/*
 * The Neverending Tapes - A Bob Dylan Archive
 * Design System — "Tube Glow"
 *
 * Hi-fi-receiver / tube-amp aesthetic: warm near-black panels, amber phosphor
 * glow, VU-meter indicators, LCD readouts, faceplate chrome.
 *
 * The semantic tokens (--bg, --accent, --text, --font-*, …) keep their original
 * NAMES so every existing stylesheet inherits the new look. The faceplate-
 * specific tokens below them are added verbatim from the redesign brief and are
 * used by the hero surfaces (nav, player, catalog, performance, collection).
 */

/* ========================================
   Tokens
   ======================================== */

:root {
  /* --- Semantic tokens (names preserved; remapped to Tube Glow) --- */

  /* Backgrounds — warm near-black */
  --bg-deep:       #0a0908;   /* screen / frame background */
  --bg:            #0c0a08;   /* panels: search, filter rail, sidebars */
  --surface:       #0d0b08;   /* recessed fields, selector wells */
  --surface-hover: #16120b;   /* lifted surface on hover */

  /* Borders — amber-tinted hairlines */
  --border-subtle: rgba(224, 162, 60, 0.10);
  --border:        rgba(224, 162, 60, 0.18);
  --border-active: rgba(224, 162, 60, 0.40);

  /* Text ramp */
  --text:          #ede2cd;
  --text-secondary:#b8a888;
  --text-muted:    #6b6354;

  /* Accent — the tube glow */
  --accent:        #e0a23c;
  --accent-hover:  #f3bd63;
  --accent-dim:    rgba(224, 162, 60, 0.08);

  /* Player */
  --player-bg:     #080605;

  /* Typography */
  --font-display:  'Newsreader', Georgia, serif;
  --font-body:     'Newsreader', Georgia, serif;
  --font-mono:     'JetBrains Mono', 'Menlo', monospace;

  /* Transitions */
  --transition-fast:   120ms ease-out;
  --transition-base:   200ms ease-out;
  --transition-slow:   350ms ease-in-out;

  /* --- Faceplate tokens (from the redesign brief) --- */

  /* Surfaces (warm near-black) */
  --frame-bg:      #0a0908;   /* screen background */
  --panel:         #0c0a08;   /* search / filter-rail / sidebars */
  --panel-2:       #080706;   /* sub-bars, pagination, tuner strips */
  --inset:         #060504;   /* recessed fields, LCD readout wells */
  --field:         #0d0b08;   /* filter selector fields */
  --dial-well:     linear-gradient(180deg, #120d08, #0a0706);  /* songbook "through time" glowing well (one step warmer than --inset) */

  /* Faceplate brushed metal */
  --metal:  linear-gradient(180deg, #1c1812, #15120d 45%, #0f0c08);
  --brush:  repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.016) 0 1px, transparent 1px 3px);
  --metal-badge: linear-gradient(180deg, #0e0b08, #080605);  /* recessed plates */

  /* Amber (the brand / phosphor) */
  --amber:        #e0a23c;
  --amber-bright: radial-gradient(circle at 38% 30%, #f3bd63, #cf8f28); /* knobs, play btn */
  --amber-glow:   0 0 8px rgba(224, 162, 60, 0.5);   /* text-shadow on lit text */
  --amber-dim:    #b8a888;
  --amber-faint:  #8a7140;

  /* Tone dial phosphor (green — matches the quality-scale green hue 150) */
  --tone-glow:      oklch(0.80 0.15 152);            /* TONE dial glow / indicator */
  --tone-glow-soft: oklch(0.80 0.15 152 / 0.55);     /* TONE arc + indicator bloom */

  /* Ink ramp */
  --ink-100: #ede2cd;
  --ink-90:  #cfc4b2;
  --ink-80:  #cdbb9b;
  --ink-70:  #b8a888;
  --ink-60:  #9a8f7c;
  --ink-50:  #8a8070;
  --ink-40:  #7a7160;
  --ink-30:  #6b6354;
  --ink-20:  #5a5244;
  --sep:     #403a30;

  /* Audio-quality scale (oklch — used by the VU-meter indicator) */
  --q-excellent: oklch(0.74 0.11 150);  /* green  */
  --q-good:      oklch(0.75 0.10 122);
  --q-fair:      oklch(0.78 0.12 80);    /* amber  */
  --q-poor:      oklch(0.66 0.13 33);    /* red    */
  --q-unknown:   #3a332a;                /* dim, unlit */
  --seg-off:     #241f17;                /* unlit VU segment */
  --needle:      oklch(0.66 0.17 30);    /* songbook dial "on deck" playhead (red-orange) */

  /* Hairlines & dividers */
  --line:        rgba(224, 162, 60, 0.10);   /* section borders */
  --line-soft:   rgba(224, 162, 60, 0.06);   /* row dividers   */
  --line-strong: rgba(224, 162, 60, 0.30);   /* emphasised cards/buttons */

  /* Decorative overlays (pointer-events:none, sit above content) */
  --scanline: repeating-linear-gradient(180deg, transparent 0 2px, rgba(0, 0, 0, 0.15) 2px 3px);
  --vignette: radial-gradient(125% 80% at 50% 0%, transparent 58%, rgba(0, 0, 0, 0.40) 100%);

  /* Radii */
  --radius-frame:   14px;
  --radius-card:    9px;
  --radius-control: 6px;
  --radius-pill:    4px;

  /* Shadows */
  --shadow-frame:    0 34px 70px -28px rgba(0, 0, 0, 0.72);
  --shadow-recessed: inset 0 1px 3px rgba(0, 0, 0, 0.70);
  --shadow-amber:    0 0 16px -2px rgba(224, 162, 60, 0.45);  /* lit glow */
  --shadow-lcd:      inset 0 0 16px -6px rgba(224, 162, 60, 0.22);  /* LCD well */
}