/* KnotAPI UI v6 — camada visual única, leve e responsiva. */
:root {
  --ui-bg: #f5f7fb;
  --ui-surface: #ffffff;
  --ui-surface-2: #f8faff;
  --ui-elevated: #ffffff;
  --ui-text: #111827;
  --ui-muted: #667085;
  --ui-faint: #98a2b3;
  --ui-border: #e2e7ef;
  --ui-border-strong: #cbd4e1;
  --ui-accent: #1769ff;
  --ui-accent-hover: #0d56d9;
  --ui-accent-soft: #edf4ff;
  --ui-success: #119b68;
  --ui-success-soft: #e9f8f1;
  --ui-danger: #e5484d;
  --ui-danger-soft: #fff0f1;
  --ui-warning-bg: #fff8e8;
  --ui-warning-border: #f1d28a;
  --ui-warning-text: #705019;
  --ui-sidebar: #0b1020;
  --ui-sidebar-line: #1f2940;
  --ui-sidebar-text: #aab7ca;
  --ui-sidebar-active: #182746;
  --ui-shadow-sm: 0 1px 2px rgba(16, 24, 40, .04), 0 8px 24px rgba(16, 24, 40, .04);
  --ui-shadow-lg: 0 24px 70px rgba(16, 24, 40, .16);
}

html[data-theme="dark"] {
  --ui-bg: #080d18;
  --ui-surface: #101827;
  --ui-surface-2: #131d2e;
  --ui-elevated: #172235;
  --ui-text: #f3f6fb;
  --ui-muted: #a5b1c2;
  --ui-faint: #7f8da3;
  --ui-border: #27344a;
  --ui-border-strong: #3a4962;
  --ui-accent: #5a96ff;
  --ui-accent-hover: #78a9ff;
  --ui-accent-soft: #14284a;
  --ui-success: #45d39a;
  --ui-success-soft: #102a22;
  --ui-danger: #ff7478;
  --ui-danger-soft: #32191e;
  --ui-warning-bg: #2a2114;
  --ui-warning-border: #70552a;
  --ui-warning-text: #f0d28d;
  --ui-sidebar: #070b14;
  --ui-sidebar-line: #202a3d;
  --ui-sidebar-text: #9eacc1;
  --ui-sidebar-active: #172640;
  --ui-shadow-sm: 0 1px 2px rgba(0, 0, 0, .22), 0 12px 30px rgba(0, 0, 0, .16);
  --ui-shadow-lg: 0 28px 80px rgba(0, 0, 0, .48);
  --ink: var(--ui-text);
  --muted: var(--ui-muted);
  --line: var(--ui-border);
  --soft: var(--ui-surface-2);
  --white: var(--ui-surface);
  --blue: var(--ui-accent);
}

