* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  /* Dark mode — mirrors frame-theory.in's own dark palette. The only theme. */
  --bg: #080808;
  --bg-panel: #14100a;
  --gold: #c8a96e;
  --gold-bright: #e2c98e;
  --gold-deep: #a07830;
  --text: #f5f0ea;
  --text-dim: rgba(245, 240, 234, 0.68);
  --danger: #e2503f;
  --shield: #cfe0f0;
  --good: #8bffb0;
  --panel-border: rgba(200, 169, 110, 0.35);
  --input-bg: rgba(245, 240, 234, 0.04);
  --overlay-bg: rgba(8, 8, 8, 0.5);
  --bg-panel-2: #0c0906;
  --muted-text: rgba(245, 240, 234, 0.4);

  /* The game canvas is always a night sky, independent of page theme */
  --space-bg: #080808;
  --space-gold: #e2c98e;
  --space-danger: #e2503f;

  /* The cabinet casing is always dark, independent of page theme — like a real machine's shell */
  --cabinet-bg: #050403;
  --cabinet-trim: rgba(226, 201, 142, 0.22);

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'DM Sans', -apple-system, sans-serif;
  --font-pixel: 'Press Start 2P', 'Cormorant Garamond', monospace;
  --font-retro: 'VT323', 'DM Sans', monospace;
}

html, body {
  height: 100%;
  height: 100dvh;
  width: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

body {
  display: flex;
  align-items: stretch;
  justify-content: center;
  font-family: var(--font-body);
  color: var(--text);
  background:
    radial-gradient(ellipse at 50% -10%, rgba(226, 201, 142, 0.07), transparent 60%),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.015) 0 2px, transparent 2px 6px),
    var(--cabinet-bg);
}

.hidden {
  display: none !important;
}