/* Background cinematography only. Never transform the arena, orbit or target. */
.pulse-game{--city-energy:0;overflow:hidden;background:#050b13!important}
.transmission-world{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none;background:#050b13}
.transmission-city{position:absolute;inset:-3%;background:url('assets/audio/neon-afterglow-title-clean.png') center/cover no-repeat;opacity:.28;transform:scale(1.035);transition:opacity .8s,transform 1.4s ease-out}
.transmission-near{position:absolute;inset:0;opacity:.7;background:linear-gradient(90deg,#020811 0 3%,transparent 3% 96%,#020811 96%),linear-gradient(0deg,#020711 0%,transparent 27%);transform:scale(1.015);transition:transform 1.4s ease-out}
.transmission-lights{position:absolute;inset:0;background:radial-gradient(ellipse at 13% 64%,#53c8ff42,transparent 22%),radial-gradient(ellipse at 85% 48%,#9b75ff38,transparent 20%);opacity:calc(.05 + var(--city-energy)*.35);transition:opacity .7s ease-out}
.transmission-vignette{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 49%,#050c16ed 0%,#050c16c9 25%,#050c1655 60%,#02060db3 100%);transition:opacity .8s}
.transmission-rain{position:absolute;inset:-12%;opacity:.1;background-image:repeating-linear-gradient(103deg,transparent 0 87px,#85cbe72b 88px,transparent 89px 163px),repeating-linear-gradient(105deg,transparent 0 132px,#b1e0f52b 133px,transparent 134px 219px);background-size:163px 137px,219px 211px;mask-image:radial-gradient(ellipse at 50% 45%,transparent 0 26%,#000 65%);-webkit-mask-image:radial-gradient(ellipse at 50% 45%,transparent 0 26%,#000 65%);animation:transmission-rain 6s linear infinite}
.transmission-mist{position:absolute;inset:35% -8% 0;background:radial-gradient(ellipse at 25% 70%,#849fc71c,transparent 50%),radial-gradient(ellipse at 80% 55%,#8b80b219,transparent 45%);opacity:.4;animation:transmission-mist 24s ease-in-out infinite alternate}
@keyframes transmission-rain{from{transform:translate3d(0,-26px,0)}to{transform:translate3d(-17px,26px,0)}}
@keyframes transmission-mist{from{transform:translate3d(-1.5%,0,0)}to{transform:translate3d(1.5%,1%,0)}}
.pulse-game[data-state="idle"] .transmission-city{opacity:.85;animation:transmission-camera 28s ease-in-out infinite alternate}
.pulse-game[data-state="idle"] .transmission-near{animation:transmission-near 28s ease-in-out infinite alternate}
.pulse-game[data-state="idle"] .transmission-vignette{opacity:.32}
.pulse-game[data-state="idle"] .transmission-rain{opacity:.2}
.pulse-game[data-state="idle"] .transmission-mist{opacity:.65}
@keyframes transmission-camera{from{transform:scale(1.015) translate3d(-.25%,0,0)}to{transform:scale(1.055) translate3d(.25%,-.4%,0)}}
@keyframes transmission-near{from{transform:scale(1)}to{transform:scale(1.035)}}
.pulse-game[data-state="countdown"] .transmission-city{opacity:.38;transform:scale(1.07)}
.pulse-game[data-state="playing"] .transmission-city{transform:scale(1.07);transition:opacity .8s;animation:none}
.pulse-game[data-state="finished"] .transmission-city{opacity:.4;transform:scale(1.07);transition:opacity .8s}
.pulse-game[data-state="finished"] .transmission-near{transform:scale(1.015);transition:none}
/* Holographic panel: texture and borders, never displacement of score digits. */
.pulse-stats{background:linear-gradient(110deg,#10223163,#0a182033);box-shadow:inset 0 1px #d9fcff0c,0 12px 28px #00000025;border-color:#70e8f526;padding-inline:10px;box-sizing:border-box}
.pulse-stats::after{height:1px;width:100%;left:0;right:0;top:auto;bottom:-5px;border:0;background:linear-gradient(90deg,transparent,#718dff26,transparent);opacity:1}
.pulse-stats::before{pointer-events:none;inset:0;width:auto;height:auto;border:0;opacity:.15;background:repeating-linear-gradient(0deg,transparent 0 4px,#70e8f512 5px,transparent 6px)}
.pulse-game[data-state="countdown"] .pulse-stats::before,.pulse-game[data-state="finished"] .pulse-stats::before{animation:transmission-scan .36s steps(3,end) both}
.pulse-system{position:relative}
@keyframes transmission-scan{0%{opacity:0;transform:translateX(-2px)}40%{opacity:.4;transform:translateX(1px)}100%{opacity:.15;transform:none}}
/* One horizontal flare centered on the unmodified arena. No large filter surfaces. */
.transmission-flare{display:block;position:absolute;left:-35%;right:-35%;top:50%;height:2px;pointer-events:none;opacity:0;background:linear-gradient(90deg,transparent,#547fff20 15%,#71e8f5aa 40%,#efffff 50%,#71e8f5aa 60%,#547fff20 85%,transparent);box-shadow:0 0 7px #70e8f544;transform:scaleX(.25);transform-origin:center}
@keyframes transmission-flare{0%{opacity:0;transform:scaleX(.25)}4%{opacity:var(--flare-peak);transform:scaleX(.95)}25%{opacity:calc(var(--flare-peak)*.4);transform:scaleX(1)}100%{opacity:0;transform:scaleX(1.06)}}
.transmission-mission{display:none;margin:0 0 12px;font:500 9px/1.6 'Space Grotesk',sans-serif;letter-spacing:.23em;color:#b3cbd7;text-shadow:0 1px 6px #020911}
.transmission-mission span{display:block;color:#7899b2;font-size:8px;letter-spacing:.19em;margin-top:3px}
.pulse-game[data-state="idle"] .transmission-mission{display:block}
.pulse-content #pulse-title{position:relative}
.pulse-game[data-state="idle"][data-intro="full"] .pulse-logo{animation:title-emerge .9s ease-out both}
.pulse-game[data-state="idle"][data-intro="short"] .pulse-logo{animation:title-emerge .3s ease-out both}
@keyframes title-emerge{0%{opacity:.15;filter:drop-shadow(0 0 1px #70e8f5)}35%{opacity:.65}100%{opacity:1;filter:drop-shadow(0 0 6px #38dcff55)}}
/* Closed, suspended and reduced-motion states do no ambient animation work. */
#play-dialog:not([open]) .transmission-world *,#play-dialog:not([open]) .pulse-logo,.pulse-game[data-suspended="true"] .transmission-world *,.pulse-game[data-state="help"] .transmission-world *,.pulse-game[data-state="paused"] .transmission-world *{animation-play-state:paused!important}
@media(max-width:600px){.transmission-rain{background-image:repeating-linear-gradient(103deg,transparent 0 117px,#85cbe72b 118px,transparent 119px 241px);opacity:.07}.transmission-mist{animation:none;opacity:.25}.transmission-city{background-position:52% center}.pulse-stats{box-shadow:inset 0 1px #d9fcff0c;padding-inline:6px}.transmission-flare{left:-18%;right:-18%}.transmission-mission{font-size:8px;letter-spacing:.16em}.transmission-mission span{font-size:7px}.pulse-game[data-state="idle"] .game-cover{height:29dvh}}
@media(prefers-reduced-motion:reduce){.transmission-world *,.pulse-game .pulse-logo,.pulse-game .pulse-stats::before,.pulse-game .pulse-system::after,.pulse-game #pulse-title::after{animation:none!important;transition:none!important}.transmission-flare{display:none}.transmission-city{transform:none!important}}

.transmission-rain{background-image:url('assets/pulse-rain.svg'),url('assets/pulse-rain.svg');background-size:240px 240px,380px 380px;background-position:0 0,97px 54px}
@media(max-width:600px){.transmission-rain{background-image:url('assets/pulse-rain.svg');background-size:300px 300px}}
/* Results: score, counts, rank, caption, portrait, retry — compact at desktop heights. */
.pulse-game[data-state="finished"]{height:100dvh;min-height:100dvh;padding-block:16px}
.pulse-game[data-state="finished"] .pulse-content{flex:1;min-height:0;justify-content:center;padding:8px 0 0;gap:0}
.pulse-game[data-state="finished"] #pulse-title,.pulse-game[data-state="finished"] .pulse-system,.pulse-game[data-state="finished"] .pulse-result{display:none}
.pulse-game[data-state="finished"] .pulse-rank-card{margin:0;gap:0}
.pulse-game[data-state="finished"] .pulse-rank-total{font-size:clamp(24px,4.8dvh,40px);line-height:1.2;margin:0 0 8px}
.pulse-game[data-state="finished"] .pulse-rank-counts{font:12px/1.5 'Space Grotesk',sans-serif;color:#add2dc;margin:0 0 18px}
.pulse-game[data-state="finished"] .pulse-rank-label{margin:0 0 5px;font-size:10px}
.pulse-game[data-state="finished"] #pulse-rank-name{font-size:clamp(24px,4dvh,32px);line-height:1.3;margin:0 0 6px}
.pulse-game[data-state="finished"] #pulse-rank-copy{font-size:13px;line-height:1.6;color:#acbfcd;margin:0 0 10px}
.pulse-game[data-state="finished"] .rank-portrait{width:min(210px,27dvh);margin:0 auto 12px}
.pulse-game[data-state="finished"] .rank-portrait img{width:100%;height:100%}
.pulse-game[data-state="finished"] .pulse-feedback:empty{display:none}
.pulse-game[data-state="finished"] .pulse-feedback:not(:empty){font-size:10px;line-height:1.4;min-height:0;margin:0 0 6px}
.pulse-game[data-state="finished"] .pulse-start{flex:none}
@media(max-height:650px){.pulse-game[data-state="finished"]{padding-block:10px}.pulse-game[data-state="finished"] .rank-portrait{width:min(170px,22dvh);margin-bottom:8px}.pulse-game[data-state="finished"] .pulse-rank-counts{margin-bottom:10px}.pulse-game[data-state="finished"] #pulse-rank-copy{margin-bottom:6px}}

.pulse-game .pulse-system:empty{display:none}

/* Keep the city and its atmospheric layers exclusively on the title screen. */
.pulse-game:not([data-state="idle"]) .transmission-world{display:none}
.pulse-game:not([data-state="idle"]) .transmission-world *{animation:none!important;transition:none!important}
.pulse-game:not([data-state="idle"]){background:radial-gradient(ellipse at 50% 48%,#11212e,#070b14 72%)!important}

/* Title credit, outside the interactive content. */
.pulse-copyright{display:none;position:absolute;bottom:max(14px,env(safe-area-inset-bottom));left:0;right:0;text-align:center;font:10px/1.5 "Space Grotesk",sans-serif;letter-spacing:.08em;color:#a7bbc8;pointer-events:none}
.pulse-game[data-state="idle"] .pulse-copyright{display:block}
.pulse-game[data-state="idle"]{padding-bottom:max(42px,calc(env(safe-area-inset-bottom) + 30px))}

/* The title's existing START control is now the center of the animated beacon.
   The horizon follows the centered square artwork's cover crop on either aspect ratio. */
.pulse-game[data-state="idle"]{height:100dvh;min-height:100dvh;--title-beacon-size:clamp(180px,30dvh,270px);--title-horizon:calc(50% + max(10vw,10dvh))}
.pulse-game[data-state="idle"] .transmission-city{background-position:center}
.pulse-game[data-state="idle"] .pulse-content #pulse-title{position:absolute;top:27%;left:50%;transform:translate(-50%,-50%);width:min(480px,calc(100% - 40px));margin:0}
.pulse-game[data-state="idle"] .game-cover{position:absolute;left:50%;top:var(--title-horizon);transform:translate(-50%,-50%);width:var(--title-beacon-size);height:var(--title-beacon-size);max-width:none;max-height:none;margin:0;pointer-events:none}
.pulse-game[data-state="idle"] #pulse-start{position:absolute;left:50%;top:var(--title-horizon);transform:translate(-50%,-50%);width:calc(var(--title-beacon-size)*.5);height:calc(var(--title-beacon-size)*.5);min-height:0;padding:0 0 0 .18em;border:0;border-radius:50%;background:radial-gradient(circle,#06192370,transparent 70%);box-shadow:none;color:#efffff;font:500 clamp(13px,1.8dvh,16px)/1 'Space Grotesk',sans-serif;letter-spacing:.18em;text-shadow:0 0 6px #6cf2ff,0 0 18px #19d9ff;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:background .2s,text-shadow .2s}
.pulse-game[data-state="idle"] #pulse-start:hover{background:#06263250;text-shadow:0 0 8px #c6ffff,0 0 24px #21dfff}
.pulse-game[data-state="idle"] #pulse-start:focus-visible{outline:1px solid #c5efff;outline-offset:7px}
@media(max-width:600px){.pulse-game[data-state="idle"] .pulse-content #pulse-title{top:30%}}
@media(max-height:480px) and (min-aspect-ratio:3/2){.pulse-game[data-state="idle"]{--title-beacon-size:150px;--title-horizon:72%}.pulse-game[data-state="idle"] .pulse-content #pulse-title{top:31%;width:min(350px,65%)}}

/* A local, one-shot highlight; never changes HUD geometry or tap timing. */
.pulse-last-cell{position:relative;isolation:isolate}
.pulse-last-cell::after{content:"";position:absolute;inset:-5px -7px;border:1px solid #6ceeff;border-radius:5px;pointer-events:none;opacity:0}
.pulse-game[data-last-beaten="true"] #pulse-last{animation:last-score-glow 1.2s ease-out both}
.pulse-game[data-last-beaten="true"] .pulse-last-cell::after{animation:last-score-edge 1.2s ease-out both}
.pulse-stats .pulse-last-notice{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@keyframes last-score-glow{0%{color:#e6ffff;text-shadow:0 0 2px #70f1ff}12%{color:#79f2ff;text-shadow:0 0 5px #70f1ff,0 0 16px #28dfffaa}45%{color:#a6f7ff;text-shadow:0 0 10px #28dfff77}100%{color:inherit;text-shadow:none}}
@keyframes last-score-edge{0%{opacity:0;box-shadow:0 0 0 transparent}12%{opacity:.8;box-shadow:0 0 12px #28dfff55,inset 0 0 8px #28dfff22}100%{opacity:0;box-shadow:0 0 0 transparent}}
.pulse-game[data-state="help"] .pulse-last-cell::after,.pulse-game[data-state="paused"] .pulse-last-cell::after,.pulse-game[data-state="help"] #pulse-last,.pulse-game[data-state="paused"] #pulse-last{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.pulse-game[data-last-beaten="true"] #pulse-last{animation:none;color:#79f2ff;text-shadow:none}.pulse-game[data-last-beaten="true"] .pulse-last-cell::after{animation:none}}
/* Title-only layered rain; the canvas is stopped outside the title screen. */
.pulse-game .transmission-rain{display:none}
.pulse-title-rain{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.pulse-title-rain[hidden]{display:none}
