:root {
    --bg: #040812;
    --bg2: #080f1e;
    --surface: rgba(255, 255, 255, 0.04);
    --surface2: rgba(255, 255, 255, 0.07);
    --border: rgba(255, 255, 255, 0.09);
    --border2: rgba(108, 99, 255, 0.45);
    --indigo: #6C63FF;
    --indigo-lo: rgba(108, 99, 255, 0.18);
    --jade: #00E5A0;
    --jade-lo: rgba(0, 229, 160, 0.14);
    --coral: #FF4757;
    --coral-lo: rgba(255, 71, 87, 0.14);
    --gold: #FFD700;
    --gold-lo: rgba(255, 215, 0, 0.14);
    --cyan: #00D4FF;
    --purple: #9B30FF;
    --text: #F0F4FF;
    --text-muted: rgba(240, 244, 255, 0.52);
    --radius: 12px;
    --radius-lg: 20px;
    --glow-i: 0 0 32px rgba(108, 99, 255, 0.35);
    --glow-j: 0 0 32px rgba(0, 229, 160, 0.35);
    --glow-c: 0 0 32px rgba(255, 71, 87, 0.35);
    --glow-g: 0 0 32px rgba(255, 215, 0, 0.35);
    --font-ui: 'Space Grotesk', system-ui, sans-serif;
    --font-num: 'JetBrains Mono', 'Courier New', monospace;
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);

    --hud-top-offset: 12%;
    --hud-side-offset: 2%;
    /* HUD panels (score, xp/level, pause, accuracy) now share the same
       plain-glass look as the answer box (.answer-shell / .glass) instead
       of their old purple-glow treatment. */
    --hud-panel-bg: var(--surface);
    --hud-panel-border: var(--border);
    --hud-panel-shadow: none;
    --hud-panel-radius: var(--radius);

    --hud-score-left: var(--hud-side-offset);
    --hud-score-top: var(--hud-top-offset);
    --hud-score-width: 20%;
    --hud-score-pad-y: 12%;
    --hud-score-pad-x: 12%;
    --hud-score-row-gap: 2vh;
    --hud-score-icon-size: 2vw;
    --hud-score-label-size: 0.95vw;
    --hud-score-value-size: 1.75vw;

    --hud-xp-left: 50%;
    --hud-xp-top: 5%;
    --hud-xp-width: 30%;
    --hud-xp-height: 15%;
    --hud-xp-pad-y: 1.55%;
    --hud-xp-pad-x: 2.55%;
    --hud-xp-gap: 3.2%;
    --hud-level-hex-size: 6.1vw;
    --hud-xp-title-size: 1.65vw;
    --hud-xp-num-size: 1.55vw;
    --hud-xp-bar-height: 2.05vh;
    --hud-xp-bar-top-gap: 1vh;

    --hud-controls-right: 3.75%;
    --hud-controls-top: 4%;
    --hud-controls-width: 9%;
    --hud-controls-gap: 2.2vh;
    --hud-control-min-height: 9.4vw;
    --hud-pause-icon-size: 3.6vw;
    --hud-control-label-size: 1.12vw;
    --hud-accuracy-value-size: 2.5vw;
}