/* ============================================================
   BLUES PIANO — Design tokens
   Atmosfera "jazz club notturno": notte profonda, ottone caldo,
   rosso vino, avorio. La blue note ha un colore freddo a parte.
   ============================================================ */

:root {
  /* --- Superfici (dal piu' profondo al piu' chiaro) --- */
  --bg:            #0d0c11;   /* notte profonda, lieve viola */
  --bg-2:          #131119;
  --surface:       #1a1722;   /* card, pannelli */
  --surface-2:     #221d2d;   /* elementi sopra le card */
  --surface-hi:    #2b2436;   /* hover */

  /* --- Linee --- */
  --border:        #2a2433;
  --border-strong: #3b3346;
  --border-glow:   #4a3f57;

  /* --- Testo --- */
  --text:          #f3ecdc;   /* avorio caldo */
  --text-soft:     #b6ad9c;
  --text-faint:    #7d7589;
  --text-dim:      #5b5468;

  /* --- Ottone / oro (accento primario) --- */
  --brass:         #c9a45c;
  --brass-hi:      #e7c884;
  --brass-deep:    #9a7c3e;
  --brass-glow:    rgba(201, 164, 92, 0.35);

  /* --- Rosso vino (accento caldo secondario) --- */
  --wine:          #b8434f;
  --wine-deep:     #7a1f2b;
  --wine-glow:     rgba(184, 67, 79, 0.30);

  /* --- Blue note (freddo, contrasto deliberato) --- */
  --blue:          #4f9dd6;
  --blue-hi:       #79c0f0;
  --blue-glow:     rgba(79, 157, 214, 0.40);

  /* --- Stati funzionali --- */
  --ok:            #6fbf73;
  --warn:          #e0a24a;
  --err:           #d9645f;

  /* --- Tipografia --- */
  --display: "Fraunces", "Playfair Display", Georgia, "Times New Roman", serif;
  --sans:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono:    ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;

  /* --- Raggi & ombre --- */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-pill: 999px;

  --shadow-1: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-2: 0 8px 30px rgba(0,0,0,0.45);
  --shadow-glow: 0 0 0 1px var(--border-glow), 0 10px 40px rgba(0,0,0,0.55);

  /* --- Spaziature di ritmo verticale --- */
  --gap-xs: 0.4rem;
  --gap-sm: 0.75rem;
  --gap-md: 1.25rem;
  --gap-lg: 2rem;
  --gap-xl: 3.5rem;

  /* --- Colori semantici tastiera --- */
  --key-white:        #efe7d6;
  --key-white-press:  #e7c884;
  --key-black:        #1b1822;
  --key-black-press:  #b8924a;

  --deg-tonic:  var(--wine);     /* tonica */
  --deg-scale:  var(--brass);    /* nota di scala */
  --deg-blue:   var(--blue);     /* blue note (b5) */
}

/* Riduzione movimento per chi lo preferisce */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}