/* ═══════════════════════════════════════════════════════
   RODS DESIGN SYSTEM — Shared Theme & Tokens
   Used by: invert-calculator.html, pipe-map-viewer.html, index.html
   ═══════════════════════════════════════════════════════ */

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

/* ── DARK (default) ── */
:root, :root[data-theme="dark"] {
  --bg-primary:    #0f1318;
  --bg-secondary:  #161c24;
  --bg-tertiary:   #1e2733;
  --bg-elevated:   #243040;

  --border-subtle: #2a3545;
  --border-default:#3a4d60;
  --border-strong: #4d6478;

  --text-primary:  #dce8f0;
  --text-secondary:#8fa8bc;
  --text-muted:    #506070;
  --text-inverse:  #0f1318;

  --accent-brass:       #b5893a;
  --accent-brass-light: #d4a84b;
  --accent-brass-dim:   rgba(181,137,58,0.18);
  --accent-steel:       #4d8aaa;
  --accent-steel-light: #6aaecf;
  --accent-steel-dim:   rgba(77,138,170,0.15);

  --status-ok:    #4a9e6e;
  --status-warn:  #c49a2a;
  --status-error: #b5453a;
  --status-info:  #4d8aaa;

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-md: 0 3px 10px rgba(0,0,0,0.5);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.6);

  --font-mono:      'Share Tech Mono', 'Courier New', monospace;
  --font-body:      'Barlow', system-ui, sans-serif;
  --font-condensed: 'Barlow Condensed', 'Barlow', sans-serif;

  --text-xs:   0.70rem;
  --text-sm:   0.80rem;
  --text-base: 0.9375rem;
  --text-md:   1.0625rem;
  --text-lg:   1.25rem;
  --text-xl:   1.5rem;
  --text-2xl:  2rem;

  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;

  --radius-sm: 3px;
  --radius-md: 5px;
  --radius-lg: 8px;
}

/* ── LIGHT MODE ── */
:root[data-theme="light"] {
  --bg-primary:    #f0f3f6;
  --bg-secondary:  #ffffff;
  --bg-tertiary:   #e4eaf0;
  --bg-elevated:   #d8e2ea;

  --border-subtle: #c8d4de;
  --border-default:#a8bccb;
  --border-strong: #7a9ab0;

  --text-primary:  #1a2530;
  --text-secondary:#445566;
  --text-muted:    #8099aa;
  --text-inverse:  #f0f3f6;

  --accent-brass:       #8a6520;
  --accent-brass-light: #a07828;
  --accent-brass-dim:   rgba(138,101,32,0.14);
  --accent-steel:       #2d6080;
  --accent-steel-light: #3a7aa0;
  --accent-steel-dim:   rgba(45,96,128,0.12);

  --status-ok:    #2d7a50;
  --status-warn:  #8a6a10;
  --status-error: #8a2820;
  --status-info:  #2d6080;

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.10);
  --shadow-md: 0 3px 10px rgba(0,0,0,0.13);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.16);
}