/* Bellhousing design tokens · Cool Crisp
   Light is default. Dark via [data-theme="dark"] or prefers-color-scheme when System. */

:root,
[data-theme="light"] {
  color-scheme: light;

  /* Surfaces */
  --bh-bg: #e8edf3;
  --bh-surface: #f5f8fb;
  --bh-surface-raised: #eef2f7;
  --bh-surface-nav: #f5f8fb;

  /* Borders */
  --bh-border: #c5d0dc;
  --bh-border-strong: #8fa0b3;

  /* Ink */
  --bh-ink: #0f172a;
  --bh-ink-2: #334155;
  --bh-muted: #556478; /* darkened from #64748B for AA ≥4.5 on surfaces */

  /* Accent (signal orange) */
  --bh-accent: #e85d04; /* fills, chart-today, mark */
  --bh-accent-fg: #0f172a; /* text ON accent fills (white failed AA) */
  --bh-accent-text: #9a3412; /* accent as text/links (AA on surfaces) */
  --bh-accent-muted: #fdba74;

  /* Status */
  --bh-good: #047857;
  --bh-bad: #b91c1c;
  --bh-warn: #b45309;

  /* Chart / instrument */
  --bh-slate: #475569; /* comparison / composition bars */
  --bh-slate-deep: #1e293b;
  --bh-track: #d3dce6;
  --bh-chart-today: var(--bh-accent);
  --bh-chart-compare: var(--bh-slate);
  --bh-chart-average: var(--bh-muted);
  /* Heat scale, slow to busy (weekday-and-hour grids, owner Oct 30): lighter to darker on light, dimmer to brighter on dark; text checked >= 4.5:1 on every step. */
  --bh-heat-1: #fff7d6;
  --bh-heat-2: #feeaa0;
  --bh-heat-3: #fed976;
  --bh-heat-4: #feb24c;
  --bh-heat-5: #fd8d3c;
  --bh-heat-6: #f2612b;
  --bh-heat-7: #d9381e;
  --bh-heat-8: #b31b1b;
  --bh-heat-9: #7f0f1e;
  --bh-heat-ink-1: var(--bh-ink);
  --bh-heat-ink-2: var(--bh-ink);
  --bh-heat-ink-3: var(--bh-ink);
  --bh-heat-ink-4: var(--bh-ink);
  --bh-heat-ink-5: var(--bh-ink);
  --bh-heat-ink-6: var(--bh-ink);
  --bh-heat-ink-7: #ffffff;
  --bh-heat-ink-8: #ffffff;
  --bh-heat-ink-9: #ffffff;
  --bh-nav-active-bg: #e2e8f0;

  /* Regions (swatches + share bars only) */
  --bh-region-blue: #3b5b84;
  --bh-region-gold: #9a7b3c;
  --bh-region-green: #3f6b54;
  --bh-region-red: #8b4a42;

  /* Type */
  --bh-font-sans: "Source Sans 3", "Helvetica Neue", Arial, sans-serif;
  --bh-font-mono: "IBM Plex Mono", ui-monospace, monospace;

  /* Radii / space */
  --bh-radius: 2px;
  --bh-radius-sm: 1px;
  --bh-space-1: 4px;
  --bh-space-2: 8px;
  --bh-space-3: 12px;
  --bh-space-4: 16px;
  --bh-space-5: 20px;
  --bh-space-6: 24px;
  --bh-space-7: 28px;
  --bh-space-8: 32px;
  --bh-space-10: 40px;
  --bh-space-12: 48px;

  /* Motion */
  --bh-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --bh-duration-fast: 180ms;
  --bh-duration: 420ms;
  --bh-duration-count: 650ms;
  --bh-duration-chart: 700ms;

  /* Shadows: none by system rule */
  --bh-shadow: none;
}

