/* Cinematic presentation only: scoring and the moving orbit's geometry are untouched. */
.pulse-game{position:relative;isolation:isolate;--music-low:0;--music-high:0;color:#eaf5ff}
.pulse-game:not([data-state="idle"]){background:radial-gradient(ellipse at 50% 48%,#11212e,#070b14 72%)}
.pulse-atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1;transition:opacity .35s;opacity:1}
.pulse-game[data-state="idle"] .pulse-atmosphere,.pulse-game[data-state="help"] .pulse-atmosphere{display:none}
.pulse-floor{position:absolute;inset:60% -30% -20%;background-image:linear-gradient(#70e8f52b 1px,transparent 1px),linear-gradient(90deg,#718dff24 1px,transparent 1px);background-size:64px 48px;transform:perspective(380px) rotateX(58deg);transform-origin:50% 0;opacity:calc(.045 + var(--music-low)*.075);mask-image:linear-gradient(transparent,#000 35%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 35%,transparent)}
.pulse-edge{position:absolute;inset:12% 3% 10%;border-left:1px solid #718dff;border-right:1px solid #70e8f5;border-radius:48%;opacity:calc(.02 + var(--music-high)*.055);background:radial-gradient(ellipse at 0 45%,#718dff30,transparent 25%),radial-gradient(ellipse at 100% 65%,#a78bfa30,transparent 25%)}
.pulse-system{font:500 10px/1.5 'Space Grotesk',sans-serif;letter-spacing:.2em;color:#7893ab;min-height:18px;margin:0 0 12px}
.pulse-system::before{content:"";display:inline-block;width:4px;height:4px;background:#70e8f5;box-shadow:0 0 6px #70e8f566;border-radius:50%;vertical-align:middle;margin-right:9px}
.pulse-game[data-state="idle"] .pulse-system{display:none}
.pulse-stats{width:min(100%,400px);gap:16px;padding:12px 0;border-block:1px solid #70e8f529;position:relative}
.pulse-stats::before,.pulse-stats::after{content:"";position:absolute;top:-1px;height:4px;width:18px;border-top:1px solid #70e8f5;opacity:.65}
.pulse-stats::before{left:0}.pulse-stats::after{right:0}
.pulse-stats span{font-size:10px;letter-spacing:.12em;color:#7893ab;white-space:nowrap}
.pulse-stats strong{font-size:25px;line-height:1.4;font-variant-numeric:tabular-nums;letter-spacing:.025em;text-shadow:none}
.pulse-game[data-judged="true"] #pulse-score{animation:cin-score .3s ease-out}
.pulse-game[data-sequence="complete"] .pulse-system{color:#70e8f5}
/* Retire the previous broad flash and particle burst. Keep light localized to the beacon. */
.pulse-game .pulse-hitfx,.pulse-game .pulse-arena::after{display:none!important}
.pulse-game[data-judged="true"] .pulse-orbit{opacity:0}
.pulse-game .pulse-target{stroke:#70e8f5;opacity:.13;stroke-width:8}
.pulse-game .pulse-target-line{stroke:#70e8f5;filter:none;stroke-width:1.2}
.pulse-game[data-echo="perfect"] .pulse-target-line{animation:cin-fuse .65s ease-out}
.pulse-echo-layer{pointer-events:none;fill:none;stroke:#70e8f5}
.pulse-echo-layer circle{opacity:0;transform-origin:160px 160px;stroke-width:1.4}
#pulse-echo{stroke-width:2;filter:drop-shadow(0 0 3px #70e8f5aa)}
.pulse-game[data-echo="good"] #pulse-echo{stroke:#718dff;animation:cin-echo .3s ease-out both}
.pulse-game[data-echo="great"] #pulse-echo{animation:cin-echo .45s ease-out both}
.pulse-game[data-echo="perfect"] #pulse-echo{stroke:#f4ffff;stroke-width:2.5;animation:cin-echo .6s ease-out both}
.pulse-game[data-echo="miss"] #pulse-echo{stroke:#7893ab;filter:none;animation:cin-echo .3s ease-out both}
.pulse-game[data-echo="great"] .pulse-wave-a{animation:cin-wave .45s ease-out both;--wave-end:1.35}
.pulse-game[data-echo="perfect"] .pulse-wave-a{stroke:#eaffff;animation:cin-wave .65s cubic-bezier(.1,.65,.2,1) both;--wave-end:1.75}
.pulse-game[data-echo="perfect"][data-combo-fx="2"] .pulse-wave-b,.pulse-game[data-echo="perfect"][data-combo-fx="3"] .pulse-wave-b,.pulse-game[data-echo="perfect"][data-combo-fx="5"] .pulse-wave-b,.pulse-game[data-echo="perfect"][data-combo-fx="10"] .pulse-wave-b{stroke:#718dff;animation:cin-wave .65s .08s ease-out both;--wave-end:1.55}
.pulse-game[data-echo="perfect"][data-combo-fx="5"] .pulse-wave-c,.pulse-game[data-echo="perfect"][data-combo-fx="10"] .pulse-wave-c{stroke:#a78bfa;stroke-dasharray:2 9;animation:cin-wave .7s .09s ease-out both;--wave-end:1.9}
.pulse-game[data-final="true"][data-echo="perfect"] .pulse-wave-a{--wave-end:2;animation-duration:.78s}
.pulse-game[data-combo-fx="10"][data-echo="perfect"] .pulse-wave-c{stroke-dasharray:none;--wave-end:2.15}
.pulse-game .pulse-feedback{font-size:28px;letter-spacing:.13em;font-weight:500}
.pulse-game[data-hit="good"] .pulse-feedback{font-size:21px;color:#8fa9ed;text-shadow:none;animation:cin-type .25s ease-out}
.pulse-game[data-hit="great"] .pulse-feedback{font-size:26px;color:#70e8f5;text-shadow:0 0 10px #70e8f530;animation:cin-type .4s ease-out}
.pulse-game[data-hit="perfect"] .pulse-feedback{color:#eaf5ff;text-shadow:0 0 6px #c8faff88,0 0 16px #70e8f54d;animation:cin-type .6s cubic-bezier(.12,.7,.2,1)}
.pulse-game[data-combo-fx="3"][data-hit="perfect"] .pulse-feedback,.pulse-game[data-combo-fx="5"][data-hit="perfect"] .pulse-feedback,.pulse-game[data-combo-fx="10"][data-hit="perfect"] .pulse-feedback{animation-name:cin-perfect-type}
.pulse-game .pulse-precision strong{color:#a9b9ff;text-shadow:none}
@keyframes cin-echo{0%{opacity:.95}35%{opacity:.6}100%{opacity:0}}
@keyframes cin-wave{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(var(--wave-end,1.7))}}
@keyframes cin-fuse{0%{stroke:#fff;stroke-width:5;filter:drop-shadow(0 0 9px #eaffff)}18%{stroke-width:2.5}100%{stroke:#70e8f5;stroke-width:1.2;filter:none}}
@keyframes cin-type{0%{opacity:.3;transform:translateY(4px)}25%,100%{opacity:1;transform:translateY(0)}}
@keyframes cin-perfect-type{0%{opacity:.3;transform:translateY(5px);letter-spacing:.22em}35%,100%{opacity:1;transform:translateY(0);letter-spacing:.13em}}
@keyframes cin-score{0%{color:#fff;text-shadow:0 0 10px #70e8f5aa}100%{color:#eaf5ff;text-shadow:none}}
@media(max-width:600px){.pulse-stats{gap:12px;padding:9px 0}.pulse-stats strong{font-size:22px}.pulse-stats span{font-size:9px}.pulse-system{font-size:9px;margin-bottom:8px}.pulse-edge{inset:15% 2% 12%}.pulse-floor{background-size:64px 56px}.pulse-game .pulse-feedback{font-size:25px}}
@media(max-height:650px){.pulse-system{margin-bottom:4px}.pulse-stats{padding:5px 0}.pulse-content #pulse-title{margin-bottom:8px}.pulse-game .pulse-arena{margin-block:10px}}
@media(prefers-reduced-motion:reduce){.pulse-game .pulse-echo-layer circle,.pulse-game .pulse-target-line,.pulse-game .pulse-feedback,.pulse-game #pulse-score{animation:none!important}.pulse-atmosphere{display:none}.pulse-game .pulse-feedback{transform:none!important;text-shadow:none!important}}
.pulse-game[data-hit="perfect"] .pulse-target{animation:cin-target .65s ease-out both}
@keyframes cin-target{0%{stroke:#f4ffff;opacity:.5}100%{stroke:#70e8f5;opacity:.13}}
@media(prefers-reduced-motion:reduce){.pulse-game[data-hit="perfect"] .pulse-target{animation:none;opacity:.13}}

/* 90% silence / 10% impact: perceptual hierarchy, not literal screen brightness. */
.pulse-game{--echo-peak:.3;--wave-peak:.24}
.pulse-game[data-echo="great"]{--echo-peak:.55;--wave-peak:.42}
.pulse-game[data-echo="perfect"]{--echo-peak:1;--wave-peak:.88}
.pulse-game[data-echo="good"] #pulse-echo{filter:none;stroke-width:1.3}
.pulse-game[data-echo="great"] #pulse-echo{filter:drop-shadow(0 0 2px #70e8f566);stroke-width:1.7}
.pulse-game[data-echo="perfect"] #pulse-echo{filter:drop-shadow(0 0 5px #c8faffaa)}
@keyframes cin-echo{0%{opacity:calc(var(--echo-peak)*.7)}3%{opacity:var(--echo-peak)}30%{opacity:calc(var(--echo-peak)*.48)}100%{opacity:0}}
@keyframes cin-wave{0%{opacity:var(--wave-peak);transform:scale(1)}30%{opacity:calc(var(--wave-peak)*.4)}100%{opacity:0;transform:scale(var(--wave-end,1.7))}}
@keyframes cin-fuse{0%{stroke:#eaffff;stroke-width:2}2%{stroke:#fff;stroke-width:5;filter:drop-shadow(0 0 9px #eaffff)}16%{stroke-width:2.5;filter:drop-shadow(0 0 4px #70e8f580)}100%{stroke:#70e8f5;stroke-width:1.2;filter:none}}
.pulse-game[data-final="true"][data-echo="perfect"] .pulse-wave-b{stroke:#718dff;animation:cin-wave .72s .04s ease-out both;--wave-end:1.75}
.pulse-game[data-final="true"][data-echo="perfect"] .pulse-wave-c{stroke:#a78bfa;stroke-dasharray:none;animation:cin-wave .78s .08s ease-out both;--wave-end:2.15}
.pulse-game[data-final="true"][data-echo="perfect"] .pulse-target-line{animation-duration:.78s}
@media(prefers-reduced-motion:reduce){.pulse-game[data-final="true"] .pulse-echo-layer circle{animation:none!important}}

/* PERFECT contact: hold the exact judged rings for 70 ms, then release the afterglow.
   Only decoration changes; arena/orbit coordinates and next-pulse timers stay untouched. */
.pulse-game[data-echo="perfect"] .pulse-target-line{animation:cin-contact .62s linear both}
.pulse-game[data-echo="perfect"] #pulse-echo{animation:cin-contact-echo .62s linear both;stroke-width:2.3}
.pulse-game[data-echo="perfect"] .pulse-target{animation:cin-contact-halo .62s linear both}
.pulse-game[data-echo="perfect"] .pulse-echo-layer .pulse-wave-a{animation-delay:.07s}
.pulse-game[data-echo="perfect"] .pulse-echo-layer .pulse-wave-b{animation-delay:.11s}
.pulse-game[data-echo="perfect"] .pulse-echo-layer .pulse-wave-c{animation-delay:.15s}
.pulse-game[data-final="true"][data-echo="perfect"] .pulse-target-line{animation-duration:.62s}
@keyframes cin-contact{0%{stroke:#f4ffff;stroke-width:2.5;filter:drop-shadow(0 0 3px #c8faff)}2%,11.3%{stroke:#fff;stroke-width:3;filter:drop-shadow(0 0 6px #c8faff)}35%{stroke:#bdf9ff;stroke-width:2;filter:drop-shadow(0 0 4px #70e8f580)}100%{stroke:#70e8f5;stroke-width:1.2;filter:none}}
@keyframes cin-contact-echo{0%{opacity:.8}2%,11.3%{opacity:1}35%{opacity:.5}100%{opacity:0}}
@keyframes cin-contact-halo{0%,11.3%{stroke:#c8faff;opacity:.35}35%{opacity:.22}100%{stroke:#70e8f5;opacity:.13}}
@media(prefers-reduced-motion:reduce){.pulse-game[data-echo="perfect"] .pulse-target{animation:none!important;opacity:.13}}

/* Keep the beacon and nearby labels spatially stable during judgement. */
.pulse-game .pulse-target-line,.pulse-game[data-echo="perfect"] .pulse-target-line{animation:none!important;stroke-width:1.2;filter:none}
.pulse-game .pulse-target,.pulse-game[data-echo="perfect"] .pulse-target{animation:none!important;stroke:#70e8f5;stroke-width:10;opacity:.13}
.pulse-game .pulse-feedback,.pulse-game .pulse-precision strong{animation:none!important;transform:none!important}

/* Isolate SVG geometry from native button line boxes and score text on iOS. */
.pulse-game .pulse-arena{appearance:none;-webkit-appearance:none;line-height:0;box-sizing:border-box}
.pulse-game .pulse-arena>svg{position:absolute;inset:0;display:block;width:100%;height:100%}