/*
 * aceious design tokens — generated by tools/build-brand.mts from
 * src/brand/tokens.ts. Do not edit by hand.
 *
 * Tailwind v4: `@import` this file and every token below becomes a utility
 * (bg-bg, text-muted, border-line, bg-accent, text-display…). Without
 * Tailwind, read the --ds-* custom properties directly.
 *
 * Theme: follows the OS, and `data-theme="light" | "dark"` on <html>
 * overrides it.
 */
:root {
  --ds-bg: #FAFAFA;
  --ds-surface: #FFFFFF;
  --ds-subtle: #F5F5F5;
  --ds-fg: #0A0A0A;
  --ds-muted: #4D4D4D;
  --ds-faint: #6B6B6B;
  --ds-line: rgba(10, 10, 10, 0.08);
  --ds-line-strong: rgba(10, 10, 10, 0.16);
  --ds-accent: #E11D2E;
  --ds-on-accent: #FFFFFF;
  --ds-invert: #0A0A0A;
  --ds-on-invert: #FAFAFA;
  --ds-success: #16A34A;
  --ds-warning: #D97706;
  --ds-info: #2563EB;
  --ds-gray-100: #F5F5F5;
  --ds-gray-200: #EDEDED;
  --ds-gray-300: #E5E5E5;
  --ds-gray-400: #DADADA;
  --ds-gray-500: #C7C7C7;
  --ds-gray-600: #A3A3A3;
  --ds-gray-700: #8F8F8F;
  --ds-gray-800: #6B6B6B;
  --ds-gray-900: #4D4D4D;
  --ds-gray-1000: #0A0A0A;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ds-bg: #0A0A0A;
    --ds-surface: #111111;
    --ds-subtle: #141414;
    --ds-fg: #EDEDED;
    --ds-muted: #A1A1A1;
    --ds-faint: #8F8F8F;
    --ds-line: rgba(255, 255, 255, 0.09);
    --ds-line-strong: rgba(255, 255, 255, 0.18);
    --ds-accent: #FF2D3D;
    --ds-on-accent: #FFFFFF;
    --ds-invert: #FAFAFA;
    --ds-on-invert: #0A0A0A;
    --ds-success: #22C55E;
    --ds-warning: #F59E0B;
    --ds-info: #3B82F6;
    --ds-gray-100: #141414;
    --ds-gray-200: #1A1A1A;
    --ds-gray-300: #222222;
    --ds-gray-400: #2B2B2B;
    --ds-gray-500: #363636;
    --ds-gray-600: #4A4A4A;
    --ds-gray-700: #6E6E6E;
    --ds-gray-800: #8F8F8F;
    --ds-gray-900: #A1A1A1;
    --ds-gray-1000: #EDEDED;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --ds-bg: #0A0A0A;
  --ds-surface: #111111;
  --ds-subtle: #141414;
  --ds-fg: #EDEDED;
  --ds-muted: #A1A1A1;
  --ds-faint: #8F8F8F;
  --ds-line: rgba(255, 255, 255, 0.09);
  --ds-line-strong: rgba(255, 255, 255, 0.18);
  --ds-accent: #FF2D3D;
  --ds-on-accent: #FFFFFF;
  --ds-invert: #FAFAFA;
  --ds-on-invert: #0A0A0A;
  --ds-success: #22C55E;
  --ds-warning: #F59E0B;
  --ds-info: #3B82F6;
  --ds-gray-100: #141414;
  --ds-gray-200: #1A1A1A;
  --ds-gray-300: #222222;
  --ds-gray-400: #2B2B2B;
  --ds-gray-500: #363636;
  --ds-gray-600: #4A4A4A;
  --ds-gray-700: #6E6E6E;
  --ds-gray-800: #8F8F8F;
  --ds-gray-900: #A1A1A1;
  --ds-gray-1000: #EDEDED;
  color-scheme: dark;
}

/*
 * A band in a fixed theme, whatever the page is in — a dark footer on a light
 * page. Every role below resolves inside it.
 */
