/*
  Design tokens for abliteration.org

  Two themes: dark (default) and light.
  Theme is applied via [data-theme="light"] on <html>, set by an inline
  script in Base.astro so there is no flash of wrong theme.

  Method colors (--m1..--m8) are shared across themes.
*/

:root {
  /* ------ DARK THEME (default) ------ */

  /* base - true black-ish, uniform */
  --bg:               #050505;
  --bg-panel:         #131313;
  --bg-panel-hover:   #1D1D1D;
  --bg-panel-tint:    #171717;
  --border:           #262626;
  --border-strong:    #383838;

  /* text - true white on dark for readability */
  --text:             #FFFFFF;
  --text-secondary:   #B8B8B8;
  --text-muted:       #7E7E7E;

  /* accent - default; can be swapped by client-side rotation */
  --accent:           #4E9B87;
  --accent-dim:       #3B7768;

  /* ------ SHARED (both themes) ------ */

  /* methods M1..M8 - same across themes for consistency */
  --m1: #D97A5C;
  --m2: #E24B4A;
  --m3: #6BA972;
  --m4: #9B8FCC;
  --m5: #4E8AC7;
  --m6: #D4A54B;
  --m7: #C878A0;
  --m8: #8A857D;

  /* fonts */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:    'Cormorant Garamond', Georgia, serif;

  /* spacing scale */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-7: 32px;
  --sp-8: 40px;

  /* radii */
  --radius-sm: 3px;
  --radius-md: 4px;
}

[data-theme="light"] {
  /* ------ LIGHT THEME ------ */

  /* base - pure white background; panels sit almost invisibly
     above it and get their definition from a subtle drop shadow
     (see global.css .panel/.model-card box-shadow rules) */
  --bg:               #FFFFFF;
  --bg-panel:         #FAFAFA;
  --bg-panel-hover:   #F2F2F2;
  --bg-panel-tint:    #FCFCFC;
  --border:           #E5E5E5;
  --border-strong:    #C8C8C8;

  /* text - pure black on white */
  --text:             #000000;
  --text-secondary:   #3A3A3A;
  --text-muted:       #7A7A7A;

  /* accent - default; can be swapped by client-side rotation */
  --accent:           #4E9B87;
  --accent-dim:       #7DB5A5;
}