:root { --cyan:#ffb04f; --pink:#b987ff; --ink:#100916; --muted:#c3a7cf; }
body { background:radial-gradient(ellipse at 80% 9%,#552037 0,transparent 34%),radial-gradient(ellipse at 10% 35%,#28143f,transparent 48%),#0c0711; }
/* Atmosphere stays behind the interface, so it never blocks flying or touch controls. */
body::before { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.72; background:radial-gradient(ellipse at 12% 77%,#b16dcb26 0,transparent 29%),radial-gradient(ellipse at 91% 65%,#ff7a2820 0,transparent 25%),repeating-linear-gradient(128deg,transparent 0 54px,#eeb7ff0a 55px 56px,transparent 57px 112px); }
.site-nav { border-bottom:1px solid #ff92252b; }
.site-nav::after { content:"✦  PUMPKIN RUN  ✦"; position:absolute; top:7px; left:50%; transform:translateX(-50%); color:#ffc46e88; font:8px "DM Mono",monospace; letter-spacing:.24em; pointer-events:none; white-space:nowrap; }
.site-nav .brand-mark { color:#ff9a32; }
.hero { isolation:isolate; }
.hero::before,.hero::after { content:""; position:absolute; width:140px; height:140px; pointer-events:none; opacity:.28; background:repeating-radial-gradient(circle at 0 0,transparent 0 23px,#c8a4de 24px 25px,transparent 26px 38px),repeating-conic-gradient(from 0deg at 0 0,transparent 0deg 14deg,#c8a4de 15deg 16deg,transparent 17deg 30deg); z-index:-1; }
.hero::before { top:0; left:0; }.hero::after { top:0; right:0; transform:scaleX(-1); }
.hero h1 em { color:#ff9a32; text-shadow:3px 2px #7637a3,0 0 30px #ff6a2244; animation:jack-glow 3.8s ease-in-out infinite; }
.hero .eyebrow,.section-label { color:#ffc17a; }
.hero-text { color:#d6badb; }
.hero-button { background:#ffa642; color:#200d13; box-shadow:0 0 30px #ff741e44; border-radius:4px; }
.halloween-tag { display:inline-block; padding:7px 10px; border:1px solid #ff98275c; border-radius:20px; background:#371a24; color:#ffc77f; font:10px "DM Mono",monospace; letter-spacing:.12em; margin:0 0 14px; }
.crystal-fallback { border-color:#ffb961; box-shadow:inset 0 0 26px #ff8a2aaa,0 0 26px #ff8a2a88; background:radial-gradient(circle at 50% 80%,#ff8a2a77,transparent 65%); }
.mission-console,.board-panel,.race-stats { background:radial-gradient(circle at 94% 18%,#ffb14b2a 0 3px,transparent 4px),radial-gradient(circle at 88% 27%,#ff843719 0 8px,transparent 9px),linear-gradient(120deg,#32152acc,#160d25ee); border-color:#914e7355; box-shadow:inset 0 0 45px #ff70200b; }
.mode-tab,.room-actions button,.host-room-controls button { background:#211128; border-color:#775075; color:#d9b6e1; }
.mode-tab.active { background:#4d281c; color:#ffd59b; border-color:#ff9a32; }
.mode-tab.shooter,.mode-tab.shooter.active { color:#ceff9c; border-color:#7aaa48; background:#1c3023; }
.mode-tab.hard,.mode-tab.hard.active { color:#e0bbff; border-color:#a36be5; background:#351845; }
.game-frame { border-color:#ff9a3277; box-shadow:0 0 26px #ff73251a,0 24px 70px #000a; background:#100919; }
.overlay { background:linear-gradient(180deg,#170a25bb,#140b23e8); }
.overlay h1,.overlay h2 { text-shadow:0 0 28px #ff8a2a66; }
.overlay button { background:#ffae4b; color:#21101a; border-color:#ffe0a8; }
.hud,.hud span { color:#ffe0b8; }.hud strong { color:#fff3dc; }
.energy-track { background:#3a231e; }.energy-track div { background:linear-gradient(90deg,#e96c21,#ffd17a); }
.attack-track div { background:linear-gradient(90deg,#7435bb,#d7a4ff); }
.touch-key,.fullscreen-button,.game-toolbar .pause-button { background:#201126e8; border-color:#b97539; color:#ffd49b; }
.dock-panel { background:linear-gradient(#30182e,#160d20); border-color:#8c5276; }
.site-nav .dock-item { background:linear-gradient(145deg,#442239,#190f25); border-color:#7d4869; color:#e4bedb; }
.site-nav .dock-item.active { background:#51301e; border-color:#ffad4f; color:#ffc46e; box-shadow:0 0 18px #ff932533; }
.info-grid h2 { color:#ffbf79; }.info-grid p { color:#bda6cd; }
.leaderboard-panel,.leaderboard { border-color:#825471; background-image:radial-gradient(circle at 5% 22%,#b86be422 0 2px,transparent 3px),radial-gradient(circle at 96% 76%,#ff9f4620 0 4px,transparent 5px); }
.music-toggle { color:#d9b6ff; border-color:#8852a2; background:#281735; }
.dashboard-hero em { color:#ffa642; text-shadow:3px 0 #7549a6,0 0 24px #ff8a2a44; }
.controls-expanded { border:1px solid #91516a50; border-radius:18px; background:linear-gradient(145deg,#27132c8c,#100a18c8); box-shadow:inset 0 0 80px #9e4a3b0e,0 18px 55px #0004; }
.controls-expanded > h1 { margin:12px 0; font-size:clamp(30px,5vw,56px); line-height:1.1; color:#ffbf79; text-shadow:0 0 22px #ff712d35; }
.controls-cards article { border-color:#9b5a72; background:radial-gradient(circle at 93% 12%,#ffb34a2b 0 2px,transparent 3px),radial-gradient(circle at 87% 18%,#b36be41c 0 4px,transparent 5px),linear-gradient(145deg,#321930,#150d21); box-shadow:inset 0 0 25px #ff7a1a0a; }
.controls-cards h2,.controls-cards h3 { margin:0 0 20px; color:#ffca8d; font-size:19px; text-shadow:0 0 14px #ff9f3d33; }
@keyframes jack-glow { 0%,100% { filter:brightness(1); } 50% { filter:brightness(1.22); } }
@media(prefers-reduced-motion:reduce) { .hero h1 em { animation:none; } }
@media(max-width:700px) { .halloween-tag { font-size:8px; letter-spacing:.03em; padding:6px 8px; }.hero h1 { font-size:clamp(31px,7.1vw,50px); }.hero::before,.hero::after { width:85px;height:85px; }.site-nav::after { display:none; }.controls-expanded { margin:12px 10px; } }