/* Surface MD — color system.
   House palette: "Precision" (bone / graphite / slate). Alternates: "Dew"
   (warm) and "Glow" (luxe dark) — campaign use only. Ratio ≈ 70% base,
   20% ink, 10% accent. */
:root{
  /* — Precision · base values — */
  --bone:        #F3F1ED;   /* page base */
  --bone-1:      #F6F4F0;   /* gradient light stop */
  --bone-2:      #ECE9E3;   /* gradient deep stop */
  --white:       #FFFFFF;   /* product panels, shine */
  --graphite:    #23262B;   /* ink / dark sections */
  --graphite-2:  #1B1E22;   /* footer, deepest dark */
  --slate:       #6E8794;   /* accent */
  --slate-deep:  #5A727E;   /* accent hover / pressed */
  --slate-frost: #9DB1BC;   /* accent on dark */
  --mist:        #838A92;   /* subdued text on light */
  --ink-soft:    #4C5057;   /* body text on light */
  --frost-body:  #AEB4BB;   /* body text on dark */
  --frost-lead:  #C7CCD2;   /* lead text on dark */

  /* — Dew · warm alternate — */
  --dew-cream:   #EFEAE2;
  --dew-bistre:  #2A2620;
  --dew-gold:    #BC9A5B;
  --dew-taupe:   #7A7263;

  /* — Glow · luxe alternate — */
  --glow-espresso:  #1E1814;
  --glow-gold:      #D9B779;
  --glow-parchment: #F1E6D2;
  --glow-stone:     #B7A488;

  /* — lines, grids, panels — */
  --rule:      rgba(35,38,43,.30);   /* hairline gradient peak */
  --line:      rgba(35,38,43,.12);   /* borders on light */
  --grid:      rgba(35,38,43,.045);  /* blueprint grid on light */
  --panel:     rgba(255,255,255,.60);/* translucent card fill */
  --rule-dark: rgba(157,177,188,.40);
  --line-dark: rgba(157,177,188,.22);
  --grid-dark: rgba(157,177,188,.05);
  --panel-dark:rgba(255,255,255,.04);

  /* — semantic aliases — */
  --bg:            var(--bone);
  --bg-raised:     var(--white);
  --bg-dark:       var(--graphite);
  --surface-card:  var(--panel);
  --text-ink:      var(--graphite);
  --text-body:     var(--ink-soft);
  --text-sub:      var(--mist);
  --text-on-dark:  var(--bone);
  --accent:        var(--slate);
  --accent-hover:  var(--slate-deep);
  --accent-on-dark:var(--slate-frost);
  --border:        var(--line);
  --border-on-dark:var(--line-dark);

  /* — status (used sparingly; do/don't panels) — */
  --ok:   #4F8A63;
  --warn: #B06A63;
}