/* ==========================================================================
   Eternal Linkage — theme tokens.
   Everything visual hangs off these variables. Restyle here first.
   ========================================================================== */
:root {
  color-scheme: light;

  /* Paper + ink */
  --bg: #f4efe6;
  --bg-2: #ebe4d7;
  --surface: #fffdf9;
  --surface-2: #f8f3ea;
  --ink: #1e1b18;
  --ink-2: #4a4540;
  --muted: #7a736b;
  --line: #e3dbcc;
  --line-2: #d2c8b6;

  /* Brand: bus red + Tube blue + a little gold */
  --red: #cc2b27;
  --red-2: #a81f1c;
  --blue: #1b4fa3;
  --blue-2: #133a7a;
  --gold: #d9a21b;
  --cream: #fff8ea;

  /* Event categories */
  --cat-date: #e2725b;
  --cat-home: #3a7bd5;
  --cat-milestone: #d9a21b;
  --cat-travel: #2a9d8f;
  --cat-family: #9b5de5;
  --cat-other: #8d99ae;

  /* Kudos kinds */
  --kind-kudos: #d9a21b;
  --kind-thanks: #e2725b;
  --kind-nudge: #3a7bd5;
  --kind-idea: #2a9d8f;

  /* Type */
  --font-display: "Fraunces", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Shape */
  --radius-s: 8px;
  --radius: 14px;
  --radius-l: 22px;
  --shadow-s: 0 1px 2px rgba(30, 27, 24, .06), 0 1px 1px rgba(30, 27, 24, .04);
  --shadow: 0 8px 24px -12px rgba(30, 27, 24, .25), 0 2px 6px -2px rgba(30, 27, 24, .08);
  --shadow-l: 0 24px 60px -24px rgba(30, 27, 24, .35);

  /* Gantt */
  --gantt-row: 40px;
  --gantt-group: 30px;
  --gantt-header: 54px;
  --gantt-labels: 240px;

  /* Motion */
  --ease: cubic-bezier(.2, .7, .2, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #17151a;
    --bg-2: #1f1c22;
    --surface: #24212a;
    --surface-2: #2c2833;
    --ink: #f1ece4;
    --ink-2: #cfc8bd;
    --muted: #9b948a;
    --line: #37323e;
    --line-2: #46404f;
    --cream: #2c2833;
    --shadow-s: 0 1px 2px rgba(0, 0, 0, .4);
    --shadow: 0 8px 24px -12px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .4);
    --shadow-l: 0 24px 60px -24px rgba(0, 0, 0, .7);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #17151a;
  --bg-2: #1f1c22;
  --surface: #24212a;
  --surface-2: #2c2833;
  --ink: #f1ece4;
  --ink-2: #cfc8bd;
  --muted: #9b948a;
  --line: #37323e;
  --line-2: #46404f;
  --cream: #2c2833;
  --shadow-s: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow: 0 8px 24px -12px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .4);
  --shadow-l: 0 24px 60px -24px rgba(0, 0, 0, .7);
}