/* Phosphor design tokens — generated from tokens.json. Themes: amber, green, paper (default: amber).
   Switch theme with <html data-theme="paper">. */
:root, [data-theme="amber"] {
  --screen: #0d0904;
  --screen-raised: #171008;
  --screen-sunk: #060402;
  --phosphor: #ffb340;
  --phosphor-hi: #ffe2a8;
  --phosphor-dim: #c98d33;
  --phosphor-faint: #6a4917;
  --on-phosphor: #0d0904;
  --alert: #ff6b4a;
  --on-alert: #0d0904;
  --glow: #ff9a1f8c;
  --glow-soft: #ff8c002e;
  --scanline: #00000038;
  --selection: #ffb34047;
  --shade: #0000008c;
  --alert-glow: #ff4a2a73;
  --glow-text: 0 0 1px #ffb3408c, 0 0 7px #ff8c0059;
  --glow-text-hi: 0 0 1px #ffe2a8cc, 0 0 9px #ffa0148c, 0 0 24px #ff820047;
  --glow-box: 0 0 2px #ffbe5a99, 0 0 14px #ff960059;
  --glow-line: 0 0 6px #ff960066;
  --shadow-drop: 10px 10px 0 #0000008c;
  --shadow-vignette: inset 0 0 160px #000000a6;
  color-scheme: light;
}
[data-theme="green"] {
  --screen: #040b06;
  --screen-raised: #08140b;
  --screen-sunk: #020603;
  --phosphor: #5dff8a;
  --phosphor-hi: #c8ffd6;
  --phosphor-dim: #36c464;
  --phosphor-faint: #1d6631;
  --on-phosphor: #040b06;
  --alert: #ff7a5c;
  --on-alert: #040b06;
  --glow: #3cff6e80;
  --glow-soft: #28ff5a29;
  --scanline: #0000003d;
  --selection: #5dff8a40;
  --shade: #0000008c;
  --alert-glow: #ff5a3a73;
  --glow-text: 0 0 1px #5dff8a8c, 0 0 7px #28ff5a55;
  --glow-text-hi: 0 0 1px #c8ffd6cc, 0 0 9px #3cff6e80, 0 0 24px #28ff5a40;
  --glow-box: 0 0 2px #7dff9e99, 0 0 14px #28ff5a50;
  --glow-line: 0 0 6px #28ff5a5c;
  --shadow-drop: 10px 10px 0 #0000008c;
  --shadow-vignette: inset 0 0 160px #000000a6;
  color-scheme: light;
}
[data-theme="paper"] {
  --screen: #eeeadf;
  --screen-raised: #f8f5ec;
  --screen-sunk: #e2dccd;
  --phosphor: #1e1a12;
  --phosphor-hi: #000000;
  --phosphor-dim: #5c5444;
  --phosphor-faint: #b4aa93;
  --on-phosphor: #f8f5ec;
  --alert: #b3261e;
  --on-alert: #ffffff;
  --glow: #1e1a1212;
  --glow-soft: #1e1a1200;
  --scanline: #0000000a;
  --selection: #1e1a1224;
  --shade: #1e1a1240;
  --alert-glow: #b3261e00;
  --glow-text: 0 0 0.6px #1e1a1273;
  --glow-text-hi: 0 0 0.8px #00000099;
  --glow-box: 0 0 0 1px #1e1a121a;
  --glow-line: none;
  --shadow-drop: 8px 8px 0 #1e1a1233;
  --shadow-vignette: inset 0 0 140px #78643c2e;
  color-scheme: light;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --radius-none: 0;
  --radius-cell: 2px;
  --radius-tube: 22px;
  --radius-bezel: 36px;
  --dur-key: 14ms;
  --dur-ignite: 40ms;
  --dur-decay: 280ms;
  --dur-scramble: 380ms;
  --dur-draw: 440ms;
  --dur-power: 300ms;
  --dur-blink: 1060ms;
  --ease-ignite: steps(2, end);
  --ease-decay: cubic-bezier(.05, .7, .1, 1);
  --ease-print: steps(14, end);
  --ease-power: cubic-bezier(.2, .9, .1, 1);
  --ease-blink: steps(1, end);
  --font-display: "VT323", "Share Tech Mono", ui-monospace, monospace;
  --font-mono: "Share Tech Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --type-display-xl-family: var(--font-display);
  --type-display-xl-size: 96px;
  --type-display-xl-line: 84px;
  --type-display-xl-weight: 400;
  --type-display-xl-tracking: 0.01em;
  --type-display-family: var(--font-display);
  --type-display-size: 56px;
  --type-display-line: 52px;
  --type-display-weight: 400;
  --type-title-family: var(--font-display);
  --type-title-size: 34px;
  --type-title-line: 34px;
  --type-title-weight: 400;
  --type-numeral-family: var(--font-display);
  --type-numeral-size: 44px;
  --type-numeral-line: 40px;
  --type-numeral-weight: 400;
  --type-heading-family: var(--font-display);
  --type-heading-size: 24px;
  --type-heading-line: 24px;
  --type-heading-weight: 400;
  --type-body-family: var(--font-mono);
  --type-body-size: 15px;
  --type-body-line: 22px;
  --type-body-weight: 400;
  --type-body-sm-family: var(--font-mono);
  --type-body-sm-size: 13px;
  --type-body-sm-line: 18px;
  --type-body-sm-weight: 400;
  --type-label-family: var(--font-mono);
  --type-label-size: 12px;
  --type-label-line: 16px;
  --type-label-weight: 400;
  --type-label-tracking: 0.12em;
}
/* Type styles as utility classes (optional) */
.type-display-xl { font-family: var(--type-display-xl-family); font-size: var(--type-display-xl-size); line-height: var(--type-display-xl-line); font-weight: var(--type-display-xl-weight); letter-spacing: var(--type-display-xl-tracking); }
.type-display { font-family: var(--type-display-family); font-size: var(--type-display-size); line-height: var(--type-display-line); font-weight: var(--type-display-weight); }
.type-title { font-family: var(--type-title-family); font-size: var(--type-title-size); line-height: var(--type-title-line); font-weight: var(--type-title-weight); }
.type-numeral { font-family: var(--type-numeral-family); font-size: var(--type-numeral-size); line-height: var(--type-numeral-line); font-weight: var(--type-numeral-weight); }
.type-heading { font-family: var(--type-heading-family); font-size: var(--type-heading-size); line-height: var(--type-heading-line); font-weight: var(--type-heading-weight); }
.type-body { font-family: var(--type-body-family); font-size: var(--type-body-size); line-height: var(--type-body-line); font-weight: var(--type-body-weight); }
.type-body-sm { font-family: var(--type-body-sm-family); font-size: var(--type-body-sm-size); line-height: var(--type-body-sm-line); font-weight: var(--type-body-sm-weight); }
.type-label { font-family: var(--type-label-family); font-size: var(--type-label-size); line-height: var(--type-label-line); font-weight: var(--type-label-weight); letter-spacing: var(--type-label-tracking); }