/* Gerado por docs/new branding/scripts/tokens_css.py a partir de tokens.json. */
/* Não editar à mão: mude o tokens.json e rode o script. */

@font-face { font-family: 'Bricolage Grotesque'; font-weight: 200 800; font-display: swap; src: url('../fonts/BricolageGrotesque.woff2') format('woff2'); }
@font-face { font-family: 'Atkinson Hyperlegible Next'; font-weight: 200 800; font-display: swap; src: url('../fonts/AtkinsonHyperlegibleNext.woff2') format('woff2'); }
@font-face { font-family: 'Atkinson Hyperlegible Mono'; font-weight: 200 800; font-display: swap; src: url('../fonts/AtkinsonHyperlegibleMono.woff2') format('woff2'); }

:root {
  --eco-surface: #f2f3ee;
  --eco-surface-raised: #ffffff;
  --eco-surface-sunken: #e8eae3;
  --eco-line: #d9dbd2;
  --eco-line-strong: #7b808b;
  --eco-ink: #15171d;
  --eco-ink-muted: #565a66;
  --eco-cobalt: #2c3fd6;
  --eco-cobalt-soft: #e3e6fb;
  --eco-on-cobalt: #ffffff;
  --eco-amber: #f2a33a;
  --eco-on-amber: #15171d;
  --eco-amber-ink: #8a5300;
  --eco-amber-soft: #fcebd0;
  --eco-success: #17694a;
  --eco-success-soft: #dcf1e6;
  --eco-danger: #b1312a;
  --eco-danger-soft: #fbe3e0;
  --eco-on-danger: #ffffff;
  --eco-focus: var(--eco-cobalt);
  --eco-link: var(--eco-cobalt);
  --eco-font-display: "Bricolage Grotesque", "Avenir Next", system-ui, sans-serif;
  --eco-font-sans: "Atkinson Hyperlegible Next", "Atkinson Hyperlegible", system-ui, sans-serif;
  --eco-font-mono: "Atkinson Hyperlegible Mono", ui-monospace, Menlo, monospace;
  --eco-radius-sm: 6px;
  --eco-radius-md: 12px;
  --eco-radius-lg: 20px;
  --eco-radius-xl: 28px;
  --eco-radius-pill: 999px;
  --eco-space-1: 4px;
  --eco-space-2: 8px;
  --eco-space-3: 12px;
  --eco-space-4: 16px;
  --eco-space-6: 24px;
  --eco-space-8: 32px;
  --eco-space-12: 48px;
  --eco-space-16: 64px;
  --eco-size-touch: 44px;
  --eco-size-action: 52px;
  --eco-shadow-raised: 0 1px 2px rgba(21,23,29,0.06), 0 8px 24px rgba(21,23,29,0.06);
}

html.dark {
  --eco-surface: #0f1117;
  --eco-surface-raised: #181b24;
  --eco-surface-sunken: #0a0c11;
  --eco-line: #2a2e3a;
  --eco-line-strong: #6b7080;
  --eco-ink: #eceef3;
  --eco-ink-muted: #a2a7b5;
  --eco-cobalt: #8e9bff;
  --eco-cobalt-soft: #1e2450;
  --eco-on-cobalt: #0f1117;
  --eco-amber: #f5b559;
  --eco-on-amber: #0f1117;
  --eco-amber-ink: #f5b559;
  --eco-amber-soft: #3a2a10;
  --eco-success: #5cc99a;
  --eco-success-soft: #123626;
  --eco-danger: #ff8a7f;
  --eco-danger-soft: #3d1715;
  --eco-on-danger: #0f1117;
  --eco-shadow-raised: 0 1px 2px rgba(0,0,0,0.4), 0 8px 24px rgba(0,0,0,0.35);
}