/* ==========================================================================
   base.css - design tokens, reset, shared primitives
   Dark technical console aesthetic. All colors flow from CSS variables so a
   single [data-theme] swap re-skins the whole game.
   ========================================================================== */

:root {
  /* Surfaces */
  --bg-void: #05070d;
  --bg-deep: #080c16;
  --bg-panel: #0c1220;
  --bg-panel-2: #111a2c;
  --bg-raise: #16203a;
  --bg-glass: rgba(12, 18, 32, 0.86);

  /* Lines */
  --line: #1e2b45;
  --line-strong: #2c3d5e;
  --line-glow: rgba(56, 189, 248, 0.35);

  /* Ink */
  --ink: #dbe6f5;
  --ink-dim: #8c9cb8;
  --ink-faint: #5a6a86;
  --ink-ghost: #3a4864;

  /* Accents */
  --accent: #38bdf8;
  --accent-2: #6366f1;
  --accent-dim: rgba(56, 189, 248, 0.16);
  --good: #34d399;
  --warn: #fbbf24;
  --bad: #f87171;
  --crit: #ef4444;
  --hot: #fb923c;

  /* Category hues (assembly part chips) */
  --cat-command: #a78bfa;
  --cat-fuel: #38bdf8;
  --cat-engine: #fb923c;
  --cat-solid: #f472b6;
  --cat-decouple: #94a3b8;
  --cat-aero: #4ade80;
  --cat-recovery: #facc15;

  /* Geometry */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 14px;

  /* Type */
  --font-ui: "Segoe UI", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  --font-mono: "Cascadia Mono", "Consolas", "SFMono-Regular", ui-monospace, monospace;

  /* Motion */
  --t-fast: 120ms cubic-bezier(.4, 0, .2, 1);
  --t-med: 220ms cubic-bezier(.4, 0, .2, 1);

  --hud-glow: 0 0 8px rgba(56, 189, 248, 0.55);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden;
  background: var(--bg-void);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body {
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

#app {
  position: fixed;
  inset: 0;
}

#viewport {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}