/* tokens.css — single source of truth for the APD colour palette (dark + light).
   Linked FIRST on every page; all component stylesheets (base.css, commsbox,
   plotter, plot, the landing page, and modern.css) consume these via var(--…).
   modern.css is loaded afterwards and augments these with radius/shadow tokens. */

:root {
    --bg0: #1a1a1a;
    --bg1: #121212;
    --card: #2a2a2a;
    --card2: #252525;
    --border: #3a3a3a;
    --border2: #4a4a4a;
    --text: #d4d4d4;
    --muted: #999999;
    --muted2: #6e6e6e;
    --accent: #ffbb00;
    --glow: rgba(255, 187, 0, 0.08);
    --ok: #5cb85c;
    --warn: #ffbb00;
    --err: #d9534f;
    --radius: 0px;
    --shadow: 0 4px 16px rgba(0,0,0,0.4);
}

[data-theme="light"] {
    --bg0: #f3f3f6;
    --bg1: #eaeaef;
    --card: #ffffff;
    --card2: #fafafe;
    --border: #e2e2ea;
    --border2: #d4d4dc;
    --text: #1a1a2e;
    --muted: #6b6b80;
    --muted2: #9494a6;
    --accent: #c08b12;
    --glow: rgba(192,139,18,0.04);
    --ok: #1a9e3f;
    --warn: #c08b12;
    --err: #d93025;
    --shadow: 0 2px 8px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.04);
}