/* ============================================================
   Music Tools — shared design tokens
   Lifted verbatim from Aural Trainer's css/style.css so the two
   tools are visually the same product. Light default, dark via
   prefers-color-scheme. No webfonts (the aural app is an offline
   PWA and both tools should look identical with no network).

   Tool-specific hues (aural's concept + scaffold-element colours,
   repertoire's genre colours) stay in that tool's own stylesheet.
   Only what EVERY tool needs belongs here.
   ============================================================ */

:root {
  /* ink + surfaces */
  --bg: oklch(0.98 0.004 270);
  --surface: oklch(1 0 0);
  --surface-2: oklch(0.955 0.006 270);
  --ink: oklch(0.24 0.02 280);
  --ink-2: oklch(0.42 0.02 280);
  --line: oklch(0.88 0.008 270);
  --accent: oklch(0.44 0.15 288);
  --accent-ink: oklch(0.98 0.005 288);
  --ok: oklch(0.55 0.14 150);
  --bad: oklch(0.55 0.18 25);
  --ok-tint: oklch(0.94 0.045 150);
  --bad-tint: oklch(0.94 0.04 25);

  /* warn sits between ok and bad — used by repertoire's "conditional"
     verdict, which is neither an endorsement nor a rejection. */
  --warn: oklch(0.56 0.13 75);
  --warn-tint: oklch(0.95 0.04 75);

  --serif: "Iowan Old Style", "Palatino Nova", Palatino, "Book Antiqua", Georgia, serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --radius: 10px;
  --shadow: 0 1px 2px oklch(0.2 0.02 280 / 0.06), 0 4px 16px oklch(0.2 0.02 280 / 0.05);

  /* z scale */
  --z-sticky: 10;
  --z-toast: 40;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: oklch(0.19 0.015 280);
    --surface: oklch(0.235 0.015 280);
    --surface-2: oklch(0.27 0.015 280);
    --ink: oklch(0.93 0.008 280);
    --ink-2: oklch(0.72 0.015 280);
    --line: oklch(0.33 0.015 280);
    --accent: oklch(0.74 0.12 288);
    --accent-ink: oklch(0.17 0.03 288);
    --ok: oklch(0.75 0.13 150);
    --bad: oklch(0.72 0.16 25);
    --ok-tint: oklch(0.3 0.05 150);
    --bad-tint: oklch(0.3 0.05 25);
    --warn: oklch(0.78 0.11 80);
    --warn-tint: oklch(0.3 0.045 80);
  }
}