/* After Hours: warm ink + brass, with a light "paper" theme. See docs/color-system.md.
   Every token is light-dark(light, dark); :root follows the system unless data-theme is set.
   The scale names are kept from the earlier Radix palette so existing styles keep working:
   "slate" is now the warm neutral and "blue" is the brass accent scale. */
:root { color-scheme: light dark; }
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }
:root {
  --slate-1:light-dark(#f6f1e7,#0b0d12); --slate-2:light-dark(#fbf7ef,#10131a); --slate-3:light-dark(#efe8db,#1c212c); --slate-4:light-dark(#e9e1d2,#252b38);
  --slate-5:light-dark(#e0d6c4,#2b3240); --slate-6:light-dark(#d6cbb7,#323a4a); --slate-7:light-dark(#c9bda8,#3a4252); --slate-8:light-dark(#b3a690,#4a5366);
  --slate-9:light-dark(#8f8576,#6b7385); --slate-10:light-dark(#857a69,#7d8597); --slate-11:light-dark(#5d574d,#aaa497); --slate-12:light-dark(#1c1915,#f4efe4);
  --blue-1:light-dark(#fffbf3,#120f0a); --blue-2:light-dark(#fdf5e6,#17130c); --blue-3:light-dark(#f8ebd2,#241e14); --blue-4:light-dark(#f3e0bd,#2e2618);
  --blue-5:light-dark(#ecd3a2,#3a2f1c); --blue-6:light-dark(#e2c184,#4a3b21); --blue-7:light-dark(#d4a95e,#6a5228); --blue-8:light-dark(#c79540,#8a6a30);
  --blue-9:light-dark(#e0a443,#eab35b); --blue-10:light-dark(#c98b2a,#f0c070); --blue-11:light-dark(#8e5a0c,#eab35b); --blue-12:light-dark(#5c3a06,#ffd48a);
  --red-3:light-dark(#fbe6e2,#3a1a1a); --red-7:light-dark(#e8a59d,#8a3a36); --red-11:light-dark(#c8382d,#ff7a70); --red-12:light-dark(#6b1a14,#ffc9c2);
  --amber-9:light-dark(#e0a443,#eab35b); --amber-12:light-dark(#3d2706,#1a1206);
  --sky-11:light-dark(#4a9ef0,#6cb6ff); --sky-12:#0b1626;
  --jgg-bg:var(--slate-1);
  --jgg-surface:light-dark(#fffdf8,#151922);
  --jgg-surface-subtle:var(--slate-2);
  --jgg-surface-raised:var(--slate-3);
  --jgg-surface-hover:var(--slate-4);
  --jgg-selected:var(--blue-3);
  --jgg-selected-hover:var(--blue-4);
  --jgg-text:var(--slate-12);
  --jgg-text-muted:var(--slate-11);
  --jgg-accent:var(--blue-11);
  --jgg-accent-hover:light-dark(#6f4608,#ffd48a);
  --jgg-link:var(--blue-12);
  --jgg-on-accent:light-dark(#fffaf0,#1a1206);
  --jgg-hero:light-dark(#1c1915,#1a1e28);
  --jgg-on-hero:light-dark(#f6f1e7,#f4efe4);
  --jgg-on-hero-muted:light-dark(#d3cab9,#c9c2b5);
  --jgg-border:var(--slate-7);
  --jgg-control-border:var(--slate-10);
  --jgg-focus:var(--blue-11);
  --jgg-focus-on-dark:light-dark(#eab35b,#ffd48a);
  --jgg-error-bg:var(--red-3);
  --jgg-error-border:var(--red-7);
  --jgg-error:var(--red-11);
  --jgg-error-text:var(--red-12);
  /* Brass marks known musical roots/reference notes; notes the player picks are sky. */
  --jgg-reference:var(--amber-9);
  --jgg-reference-text:var(--amber-12);
  --jgg-pick:var(--sky-11);
  --jgg-on-pick:var(--sky-12);
  /* Colour = function in the lab: root brass, 3rd coral, 5th teal, 7th violet, colour tones sky.
     The fretboard is dark wood in both themes, so these stay bright in both. */
  --jgg-third:#ff8a73;
  --jgg-fifth:#4fd1bd;
  --jgg-seventh:#ab8cff;
  --jgg-on-role:#15110a;
  /* Shadow tint and the wooden fretboard. */
  --jgg-shadow:light-dark(#3c2a0a,#000000);
  --jgg-board-1:light-dark(#4a311c,#3b2717);
  --jgg-board-2:light-dark(#2c1d11,#22160d);
  --jgg-fret-wire:#c9c2b5;
  --jgg-string:#e2d6c2;
  --jgg-inlay:#d8cfc0;
}