/* =====================================================================
   ETEIA — Design tokens, LIGHT THEME ONLY.
   Ported from MVPApplication/src/styles/tokens.css (base palette lines
   5-60 + the :root[data-theme="light"] override block, lines 136-184)
   and flattened into a single :root. This app has no theme toggle and
   ships no dark values.
   ===================================================================== */
:root {
  /* ---- Core neutrals ---- */
  --warm-white:   #f4f1ec;
  --warm-white-2: #ece7df;
  --bone:         #e6e0d6;
  --charcoal:     #1a1a1d;
  --charcoal-2:   #232327;

  /* ---- Biological ambient light (drives the background blooms) ---- */
  --sage:          #a9bda3;
  --sage-deep:     #6f8a72;
  --lavender:      #b7aee0;
  --lavender-deep: #8478c4;
  --rose:          #e0a9bd;
  --rose-deep:     #c77f9c;
  --amber-warm:    #e6c69a;
  --electric:      #6e8cff;
  --electric-soft: #9fb4ff;

  /* ---- Biological light spectrum ---- */
  --lime:    #EEFA7A;   /* official Eteia brand mark */
  --violet:  #8B6BFF;
  --magenta: #FF4D9E;
  --amber:   #FF8A2B;
  --blue:    #4DA6FF;

  /* ---- Typography ---- */
  --font-display: "Inter Tight", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-body:    "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-serif:   "Instrument Serif", Georgia, "Times New Roman", serif;

  /* ---- Motion ---- */
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.1, 1);
  --spring:    cubic-bezier(0.34, 1.56, 0.64, 1);

  /* =====================================================================
     Semantic surface layer — light values.
     ===================================================================== */
  --bg:        #f2ede4;
  --bg-elev:   #ffffff;
  --chrome-bg: rgba(242,237,228,0.80);
  --menu-bg:   rgba(255,255,255,0.96);
  --glass-bg:  linear-gradient(135deg, rgba(255,255,255,0.90), rgba(255,250,242,0.78));

  --fg:        #0a0a0b;
  --fg-rgb:    10,10,11;
  --fg-soft:   rgba(10,10,11,0.66);
  --fg-faint:  #6b6b70;
  --line:      rgba(10,10,11,0.08);

  --accent:      #C4527F;   /* rose, deepened for AA contrast on cream */
  --accent-rgb:  196,82,127;
  --accent-fill: #d9a8c4;
  --ok:          #5F7010;   /* mint, deepened for AA contrast on cream */
  --ok-rgb:      95,112,16;
  --ok-fill:     #b8d64a;
  --cta-bg:      #0a0a0b;
  --cta-fg:      #f5efe4;

  --tint-rgb:   10,10,11;
  --shadow-rgb: 10,10,11;
  --shadow-card: 0 20px 50px -28px rgba(10,10,11,0.16);
  --atmosphere-blend: multiply;
  --grain-blend:      multiply;
  --grain-opacity:    0.025;
  --native-scheme:    light;

  /* =====================================================================
     Mood Swings playfield. The arcade cabinet is DARK, so right/wrong can
     use the Eteia brand spectrum at full strength: lime and magenta are far
     more distinguishable (and more arcade) than the olive/dusty-rose pair
     the light theme forces. Used only inside .playfield.
     ===================================================================== */
  --cab-bg:      #0a0a0f;              /* --midnight */
  --cab-bg-2:    #15151f;
  --cab-fg:      #f4efe7;              /* --on-dark */
  --cab-fg-soft: rgba(244,239,231,0.72);
  --cab-line:    rgba(244,239,231,0.16);

  --quiz-right:      #EEFA7A;          /* --lime, the Eteia brand mark */
  --quiz-right-rgb:  238,250,122;
  --quiz-wrong:      #FF4D9E;          /* --magenta */
  --quiz-wrong-rgb:  255,77,158;
  --steel:           #b9bcc6;          /* wrecking ball */
  --steel-dark:      #6f737f;
}