html, body { max-width: 100%; }
body { overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, svg, video, canvas { max-width: 100%; }
.hidden { display: none !important; }
.theme-icon, .theme-icon svg, [data-theme-icon] svg { width: 18px; height: 18px; display: block; }
.theme-header-toggle, .theme-floating, .app-theme-button, .docs-theme-toggle {
  color: var(--ui-text);
  border-color: var(--ui-border);
}

/* App shell */
.app-shell-page {
  --app-side: 252px;
  min-height: 100vh;
  background:
    radial-gradient(circle at 88% 0, rgba(23, 105, 255, .055), transparent 30rem),
    var(--ui-bg);
  color: var(--ui-text);
}
.app-sidebar {
  width: var(--app-side);
  padding: 24px 16px 16px;
  background: linear-gradient(180deg, #0c1120 0%, var(--ui-sidebar) 100%);
  border-color: var(--ui-sidebar-line);
}
.app-brand { margin: 0 8px 28px; padding: 0 8px; height: 44px; }
.app-brand img, .app-mobile-brand img { filter: drop-shadow(0 6px 14px rgba(35, 113, 255, .18)); }
.app-brand b { font-size: 19px; letter-spacing: -.55px; }
.app-nav { gap: 4px; }
.app-nav a {
  min-height: 44px;
  padding: 11px 12px;
  color: var(--ui-sidebar-text);
  border: 1px solid transparent;
  border-radius: 10px;
  transition: color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease;
}
.app-nav a:hover { color: #fff; background: rgba(255, 255, 255, .045); transform: translateX(2px); }
.app-nav a.active {
  color: #fff;
  border-color: rgba(96, 151, 255, .16);
  background: linear-gradient(110deg, var(--ui-sidebar-active), rgba(25, 50, 91, .82));
  box-shadow: inset 3px 0 0 #4f8fff;
}
.app-nav a > span { width: 20px; height: 20px; display: grid; place-items: center; color: #7fa8ed; }
.app-nav a em { display: grid; place-items: center; width: 16px; height: 16px; }
.app-nav a em .app-icon { width: 14px; height: 14px; }
.app-icon { display: block; width: 19px; height: 19px; flex: 0 0 auto; }
.app-account { border-color: var(--ui-sidebar-line); }
.app-account-trigger { border: 1px solid transparent; }
.app-account-trigger:hover, .app-account-trigger[aria-expanded="true"] { border-color: #26344b; background: #111a2a; }
.app-account-trigger i { display: grid; place-items: center; transition: transform .18s ease; }
.app-account-trigger i .app-icon { width: 15px; height: 15px; }
.app-account-trigger[aria-expanded="true"] i { transform: rotate(180deg); }
.app-avatar { background: linear-gradient(145deg, #1769ff, #4d92ff); box-shadow: 0 8px 20px rgba(23, 105, 255, .25); }
.app-account-menu {
  border-color: #2b3850;
  background: #111a2a;
  box-shadow: var(--ui-shadow-lg);
  padding: 9px;
}
.app-account-menu a, .app-account-menu button { display: flex; align-items: center; gap: 9px; min-height: 36px; }
.app-account-menu .app-menu-title { color: #eef4ff; font-weight: 750; }
.app-account-menu .app-icon { width: 16px; height: 16px; }
.app-sidebar-scrim { display: none; }
.app-main, .app-shell-page > .dashboard-main {
  width: auto;
  min-width: 0;
  max-width: none;
  overflow-x: clip;
  margin-left: var(--app-side);
  padding: 40px clamp(26px, 4vw, 58px) 72px;
}
.app-main > *, .dashboard-main > *, .dashboard-card > *, .card-heading > *, .settings-view, .portal-view { min-width: 0; }
.dashboard-header { max-width: 1240px; margin: 0 auto 28px; }
.dashboard-header h1 { color: var(--ui-text); letter-spacing: -.04em; }
.dashboard-header p, .card-heading p { color: var(--ui-muted); }
.portal-view, .settings-view, .settings-main > .message, .settings-main > .privacy-log-note,
.settings-main > .dashboard-card, .settings-tabs { width: min(100%, 1240px); margin-left: auto; margin-right: auto; }

/* Surfaces and controls */
.dashboard-card, .stats-grid article, .dashboard-quick-grid article, .settings-tabs {
  color: var(--ui-text);
  background: color-mix(in srgb, var(--ui-surface) 96%, transparent);
  border-color: var(--ui-border);
  box-shadow: var(--ui-shadow-sm);
}
.dashboard-card { border-radius: 16px; }
.stats-grid { gap: 14px; }
.stats-grid article { position: relative; overflow: hidden; min-width: 0; border-radius: 15px; }
.stats-grid article::after { content: ""; position: absolute; inset: auto -35px -55px auto; width: 130px; height: 130px; border-radius: 50%; background: rgba(23, 105, 255, .055); }
.stats-grid article span, .stats-grid article small { color: var(--ui-muted); }
.stats-grid article strong { color: var(--ui-text); }
.stats-grid article:first-child strong { color: var(--ui-success); }
.quota-track { background: var(--ui-border); }
.quota-track span { background: linear-gradient(90deg, #1769ff, #5b9cff); }
.quota-legend { color: var(--ui-muted); }
.dashboard-quick-grid { gap: 16px; }
.dashboard-quick-grid article { border-radius: 14px; }
.dashboard-quick-grid p, .dashboard-quick-grid li { color: var(--ui-muted); }
.button { min-height: 40px; border-radius: 10px; }
.button.primary { color: #fff; background: linear-gradient(135deg, #1769ff, #287bff); box-shadow: 0 8px 22px rgba(23, 105, 255, .18); }
.button.primary:hover { background: linear-gradient(135deg, #0d56d9, #1769ff); transform: translateY(-1px); }
.button.secondary, .button.ghost, .row-actions button {
  color: var(--ui-text);
  background: var(--ui-surface);
  border-color: var(--ui-border-strong);
}
input, select, textarea, .settings-form-wide input, .logs-filters input, .logs-filters select {
  max-width: 100%;
  color: var(--ui-text);
  background: var(--ui-surface-2);
  border-color: var(--ui-border-strong);
}
input:focus, select:focus, textarea:focus { border-color: var(--ui-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-accent) 16%, transparent); outline: none; }
input[readonly], .settings-form-wide input[readonly] { color: var(--ui-muted); background: color-mix(in srgb, var(--ui-surface-2) 88%, var(--ui-border)); }
.settings-tabs { position: sticky; top: 14px; z-index: 35; padding: 6px; border-radius: 13px; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
.settings-tabs::-webkit-scrollbar { display: none; width: 0; height: 0; }
.settings-tabs a { min-height: 38px; display: grid; place-items: center; color: var(--ui-muted); }
.settings-tabs a:hover, .settings-tabs a.active { color: var(--ui-accent); background: var(--ui-accent-soft); }
.settings-summary-card > div, .billing-overview > div, .payment-history article, .privacy-requests article { border-color: var(--ui-border); }
.settings-panel, .team-owner, .team-keys article, .privacy-facts article, .legal-links-card a,
.affiliate-share, .affiliate-stats, .affiliate-identity, .keys-grid article {
  color: var(--ui-text);
  background: var(--ui-surface-2);
  border-color: var(--ui-border);
}
.team-keys article > div + div { border-color: var(--ui-border); }
.privacy-facts p, .settings-panel p, .team-owner span, .team-owner small { color: var(--ui-muted); }
.legal-alert, .key-onboarding { color: var(--ui-text); background: var(--ui-warning-bg); border-color: var(--ui-warning-border); }
.privacy-log-note { color: var(--ui-text); background: var(--ui-accent-soft); border-color: color-mix(in srgb, var(--ui-accent) 35%, var(--ui-border)); }
.privacy-log-note span { color: var(--ui-muted); }
.security-note { align-items: flex-start; padding: 12px 14px; color: var(--ui-warning-text); border: 1px solid var(--ui-warning-border); border-radius: 10px; background: var(--ui-warning-bg); line-height: 1.55; }
.security-note b, .security-note span { color: inherit; }
.secret-box, .pix-box, .pix-checkout { color: var(--ui-text); background: var(--ui-surface-2); border-color: var(--ui-border-strong); }
.secret-box code, .pix-content code, .dashboard-code { color: #dce8fa; background: #080e1a; border-color: #27344a; }
.app-dialog, .key-dialog { color: var(--ui-text); background: var(--ui-elevated); border: 1px solid var(--ui-border); }
.app-dialog::backdrop, .key-dialog::backdrop { background: rgba(3, 7, 18, .68); backdrop-filter: blur(4px); }
.message { box-shadow: var(--ui-shadow-sm); }

/* Activities: no horizontal page leak. The table keeps its own scroll area. */
.logs-filters { grid-template-columns: minmax(190px, 1.4fr) minmax(170px, 1fr) repeat(2, minmax(126px, .65fr)) auto auto; }
.table-scroll { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.table-scroll table { min-width: 680px; }
th { color: var(--ui-muted); background: var(--ui-surface-2); }
td, th { border-color: var(--ui-border); }

/* Dark surfaces that legacy selectors left bright. */
html[data-theme="dark"] .app-shell-page,
html[data-theme="dark"] .dashboard-page,
html[data-theme="dark"] .settings-page { background-color: var(--ui-bg); color: var(--ui-text); }
html[data-theme="dark"] .dashboard-card,
html[data-theme="dark"] .stats-grid article,
html[data-theme="dark"] .dashboard-quick-grid article,
html[data-theme="dark"] .compact-plans button,
html[data-theme="dark"] .settings-tabs,
html[data-theme="dark"] .settings-panel,
html[data-theme="dark"] .team-owner,
html[data-theme="dark"] .team-keys article,
html[data-theme="dark"] .privacy-facts article,
html[data-theme="dark"] .legal-links-card a { background: var(--ui-surface); border-color: var(--ui-border); color: var(--ui-text); }
html[data-theme="dark"] .compact-plans button.current-plan { background: #172235; }
html[data-theme="dark"] .admin-page,
html[data-theme="dark"] .admin-main { color: var(--ui-text); background-color: var(--ui-bg); }
html[data-theme="dark"] .admin-page .dashboard-card,
html[data-theme="dark"] .admin-page .table-card,
html[data-theme="dark"] .admin-page .quick-actions button,
html[data-theme="dark"] .admin-page .client-dialog,
html[data-theme="dark"] .admin-page .settings-panel,
html[data-theme="dark"] .admin-page .keys-grid article,
html[data-theme="dark"] .admin-page .mini-history article {
  color: var(--ui-text);
  background: var(--ui-surface);
  border-color: var(--ui-border);
}
html[data-theme="dark"] .admin-page .quick-actions button:hover { background: var(--ui-elevated); border-color: var(--ui-accent); }
html[data-theme="dark"] .admin-page .quick-actions button p,
html[data-theme="dark"] .admin-page .quick-actions button span,
html[data-theme="dark"] .admin-page .dashboard-header p { color: var(--ui-muted); }
html[data-theme="dark"] .admin-page table,
html[data-theme="dark"] .admin-page tbody,
html[data-theme="dark"] .admin-page tr { color: var(--ui-text); background: transparent; }
html[data-theme="dark"] .admin-page td,
html[data-theme="dark"] .admin-page th { border-color: var(--ui-border); }
html[data-theme="dark"] .free-plan-banner { background: linear-gradient(120deg, #111d32, #101827); border-color: #2e4f7d; }
html[data-theme="dark"] .auth-panel { background: var(--ui-surface); color: var(--ui-text); }
html[data-theme="dark"] .auth-panel h2, html[data-theme="dark"] .auth-form label { color: var(--ui-text); }
html[data-theme="dark"] .auth-panel-head p, html[data-theme="dark"] .auth-flow-note { color: var(--ui-muted); }
html[data-theme="dark"] .auth-form input { background: var(--ui-surface-2); border-color: var(--ui-border-strong); color: var(--ui-text); }
html[data-theme="dark"] .landing-v2 .hero-copy h1 em { color: #6da2ff; }
html[data-theme="dark"] .landing-v2 .eyebrow-v2 { color: #7eabff; }
html[data-theme="dark"] .landing-v2 .eyebrow-v2 > span { background: #7eabff; }
html[data-theme="dark"] .landing-v2 .button.primary { background: linear-gradient(135deg, #2878ff, #4f91ff); }
html[data-theme="dark"] .theme-floating { color: var(--ui-text); border-color: var(--ui-border-strong); background: rgba(16, 24, 39, .72); }

/* Responsive */
@media (max-width: 1180px) {
  .app-shell-page { --app-side: 224px; }
  .app-main, .app-shell-page > .dashboard-main { padding-inline: 28px; }
  .logs-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .logs-filters .button { width: 100%; }
  .compact-plans { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .app-shell-page { --app-side: min(310px, calc(100vw - 48px)); }
  .app-sidebar { width: var(--app-side); padding: 20px 15px 16px; }
  .app-sidebar-scrim { display: block; position: fixed; inset: 0; z-index: 70; border: 0; padding: 0; background: rgba(3, 7, 18, .62); opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; }
  .app-sidebar-scrim.open { opacity: 1; visibility: visible; }
  body.app-menu-open { overflow: hidden; }
  .app-topbar { color: var(--ui-text); background: color-mix(in srgb, var(--ui-surface) 92%, transparent); border-color: var(--ui-border); }
  .app-mobile-toggle, .app-theme-button { display: grid; place-items: center; color: var(--ui-text); border-color: var(--ui-border); }
  .app-mobile-toggle .app-icon { width: 20px; height: 20px; }
  .app-main, .app-shell-page > .dashboard-main { margin-left: 0; padding: 24px 15px 56px; }
  .dashboard-header { margin-bottom: 22px; }
  .dashboard-header h1 { font-size: clamp(28px, 9vw, 38px); }
  .dashboard-card { padding: 21px 18px; border-radius: 14px; }
  .stats-grid, .dashboard-quick-grid, .compact-plans, .settings-field-row, .privacy-facts, .legal-links-card, .team-keys { grid-template-columns: 1fr; }
  .stats-grid article { padding: 23px; }
  .settings-tabs { top: 66px; width: 100%; margin-bottom: 23px; justify-content: flex-start; }
  .settings-tabs a { flex: 0 0 auto; padding-inline: 14px; }
  .card-heading { align-items: flex-start; }
  .card-heading > .button, .card-heading > a.button { width: 100%; }
  .logs-filters { grid-template-columns: 1fr; }
  .logs-pagination { gap: 12px; align-items: flex-start; flex-direction: column; }
  .privacy-log-note { align-items: flex-start; flex-direction: column; }
  .payment-history article, .privacy-requests article { align-items: flex-start; flex-direction: column; }
  .payment-history article > div:last-child, .privacy-requests article > div:last-child { align-items: flex-start; }
  .team-owner { grid-template-columns: auto minmax(0, 1fr); }
  .team-owner > strong { grid-column: 1 / -1; justify-self: start; }
  .pix-box > .pix-content { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
  .app-topbar { padding-inline: 11px; }
  .app-mobile-brand b { display: none; }
  .app-quota-chip span { display: none; }
  .dashboard-card { padding-inline: 16px; }
  .stats-grid article strong { font-size: 27px; }
}

@media (prefers-reduced-motion: reduce) {
  .app-nav a, .button, .app-sidebar, .app-sidebar-scrim { transition: none !important; }
}

/* Workspace, sessões e correções de contraste — 2026-08-11 */
.team-members, .team-invites, .security-sessions { display: grid; gap: 10px; }
.team-members article, .team-invites article, .security-session { display: flex; align-items: center; gap: 14px; padding: 15px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface); }
.team-members .avatar { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 12px; color: var(--ui-accent); background: var(--ui-accent-soft); font-weight: 850; }
.member-identity { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 3px; }
.member-identity span, .member-identity small, .team-invites span, .security-session span, .security-session small { color: var(--ui-muted); font-size: 11px; }
.member-actions { display: flex; align-items: center; gap: 8px; }
.member-actions select, .team-invite-form input, .team-invite-form select { min-height: 40px; padding: 8px 11px; color: var(--ui-text); border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-2); }
.team-invite-form { display: grid; grid-template-columns: minmax(240px, 1fr) 220px auto; gap: 12px; align-items: end; margin-bottom: 20px; }
.team-invite-form label { display: flex; flex-direction: column; gap: 7px; font-size: 11px; font-weight: 750; }
.team-invites h3 { margin: 3px 0; font-size: 14px; }
.team-invites article { justify-content: space-between; }
.team-invites article > div { display: flex; flex-direction: column; gap: 4px; }
.sessions-panel { min-height: 100%; }
.sessions-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.security-session { justify-content: space-between; }
.security-session > div:first-child { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.security-session code { width: max-content; padding: 3px 6px; color: var(--ui-muted); background: var(--ui-surface-2); border-radius: 5px; font-size: 9px; }
.security-session.current { border-color: color-mix(in srgb, var(--ui-success) 44%, var(--ui-border)); background: color-mix(in srgb, var(--ui-success) 5%, var(--ui-surface)); }
.empty-state.compact { padding: 18px; }
.settings-save { padding-top: 4px; border-top: 0; }
.key-actions { border-color: var(--ui-border); }
.key-actions button { color: var(--ui-text); border-color: var(--ui-border); background: var(--ui-surface-2); }
.key-actions button:hover { color: var(--ui-accent); border-color: var(--ui-accent); background: var(--ui-accent-soft); }
.dialog-help, .key-onboarding, .legal-alert { color: var(--ui-warning-text); border-color: var(--ui-warning-border); background: var(--ui-warning-bg); }
.code-tabs-scroll { overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: none !important; -ms-overflow-style: none; }
.code-tabs-scroll::-webkit-scrollbar { display: none !important; width: 0 !important; height: 0 !important; }
.code-tabs-scroll button { scroll-snap-align: start; }
html[data-theme="light"] .landing-v2 .code-tabs-scroll { background: #101827; }
html[data-theme="dark"] .key-dialog { color: var(--ui-text); border: 1px solid var(--ui-border); background: var(--ui-surface); }
html[data-theme="dark"] .key-dialog input, html[data-theme="dark"] .key-dialog textarea { color: var(--ui-text); border-color: var(--ui-border); background: var(--ui-surface-2); }
html[data-theme="dark"] .dialog-close { color: var(--ui-text); background: var(--ui-surface-2); }
.team-invite-page { min-height: 100vh; background: radial-gradient(circle at 50% 0, #eaf2ff, #f8fafc 45%); }
.team-invite-page .auth-brand { position: fixed; top: 25px; left: 28px; display: flex; align-items: center; gap: 10px; font-size: 20px; font-weight: 850; }
.team-invite-page .auth-brand img { object-fit: contain; }
.team-invite-shell { display: grid; place-items: center; min-height: 100vh; padding: 90px 20px 40px; }
.team-invite-shell .auth-panel { width: min(100%, 560px); border-radius: 20px; box-shadow: 0 30px 80px rgba(24, 39, 75, .14); }
.team-invite-shell .auth-panel h1 { margin: 8px 0; }
.auth-secondary-link { display: block; margin-top: 16px; text-align: center; color: var(--ui-accent); font-size: 12px; font-weight: 750; }
html[data-theme="dark"] .team-invite-page { background: radial-gradient(circle at 50% 0, #15233c, #090e1a 50%); }
.status-live-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 16px; padding: 16px 20px; color: var(--ui-text); border: 1px solid var(--ui-border); border-radius: 13px; background: var(--ui-surface); }
.status-live-card > div { display: flex; align-items: center; gap: 12px; }
.status-live-card > div > div { display: flex; flex-direction: column; gap: 3px; }
.status-live-card small { color: var(--ui-muted); font-size: 10px; }
.status-live-card strong { color: var(--ui-accent); font-size: 10px; }
.status-live-pulse { width: 10px; height: 10px; border-radius: 50%; background: var(--ui-success); box-shadow: 0 0 0 6px color-mix(in srgb, var(--ui-success) 12%, transparent); }

@media (max-width: 820px) {
  .team-invite-form { grid-template-columns: 1fr; }
  .team-members article { align-items: flex-start; flex-wrap: wrap; }
  .member-actions { width: 100%; }
  .member-actions select { flex: 1; }
  .sessions-heading { flex-direction: column; }
}

/* Central operacional administrativa — 2026-08-11 */
.admin-page .dashboard-main { max-width: none; min-width: 0; }
.admin-page .dashboard-header { width: 100%; max-width: none; margin: 0 0 28px; }
.admin-page .dashboard-sidebar { overflow: hidden; }
.admin-page .dashboard-sidebar nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding-right: 0; scrollbar-width: none; }
.admin-page .dashboard-sidebar nav::-webkit-scrollbar { display: none; }
.admin-page .dashboard-sidebar .sidebar-user { flex: 0 0 auto; margin-top: 8px; }
.sidebar-theme-toggle { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; width: 100%; margin-top: 10px; padding: 10px 14px; color: #8fa0bb; border: 1px solid #253047; border-radius: 9px; background: #11192a; font-size: 12px; cursor: pointer; }
.sidebar-theme-toggle:hover { color: #fff; border-color: #3a4d6c; background: #162137; }
.sidebar-theme-toggle .theme-icon { width: 18px; height: 18px; }
.admin-page .sidebar-logout { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 14px; border-radius: 8px; }
.admin-page .sidebar-logout svg { width: 17px; height: 17px; flex: 0 0 auto; }
.admin-page .sidebar-logout:hover { color: #fff; background: #18233a; }
.admin-page .admin-view { min-width: 0; }
.admin-stats-wide { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ops-flags { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.ops-flags span { padding: 6px 9px; border: 1px solid var(--ui-border); border-radius: 999px; color: var(--ui-muted); background: var(--ui-surface-2); font-size: 9px; font-weight: 750; }
.admin-two-columns { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr); gap: 18px; margin-bottom: 18px; }
.admin-two-columns .table-card { padding: 22px; }
.card-heading.compact { margin-bottom: 17px; }
.card-heading.compact h2 { margin-bottom: 0; }
.usage-bars { display: flex; align-items: flex-end; gap: 5px; height: 220px; padding-top: 18px; overflow-x: auto; }
.usage-bars > div { display: flex; flex: 1 0 18px; min-width: 18px; height: 100%; flex-direction: column; justify-content: flex-end; align-items: center; gap: 7px; }
.usage-bars i { width: 100%; min-height: 4px; border-radius: 4px 4px 1px 1px; background: linear-gradient(180deg, #4387ff, var(--ui-accent)); }
.usage-bars span { color: var(--ui-muted); font-size: 8px; writing-mode: vertical-rl; }
.admin-list { display: grid; gap: 7px; }
.admin-list article { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 11px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-2); }
.admin-list article > span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; color: var(--ui-accent); background: var(--ui-accent-soft); font-size: 9px; font-weight: 850; }
.admin-list article div { display: flex; min-width: 0; flex-direction: column; }
.admin-list article small { overflow: hidden; color: var(--ui-muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.admin-list article strong { font-size: 11px; }
.toolbar-note { margin: auto 0; color: var(--ui-muted); font-size: 11px; }
.admin-warning { display: flex; align-items: flex-start; gap: 10px; padding: 15px 18px; color: var(--ui-warning-text); border-color: var(--ui-warning-border); background: var(--ui-warning-bg); }
.admin-warning span { color: inherit; font-size: 11px; line-height: 1.5; }
.wrap-cell { max-width: 340px; white-space: normal; word-break: break-word; }
.admin-audit-filters { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(180px, .6fr) 145px 145px auto auto; gap: 10px; align-items: end; margin-bottom: 14px; padding: 16px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface); }
.admin-audit-filters label { display: flex; flex-direction: column; gap: 6px; color: var(--ui-muted); font-size: 10px; font-weight: 750; }
.admin-audit-filters input, .admin-page select, .admin-page input, .admin-page textarea { color: var(--ui-text); border-color: var(--ui-border); background: var(--ui-surface-2); }
.admin-audit-filters input, .admin-filter-field select { width: 100%; min-height: 40px; padding: 9px 11px; border: 1px solid var(--ui-border); border-radius: 8px; outline: none; }
.admin-audit-filters input:focus, .admin-filter-field select:focus { border-color: var(--ui-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-accent) 14%, transparent); }
.admin-filter-field { display: flex; min-width: 220px; flex-direction: column; gap: 6px; color: var(--ui-muted); font-size: 10px; font-weight: 750; }
.admin-email-toolbar { align-items: flex-end; }
.admin-pagination { display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding: 14px 16px; border-top: 1px solid var(--ui-border); }
.admin-pagination span { margin-right: auto; color: var(--ui-muted); font-size: 10px; }
.admin-page .table-action, .admin-page .row-actions button { color: var(--ui-text); border-color: var(--ui-border); background: var(--ui-surface-2); }
.admin-page .table-action:hover, .admin-page .row-actions button:hover { color: var(--ui-accent); border-color: var(--ui-accent); background: var(--ui-accent-soft); }
.admin-page .row-actions button, .admin-page .table-action { min-height: 30px; padding: 7px 10px; border-radius: 7px; font-size: 10px; font-weight: 750; }
.admin-page .row-actions .primary-action, .admin-page .primary-action { color: #fff; border-color: var(--ui-accent); background: var(--ui-accent); }
.admin-page .row-actions .primary-action:hover, .admin-page .primary-action:hover { color: #fff; border-color: var(--ui-accent-hover); background: var(--ui-accent-hover); }
.admin-page th { color: var(--ui-muted); background: var(--ui-surface-2); }
.admin-page td { border-color: var(--ui-border); }
.admin-detail-dialog { width: min(960px, calc(100vw - 32px)); max-height: min(860px, calc(100vh - 32px)); padding: 26px; overflow: auto; }
.admin-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 4px 0 18px; }
.admin-detail-grid article { display: flex; min-width: 0; flex-direction: column; gap: 6px; padding: 14px; border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-surface-2); }
.admin-detail-grid span { color: var(--ui-muted); font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .45px; }
.admin-detail-grid b { overflow-wrap: anywhere; font-size: 12px; line-height: 1.45; }
.admin-detail-note { display: flex; flex-direction: column; gap: 7px; margin-top: 12px; padding: 14px 16px; color: var(--ui-warning-text); border: 1px solid var(--ui-warning-border); border-radius: 10px; background: var(--ui-warning-bg); }
.admin-detail-note span { font-size: 11px; line-height: 1.5; }
.admin-detail-note code { overflow-wrap: anywhere; color: inherit; font-size: 10px; }
.email-preview-heading { display: flex; align-items: flex-start; justify-content: space-between; margin: 24px 0 10px; }
.email-preview-heading > div { display: flex; flex-direction: column; gap: 4px; }
.email-preview-heading span { color: var(--ui-muted); font-size: 10px; }
.email-preview-canvas { overflow: auto; max-height: 520px; padding: 16px; color: #0b1734; border: 1px solid var(--ui-border); border-radius: 12px; background: #f3f6fa; }
.admin-empty-preview { display: flex; flex-direction: column; gap: 6px; margin-top: 20px; padding: 20px; color: var(--ui-muted); border: 1px dashed var(--ui-border); border-radius: 10px; background: var(--ui-surface-2); }
.admin-empty-preview span { font-size: 11px; }
.status-header { padding: 0 24px; }
.status-header-inner { display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 920px; height: 100%; margin: 0 auto; }
.status-header-inner nav { display: flex; align-items: center; gap: 10px; }
.status-header-inner .theme-header-toggle { flex: 0 0 auto; }
html[data-theme="dark"] select, html[data-theme="dark"] select option { color: #f4f7fc; background-color: #101827; color-scheme: dark; }
html[data-theme="light"] select, html[data-theme="light"] select option { color: #111827; background-color: #fff; color-scheme: light; }

@media (max-width: 1280px) {
  .admin-stats-wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-two-columns { grid-template-columns: 1fr; }
  .admin-audit-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .admin-stats-wide { grid-template-columns: 1fr; }
  .admin-audit-filters { grid-template-columns: 1fr; }
  .ops-flags { justify-content: flex-start; margin-top: 12px; }
  .admin-detail-grid { grid-template-columns: 1fr; }
  .status-header { padding: 0 16px; }
}

/* Suporte global discreto via WhatsApp — 2026-08-14 */
.knot-support-fab {
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 65;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 48px;
  padding: 7px 13px 7px 7px;
  color: #172033;
  border: 1px solid rgba(23, 32, 51, .12);
  border-radius: 999px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .15);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.knot-support-fab:hover {
  color: #172033;
  border-color: rgba(37, 211, 102, .45);
  box-shadow: 0 14px 34px rgba(15, 23, 42, .2);
  transform: translateY(-2px);
}
.knot-support-fab:focus-visible {
  outline: 3px solid rgba(37, 211, 102, .32);
  outline-offset: 3px;
}
.knot-support-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  color: #fff;
  border-radius: 50%;
  background: #25d366;
  box-shadow: 0 5px 13px rgba(37, 211, 102, .24);
}
.knot-support-icon svg { width: 18px; height: 18px; }
.knot-support-copy { display: flex; flex-direction: column; gap: 1px; line-height: 1.05; }
.knot-support-copy strong { color: inherit; font-size: 12px; font-weight: 800; }
.knot-support-copy small { color: #64748b; font-size: 9px; font-weight: 650; }
html[data-theme="dark"] .knot-support-fab {
  color: #f7f9fc;
  border-color: rgba(148, 163, 184, .22);
  background: rgba(15, 23, 42, .94);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .38);
}
html[data-theme="dark"] .knot-support-fab:hover { color: #fff; border-color: rgba(37, 211, 102, .55); }
html[data-theme="dark"] .knot-support-copy small { color: #9eabc0; }
@media (max-width: 560px) {
  .knot-support-fab { right: max(12px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); min-height: 44px; padding: 5px 10px 5px 5px; }
  .knot-support-icon { width: 33px; height: 33px; }
  .knot-support-copy small { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .knot-support-fab { transition: none; }
}
@media print {
  .knot-support-fab { display: none !important; }
}

/* Histórico técnico por requisição — 2026-08-14 */
.requests-main > .request-summary, .requests-main > .request-retention-note { width: min(100%, 1240px); margin-left: auto; margin-right: auto; }
.request-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.request-summary article { min-width: 0; padding: 19px 20px; border: 1px solid var(--ui-border); border-radius: 13px; background: var(--ui-surface); box-shadow: var(--ui-shadow); }
.request-summary span, .request-summary strong, .request-summary small { display: block; }
.request-summary span { margin-bottom: 9px; color: var(--ui-muted); font-size: 10px; font-weight: 750; }
.request-summary strong { color: var(--ui-text); font-size: 23px; line-height: 1; }
.request-summary small { margin-top: 8px; color: var(--ui-muted); font-size: 9px; }
.request-retention-note { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 18px; padding: 15px 17px; color: var(--ui-warning-text); border: 1px solid var(--ui-warning-border); border-radius: 12px; background: var(--ui-warning-bg); }
.request-retention-note > span { display: grid; place-items: center; flex: 0 0 auto; width: 24px; height: 24px; border: 1px solid currentColor; border-radius: 50%; font-size: 11px; font-weight: 850; }
.request-retention-note div { display: flex; flex-direction: column; gap: 4px; }
.request-retention-note p { margin: 0; color: inherit; font-size: 11px; line-height: 1.55; }
.request-filters { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px 10px; align-items: end; }
.request-filter-primary { grid-column: span 3; }
.request-filter-origin { grid-column: span 4; }
.request-filter-date { grid-column: span 2; }
.request-filter-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; }
.request-filter-actions { grid-column: span 4; }
.request-filter-actions .button { flex: 1 1 0; min-width: 74px; white-space: nowrap; }
.request-filters label { display: flex; min-width: 0; flex-direction: column; gap: 6px; color: var(--ui-text); font-size: 10px; font-weight: 800; }
.request-filters input, .request-filters select { width: 100%; min-height: 40px; padding: 9px 10px; color: var(--ui-text); border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-surface-2); outline: none; }
.request-filters input:focus, .request-filters select:focus { border-color: var(--ui-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-accent) 14%, transparent); }
.requests-table { min-width: 1180px; }
.requests-table td { vertical-align: top; }
.requests-table td > b, .requests-table td > span, .requests-table td > small { display: block; }
.requests-table td > span, .requests-table td > small { margin-top: 4px; color: var(--ui-muted); font-size: 9px; line-height: 1.4; }
.request-cpf { color: var(--ui-text); font-size: 11px; font-weight: 750; white-space: nowrap; }
.request-status { display: inline-flex !important; width: max-content; margin: 0 !important; padding: 4px 7px; border-radius: 999px; font-size: 9px !important; font-weight: 850; }
.request-status.success { color: var(--ui-success); background: var(--ui-success-soft); }
.request-status.warning { color: var(--ui-warning-text); background: var(--ui-warning-bg); }
.request-status.danger { color: var(--ui-danger); background: var(--ui-danger-soft); }
@media (max-width: 1200px) {
  .request-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .request-filter-primary, .request-filter-origin, .request-filter-date { grid-column: auto; }
  .request-filter-actions { grid-column: 1 / -1; }
}
@media (max-width: 820px) {
  .request-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .request-summary, .request-filters { grid-template-columns: 1fr; }
  .request-retention-note { flex-direction: column; }
  .request-filter-actions { width: 100%; }
  .request-filter-actions .button { flex: 1 1 0; }
}