/* ================================================================
   SYRIDS Brand Theme — canonical design tokens
   Dark is the default theme; light is opt-in via [data-theme="light"].
   Per-page stylesheets (style.css, landing.css) keep their own variable
   names but should stay value-in-sync with this file.
   ================================================================ */

:root, [data-theme="dark"] {
  --ground:     #1A1A22;
  --surface:    #222230;
  --surface-2:  #1E1E28;
  --border:     #2E2E34;
  --border-hi:  #424249;
  --border-sub: #191920;
  --text:       #F2F2F5;
  --text-sub:   #B0B0C2;
  --accent:     #09C43A;
  --accent-dim: #07AA32;
  --accent-ink: #030E07;   /* text/icon sitting ON an accent fill */
  --sky:        #38BDF8;
  --green:      #3FB950;
  --yellow:     #D29922;
  --red:        #FF4545;
  --grid:       rgba(46,46,52,0.45);
  --glow:       rgba(9,196,58,0.20);

  --font-body:  'Space Grotesk', 'Cairo', sans-serif;
  --font-mono:  'IBM Plex Mono', 'Courier New', monospace;
  --ease:       .16s cubic-bezier(.4, 0, .2, 1);
}

[data-theme="light"] {
  --ground:     #F4F6F8;
  --surface:    #FFFFFF;
  --surface-2:  #EEF1F4;
  --border:     #E1E5EA;
  --border-hi:  #C7CDD6;
  --border-sub: #ECEFF2;
  --text:       #0B0F19;
  --text-sub:   #5B6472;
  --accent:     #15803D;
  --accent-dim: #106830;
  --accent-ink: #FFFFFF;
  --sky:        #2563EB;
  --green:      #16A34A;
  --yellow:     #D97706;
  --red:        #DC2626;
  --grid:       rgba(15,23,42,0.05);
  --glow:       rgba(21,128,61,0.16);
}