/* Vector stage art sits behind gameplay; the canvas owns notes and impacts. */
:root{--yellow:#ffdf45;--pink:#ff3cbe;--blue:#737aff;--cyan:#35f6ff}
#gameScreen .arena,#gameScreen .arena[data-scene]{
 background:radial-gradient(ellipse at 5% 94%,#053b4b80,transparent 40%),radial-gradient(ellipse at 98% 90%,#32145288,transparent 45%),linear-gradient(#02030b,#080d20 75%,#070d1e);
}
#gameScreen .arena:before{content:'';position:absolute;inset:0;background:url('system/neon-stage.svg') center/100% 100% no-repeat;opacity:1;pointer-events:none;z-index:0}
#gameScreen .arena:after{content:'';position:absolute;inset:auto 0 35px;height:140px;background:url('system/neon-dock.svg') center/100% 100% no-repeat;pointer-events:none;z-index:0}
#gameScreen .arena .sceneIllustration{display:none}
#gameScreen .stageLights{opacity:0}
#gameScreen.boosting .stageLights{opacity:.11;mix-blend-mode:screen}
#gameScreen .lane,#gameScreen .lane.pressed{background:transparent}
#gameScreen .lane span{opacity:.24;font-size:12px}
#gameScreen #laneEffects b{font-size:22px;color:#f7ffff;text-shadow:0 0 5px #35f6ff,2px 2px #673eae;letter-spacing:.06em;font-style:italic}
#gameScreen .gameShell,#gameScreen .gameTop,#gameScreen .lifeHud{background:#060a17}
#gameScreen .gameTop{border-bottom:1px solid #6065a944;background:linear-gradient(110deg,#0c182a,#120e26)}
#gameScreen #pause{background:linear-gradient(145deg,#1b3450,#101a31);border-color:#56d8f077;border-radius:4px;box-shadow:inset 0 1px #bbfaff24;color:#d9fcff}
#gameScreen .progress{background:#132231;height:2px}
#gameScreen .progress i{background:linear-gradient(90deg,#35f6ff,#737aff,#ff3cbe);box-shadow:0 0 7px #737aff}
#gameScreen .trackLine{display:flex;align-items:center;gap:7px;min-width:0}
#gameScreen #gameTitle{min-width:0;flex:1}
#gameScreen #trackTime{flex:none;font:500 11px 'Noto Sans KR',sans-serif;color:#adc3d5;font-variant-numeric:tabular-nums;white-space:nowrap}
#gameScreen .gameTop{gap:8px;padding-inline:9px}
#gameScreen .scorebox strong{font-size:24px}
#gameScreen .playClearance{height:74px;flex:none;background:radial-gradient(ellipse at 50% 0,#20264755,transparent 70%),#060a17;padding-bottom:env(safe-area-inset-bottom)}
#gameScreen .comboHud{z-index:5}
#gameScreen #boost{pointer-events:auto;touch-action:manipulation;display:block;margin:8px auto 0;width:174px;height:70px;padding:0 0 5px;border:0;background:url('system/boost-emblem.svg') center/contain no-repeat;color:#fff5ab;font-size:32px;font-style:italic;text-shadow:0 0 12px #ff3cbe,2px 2px #592b90;filter:drop-shadow(0 0 8px #a82eff55);animation:boostArrive .42s cubic-bezier(.2,.8,.25,1.25) both}
#gameScreen #boost:active{transform:scale(.93);filter:brightness(1.5)}
#gameScreen .comboHud{text-shadow:0 2px 8px #030916}
#gameScreen .comboHud strong{color:#fff4b0;text-shadow:0 0 18px #ffdf4540,2px 3px #544894}
#gameScreen #judgement{font-style:italic;letter-spacing:.035em;text-shadow:0 0 8px #737aff,2px 2px #281e53}
#gameScreen #lifeDots i{background:#35f6ff;box-shadow:0 0 6px #35f6ff33}#gameScreen #lifeDots i.off{background:#253051;box-shadow:none}
#gameScreen .scorebox strong{color:#fff4af;text-shadow:0 0 10px #ffdf4533}
#lobby .songCard{border-color:#5d5687;box-shadow:0 5px 20px #0005}
#lobby .songCard.active{border-color:#35f6ff;box-shadow:0 0 15px #35f6ff22}
#lobby .primary{background:linear-gradient(115deg,#ffe576,#ffbe56);border-color:#fff2bb;box-shadow:3px 3px #4a3b81;color:#17122b}
#lobby .tools button,#lobby .iconbtn{background:#15172c;border-color:#4f507b}
#lobby .songItem.open{border-bottom-color:#737aff}
/* Shared 10% gutters keep rendered lanes and full rectangular touch targets aligned. */
#gameScreen #notes{left:5%;right:5%;width:90%}
#gameScreen #pads,#gameScreen #laneEffects{left:5%;right:5%;width:90%}
#gameScreen .arena:before,#gameScreen .arena:after{left:5%;right:5%}
#gameScreen .playClearance{display:none}
.reduced #boost{animation:none!important}
@keyframes boostArrive{0%{opacity:0;transform:scale(.55) translateY(8px)}65%{opacity:1;transform:scale(1.1)}100%{transform:scale(1)}}
@media(max-width:380px){#gameScreen .gameTop{gap:6px;padding-inline:7px}#gameScreen .scorebox strong{font-size:21px}#gameScreen #trackTime{font-size:10px}#gameScreen .trackLine{gap:4px}}

#gameScreen .arena:before{display:none}

/* Match the full rectangular input areas to the selected lane layout. */
#pads{grid-template-columns:repeat(var(--lane-count,3),minmax(0,1fr))}
.stageLights{display:none!important}
.boosting .arena{background-color:#050a1c}

/* Share the receptor baseline with the renderer; keep full-height lane input. */
#gameScreen .arena:after{bottom:calc(var(--receptor-bottom,120px) - 50px)}
#gameScreen #boost{position:absolute;z-index:5;left:50%;bottom:calc(var(--receptor-bottom,120px) + 40px);translate:-50% 0;margin:0;width:150px;height:60px;font-size:29px}
#gameScreen #laneEffects b{bottom:calc(var(--receptor-bottom,120px) + 45px)}