/* Eazy Pizzy design tokens — calm blue + cream. Use these variables only. */
:root {
  /* Brand */
  --blue-950: #0b2239;
  --blue-900: #10304f;
  --blue-800: #163f66;
  --blue-700: #1d4f7f;
  --blue-600: #2a6599;
  --blue-500: #3b7db6;
  --blue-400: #6a9fcc;
  --blue-200: #c4daee;
  --blue-100: #e0ecf7;
  --blue-50:  #f0f6fc;
  --cream-50:  #fffdf8;
  --cream-100: #fcf8ee;
  --cream-200: #f6eedb;
  --cream-300: #ecdfc2;
  --cream-400: #dcc9a0;

  /* Semantic surfaces */
  --bg: var(--cream-100);
  --bg-elevated: var(--cream-50);
  --surface: #ffffff;
  --surface-muted: var(--cream-200);
  --surface-brand: var(--blue-900);
  --border: #e7dfcd;
  --border-strong: #d6c9ad;

  /* Text */
  --ink: #132a40;
  --ink-soft: #3a5068;
  --muted: #66788b;
  --on-brand: var(--cream-50);
  --link: var(--blue-600);

  /* Accents & status (tone) */
  --primary: var(--blue-700);
  --primary-hover: var(--blue-800);
  --primary-soft: var(--blue-100);
  --good: #2f7d5b;   --good-soft: #def0e6;
  --warn: #a8701a;   --warn-soft: #f7ead0;
  --bad:  #b4473b;   --bad-soft:  #f6e0dc;
  --info: var(--blue-600); --info-soft: var(--blue-100);
  --neutral: #6b7785; --neutral-soft: #ebe8e1;

  /* Data viz series (validated for contrast on light surface) */
  --series-1: #2a6599;
  --series-2: #c08a2e;
  --series-3: #1f9d7e;
  --series-grid: #ece5d6;

  /* Type */
  --font-sans: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --fs-xs: 0.75rem; --fs-sm: 0.875rem; --fs-md: 1rem; --fs-lg: 1.125rem;
  --fs-xl: 1.375rem; --fs-2xl: 1.75rem; --fs-3xl: 2.25rem; --fs-4xl: clamp(2.25rem, 5vw, 3.5rem);

  /* Space, radius, shadow, motion */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;
  --r-sm: 8px; --r-md: 12px; --r-lg: 18px; --r-xl: 26px; --r-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(16, 48, 79, 0.06), 0 1px 1px rgba(16, 48, 79, 0.04);
  --shadow-md: 0 6px 18px -6px rgba(16, 48, 79, 0.14), 0 2px 6px rgba(16, 48, 79, 0.06);
  --shadow-lg: 0 24px 48px -16px rgba(16, 48, 79, 0.22);
  --ring: 0 0 0 3px rgba(59, 125, 182, 0.35);
  --ease: cubic-bezier(.2, .7, .2, 1);
  --dur: 180ms;
  --container: 1180px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0d1b2a; --bg-elevated: #112335; --surface: #142a40; --surface-muted: #1a334c;
    --surface-brand: #0a1826; --border: #23405c; --border-strong: #2f5273;
    --ink: #f3ecdc; --ink-soft: #d6cdb9; --muted: #9fb0c2; --on-brand: var(--cream-50); --link: #8fbde6;
    --primary: #5a9bd3; --primary-hover: #74aedf; --primary-soft: #1d3a57;
    --good: #6cc39b; --good-soft: #17382b; --warn: #e2b260; --warn-soft: #3b2f17;
    --bad: #e58b7f; --bad-soft: #42221e; --info: #8fbde6; --info-soft: #1d3a57;
    --neutral: #a7b2bf; --neutral-soft: #26384b;
    --series-1: #4a90d4; --series-2: #bd8424; --series-3: #2a9a76; --series-grid: #22405c;
    --shadow-sm: 0 1px 2px rgba(0,0,0,.3); --shadow-md: 0 8px 22px -8px rgba(0,0,0,.5); --shadow-lg: 0 24px 48px -16px rgba(0,0,0,.6);
  }
}
:root[data-theme="dark"] {
  --bg: #0d1b2a; --bg-elevated: #112335; --surface: #142a40; --surface-muted: #1a334c;
  --surface-brand: #0a1826; --border: #23405c; --border-strong: #2f5273;
  --ink: #f3ecdc; --ink-soft: #d6cdb9; --muted: #9fb0c2; --on-brand: var(--cream-50); --link: #8fbde6;
  --primary: #5a9bd3; --primary-hover: #74aedf; --primary-soft: #1d3a57;
  --good: #6cc39b; --good-soft: #17382b; --warn: #e2b260; --warn-soft: #3b2f17;
  --bad: #e58b7f; --bad-soft: #42221e; --info: #8fbde6; --info-soft: #1d3a57;
  --neutral: #a7b2bf; --neutral-soft: #26384b;
  --series-1: #4a90d4; --series-2: #bd8424; --series-3: #2a9a76; --series-grid: #22405c;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--font-sans); font-size: var(--fs-md); line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
:focus-visible { outline: none; box-shadow: var(--ring); border-radius: var(--r-sm); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
