/* Reference proportions for the actual interactive game views. */
#modeSelect.show{display:block;padding-top:clamp(88px,16vh,165px)}
#modeSelect .modeWrap{width:min(69vw,1460px);margin:0 auto}
#modeSelect .modeHeading{margin:0 0 6vh}
#modeSelect .modeHeading h1{font-size:clamp(34px,4vw,78px);margin:0 0 .35em}
#modeSelect .modeHeading span{font-size:clamp(14px,1.65vw,32px);letter-spacing:0}
#modeSelect .modeCards{gap:4.3vw}
#modeSelect .mainModeCard{height:48vh;min-height:240px;padding:1.5vw;display:grid!important;place-items:center}
#modeSelect .modeCardContent{display:grid;justify-items:center;align-content:center;gap:2.2vh;height:auto;width:100%;min-height:0}
#modeSelect .modeNumber{display:none}
#modeSelect .modeIcon,#modeSelect .rank .modeIcon{margin:0;height:auto}
#modeSelect .modeIcon svg{width:clamp(95px,11vw,220px);height:clamp(64px,13vh,160px);filter:drop-shadow(0 0 9px var(--card-light))}
#modeSelect .modeName,#modeSelect .multiCards146 .open146 .modeName{font:italic 900 clamp(28px,3.6vw,70px)/1.05 system-ui}
#modeSelect .modeDesc{font-size:clamp(14px,1.65vw,32px);white-space:pre-line;line-height:1.45;margin:1vh 0 0}
#modeSelect .modeKeyHint{display:none}
#modeSelect .arcNav167{min-height:12vh;gap:3.5vw}
#modeSelect .arcNav167 .arcBrand167{width:14vw;max-height:10vh}
#modeSelect .arcNav167 button{font-size:clamp(14px,1.5vw,29px)}
#songSelect{--frame168:linear-gradient(125deg,#5ee8ff,#803ac9 43%,#f976ff 73%,#5ee8ff);padding:0 1.15vw 1.4vh}
#songSelect .selectHeader{height:13vh;min-height:64px;justify-content:space-between;flex-wrap:nowrap}
#songSelect .selectHeader>.arcBrand167{width:min(24vw,410px);max-height:11vh}
#songSelect .shellHeaderMark,#songSelect .shellFooter{display:none}
.trackNav168{display:flex;gap:5px}
.trackNav168 button,.trackRail168 button,.trackStar168{
 background:#111b35;color:#edf6ff;border:1px solid #7f62c5;border-radius:7px;
 padding:clamp(6px,1vw,17px);font:800 clamp(10px,.95vw,19px)/1.15 system-ui;cursor:pointer
}
.trackNav168 button[aria-current],.trackRail168 button[aria-pressed=true],.trackStar168[aria-pressed=true]{
 background:linear-gradient(115deg,#4a1a75,#79175f);border-color:#ff91f7;box-shadow:inset 0 0 14px #fa48e777
}
#songSelect#songSelect.hasRanking .selectBody{
 display:grid!important;grid-template-columns:10.5% minmax(0,55%) minmax(0,1fr)!important;
 grid-template-rows:minmax(0,1fr) minmax(105px,21vh);gap:clamp(8px,1.2vw,22px);
 height:calc(100% - max(13vh,64px));padding:1.4vh 0 0;overflow:hidden
}
.trackRail168,#songSelect .trackHero,.trackDock168>section,.trackDock168>.songDetail,.trackDock168>.detailSection{
 border:2px solid transparent!important;border-radius:14px;
 background:linear-gradient(135deg,#0b1429,#1d1235) padding-box,var(--frame168) border-box!important;
 box-shadow:0 0 14px #8550c64d
}
.trackRail168{display:flex;flex-direction:column;gap:5px;padding:6px;min-width:0}
.trackRail168 button{flex:1;text-align:left;display:flex;align-items:center;gap:.55vw;min-width:0}
.trackRail168 i{font:normal 600 clamp(17px,2.1vw,36px)/1 system-ui;color:#8ce9ff}
#songSelect .trackHero{display:flex;align-items:stretch;padding:clamp(8px,1.6vw,28px);min-width:0;overflow:hidden}
#songSelect.hasRanking .trackHero .detailTop{display:grid;grid-template-columns:minmax(0,46%) minmax(0,1fr)!important;gap:clamp(9px,1.5vw,26px);height:100%!important;min-height:0!important;width:100%}
#songSelect.hasRanking .trackHero .detailJacket{width:100%!important;height:100%!important;max-height:100%;max-width:none!important;object-fit:contain;background:#070d20}
#songSelect .trackHero .detailMeta{position:relative;align-self:center;min-width:0}
#songSelect .trackHeroKicker{display:flex;margin:0 0 .8vh;padding:0;border:0;font:italic 900 clamp(10px,1.1vw,21px)/1 system-ui;color:#ff9af4}
#songSelect .trackHeroKicker span{display:none}
#songSelect.hasRanking .detailMeta h2{font:italic 900 clamp(21px,3.25vw,63px)/1.03 system-ui!important;margin:.7vh 0;color:#fff!important;-webkit-line-clamp:2}
#songSelect .detailMeta p{font-size:clamp(12px,1.55vw,28px);font-style:italic}
#songSelect .detailBpm{display:flex;align-items:center;gap:.5em;background:#0b142b;border:1px solid #715aab;padding:.65em;margin:1.5vh 0 0;font-size:clamp(11px,1vw,19px)}
#songSelect .detailBpm b{font-size:1.35em}
.trackStar168{position:absolute;right:0;top:-1.4em;padding:.25em .48em;font-size:clamp(16px,1.7vw,30px)}
#songSelect .trackHero .detailSection{margin:1.3vh 0 0}
#songSelect .trackHero .selectedRating{display:none}
#songSelect.hasRanking #chartList .chartButton{min-height:clamp(38px,6.7vh,75px)!important;padding:3px!important;border-radius:7px!important}
#songSelect.hasRanking #chartList .chartDiffName{font-size:clamp(7px,.8vw,15px)!important}
#songSelect #chartList .chartLevelLabel,#songSelect #chartList .chartDiffSub{display:none}
#songSelect .songListPane{border:0!important;padding:0!important;min-height:0;display:flex;flex-direction:column}
#songSelect .songToolbar{display:flex;align-items:center;gap:5px;margin:0 0 6px;min-width:0}
#songSelect .songToolbar :is(input,select){background:#101b34;color:#ebf1ff;border:1px solid #775ab1;border-radius:6px;min-width:0;padding:8px;font:inherit}
#songSelect .songToolbar input{flex:1;padding:8px!important}
#songSelect .songCount{display:none}
#songSelect #songGrid{min-height:0;max-height:none;flex:1;overflow:auto;scrollbar-color:#ea79ef #13152d}
#songSelect .songCard{min-height:clamp(45px,6.9vh,83px);height:auto;grid-template-columns:clamp(40px,4.3vw,74px) minmax(0,1fr) auto;padding:4px 9px;gap:8px;margin-bottom:4px}
#songSelect .songCard img{width:100%;height:clamp(36px,5.8vh,69px)}
#songSelect .songCardInfo b{font-size:clamp(12px,1.25vw,23px)}
#songSelect .songCardInfo span{font-size:clamp(10px,.9vw,17px)}
#songSelect .songBadge{font-size:clamp(9px,.8vw,15px)}
.trackDock168{grid-column:1/-1;display:grid;grid-template-columns:2.08fr 1fr 1.03fr;gap:1vw;min-height:0}
.trackDock168>*{margin:0!important;padding:clamp(6px,1vw,16px)!important;min-width:0;overflow:auto}
.trackDock168 .trackEquipment168{display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap}
.trackEquipment168>strong{width:100%;color:#eebdff;font:italic 900 clamp(12px,1.25vw,23px)/1 system-ui}
.trackEquipment168 .detailSectionTitle{display:none}
.trackEquipment168 .shellDisclosure,.trackEquipment168>.detailSection{margin:0!important;border:0}
.trackEquipment168 .shellDisclosure>summary{background:#181d39;border:1px solid #855bce;border-radius:6px;padding:6px!important}
.trackEquipment168 .shellDisclosure .skinChoice{width:clamp(43px,4.1vw,70px)}
.trackEquipment168 .gearArtworkTile,.trackEquipment168 .classicGearTile{max-width:32px;max-height:32px}
.trackEquipment168 .playModeRow button{padding:7px}
.trackLaunch168{display:grid;align-content:center}
#songSelect .trackLaunch168 #libraryStart{position:static!important;margin:0!important;min-height:58px;font:italic 900 clamp(18px,2.7vw,51px)/1 system-ui!important;background:linear-gradient(110deg,#62248f,#ab1e88)!important;box-shadow:inset 0 0 0 2px #ffbaf8,inset 0 0 22px #fa5fe8!important}
.trackLaunch168 .libraryState{font-size:11px;margin-top:5px;text-align:center}
#songSelect .rankingPane[hidden]{display:none!important}
#songSelect#songSelect .rankingPane:not([hidden]){position:absolute;inset:4px 0 auto auto;z-index:8;width:min(520px,90vw);height:min(62vh,600px);background:#130f2c;border:1px solid #f696ff!important;box-shadow:0 10px 40px #000b}
#result#result:not(:has(.matchFinalView.show)) .resultCard{width:min(1450px,94vw)!important;max-width:none!important;gap:12px 30px!important}
#result#result:not(:has(.matchFinalView.show)) .resultHero,#result#result:not(:has(.matchFinalView.show)) .resultData{grid-row:2}
#result .resultTrackHeader{padding-bottom:8px}
#result#result .resultScoreBox:first-of-type b{font:italic 900 clamp(45px,6vw,110px)/1 system-ui!important}
#result#result .resultJudges{grid-template-columns:1fr;border:1px solid #905cdc;border-radius:10px;padding:4px 12px}
#result#result .resultJudge{display:flex;justify-content:space-between;align-items:center;padding:3px 10px!important;border-radius:0!important}
#result#result .resultJudge span{font:italic 850 clamp(11px,1.25vw,21px)/1 system-ui}
#result#result .resultJudge b{font-size:clamp(13px,1.5vw,26px)}
#game .arcGameTrack167,#game .arcGameHud167{width:min(23vw,380px)}
#game .arcGameInfo167,#game .arcGameHud167{border-color:#ce87ff;box-shadow:inset 0 0 16px #ae55ff42,0 0 14px #844bee5e}
#game .arcGameInfo167 strong{font-size:clamp(14px,1.95vw,33px)}
#game .arcLiveScore167{font-size:clamp(24px,3.4vw,61px)}
#game .arcJudge167{font-size:clamp(12px,1.25vw,22px)}
#soloGear .comboBox::before{content:'— COMBO —';font:italic 900 clamp(11px,1.2vw,21px)/1 system-ui;color:#f0d5ff}
#soloGear #combo{font:italic 900 clamp(33px,5vw,92px)/1 system-ui;color:#fff1ff;text-shadow:0 0 13px #b83cff}
@media(max-width:900px){
 #modeSelect .modeWrap{width:92vw}#modeSelect .arcNav167{gap:4px}
 #songSelect#songSelect.hasRanking .selectBody{display:flex!important;overflow:auto;flex-direction:column;height:auto}
 .trackRail168{flex-direction:row;order:0}.trackRail168 button{justify-content:center}
 #songSelect .trackHero{order:1;min-height:220px}
 #songSelect .songListPane{order:2;min-height:240px;max-height:42vh}
 .trackDock168{order:3;grid-template-columns:1fr 1fr}.trackEquipment168{grid-column:1/-1}
 #songSelect .selectHeader>.arcBrand167{width:85px}.trackNav168{gap:2px}
 #result#result:not(:has(.matchFinalView.show)) .resultHero,#result#result:not(:has(.matchFinalView.show)) .resultData{grid-row:auto}
}
@media(max-width:600px){
 #modeSelect.show{padding-top:140px}#modeSelect .modeHeading{margin-bottom:12px}
 #modeSelect .modeCards{gap:10px}#modeSelect .mainModeCard{height:auto;min-height:170px}
 #modeSelect .modeCardContent{gap:7px}
 .trackNav168 button{font-size:9px;padding:5px}.trackRail168 button{font-size:9px;padding:4px}
 #songSelect .trackHero{min-height:155px}
 #songSelect .trackHeroKicker{display:none}
 #songSelect .songToolbar{flex-wrap:wrap}
}
#songSelect,#modeSelect{
 background:
 linear-gradient(132deg,transparent 10%,#38bff538 10.15%,transparent 10.7% 81%,#f446e657 81.4%,transparent 82%),
 repeating-linear-gradient(110deg,transparent 0 11vw,#6331b220 11vw 12vw,transparent 12.1vw 25vw),
 radial-gradient(ellipse at 87% 90%,#451366,transparent 52%),
 radial-gradient(ellipse at 12% 85%,#12264d,transparent 48%),#070918;
}
#songSelect::after,#modeSelect::after{height:20%;background:linear-gradient(#0b0b1b00,#100d2e),repeating-linear-gradient(0deg,#9c4af04d 0 1px,transparent 1px 21px),repeating-linear-gradient(104deg,transparent 0 7vw,#2569a767 7.1vw,transparent 7.25vw 11vw);box-shadow:0 -2px 12px #b342e864}
#songSelect .songCard.active{border-color:#ffd0fb;box-shadow:inset 0 0 0 1px #f47aff,inset 0 0 16px #f22ed577,0 0 7px #e338df99}
#songSelect .trackHeroKicker strong{padding:.38em .75em;border:1px solid #ff84ed;border-radius:5px;background:#592056;box-shadow:0 0 9px #f73cdd85}
#songSelect .trackHero .detailJacket{border:1px solid #ee98ff;box-shadow:0 0 18px #a348e156}
.trackLaunch168{background:linear-gradient(130deg,#0b142b,#31123d) padding-box,var(--frame168) border-box!important}
.trackDock168 .trackSpeed168>.detailSectionTitle{font:italic 900 clamp(12px,1.3vw,25px)/1 system-ui;color:#f4d4ff;margin-bottom:10px}
#modeSelect .mainModeCard{background:radial-gradient(ellipse at bottom right,var(--card-dark),transparent 62%),linear-gradient(148deg,#0e1129,#171333)!important}
#songSelect .trackHeroKicker{display:flex!important}
#songSelect #chartList .chartLevelWrap{display:block!important;text-align:center}
#songSelect #chartList .chartButton{display:flex;align-items:center;justify-content:center;gap:5px}
#songSelect #chartList .chartLevel{font-size:clamp(12px,1.4vw,25px)}
#songSelect .chartButton:not(:disabled) .chartLevel::before{content:'★ ';font-size:.8em}
#songSelect.hasRanking .trackHero .detailJacket{height:auto!important;aspect-ratio:1;align-self:center;object-fit:cover}
#songSelect .songCard{min-height:clamp(40px,6.1vh,74px)!important}
#songSelect .songCard img{height:clamp(33px,5vh,60px)}
#songSelect .songListPane .songCard{margin:0 0 2px}
#songSelect .trackHero,.trackRail168,.trackDock168>section,.trackDock168>.songDetail,.trackDock168>.detailSection{
 border-radius:0;clip-path:var(--arc-cut);box-shadow:inset 0 0 16px #824fc84f
}
.trackPresets168{display:flex;justify-content:center;gap:4px;margin-top:8px}
.trackPresets168 button{min-width:0;flex:1;padding:4px 2px;border:1px solid #7d8bd6;border-radius:5px;background:#161d38;color:#eff4ff;cursor:pointer}
.trackPresets168 button:hover,.trackPresets168 button:focus-visible{border-color:#8fe9ff;background:#253571}
#soloGear .comboLabel{display:none!important}
#result#result .resultScoreBox:has(#finalScore) b{font:italic 900 clamp(46px,6vw,110px)/1 system-ui!important}
@media(max-width:600px){#songSelect .trackHeroKicker strong{font-size:8px}}
#game:not(.arcBattle167) .vignette{
 background:linear-gradient(90deg,#0d08237d,transparent 39% 61%,#12092885),
 linear-gradient(155deg,transparent 22%,#8350ff3b 22.2%,transparent 22.7% 80%,#fa49e855 80.2%,transparent 80.8%),
 linear-gradient(0deg,#170c38c0,transparent 28%);
}
#soloStage::after{
 content:'';position:absolute;inset:auto 0 0;height:12%;pointer-events:none;
 background:repeating-linear-gradient(0deg,#ab68ef29 0 1px,transparent 1px 18px);
}
#soloGear{z-index:1}
#result#result:not(:has(.matchFinalView.show)) .resultData{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px
}
#result#result .resultData>*{grid-column:1/-1}
#result#result .resultScoreBox:has(#finalScore){
 display:flex!important;flex-direction:column;align-items:center;padding:8px!important;
 border:1px solid #9969d4!important;background:#1d1035!important;border-radius:8px
}
#result#result .resultScoreBox:has(#accuracy),#result#result .arcResultCombo167{
 grid-row:3;grid-column:2;display:flex!important;justify-content:space-between;align-items:center;
 padding:8px!important;margin:0!important;border:1px solid #875dbd!important;border-radius:8px;background:#15112b!important
}
#result#result .arcResultCombo167{grid-column:1}
#result#result #accuracy{font:italic 900 clamp(18px,2.8vw,50px)/1 system-ui!important}
#result#result .arcResultCombo167 b{font-size:clamp(18px,2.8vw,50px)}
#result#result .resultJudge{display:grid;grid-template-columns:minmax(0,1fr) minmax(40px,auto) minmax(70px,18%);text-align:right;gap:8px}
#result#result .resultJudge span{text-align:left}
#result#result .resultJudge small{color:#e4ceff;font-size:clamp(10px,1.2vw,19px)}
#result#result:not(:has(.matchFinalView.show)) .resultHero::after{
 content:'RANK';position:absolute;top:4%;font:italic 900 clamp(15px,2vw,32px)/1 system-ui;color:#f3dbff
}
