/*
 * Design tokens — every colour, space and font in the game resolves here.
 *
 * Swapping the UI theme means:
 *   1. point the <link id="vt-theme-css"> at another CSS (98.css / xp.css / 7.css)
 *   2. override the tokens below in a [data-vt-theme="..."] block
 *
 * Palette is a constrained 16-bit-ish set: 32 colours, no gradients.
 */

:root {
  /* --- 16-bit palette ------------------------------------------------ */
  --vt-black: #0b0e14;
  --vt-ink: #1b1f2a;
  --vt-slate: #2d3444;
  --vt-steel: #55606e;
  --vt-fog: #9fb3c8;
  --vt-paper: #dfe4ea;
  --vt-white: #f6f8fa;

  --vt-sky: #5bc0eb;
  --vt-sky-deep: #2b7fa8;
  --vt-gold: #e8c547;
  --vt-amber: #fa7921;
  --vt-rust: #b5502a;
  --vt-blood: #a52a2a;
  --vt-rose: #ff5d73;
  --vt-plum: #7a4fa3;
  --vt-lilac: #c3a6ff;
  --vt-moss: #9bc53d;
  --vt-forest: #2f7a4f;
  --vt-teal: #1b7f79;
  --vt-sand: #8b6f47;
  --vt-lemon: #fde74c;

  /* --- Semantic ------------------------------------------------------ */
  --vt-bg: var(--vt-ink);
  --vt-bg-desktop: #3a6ea5; /* the classic teal-blue desktop */
  --vt-fg: var(--vt-black);
  --vt-fg-dim: var(--vt-steel);
  --vt-accent: var(--vt-sky);
  --vt-good: var(--vt-forest);
  --vt-warn: var(--vt-amber);
  --vt-danger: var(--vt-blood);
  --vt-trail: var(--vt-gold);
  --vt-trail-planned: var(--vt-sand);

  /* HUD is dark regardless of window theme, like a dashboard cluster. */
  --vt-hud-bg: var(--vt-ink);
  --vt-hud-fg: var(--vt-paper);
  --vt-hud-dim: var(--vt-fog);
  --vt-hud-border: var(--vt-black);

  /* --- Spacing (8px grid, pixel-art friendly) ------------------------ */
  --vt-space-0: 0;
  --vt-space-1: 2px;
  --vt-space-2: 4px;
  --vt-space-3: 8px;
  --vt-space-4: 12px;
  --vt-space-5: 16px;
  --vt-space-6: 24px;

  /* --- Typography ---------------------------------------------------- */
  --vt-font-pixel: 'Press Start 2P', 'VT323', monospace;
  --vt-font-display: 'VT323', 'Press Start 2P', monospace;
  --vt-font-body: 'IBM Plex Mono', ui-monospace, 'Cascadia Mono', Menlo, monospace;
  --vt-font-ui: 'Pixelated MS Sans Serif', Arial, sans-serif; /* 98.css default */

  --vt-text-xs: 10px;
  --vt-text-sm: 11px;
  --vt-text-md: 13px;
  --vt-text-lg: 16px;
  --vt-text-xl: 20px;

  /* --- Chrome -------------------------------------------------------- */
  --vt-hud-height: 44px;
  --vt-taskbar-height: 34px;
  --vt-border-hard: 2px solid var(--vt-black);
  --vt-shadow-pixel: 3px 3px 0 rgba(0, 0, 0, 0.45);
  --vt-radius: 0; /* pixel art has no rounded corners */
}

/* Theme overrides: XP is lighter and bluer. */
:root[data-vt-theme='xp'] {
  --vt-bg-desktop: #5a7edc;
  --vt-hud-bg: #1f3a93;
}

/* Windows 7 leans translucent-dark. */
:root[data-vt-theme='7'] {
  --vt-bg-desktop: #1e5799;
  --vt-hud-bg: #10243e;
}

/* Respect the OS reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --vt-anim-duration: 0ms;
  }
}