/* THEME - the one file to edit when you want to re-skin the app.
   Everything visual in app.css reads these tokens. Switch themes with the button in the header
   (or set data-theme on <html>). Add a theme = copy a block below and change the values. */

:root, :root[data-theme="battlestation"] {   /* charcoal + cream plastic + orange-red  (ref. 2) */
  --font-display: "Helvetica Neue", Helvetica, "Arial Nova", Arial, sans-serif;
  --font-mono: ui-monospace, "Cascadia Mono", "SF Mono", Consolas, "Liberation Mono", "Courier New", monospace;
  --font-jp: "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;

  --bg: #2d2f31;        --bg-deep: #1f2123;
  --plate: #d8d1bf;     --plate-2: #c8c0aa;   --plate-3: #b3ab94;
  --ink: #222426;       --ink-soft: #4a4d50;
  --accent: #ff4a1c;    --accent-ink: #ffffff;
  --key: #62676c;       --key-hi: #7a8085;    --key-lo: #3f4347;   --key-ink: #f3efe3;
  --bezel: #585b5f;     --bezel-hi: #787c80;  --screen: #101213;
  --lcd: #9fe35b;       --lcd-ink: #12300b;
  --mast-bg: var(--bg-deep); --mast-ink: var(--plate); --mast-dim: var(--plate-3);
  --foot-ink: #9a9da0;
  --s1: #2aa0d8; --s2: #8cb832; --s3: #ffe51f; --s4: #ff7a1a; --s5: #ff2d9b;   /* stripe palette (ref. 1) */

  --rail-w: 92px; --panel-w: 372px;
}

:root[data-theme="supercolor"] {              /* black + mustard + cassette stripes  (ref. 1) */
  --bg: #121515;        --bg-deep: #0a0c0c;
  --plate: #e9a63a;     --plate-2: #dc9a2f;   --plate-3: #b9801f;
  --ink: #15110a;       --ink-soft: #4a3510;
  --accent: #d6402a;    --accent-ink: #fff4e0;
  --key: #232a2a;       --key-hi: #3a4343;    --key-lo: #0f1313;   --key-ink: #f1e8cc;
  --bezel: #1d2222;     --bezel-hi: #2c3434;  --screen: #0a0c0c;
  --foot-ink: #8b8f8f;
}

:root[data-theme="bellum"] {                  /* aged cream handheld + grey buttons  (ref. 3) */
  --bg: #e4dbc2;        --bg-deep: #cfc5a8;
  --plate: #f3ecd7;     --plate-2: #e5dbbd;   --plate-3: #cdc19f;
  --ink: #2a2926;       --ink-soft: #5b564a;
  --accent: #e0431f;    --accent-ink: #ffffff;
  --key: #666b71;       --key-hi: #82878e;    --key-lo: #44484d;   --key-ink: #f6f1e0;
  --bezel: #7b7f84;     --bezel-hi: #989ca1;  --screen: #0f1112;
  --mast-bg: #2a2926;   --mast-ink: #f3ecd7;  --mast-dim: #bdb496;
  --foot-ink: #bdb496;
}