.theme-dark {
  --ds-bg: #0A0A0A;
  --ds-surface: #111111;
  --ds-subtle: #141414;
  --ds-fg: #EDEDED;
  --ds-muted: #A1A1A1;
  --ds-faint: #8F8F8F;
  --ds-line: rgba(255, 255, 255, 0.09);
  --ds-line-strong: rgba(255, 255, 255, 0.18);
  --ds-accent: #FF2D3D;
  --ds-on-accent: #FFFFFF;
  --ds-invert: #FAFAFA;
  --ds-on-invert: #0A0A0A;
  --ds-success: #22C55E;
  --ds-warning: #F59E0B;
  --ds-info: #3B82F6;
  --ds-gray-100: #141414;
  --ds-gray-200: #1A1A1A;
  --ds-gray-300: #222222;
  --ds-gray-400: #2B2B2B;
  --ds-gray-500: #363636;
  --ds-gray-600: #4A4A4A;
  --ds-gray-700: #6E6E6E;
  --ds-gray-800: #8F8F8F;
  --ds-gray-900: #A1A1A1;
  --ds-gray-1000: #EDEDED;
  color-scheme: dark;
}
.theme-light {
  --ds-bg: #FAFAFA;
  --ds-surface: #FFFFFF;
  --ds-subtle: #F5F5F5;
  --ds-fg: #0A0A0A;
  --ds-muted: #4D4D4D;
  --ds-faint: #6B6B6B;
  --ds-line: rgba(10, 10, 10, 0.08);
  --ds-line-strong: rgba(10, 10, 10, 0.16);
  --ds-accent: #E11D2E;
  --ds-on-accent: #FFFFFF;
  --ds-invert: #0A0A0A;
  --ds-on-invert: #FAFAFA;
  --ds-success: #16A34A;
  --ds-warning: #D97706;
  --ds-info: #2563EB;
  --ds-gray-100: #F5F5F5;
  --ds-gray-200: #EDEDED;
  --ds-gray-300: #E5E5E5;
  --ds-gray-400: #DADADA;
  --ds-gray-500: #C7C7C7;
  --ds-gray-600: #A3A3A3;
  --ds-gray-700: #8F8F8F;
  --ds-gray-800: #6B6B6B;
  --ds-gray-900: #4D4D4D;
  --ds-gray-1000: #0A0A0A;
  color-scheme: light;
}

@theme inline {
  --color-ace-black: #0A0A0A;
  --color-ace-red: #E11D2E;
  --color-ace-red-bright: #FF2D3D;
  --color-soft-white: #FAFAFA;
  --color-ash: #1A1A1A;
  --color-slate: #6B7280;
  --color-mist: #E5E7EB;
  --color-warm-gray: #D4D4D8;
  --color-bg: var(--ds-bg);
  --color-surface: var(--ds-surface);
  --color-subtle: var(--ds-subtle);
  --color-fg: var(--ds-fg);
  --color-muted: var(--ds-muted);
  --color-faint: var(--ds-faint);
  --color-line: var(--ds-line);
  --color-line-strong: var(--ds-line-strong);
  --color-accent: var(--ds-accent);
  --color-on-accent: var(--ds-on-accent);
  --color-invert: var(--ds-invert);
  --color-on-invert: var(--ds-on-invert);
  --color-success: var(--ds-success);
  --color-warning: var(--ds-warning);
  --color-info: var(--ds-info);
  --color-gray-100: var(--ds-gray-100);
  --color-gray-200: var(--ds-gray-200);
  --color-gray-300: var(--ds-gray-300);
  --color-gray-400: var(--ds-gray-400);
  --color-gray-500: var(--ds-gray-500);
  --color-gray-600: var(--ds-gray-600);
  --color-gray-700: var(--ds-gray-700);
  --color-gray-800: var(--ds-gray-800);
  --color-gray-900: var(--ds-gray-900);
  --color-gray-1000: var(--ds-gray-1000);
}

@theme {
  --font-sans: var(--font-poppins), ui-sans-serif, system-ui, sans-serif;
  --font-mono: var(--font-geist-mono), ui-monospace, SFMono-Regular, Menlo, monospace;
  --text-display: 3.5rem;
  --text-display--line-height: 1.1428571428571428;
  --text-display--letter-spacing: -0.035em;
  --text-display--font-weight: 700;
  --text-h1: 2.5rem;
  --text-h1--line-height: 1.2;
  --text-h1--letter-spacing: -0.03em;
  --text-h1--font-weight: 700;
  --text-h2: 2rem;
  --text-h2--line-height: 1.25;
  --text-h2--letter-spacing: -0.025em;
  --text-h2--font-weight: 600;
  --text-h3: 1.25rem;
  --text-h3--line-height: 1.4;
  --text-h3--letter-spacing: -0.015em;
  --text-h3--font-weight: 600;
  --text-body: 1rem;
  --text-body--line-height: 1.5;
  --text-body--letter-spacing: 0em;
  --text-body--font-weight: 400;
  --text-small: 0.875rem;
  --text-small--line-height: 1.4285714285714286;
  --text-small--letter-spacing: 0em;
  --text-small--font-weight: 400;
  --text-caption: 0.875rem;
  --text-caption--line-height: 1.4285714285714286;
  --text-caption--letter-spacing: 0em;
  --text-caption--font-weight: 500;
  --text-label: 0.75rem;
  --text-label--line-height: 1.3333333333333333;
  --text-label--letter-spacing: 0.04em;
  --text-label--font-weight: 500;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --ease-brand: cubic-bezier(0.22, 1, 0.36, 1);
}
