/* Tokens do Verso One no site: gerado de docs/design/sistema/tokens.json por tools/design/tokens-site.mjs; não edite à mão (edite o JSON e rode `npm run tokens`). */

:root {
  --font-ui: Geist, "Segoe UI", system-ui, sans-serif;
  --font-mono: "Geist Mono", monospace;
  --display-size: 60px;
  --display-lh: 1;
  --display-weight: 600;
  --display-tracking: -0.045em;
  --texto-display: 600 60px/1 var(--font-ui);
  --titulo-1-size: 40px;
  --titulo-1-lh: 1.05;
  --titulo-1-weight: 600;
  --titulo-1-tracking: -0.035em;
  --texto-titulo-1: 600 40px/1.05 var(--font-ui);
  --titulo-2-size: 28px;
  --titulo-2-lh: 1.1;
  --titulo-2-weight: 600;
  --titulo-2-tracking: -0.03em;
  --texto-titulo-2: 600 28px/1.1 var(--font-ui);
  --titulo-3-size: 22px;
  --titulo-3-lh: 1.45;
  --titulo-3-weight: 600;
  --titulo-3-tracking: -0.02em;
  --texto-titulo-3: 600 22px/1.45 var(--font-ui);
  --corpo-15-size: 15px;
  --corpo-15-lh: 1.45;
  --corpo-15-weight: 500;
  --corpo-15-tracking: 0;
  --texto-corpo-15: 500 15px/1.45 var(--font-ui);
  --corpo-size: 14px;
  --corpo-lh: 1.45;
  --corpo-weight: 400;
  --corpo-tracking: 0;
  --texto-corpo: 400 14px/1.45 var(--font-ui);
  --corpo-13-size: 13px;
  --corpo-13-lh: 1.45;
  --corpo-13-weight: 400;
  --corpo-13-tracking: 0;
  --texto-corpo-13: 400 13px/1.45 var(--font-ui);
  --nota-size: 12.5px;
  --nota-lh: 1.45;
  --nota-weight: 400;
  --nota-tracking: 0;
  --texto-nota: 400 12.5px/1.45 var(--font-ui);
  --rotulo-size: 12px;
  --rotulo-lh: 1.45;
  --rotulo-weight: 500;
  --rotulo-tracking: 0;
  --texto-rotulo: 500 12px/1.45 var(--font-ui);
  --mono-size: 12px;
  --mono-lh: 1.45;
  --mono-weight: 400;
  --mono-tracking: 0;
  --texto-mono: 400 12px/1.45 var(--font-mono);
  --atalho-size: 11px;
  --atalho-lh: 1.45;
  --atalho-weight: 400;
  --atalho-tracking: 0;
  --texto-atalho: 400 11px/1.45 var(--font-mono);
  --space-2: 2px;
  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-14: 14px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-28: 28px;
  --space-32: 32px;
  --space-36: 36px;
  --space-44: 44px;
  --space-48: 48px;
  --space-56: 56px;
  --space-72: 72px;
  --radius-4: 4px;
  --radius-5: 5px;
  --radius-6: 6px;
  --radius-7: 7px;
  --radius-8: 8px;
  --radius-9: 9px;
  --radius-10: 10px;
  --radius-12: 12px;
  --radius-44: 44px;
  --radius-round: 50%;
  --size-top: 48px;
  --size-toolbar: 44px;
  --size-toolbar-media: 56px;
  --size-status: 32px;
  --size-status-progress: 40px;
  --size-sidebar: 240px;
  --size-panel: 380px;
  --size-panel-wide: 460px;
  --size-panel-narrow: 300px;
  --size-row: 46px;
  --size-row-dense: 42px;
  --size-row-head: 32px;
  --size-nav-item: 32px;
  --size-control-xs: 26px;
  --size-control-sm: 30px;
  --size-control: 32px;
  --size-control-md: 40px;
  --size-control-lg: 44px;
  --size-control-touch: 52px;
  --size-search: 268px;
  --size-dot: 6px;
  --size-check: 14px;
  --size-switch-w: 36px;
  --size-switch-h: 20px;
  --size-knob: 16px;
  --size-thumb: 18px;
  --size-rail: 2px;
  --size-rail-media: 4px;
  --size-glyph-grid: 24px;
  --size-icon-ui: 16px;
  --size-file-icon: 22px;
  --recede: .35;
  --recede-list: .25;
  --t-fast: 140ms;
  --t: 260ms;
  --t-slow: 420ms;
  --t-moment: 640ms;
  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-io: cubic-bezier(.65,0,.35,1);
  --ease-save: cubic-bezier(.33,0,.15,1);
  --ease-in: cubic-bezier(.4,0,1,1);
  --shadow-sheet: 0 1px 0 rgba(15,14,11,.04);
  --shadow-lift: 0 30px 50px -18px rgba(40,32,20,.30);
  --shadow-open: 0 10px 24px -14px rgba(40,32,20,.22);
  --shadow-landed: 0 4px 10px -6px rgba(40,32,20,.18);
  --shadow-card: 0 1px 2px rgba(15,14,11,.06);
  --shadow-knob: 0 1px 1px rgba(15,14,11,.20);
}

