/* Vibernance tokens — generated from tokens.json by scripts/build-tokens.py. Edit tokens.json, then rerun the script. */

:root,
[data-theme="light"] {
  color-scheme: light;
  --surface: #F6F5F1;
  --surface-raised: #FFFFFF;
  --surface-sunken: #ECEBE6;
  --ink: #0E1116;
  --muted: #5B6068;
  --border: #D9D8D2;
  --border-strong: #83888F;
  --brand: #0E9F6E;
  --accent: #0E9F6E;
  --accent-strong: #087A54;
  --on-accent: #FFFFFF;
  --accent-tint: #E3F4EC;
  --warning: #A34A07;
  --warning-tint: #FBEFD9;
  --danger: #B42318;
  --danger-tint: #FBE4E1;
  --info: #1D4FD7;
  --info-tint: #E3ECFD;
  --shadow-sm: 0 1px 2px rgba(14,17,22,0.08);
  --shadow-md: 0 8px 24px rgba(14,17,22,0.12);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-icon: 22.9%;
  --radius-full: 999px;
  --font-display: "Space Grotesk", Inter, system-ui, sans-serif;
  --font-sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
}

[data-theme="dark"] {
  color-scheme: dark;
  --surface: #0E1116;
  --surface-raised: #171B22;
  --surface-sunken: #07090C;
  --ink: #F6F5F1;
  --muted: #9AA0A8;
  --border: #2A303A;
  --border-strong: #6A717C;
  --brand: #0E9F6E;
  --accent: #2BC48C;
  --accent-strong: #34D399;
  --on-accent: #0E1116;
  --accent-tint: #0F2A20;
  --warning: #F59E0B;
  --warning-tint: #2D2109;
  --danger: #F97066;
  --danger-tint: #331512;
  --info: #6EA0FF;
  --info-tint: #121D33;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.5);
  --shadow-md: 0 8px 24px rgba(0,0,0,0.6);
}

/* Follow the OS setting unless a theme is set explicitly. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --surface: #0E1116;
    --surface-raised: #171B22;
    --surface-sunken: #07090C;
    --ink: #F6F5F1;
    --muted: #9AA0A8;
    --border: #2A303A;
    --border-strong: #6A717C;
    --brand: #0E9F6E;
    --accent: #2BC48C;
    --accent-strong: #34D399;
    --on-accent: #0E1116;
    --accent-tint: #0F2A20;
    --warning: #F59E0B;
    --warning-tint: #2D2109;
    --danger: #F97066;
    --danger-tint: #331512;
    --info: #6EA0FF;
    --info-tint: #121D33;
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.5);
    --shadow-md: 0 8px 24px rgba(0,0,0,0.6);
  }
}

/* Type styles */
.display-xl { font-family: var(--font-display); font-size: 64px; line-height: 68px; font-weight: 700; }
.heading-lg { font-family: var(--font-display); font-size: 40px; line-height: 44px; font-weight: 700; }
.heading-md { font-family: var(--font-display); font-size: 28px; line-height: 34px; font-weight: 600; }
.heading-sm { font-family: var(--font-display); font-size: 20px; line-height: 28px; font-weight: 600; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }
.body-sm { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.label { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 600; }
.code { font-family: var(--font-mono); font-size: 14px; line-height: 20px; font-weight: 400; }