:root {
  --font-ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI",
             Inter, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
               "Liberation Mono", monospace;

  --escala: 1;
  --escala-sp: 1;
  --fs-10: calc(10px * var(--escala));  --fs-11: calc(11px * var(--escala));
  --fs-12: calc(12px * var(--escala));  --fs-13: calc(13px * var(--escala));
  --fs-14: calc(14px * var(--escala));  --fs-15: calc(15px * var(--escala));
  --fs-17: calc(17px * var(--escala));  --fs-20: calc(20px * var(--escala));
  --fs-24: calc(24px * var(--escala));  --fs-28: calc(28px * var(--escala));

  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600;

  --lh-tight: 1.25; --lh-normal: 1.45; --lh-loose: 1.6;
  --tracking-tight: -0.02em; --tracking-caps: 0.06em;

  --sp-1: calc(4px * var(--escala-sp));   --sp-2: calc(8px * var(--escala-sp));
  --sp-3: calc(12px * var(--escala-sp));  --sp-4: calc(16px * var(--escala-sp));
  --sp-5: calc(20px * var(--escala-sp));  --sp-6: calc(24px * var(--escala-sp));
  --sp-8: calc(32px * var(--escala-sp));  --sp-10: calc(40px * var(--escala-sp));
  --sp-12: calc(48px * var(--escala-sp)); --sp-16: calc(64px * var(--escala-sp));

  --r-xs: 6px; --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-pill: 999px;

  --z-content: 1; --z-sticky: 20; --z-shell: 40; --z-drawer: 60;
  --z-overlay: 80; --z-toast: 100;

  --w-leitura: 960px;
  --w-lista: 3200px;

  --sidebar-w: 244px;
  --sidebar-w-collapsed: 64px;
  --topbar-h: 52px;
  --contexthdr-h: 60px;
  --navinf-h: 56px;
  --toque: 44px;

  --ease: cubic-bezier(.32, .72, 0, 1);
  --dur-fast: .12s; --dur-base: .18s; --dur-slow: .26s;
}