[data-theme="dark"] {
  color-scheme: dark;

  --bh-bg: #0b1220;
  --bh-surface: #121a2a;
  --bh-surface-raised: #1a2436;
  --bh-surface-nav: #121a2a;

  --bh-border: #2a3748;
  --bh-border-strong: #3d4f66;

  --bh-ink: #e8eef4;
  --bh-ink-2: #a8b4c4;
  --bh-muted: #8494a8;

  --bh-accent: #f97316;
  --bh-accent-fg: #0b1220;
  --bh-accent-text: #fb923c;
  --bh-accent-muted: #fdba74;

  --bh-good: #34d399;
  --bh-bad: #f87171;
  --bh-warn: #fbbf24;

  --bh-slate: #94a3b8;
  --bh-slate-deep: #cbd5e1;
  --bh-track: #1e293b;
  --bh-chart-today: var(--bh-accent);
  --bh-chart-compare: var(--bh-slate);
  --bh-chart-average: var(--bh-muted);
  /* Heat scale, slow to busy (weekday-and-hour grids, owner Oct 30): lighter to darker on light, dimmer to brighter on dark; text checked >= 4.5:1 on every step. */
  --bh-heat-1: #2a2a24;
  --bh-heat-2: #3d3722;
  --bh-heat-3: #5a4720;
  --bh-heat-4: #7a561b;
  --bh-heat-5: #995c14;
  --bh-heat-6: #d26a14;
  --bh-heat-7: #ea6a1a;
  --bh-heat-8: #ff7a3d;
  --bh-heat-9: #ffb37a;
  --bh-heat-ink-1: var(--bh-ink);
  --bh-heat-ink-2: var(--bh-ink);
  --bh-heat-ink-3: var(--bh-ink);
  --bh-heat-ink-4: var(--bh-ink);
  --bh-heat-ink-5: var(--bh-ink);
  --bh-heat-ink-6: #0f172a;
  --bh-heat-ink-7: #0f172a;
  --bh-heat-ink-8: #0f172a;
  --bh-heat-ink-9: #0f172a;
  --bh-nav-active-bg: #1e293b;

  --bh-region-blue: #6b8cae;
  --bh-region-gold: #c4a35a;
  --bh-region-green: #6b9b7a;
  --bh-region-red: #c47a72;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bh-bg: #0b1220;
    --bh-surface: #121a2a;
    --bh-surface-raised: #1a2436;
    --bh-surface-nav: #121a2a;
    --bh-border: #2a3748;
    --bh-border-strong: #3d4f66;
    --bh-ink: #e8eef4;
    --bh-ink-2: #a8b4c4;
    --bh-muted: #8494a8;
    --bh-accent: #f97316;
    --bh-accent-fg: #0b1220;
    --bh-accent-text: #fb923c;
    --bh-accent-muted: #fdba74;
    --bh-good: #34d399;
    --bh-bad: #f87171;
    --bh-warn: #fbbf24;
    --bh-slate: #94a3b8;
    --bh-slate-deep: #cbd5e1;
    --bh-track: #1e293b;
    --bh-chart-today: var(--bh-accent);
    --bh-chart-compare: var(--bh-slate);
    --bh-chart-average: var(--bh-muted);
    /* Heat scale, slow to busy (weekday-and-hour grids, owner Oct 30): lighter to darker on light, dimmer to brighter on dark; text checked >= 4.5:1 on every step. */
    --bh-heat-1: #2a2a24;
    --bh-heat-2: #3d3722;
    --bh-heat-3: #5a4720;
    --bh-heat-4: #7a561b;
    --bh-heat-5: #995c14;
    --bh-heat-6: #d26a14;
    --bh-heat-7: #ea6a1a;
    --bh-heat-8: #ff7a3d;
    --bh-heat-9: #ffb37a;
    --bh-heat-ink-1: var(--bh-ink);
    --bh-heat-ink-2: var(--bh-ink);
    --bh-heat-ink-3: var(--bh-ink);
    --bh-heat-ink-4: var(--bh-ink);
    --bh-heat-ink-5: var(--bh-ink);
    --bh-heat-ink-6: #0f172a;
    --bh-heat-ink-7: #0f172a;
    --bh-heat-ink-8: #0f172a;
    --bh-heat-ink-9: #0f172a;
    --bh-nav-active-bg: #1e293b;
    --bh-region-blue: #6b8cae;
    --bh-region-gold: #c4a35a;
    --bh-region-green: #6b9b7a;
    --bh-region-red: #c47a72;
  }
}

/* Base application of tokens */
*,
*::before,
*::after {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  background: var(--bh-bg);
  color: var(--bh-ink);
  font-family: var(--bh-font-sans);
  font-feature-settings:
    "tnum" 1,
    "kern" 1;
  -webkit-font-smoothing: antialiased;
}

.bh-num {
  font-family: var(--bh-font-mono);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}