/* ============================================================
   NMS AUDIO — DESIGN TOKENS  (equivalente ao tailwind.config.js)
   Escada de luminância + bordas translúcidas: padrão Linear (medido ao vivo)
   Acento cromático único: âmbar da marca (papel do indigo #5E6AD2 no Linear)
   ============================================================ */
:root {
  /* ---- superfícies ---- */
  --bg:        #08090A;
  --surface:   #101112;
  --surface-2: #191A1B;
  --surface-hover: rgba(255, 255, 255, 0.04);

  /* ---- texto ---- */
  --ink:   #F7F8F8;
  --ink-2: #D0D6E0;
  --mute:  #8A8F98;
  --dim:   #62666D;

  /* ---- acento único da marca ---- */
  --amber:      #FFB454;
  --amber-hot:  #FFC878;
  --amber-deep: #B87A2E;
  --amber-08:   rgba(255, 180, 84, 0.08);
  --amber-16:   rgba(255, 180, 84, 0.16);
  --amber-35:   rgba(255, 180, 84, 0.35);

  /* ---- bordas ---- */
  --line:    rgba(255, 255, 255, 0.05);
  --line-2:  rgba(255, 255, 255, 0.08);
  --line-3:  rgba(255, 255, 255, 0.16);
  --bg-soft: rgba(255, 255, 255, 0.02);

  /* ---- tipografia (redesign: Instrument Sans + Newsreader) ---- */
  --font-ui:      "Instrument Sans", "Plus Jakarta Sans", system-ui, sans-serif;
  --font-display: "Big Shoulders Display", "Arial Narrow", sans-serif;
  --font-serif:   "Newsreader", Georgia, serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, monospace;
  --track-display: -0.022em;
  --track-body:   -0.011em;

  /* ---- geometria ---- */
  --radius-card: 14px;
  --radius-btn:  8px;
  --radius-pill: 9999px;
  --chamfer: 18px;
  --container: 1240px;
  --gutter: clamp(20px, 5vw, 56px);

  /* ---- elevação ---- */
  --shadow-btn:
    0 8px 2px rgba(0,0,0,0.00), 0 5px 2px rgba(0,0,0,0.01),
    0 3px 2px rgba(0,0,0,0.04), 0 1px 1px rgba(0,0,0,0.07),
    0 0 1px rgba(0,0,0,0.08);
  --shadow-card:
    0 0 0 1px rgba(255,255,255,0.02) inset,
    0 12px 32px rgba(0,0,0,0.45);
  --shadow-plate:
    0 34px 60px rgba(0,0,0,.55);
  --shadow-soft:
    0 24px 48px -12px rgba(0,0,0,.5),
    0 4px 12px rgba(0,0,0,.3);

  /* ---- movimento (beziers próprios; nada de linear/ease genérico) ---- */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-io:     cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.32, 0.72, 0, 1);
  --dur-fast: 180ms;
  --dur-med:  450ms;
  --dur-slow: 800ms;
  --stagger: 120ms;

  --ring: 0 0 0 2px var(--bg), 0 0 0 4px var(--amber);
}