:root {
  color-scheme: dark;

  /* Typography */
  --font-display: "Avenir Next Rounded", "Avenir Next", "Trebuchet MS", sans-serif;
  --font-body: "Avenir Next", "Trebuchet MS", sans-serif;
  --font-data: "SFMono-Regular", "Roboto Mono", "Courier New", monospace;
  --text-2xs: 0.6875rem;
  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-md: 0.875rem;
  --text-lg: 1.0625rem;
  --text-xl: 1.3125rem;
  --text-2xl: clamp(1.5rem, 2.3vw, 2rem);
  --tracking-label: 0.045em;
  --tracking-display: 0.012em;

  /* Bright cartoon science-fiction palette */
  --space-void: #0a1e4a;
  --space-abyss: #0f2a5e;
  --space-deep: #133870;
  --space-navy: #1a4a88;
  --space-steel: #2468b0;
  --surface-1: rgba(19, 52, 104, 0.95);
  --surface-2: rgba(24, 66, 126, 0.96);
  --surface-3: rgba(30, 82, 152, 0.97);
  --surface-raised: rgba(39, 98, 172, 0.98);
  --surface-sunken: rgba(9, 32, 74, 0.86);
  --surface-scrim: rgba(5, 19, 48, 0.7);
  --surface-highlight: rgba(110, 190, 250, 0.26);
  --text-primary: #ffffff;
  --text-secondary: #d9ecff;
  --text-tertiary: #a3c6ec;
  --accent-blue: #2f8dff;
  --accent-blue-deep: #1c64d4;
  --accent-cyan: #46d4ff;
  --accent-cyan-bright: #9fecff;
  --accent-gold: #ffc233;
  --accent-gold-bright: #ffdf74;
  --accent-orange: #ff8a3d;
  --accent-orange-deep: #f4611e;
  --accent-purple: #a968e8;
  --accent-purple-deep: #7f3fd0;
  --accent-green: #59cc3d;
  --accent-green-deep: #3aa428;
  --accent-red: #ff5252;
  --accent-red-deep: #d92f3c;
  --state-success: #6fd94f;
  --state-warning: #ff8a3d;
  --state-danger: #ff5c62;
  --state-rare: #a968e8;
  --badge-danger: linear-gradient(180deg, #ff7061, #e02f38);

  /* Tier and rarity semantics */
  --tier-1: #b5d8ea;
  --tier-2: #72d596;
  --tier-3: #ad7ef0;
  --tier-4: #ff9b52;
  --tier-5: #ffe06d;
  --rarity-common: #b9cfdf;
  --rarity-rare: #57b9f0;
  --rarity-epic: #ad70ed;
  --rarity-legendary: #ffc64b;
  --rarity-mythic: #f06b71;

  /* Layout */
  --space-1: 0.25rem;
  --space-2: 0.375rem;
  --space-3: 0.5rem;
  --space-4: 0.75rem;
  --space-5: 1rem;
  --space-6: 1.25rem;
  --space-7: 1.5rem;
  --space-8: 2rem;
  --space-9: 2.5rem;
  --space-10: 3rem;
  --radius-xs: 0.5rem;
  --radius-sm: 0.75rem;
  --radius-md: 1rem;
  --radius-lg: 1.375rem;
  --radius-xl: 1.75rem;
  --radius-pill: 999px;
  --cut-sm: 0;
  --cut-md: 0;
  --touch-min: 3rem;
  --touch-comfortable: 3.25rem;
  --safe-top: max(0.5rem, env(safe-area-inset-top));
  --safe-right: max(0.5rem, env(safe-area-inset-right));
  --safe-bottom: max(0.5rem, env(safe-area-inset-bottom));
  --safe-left: max(0.5rem, env(safe-area-inset-left));
  --hud-top-height: 5.4rem;
  --hud-bottom-height: 5.25rem;
  --hud-rail-width: 4.25rem;

  /* Lines, depth and motion */
  --line-soft: rgba(150, 212, 255, 0.26);
  --line-default: rgba(150, 212, 255, 0.5);
  --line-strong: rgba(178, 228, 255, 0.78);
  --line-focus: rgba(70, 212, 255, 0.95);
  --shadow-1: 0 0.22rem 0 rgba(5, 21, 53, 0.42), 0 0.6rem 1rem rgba(5, 21, 53, 0.2);
  --shadow-2: 0 0.38rem 0 rgba(5, 21, 53, 0.52), 0 1rem 2.2rem rgba(5, 21, 53, 0.28);
  --shadow-3: 0 0.55rem 0 rgba(5, 21, 53, 0.56), 0 1.5rem 3.5rem rgba(5, 21, 53, 0.34);
  --inset-metal: inset 0 2px 0 rgba(255, 255, 255, 0.16), inset 0 -2px 0 rgba(5, 22, 58, 0.25);
  --focus-ring: 0 0 0 2px var(--space-abyss), 0 0 0 5px var(--accent-gold-bright);
  --motion-fast: 120ms;
  --motion-normal: 180ms;
  --motion-slow: 260ms;
  --ease-tactical: cubic-bezier(0.2, 0.9, 0.25, 1);

  /* Compatibility aliases for the existing HUD */
  --hud-blue-950: var(--space-void);
  --hud-blue-900: var(--space-deep);
  --hud-blue-800: var(--space-navy);
  --hud-blue-700: var(--space-steel);
  --hud-blue-500: var(--accent-blue);
  --hud-cyan: var(--accent-cyan);
  --hud-cyan-soft: rgba(91, 198, 232, 0.28);
  --hud-gold: var(--accent-gold-bright);
  --hud-gold-soft: rgba(255, 198, 75, 0.34);
  --hud-red: var(--state-danger);
  --hud-orange: var(--state-warning);
  --hud-green: var(--state-success);
  --hud-violet: var(--state-rare);
  --hud-text: var(--text-primary);
  --hud-muted: var(--text-secondary);
  --hud-dim: var(--text-tertiary);
  --hud-panel: var(--surface-1);
  --hud-panel-strong: var(--surface-2);
  --hud-line: var(--line-default);
  --hud-line-strong: var(--line-strong);
  --hud-radius: var(--radius-md);
  --hud-cut: var(--cut-md);
  --hud-gap: var(--space-3);
  --hud-shadow: var(--shadow-2);
  --hud-inner: var(--inset-metal);
  --hud-transition: var(--motion-normal) var(--ease-tactical);
}