:root,
[data-theme="classic"] {
  color-scheme: light;

  --surface-app:    #C5D9EE;
  --surface-raised: #E8F1FA;
  --surface-sunken: #B7CDE4;
  --surface-hover:  #D4E4F4;
  --surface-active: #C0D8EE;
  --surface-shell:  #D6E6F4;
  --surface-code:   #DCEAF6;

  --border:        #9BB6D0;
  --border-strong: #7A9BB8;
  --border-dashed: #8AABC4;

  --text-1: #172B50;
  --text-2: #3D5A7A;
  --text-3: #5B7A98;
  --text-on-accent: #FFFFFF;

  --accent:         #2563EB;
  --accent-hover:   #1D4FD8;
  --accent-soft:    #EAF2FF;
  --accent-strong:  #14497E;
  --accent-border:  #8FB0D4;
  --focus-ring:     rgba(20, 73, 126, .40);

  --chrome-bg:        #14497E;
  --chrome-border:    #0D335C;
  --chrome-text:      #EAF2FF;
  --chrome-muted:     #B7D0EA;
  --chrome-hover:     rgba(255, 255, 255, .14);
  --chrome-active:    #EAF2FF;
  --chrome-on-active: #14497E;

  --success:      #08783e; --success-soft: #edf9f1; --success-border: #b7e0c6;
  --warning:      #9a6700; --warning-soft: #fff8e7; --warning-border: #ecd9a0;
  --danger:       #a61b1b; --danger-soft:  #fff1f1; --danger-border:  #f3c0c0;
  --neutral-soft: #D6E6F4; --neutral-border: #9BB6D0;

  --shadow-sm: 0 1px 2px rgba(20, 73, 126, .10);
  --shadow-md: 0 4px 12px rgba(20, 73, 126, .14);
  --shadow-lg: 0 10px 32px rgba(20, 73, 126, .18);
  --grad-marca: radial-gradient(120% 160% at 100% 0%, #2C6FCF 0%, #14497E 55%, #0D335C 100%);

  --overlay-scrim: rgba(23, 32, 51, .40);
  --diff-add-bg: #edf9f1; --diff-add-marker: #08783e;
  --diff-del-bg: #fff1f1; --diff-del-marker: #a61b1b;
  --watermark-opacity: .04;
}

[data-theme="dark"] {
  color-scheme: dark;

  --surface-app:    #131315;
  --surface-raised: #1C1C1F;
  --surface-sunken: #0E0E10;
  --surface-hover:  #232327;
  --surface-active: #2B2B30;
  --surface-shell:  #131315;
  --surface-code:   #1F1F23;

  --border:        #2E2E33;
  --border-strong: #3C3C43;
  --border-dashed: #46464D;

  --text-1: #F2F2F4;
  --text-2: #A2A2AA;
  --text-3: #74747D;
  --text-on-accent: #FFFFFF;

  --accent:         #6FA8FF;
  --accent-hover:   #86B7FF;
  --accent-soft:    #1B2733;
  --accent-strong:  #A8CBFF;
  --accent-border:  #2F4763;
  --focus-ring:     rgba(111, 168, 255, .38);

  --chrome-bg:        #131315;
  --chrome-border:    #2E2E33;
  --chrome-text:      #F2F2F4;
  --chrome-muted:     #A2A2AA;
  --chrome-hover:     #232327;
  --chrome-active:    #2B2B30;
  --chrome-on-active: #F2F2F4;

  --success:      #4ADE9B; --success-soft: #17251F; --success-border: #2C4A3B;
  --warning:      #F5C14E; --warning-soft: #262015; --warning-border: #4D3D1B;
  --danger:       #FF8A85; --danger-soft:  #2A1818; --danger-border:  #4F2A2A;
  --neutral-soft: #232327; --neutral-border: #35353B;

  --shadow-sm: 0 1px 2px rgba(0,0,0,.4);
  --shadow-md: 0 4px 16px rgba(0,0,0,.45);
  --shadow-lg: 0 16px 48px rgba(0,0,0,.55);
  --grad-marca: radial-gradient(120% 160% at 100% 0%, #2C6FCF 0%, #14497E 55%, #0D335C 100%);

  --overlay-scrim: rgba(0,0,0,.62);
  --diff-add-bg: #16251E; --diff-add-marker: #4ADE9B;
  --diff-del-bg: #2A1818; --diff-del-marker: #FF8A85;
  --watermark-opacity: .05;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-ui);
  font-size: var(--fs-14);
  line-height: var(--lh-normal);
  color: var(--text-1);
  background: var(--surface-app);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }

[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; color: inherit; }

.ico { width: 16px; height: 16px; flex: 0 0 auto; }
svg.ico[width="12"] { width: 12px !important; height: 12px !important; }
svg.ico[width="14"] { width: 14px !important; height: 14px !important; }
svg.ico[width="16"] { width: 16px !important; height: 16px !important; }
svg.ico[width="18"] { width: 18px !important; height: 18px !important; }
svg.ico[width="20"] { width: 20px !important; height: 20px !important; }
svg.ico[width="24"] { width: 24px !important; height: 24px !important; }
a { color: var(--color-action-accent); text-decoration: none; }
a:hover { text-decoration: underline; }

:focus-visible {
  outline: 2px solid var(--color-action-accent);
  outline-offset: 2px;
  border-radius: var(--r-xs);
}

::selection { background: var(--color-action-soft); color: var(--text-1); }

* { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb {
  background: var(--border-strong); border-radius: var(--r-pill);
  border: 3px solid transparent; background-clip: content-box;
}
*::-webkit-scrollbar-track { background: transparent; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
  }
}

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

:root,
[data-theme="classic"] {
  --color-brand-accent:   #14497E;
  --color-brand-surface:  #14497E;
  --color-action-accent:  #2563EB;
  --color-action-surface: #2563EB;
  --color-on-brand:       #FFFFFF;
  --color-on-action:      #FFFFFF;
  --color-action-soft:    color-mix(in srgb, var(--color-action-accent) 8%, var(--surface-raised));
  --color-action-border:  color-mix(in srgb, var(--color-action-accent) 34%, var(--surface-raised));
  --color-focus-ring:     color-mix(in srgb, var(--color-action-accent) 38%, transparent);
  --icon-size-dense: 14px;
  --icon-size-compact: 16px;
  --icon-size-control: 20px;
  --icon-size-feature: 24px;
  --icon-stroke-dense: 1.75;
  --icon-stroke-compact: 1.75;
  --icon-stroke-control: 1.5;
  --icon-stroke-feature: 1.5;
  --icon-color-disabled: currentColor;
  --icon-opacity-disabled: 0.55;
}
[data-theme="dark"] {
  --color-brand-accent:   #97C3EF;
  --color-brand-surface:  #14497E;
  --color-action-accent:  #5C8BF0;
  --color-action-surface: #2563EB;
  --color-on-brand:       #FFFFFF;
  --color-on-action:      #FFFFFF;
}

@media (min-width: 1920px) { :root { --escala: 1.08; --escala-sp: 1.08; } }
@media (min-width: 2560px) { :root { --escala: 1.18; --escala-sp: 1.15; } }