/* Play Park site chrome surrounds the user's requested neon rhythm stage. */
.game-shell{background:linear-gradient(155deg,#121a32,#0c1022 60%,#15102b);border:1px solid #343455;color:#f6f8ff;box-shadow:0 20px 65px #22295622;padding:24px;overflow:hidden}
.track-info h2{color:#fff;letter-spacing:.1px}.track-info small{color:#8f9ec1}.track-info p{color:#8b9abc}.album{background:linear-gradient(135deg,#153e50,#201843);color:#55edff;border:1px solid #3d6880;box-shadow:inset 0 0 13px #44c9ff1f,0 0 20px #36e5ff0c;border-radius:14px}.game-shell .small-button{background:#171e34;border-color:#334360;color:#aabbdc}.game-shell .small-button:hover{background:#23314c}.mode-tabs{background:#080e1f;border:1px solid #28324a;margin:18px 0}.mode-tabs button{color:#8294b7}.mode-tabs button[aria-pressed=true]{background:#223149;color:#65ecfa;box-shadow:inset 0 0 0 1px #46b6c04a}.meters small{color:#8395b8}.meters strong{color:#e8f3ff;font-size:24px}.meters>div:last-child strong{color:#65e7f8}.combo-billboard{height:106px;background:radial-gradient(ellipse at 50% 110%,#203247,#10162a 75%);border-color:#2b3851;color:#7083a7;border-radius:15px;box-shadow:inset 0 1px 0 #ffffff08;margin:0 0 16px}.combo-line strong{font-size:64px;font-style:italic;letter-spacing:-3px}.combo-line span{font-size:14px;font-style:italic;letter-spacing:3px}.combo-billboard p{font-size:12px;letter-spacing:.3px}.combo-billboard[data-level=ready]{background:radial-gradient(ellipse at 50% 100%,#203247,#11162a 80%);color:#778aaf}.combo-billboard[data-level=blue]{background:radial-gradient(ellipse at 50% 150%,#14516b,#111a33 80%);border-color:#3eeaff6e;color:#8df8ff;box-shadow:inset 0 0 25px #23daf415,0 0 20px #17e3ff12}.combo-billboard[data-level=blue] .combo-line{filter:drop-shadow(0 0 9px #1cc9e88c)}.combo-billboard[data-level=gold]{background:radial-gradient(ellipse at 50% 150%,#67364e,#1c1835 80%);border-color:#ff5ae181;color:#ffabf2;box-shadow:inset 0 0 25px #ff2bbe15,0 0 23px #ff51d11a}.combo-billboard[data-level=gold] .combo-line{filter:drop-shadow(0 0 9px #fa2eccaa)}.combo-billboard[data-level=fire]{background:radial-gradient(ellipse at 50% 160%,#763976,#261a45 80%);border-color:#f183ed;color:#fff4fd;box-shadow:inset 0 0 30px #ff29e62b,0 0 25px #d964ff27}.combo-billboard[data-level=fire] .combo-line{filter:drop-shadow(0 0 8px #ff3ed2)}.combo-billboard.bump:after{border-color:#75f7ff85}.difficulty{color:#647b9b;margin:0 1px 9px}.difficulty strong{color:#78e4ef;letter-spacing:.8px}.progress{height:3px;background:#252d47;margin-bottom:12px}.progress i{background:linear-gradient(90deg,#28ddeb,#a475ff,#ff61da);box-shadow:0 0 9px #41e7ff}
.pad,.pad[data-stage="3"]{--lane-h:380px;height:var(--lane-h);background:#080d21;border:1px solid #35405d;border-radius:17px;perspective:none;box-shadow:inset 0 -20px 60px #752d8818;isolation:isolate}.pad:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 1%,#38bfd631,transparent 32%),radial-gradient(ellipse at 0 87%,#2cf2fc18,transparent 36%),radial-gradient(ellipse at 100% 92%,#fd2ddd1e,transparent 38%);pointer-events:none;z-index:1}.road{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}.lane{background:transparent;z-index:2}.lane:before{content:'';position:absolute;left:0;right:0;top:0;height:24%;background:linear-gradient(#080d21b8,transparent);z-index:3;pointer-events:none}.hit-line,.pad[data-stage="3"] .hit-line{top:82%;left:7%;width:86%;height:2px;border:0;border-radius:0;transform:none;background:linear-gradient(90deg,transparent,#3ee8ff 12%,#fff 50%,#ff64de 88%,transparent);box-shadow:0 0 12px #60dcffab,0 7px 25px #e547ff60;z-index:0}.hit-label{top:87%;left:50%;color:#a3a8c6;font-size:10px;letter-spacing:3px;text-transform:uppercase}.record{display:none}.note,.note.downbeat{height:18px;width:65px;border-radius:50%;border:1px solid #8afdff;background:radial-gradient(ellipse at 50% 32%,#d6ffff,#51f5ff 48%,#17a3d2 93%);box-shadow:0 0 5px #87fdff,0 0 15px #20d9ffb3,0 7px 15px #0096c67a;transform:translate(-50%,-50%);z-index:4}.note.pink{background:radial-gradient(ellipse at 50% 32%,#ffe1fc,#fc65df 48%,#bc32d1 93%);border-color:#ffa6f2;box-shadow:0 0 5px #ff9df0,0 0 16px #ee3bdfa8,0 7px 15px #bb20da7a}.note:after{content:'';position:absolute;left:11%;right:11%;top:20%;height:25%;border-radius:50%;background:#fff7;filter:blur(1px)}.pad #judgment{left:0;right:0;top:11px;width:100%;max-width:none;font-size:18px;letter-spacing:2px;font-style:italic;color:#79eaff;text-shadow:0 0 13px #27daf977;z-index:8;opacity:.92}.pad[data-judge=GOOD] #judgment{color:#b1a0ff;text-shadow:0 0 13px #ac73e777}.pad[data-judge=MISS] #judgment,.pad[data-judge=EXTRA] #judgment{color:#f395bc;text-shadow:none;font-size:14px}.pad #pad-caption{bottom:9px;color:#8799bb;font-size:10px;letter-spacing:.5px}.pad.hit:after{content:'';position:absolute;left:7%;right:7%;top:78%;height:8%;background:radial-gradient(ellipse,#69e8ff29,transparent 73%);pointer-events:none;z-index:5}.game-shell .input-guide{color:#7588a7}.game-shell #status{color:#9aacc7;font-size:12px}.game-shell .primary{background:linear-gradient(100deg,#176ecf,#5255ee 65%,#925ae4);border:1px solid #6d97ef7a;box-shadow:0 6px 22px #222fa744;color:#fff}.game-shell .settings{border-color:#26314a;color:#879bbd}.game-shell .settings input{accent-color:#65d6ed}.game-shell .settings summary{color:#8b9bbc}.game-shell .settings output{color:#60e7f4}
body.playing .pad{border-color:#446583}body.playing .game-shell{box-shadow:0 18px 65px #19183326}.intro h1 em span{color:#f266c4}.result{background:linear-gradient(140deg,#151d39,#241b42);border-color:#393b60;color:#f2f5ff}.result h2{color:#fff}.result .eyebrow{color:#74e8f3}.result .final-score{color:#85f0f7;text-shadow:0 0 20px #35c4e033}.result p{color:#aab4d3}.result-counts{border-color:#363653;color:#929dbf}.result-counts b{color:#d9eafe}.result form{background:#f7f9ff;color:#182a49}.result .primary{background:#4d61ed}.result #verify-retry{color:#42598e}
@media(max-width:640px){.game-shell{padding:18px 14px;border-radius:23px}.pad,.pad[data-stage="3"]{--lane-h:320px;height:var(--lane-h)}.combo-billboard{height:96px;margin-bottom:13px}.combo-line strong{font-size:57px}.combo-line span{font-size:13px}.combo-billboard p{font-size:11px}.meters strong{font-size:24px}.pad #judgment{font-size:16px}.track-info h2{font-size:17px}.intro h1 em{font-size:29px}.game-shell .track-info small,.game-shell .track-info p{font-size:10px}}
@media(prefers-reduced-motion:reduce){.combo-billboard.bump .combo-line,.combo-billboard.bump:after{animation:none}.combo-billboard,.note{transition:none}.pad.hit:after{display:none}}

/* Successful hits have a clear impact; misses have no impact animation. */
.hit-fx{position:absolute;inset:0;z-index:7;pointer-events:none;overflow:hidden;contain:paint}
.hit-fx i{display:block;position:absolute;opacity:0;pointer-events:none}
.hit-wash{inset:49% 0 0;background:radial-gradient(ellipse at var(--impact-x,50%) 64%,#60faff66,transparent 55%)}
.hit-ring,.hit-core{left:var(--impact-x,50%);top:82%;width:98px;height:35px;border-radius:50%;transform:translate(-50%,-50%)}
.hit-ring{border:3px solid #c6ffff;box-shadow:0 0 14px #37efff,inset 0 0 10px #2ae3ff}
.hit-ring.outer{border-color:#fc8dea;box-shadow:0 0 14px #ff47d4}
.hit-core{width:78px;height:27px;background:radial-gradient(ellipse,#fff 10%,#dcffff 35%,#5befff 60%,transparent 76%);filter:drop-shadow(0 0 11px #3cffff)}
.hit-ray{left:var(--impact-x,50%);top:82%;width:20px;height:3px;border-radius:3px;background:#baffff;box-shadow:0 0 8px #55edff;transform:translate(-50%,-50%) rotate(var(--turn))}
.hit-ray:nth-child(3n){background:#ffa7ee;box-shadow:0 0 8px #ff58db}
.pad.hit:after{display:none}
.pad.hit .hit-core{animation:rhythm-impact-core 260ms ease-out both}
.pad.hit .hit-ring{animation:rhythm-impact-ring 420ms cubic-bezier(.12,.75,.2,1) both}
.pad.hit .hit-ring.outer{animation-delay:35ms}
.pad.hit .hit-ray{animation:rhythm-impact-ray 380ms cubic-bezier(.1,.7,.2,1) both}
.pad.hit .hit-wash{animation:rhythm-impact-wash 300ms ease-out both}
.pad.hit .hit-line{height:4px;box-shadow:0 0 10px #fff,0 0 28px #50eaff;animation:rhythm-line-strike 350ms ease-out both}
.pad.hit #judgment{top:56%;font-size:34px;letter-spacing:2px;color:#f0ffff;text-shadow:0 0 6px #fff9,0 0 20px #39eaff,0 3px 0 #20708c;animation:rhythm-judge-pop 420ms ease-out both}
.pad.hit[data-judge=GOOD] #judgment{font-size:29px;color:#ddceff;text-shadow:0 0 18px #a77eff,0 3px 0 #554477}
.pad[data-impact=GOOD] .hit-core{width:62px;height:22px;filter:drop-shadow(0 0 8px #a593ff)}
.pad[data-impact=GOOD] .hit-ring{border-color:#cab5ff;box-shadow:0 0 12px #a488ff}
.combo-billboard{height:126px;overflow:hidden}
.combo-line{transform-origin:50% 60%;will-change:transform}
.combo-line strong{font-size:76px;text-shadow:0 3px 0 #090b2944}
.combo-billboard.bump .combo-line{animation:rhythm-combo-bounce 420ms cubic-bezier(.2,.75,.25,1) both}
.combo-billboard.bump:after{animation:rhythm-combo-ring 420ms ease-out both;border:2px solid #7cfaff;border-radius:inherit;inset:5px;box-shadow:inset 0 0 28px #50ddff33,0 0 16px #79ffff44}
.combo-billboard[data-level=gold].bump:after,.combo-billboard[data-level=fire].bump:after{border-color:#ff9ce8;box-shadow:inset 0 0 32px #ff43cf38,0 0 20px #ff69df44}
.combo-billboard[data-milestone=true].bump .combo-line{animation-name:rhythm-combo-milestone}
.combo-billboard[data-milestone=true] .combo-line span{color:#fff1a9;text-shadow:0 0 12px #ff82da}
@keyframes rhythm-impact-core{0%{opacity:1;transform:translate(-50%,-50%) scale(.45)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.55)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.05)}}
@keyframes rhythm-impact-ring{0%{opacity:1;transform:translate(-50%,-50%) scale(.4)}35%{opacity:.95}100%{opacity:0;transform:translate(-50%,-50%) scale(2.8)}}
@keyframes rhythm-impact-ray{0%{opacity:1;transform:translate(-50%,-50%) rotate(var(--turn)) scaleX(.5)}75%{opacity:.9}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(var(--turn)) scaleX(.2)}}
@keyframes rhythm-impact-wash{0%{opacity:.9}100%{opacity:0}}
@keyframes rhythm-line-strike{0%{opacity:1;transform:scaleX(.86)}35%{transform:scaleX(1.04)}100%{opacity:.65;transform:scaleX(1)}}
@keyframes rhythm-judge-pop{0%{opacity:1;transform:translateY(10px) scale(.55)}22%{opacity:1;transform:translateY(-3px) scale(1.2)}55%{transform:translateY(-8px) scale(.98)}100%{opacity:.85;transform:translateY(-18px) scale(1)}}
@keyframes rhythm-combo-bounce{0%{transform:scale(.58) translateY(7px)}24%{transform:scale(1.38) translateY(-2px)}49%{transform:scale(.91)}73%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes rhythm-combo-milestone{0%{transform:scale(.5) rotate(-4deg)}25%{transform:scale(1.48) rotate(2deg)}50%{transform:scale(.93) rotate(-1deg)}75%{transform:scale(1.1)}100%{transform:scale(1)}}
@keyframes rhythm-combo-ring{0%{opacity:1;transform:scale(.83)}100%{opacity:0;transform:scale(1.035)}}
@media(max-width:640px){.combo-billboard{height:116px}.combo-line strong{font-size:66px}.pad.hit #judgment{font-size:29px}.pad.hit[data-judge=GOOD] #judgment{font-size:25px}}
@media(prefers-reduced-motion:reduce){.pad.hit .hit-fx i,.pad.hit .hit-line,.pad.hit #judgment,.combo-billboard.bump .combo-line,.combo-billboard[data-milestone=true].bump .combo-line,.combo-billboard.bump:after{animation:none}.pad.hit .hit-core{opacity:.85;transform:translate(-50%,-50%);filter:none}.pad.hit #judgment{transform:none}.combo-billboard.bump:after{opacity:.65;transform:none}}