:root {
  color-scheme: light;
  --bg: #f4f1ea;
  --bg-2: #ece8df;
  --bg-3: #e3ded3;
  --elev: #faf8f4;
  --ink: #0f0e0b;
  --ink-2: #45413a;
  --ink-3: #5c5851;
  --line-faint: rgba(15,14,11,.06);
  --line-soft: rgba(15,14,11,.08);
  --line: rgba(15,14,11,.10);
  --line-control: rgba(15,14,11,.16);
  --line-strong: rgba(15,14,11,.18);
  --hover: rgba(15,14,11,.035);
  --current: rgba(15,14,11,.06);
  --selected: rgba(15,14,11,.08);
  --segment-track: var(--bg-3);
  --segment-edge: #0f0e0b00;
  --segment-on: var(--elev);
  --segment-on-ink: var(--ink);
  --rail: rgba(15,14,11,.16);
  --tick: rgba(15,14,11,.30);
  --thumb: #faf8f4;
  --switch-off: var(--bg-3);
  --switch-knob: #faf8f4;
  --accent: #e65142;
  --accent-text: #a23a2e;
  --accent-ink: #0f0e0b;
  --link-hover: #7e2c23;
  --focus: var(--ink);
  --on-ink: var(--bg);
  --sheet: #faf8f4;
  --sheet-fold: #e3ded3;
  --sheet-edge: rgba(15,14,11,.24);
  --sheet-edge-32: rgba(15,14,11,.28);
  --sheet-edge-16: rgba(15,14,11,.34);
  --sheet-outline: rgba(15,14,11,.10);
  --sheet-crease: #e65142;
  --sheet-ink: #0f0e0b;
  --sheet-ink-2: #45413a;
  --sheet-ink-3: #5c5851;
  --sheet-rule: #cfc9bc;
  --sheet-line: rgba(15,14,11,.10);
  --sheet-line-strong: rgba(15,14,11,.18);
  --sheet-hover: rgba(15,14,11,.05);
  --sheet-surface: #f1eee7;
  --sheet-accent-text: #a23a2e;
  --sheet-glyph: var(--sheet-ink-2);
  --symbol-back: #fa5e45;
  --symbol-front: #ff6b57;
  --symbol-one: var(--ink);
  --scrim-caption: rgba(15,14,11,.80);
  --on-scrim: #f4f1ea;
  --shadow-drag: 0 28px 40px -16px rgba(40,32,20,.34);
  --shadow-ring: 0 0 0 1px rgba(15,14,11,.14);
  --shadow-ring-strong: 0 0 0 1px rgba(15,14,11,.18);
  --shadow-float: 0 1px 0 rgba(15,14,11,.05), 0 18px 50px -12px rgba(40,32,20,.24), 0 4px 12px -4px rgba(40,32,20,.10);
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg: #0f0e0b;
    --bg-2: #171612;
    --bg-3: #1f1d18;
    --elev: #1a1915;
    --ink: #f4f1ea;
    --ink-2: #bdb7ab;
    --ink-3: #948e82;
    --line-faint: rgba(244,241,234,.06);
    --line-soft: rgba(244,241,234,.08);
    --line: rgba(244,241,234,.10);
    --line-control: rgba(244,241,234,.14);
    --line-strong: rgba(244,241,234,.18);
    --hover: rgba(244,241,234,.06);
    --current: rgba(244,241,234,.07);
    --selected: rgba(244,241,234,.08);
    --segment-track: var(--bg-2);
    --segment-edge: rgba(244,241,234,.08);
    --segment-on: var(--ink);
    --segment-on-ink: var(--bg);
    --rail: rgba(244,241,234,.16);
    --tick: #948e82;
    --thumb: #f4f1ea;
    --switch-off: var(--bg-3);
    --switch-knob: #faf8f4;
    --accent: #ff6857;
    --accent-text: #ff6857;
    --accent-ink: #0f0e0b;
    --link-hover: #ff8a7c;
    --focus: var(--ink);
    --on-ink: var(--bg);
    --sheet: #faf8f4;
    --sheet-fold: #e3ded3;
    --sheet-edge: #faf8f400;
    --sheet-edge-32: #faf8f400;
    --sheet-edge-16: #faf8f400;
    --sheet-outline: #faf8f400;
    --sheet-crease: #ff6857;
    --sheet-ink: #0f0e0b;
    --sheet-ink-2: #45413a;
    --sheet-ink-3: #5c5851;
    --sheet-rule: #cfc9bc;
    --sheet-line: rgba(15,14,11,.10);
    --sheet-line-strong: rgba(15,14,11,.18);
    --sheet-hover: rgba(15,14,11,.05);
    --sheet-surface: #f1eee7;
    --sheet-accent-text: #a23a2e;
    --sheet-glyph: var(--sheet-ink-2);
    --symbol-back: #fa5e45;
    --symbol-front: #ff6b57;
    --symbol-one: var(--ink);
    --scrim-caption: rgba(15,14,11,.80);
    --on-scrim: #f4f1ea;
    --shadow-drag: 0 22px 28px rgba(0,0,0,.55), 0 2px 3px rgba(0,0,0,.35);
    --shadow-ring: none;
    --shadow-ring-strong: 0 0 0 1px rgba(244,241,234,.18);
    --shadow-float: 0 1px 0 rgba(255,255,255,.04), 0 24px 60px -14px rgba(0,0,0,.7), 0 6px 14px -4px rgba(0,0,0,.5);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --t: 140ms;
    --t-slow: 140ms;
    --t-moment: 140ms;
  }
}