/* Focinho KYC — tokens 1.0.0. Gerado por ferramentas/construir.py a partir de fonte/tokens.json. Não edite à mão. Tema: segue o sistema (prefers-color-scheme). Para forçar, ponha data-theme="light" ou "dark" no . */ :root, [data-theme="light"] { color-scheme: light; --bg: #f4f1ea; --card: #ffffff; --tx: #1d2626; --mut: #5f6b69; --bd: #ddd6c9; --pri: #1f6f5c; --pri-bg: #e3f0ec; --ok: #1e7a3c; --ok-bg: #e2f3e7; --rev: #8a5a00; --rev-bg: #fbefd5; --rep: #b3261e; --rep-bg: #fbe4e2; --pri-tx: var(--pri); --pri-hover: #185a4b; --on-pri: #ffffff; --on-rep: #ffffff; --bd-ctl: #8a8275; --sunk: #f9f7f2; --hover: #f7f5ef; --neu: #4f5b59; --neu-bg: #ece8df; --focus: var(--pri); --link: var(--pri-tx); --crop: #ffd23f; --crop-ink: #1d2626; --mira-ok: #3ddc84; --camera-bg: #0a0e0d; --camera-tx: #ffffff; --camera-mut: #c3cdcb; --overlay: #0a0e0d8f; --toast-bg: var(--tx); --toast-tx: var(--card); --chart-1: #2a78d6; --chart-2: #1baf7a; --chart-3: #eb6834; --chart-axis: #bdb5a6; --shadow-card: 0 1px 2px #1d26260f; --shadow-pop: 0 2px 6px #1d262614, 0 12px 28px #1d262629; } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { color-scheme: dark; --bg: #121817; --card: #1b2322; --tx: #e6ecea; --mut: #9aa7a4; --bd: #2d3836; --pri: #3fa58a; --pri-bg: #1c3a33; --ok: #6fcf8f; --ok-bg: #16301f; --rev: #e9b24e; --rev-bg: #3a2b0e; --rep: #ff8a80; --rep-bg: #3d1a17; --pri-tx: #62c6a8; --pri-hover: #52b89c; --on-pri: #0c1412; --on-rep: #1c0f0e; --bd-ctl: #6a7a77; --sunk: #161d1c; --hover: #212b29; --neu: #b9c4c1; --neu-bg: #27312f; --focus: var(--pri-tx); --chart-1: #3987e5; --chart-2: #199e70; --chart-3: #d95926; --chart-axis: #3f4c49; --shadow-card: 0 1px 2px #00000059; --shadow-pop: 0 12px 32px #000000a6; --link: var(--pri-tx); --toast-bg: var(--tx); --toast-tx: var(--card); } } [data-theme="dark"] { color-scheme: dark; --bg: #121817; --card: #1b2322; --tx: #e6ecea; --mut: #9aa7a4; --bd: #2d3836; --pri: #3fa58a; --pri-bg: #1c3a33; --ok: #6fcf8f; --ok-bg: #16301f; --rev: #e9b24e; --rev-bg: #3a2b0e; --rep: #ff8a80; --rep-bg: #3d1a17; --pri-tx: #62c6a8; --pri-hover: #52b89c; --on-pri: #0c1412; --on-rep: #1c0f0e; --bd-ctl: #6a7a77; --sunk: #161d1c; --hover: #212b29; --neu: #b9c4c1; --neu-bg: #27312f; --focus: var(--pri-tx); --chart-1: #3987e5; --chart-2: #199e70; --chart-3: #d95926; --chart-axis: #3f4c49; --shadow-card: 0 1px 2px #00000059; --shadow-pop: 0 12px 32px #000000a6; --link: var(--pri-tx); --toast-bg: var(--tx); --toast-tx: var(--card); } :root { --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-12: 48px; --radius-sm: 6px; --radius-btn: 9px; --radius-card: 12px; --radius-pill: 999px; --size-touch: 44px; --size-control: 44px; --size-control-lg: 56px; --size-control-sm: 36px; --size-topbar: 56px; --size-sidebar: 264px; --size-content: 1200px; --size-form: 560px; --size-thumb: 72px; --bp-drawer: 820px; --bp-wide: 1280px; --z-topbar: 30; --z-drawer: 50; --z-dialog: 70; --z-toast: 80; --z-camera: 90; --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo, Consolas, monospace; } .t-decisao { font-family: var(--font-sans); font-size: 28px; line-height: 32px; font-weight: 800; letter-spacing: 0.01em; } .t-kpi { font-family: var(--font-sans); font-size: 28px; line-height: 32px; font-weight: 700; } .t-h1 { font-family: var(--font-sans); font-size: 1.4rem; line-height: 1.3; font-weight: 700; } .t-h2 { font-family: var(--font-sans); font-size: 1.1rem; line-height: 1.35; font-weight: 700; } .t-h3 { font-family: var(--font-sans); font-size: 1rem; line-height: 1.4; font-weight: 650; } .t-score { font-family: var(--font-sans); font-size: 22px; line-height: 28px; font-weight: 700; } .t-body { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 400; } .t-body-strong { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 600; } .t-input { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; } .t-small { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 400; } .t-label { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 600; } .t-th { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: 0.06em; } .t-badge { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: 0.02em; } .t-mono { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 400; }