.roster-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8cqw}.roster-card{position:relative;height:10cqw;min-height:66px;background:radial-gradient(ellipse at top,#154362,#04182e);border:1px solid #3b7595;text-align:left;overflow:hidden}.roster-card.selected{border:2px solid var(--accent);box-shadow:0 0 1cqw #2fd0ff40}.roster-art{position:absolute;inset:0;background-repeat:no-repeat;background-size:100%;background-position:center 0}.roster-label{position:absolute;inset:auto 0 0;padding:1cqw .7cqw .5cqw;background:linear-gradient(transparent,#03142be8 35%);display:flex;align-items:baseline;gap:.7cqw}.roster-label b{font-size:1.5cqw;color:#fff}.roster-label small{font-size:.75cqw;color:var(--accent)}.roster-number{position:absolute;top:.3cqw;right:.4cqw;font-size:1.1cqw;font-weight:900;color:var(--accent);text-shadow:0 1px #03142b}#character-profile{padding:1cqw 1.2cqw;background:#041b35;margin-top:1cqw;border-left:3px solid #35c2ef}.profile-head{display:flex;align-items:center;gap:1cqw}.profile-head b{font-size:1.6cqw}.profile-head span{font-size:.8cqw;color:#9dc9e0}.profile-head i{margin-left:auto;font-size:.85cqw;color:#ffcc68}#character-profile p{font-size:.85cqw;margin:.5cqw 0}.profile-skill{display:flex;gap:.8cqw;font-size:.9cqw;align-items:center}.profile-skill strong{color:#ffcd64;white-space:nowrap}.profile-skill span{color:#c4e0ef}.profile-bars{display:flex;gap:2cqw;font-size:.8cqw;color:#64cee9;margin-top:.55cqw}.opponent-label{display:flex;align-items:center;gap:1.2cqw}.opponent-label select{background:#041a33;border:1px solid #37779b;color:#e4f5ff;padding:.7cqw 1cqw;font:inherit;flex:1}.volume-row{display:flex;gap:2cqw;margin-top:1cqw}.volume-row label{display:flex;align-items:center;gap:.7cqw;flex:1;white-space:nowrap;font-size:.9cqw!important}.volume-row input{width:100%;accent-color:#20c4ed}.credits-button{background:none;color:#86d9fa;font-size:.85cqw;padding:.5cqw 0;margin-top:.5cqw;text-decoration:underline}.training-energy{position:absolute;left:2%;top:24%;background:#052746d9;border:1px solid #46bfe6;padding:.45cqw .75cqw;color:#a5ecff;font-size:.85cqw;z-index:2}.receive-control{width:9.3cqw!important;height:9.3cqw!important;border-color:#80edff!important}.receive-control span{font-size:1.65cqw!important}.dash-control{width:6.8cqw!important;height:6.8cqw!important}.action-controls{gap:1.4cqw}.action-controls .hit-control{margin-bottom:.2cqw}.action-controls button.hit-control span{font-size:1.65cqw!important}#court{position:absolute;inset:0}#court canvas{display:block!important;width:100%!important;height:100%!important;margin:0!important;touch-action:none}#music-unlock{position:absolute;bottom:6.2%;left:5%;font-size:.82cqw;letter-spacing:.06em;color:#a5d8ef}.playing .utility{display:none}.cinematic.ayo .cinematic-title{display:block;bottom:8%;left:3%;padding:.3cqw 1cqw;background:#03162ceb;max-width:48%}.cinematic.ayo .cinematic-title strong{font-size:4.8cqw;color:#ffdc4a}.modal-panel:has(.roster-grid){padding:1.5cqw 2cqw;width:85%}.modal-panel:has(.roster-grid) h2{font-size:2.1cqw;margin:.3cqw 0 1cqw}.modal-panel:has(.roster-grid) .slash-button{margin-top:1cqw;min-height:3.2cqw}.modal-panel:has(.volume-row) .settings-row{padding:.6cqw 0}.modal-panel:has(.volume-row) h2{margin-bottom:.6cqw}.hero-tag>b{max-width:10cqw}.rin-menu-hero{background-size:contain!important}
@media(pointer:coarse){.roster-label b{font-size:1.9cqw}.roster-label small{font-size:.95cqw}.profile-head span,.profile-head i,#character-profile p,.profile-bars{font-size:1.05cqw}.profile-skill{font-size:1.1cqw}.training-energy{font-size:1.1cqw;min-height:28px}.receive-control{width:10cqw!important;height:10cqw!important}.volume-row label{font-size:1.1cqw!important}.opponent-label select{min-height:32px}.action-controls .dash-control{width:7.8cqw!important;height:7.8cqw!important}#music-unlock{font-size:1cqw}.modal-panel:has(.roster-grid){width:90%;padding:1.2cqw 2cqw}.roster-card{height:9cqw;min-height:50px}.profile-head i{display:none}}
.cinematic.ayo .cinematic-title{display:none}.music-track-row{margin:.8cqw 0;font-size:1cqw;display:flex;align-items:center;gap:1cqw}.music-track-row select{font:inherit;background:#062345;border:1px solid #3c789d;color:#dcf2ff;padding:.4cqw;flex:1}
.perfect-feedback{position:absolute;z-index:5;left:19%;top:21%;width:23cqw;pointer-events:none;transform:rotate(-6deg);animation:perfect-pop .24s ease-out}.perfect-feedback.rival{left:auto;right:19%}.perfect-feedback>img{display:block;width:100%;filter:drop-shadow(0 .2cqw .25cqw #001b3c)}#perfect-chain{display:flex;align-items:center;justify-content:center;gap:.4cqw;margin-top:-1.4cqw}#perfect-chain img{width:70%;height:auto}#perfect-chain-count{font:italic 900 3.6cqw Impact,'Arial Black',sans-serif;color:#fff4a0;-webkit-text-stroke:.09cqw #182443;text-shadow:.15cqw .2cqw #07233b;white-space:nowrap}@keyframes perfect-pop{from{transform:rotate(-8deg) scale(1.25);opacity:.35}to{transform:rotate(-6deg) scale(1);opacity:1}}
#cinematic-art .skill-image:not(.hidden){animation:skill-pan .5s ease-out both}.cinematic:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 3cqw var(--skill-color,#50ddff);border-block:.2cqw solid var(--skill-color,#50ddff);opacity:.7}.cinematic-score,.cinematic-title{z-index:1}@keyframes skill-pan{from{transform:scale(1.04) translateX(-.5%)}to{transform:scale(1)}}
#loading{background:radial-gradient(ellipse at 75% 30%,#123e64,#031126 75%)}.loading-panel{width:62%;padding:3cqw;text-align:center;border:1px solid #287da8;background:linear-gradient(135deg,#092b49e8,#03162cec);box-shadow:0 1cqw 5cqw #0005}.loading-panel .load-track{width:100%;height:.7cqw;margin:2cqw 0 1cqw}.loading-panel .load-mark{font-size:5cqw}.loading-panel #load-count{display:block;color:#83e7ff;font-size:1.3cqw;font-variant-numeric:tabular-nums}.loading-panel #load-status{display:block;min-height:2em;font-size:1cqw;margin-top:.8cqw;color:#d2eaf9}.load-tip{font-size:.9cqw;color:#8caec7;margin-top:1.4cqw}#load-actions{display:flex;gap:1cqw;justify-content:center;margin-top:1cqw}#load-actions button,.playlist-row button{padding:.65cqw 1.3cqw;background:#07537c;border:1px solid #50d9f9;color:#fff;font:inherit}#cinematic-art{position:absolute;inset:0}.skill-image{position:absolute;inset:0;object-fit:cover}.playlist-row{display:flex;align-items:center;justify-content:space-between;gap:1cqw;font-size:1cqw;margin:1cqw 0}.playlist-row b{color:#84e5fa;margin-left:.8cqw}.playlist-row button{font-size:.9cqw}
@media(pointer:coarse){.loading-panel{width:80%}.loading-panel #load-status,.load-tip,.playlist-row,.playlist-row button{font-size:11px}.loading-panel #load-count{font-size:13px}#load-actions button{min-height:36px;font-size:12px}.playlist-row button{min-height:32px}}
.roster-card{height:auto;min-height:0;padding:0;display:flex;flex-direction:column;border:1px solid #3b7595;background:#071d34}
.roster-card.selected{border-width:1px;box-shadow:inset 0 0 0 1px var(--accent),0 0 .8cqw #2fd0ff26}
.roster-card:focus-visible{outline:2px solid #f4dd8c;outline-offset:3px}
.roster-card[hidden]{display:none}.roster-pages{display:flex;align-items:center;gap:.7cqw;margin:0 0 .7cqw}.roster-pages button{background:#07223c;border:1px solid #386880;color:#b1d6e8;padding:.5cqw 1cqw;font:inherit;font-size:.9cqw;min-height:30px}.roster-pages button.selected{color:#e8fbff;border-color:#6ae6ff;background:#10516c}.roster-pages span{margin-left:auto;color:#8fbdcf;font-size:.85cqw}.roster-pages button:focus-visible{outline:2px solid #ffdb7d;outline-offset:2px}@media(pointer:coarse){.roster-pages button{font-size:11px}.roster-pages span{font-size:11px}}
.roster-art{position:relative;inset:auto;width:100%;aspect-ratio:2.1;overflow:hidden;background:radial-gradient(ellipse at 50% 25%,#194460,#082038 75%)}
.roster-portrait{position:absolute;left:50%;top:36%;width:var(--portrait-scale);height:auto;max-width:none;transform:translate(calc(0% - var(--face-x)),calc(0% - var(--eye-y)));pointer-events:none}
.roster-label{position:relative;inset:auto;min-height:2.6cqw;padding:.5cqw .75cqw;display:flex;align-items:center;gap:.65cqw;background:#04182c;border-top:1px solid #27516b;line-height:1.3}
.roster-label b{font-size:1.4cqw;white-space:nowrap}.roster-label small{font-size:.8cqw;white-space:nowrap}
.roster-number,.roster-check{position:absolute;top:.45cqw;z-index:1;line-height:1.2;background:#031a30db;padding:.2cqw .35cqw;border-radius:2px}
.roster-number{right:.45cqw;font-variant-numeric:tabular-nums;font-size:1cqw}
.roster-check{left:.45cqw;color:#f3faff;font-size:.7cqw;visibility:hidden}.selected .roster-check{visibility:visible}
@media(pointer:coarse){.roster-card{height:auto;min-height:0}.roster-art{aspect-ratio:2.6}.roster-portrait{top:42%}.roster-label{min-height:24px;padding:3px 6px;gap:6px}.roster-number{font-size:11px}.roster-check{font-size:9px}}
@media(pointer:coarse){
 .modal-panel p,.settings-row small,.tutorial-card p,.profile-skill,#character-profile p{font-size:max(11px,1.2cqw);line-height:1.55}
 .settings-row label,.modal-panel label{font-size:max(12px,1.5cqw)}
 .profile-head span,.profile-bars,.roster-label small{font-size:max(10px,1.05cqw)}
 .profile-head b,.roster-label b{font-size:max(14px,1.9cqw)}
 .profile-skill{align-items:flex-start}.profile-head{flex-wrap:wrap}.profile-bars{gap:1.3cqw;flex-wrap:wrap}
 .volume-row{gap:12px;flex-wrap:wrap}.volume-row label{font-size:11px!important;min-width:160px}
 .music-track-row,.credits-button{font-size:11px}.music-track-row select{min-height:32px}
 .modal-panel:has(.volume-row){width:84%}.modal-panel:has(.volume-row) .settings-row{padding:7px 0}
 .rival-info .icon-button{min-width:40px;min-height:40px}.match-hint{font-size:max(10px,1.1cqw)}
 .training-energy,#music-unlock{font-size:max(10px,1.1cqw)}.profile-skill strong{min-width:5em}
 .menu-sub button,.modal-panel .slash-button{min-height:32px}
 #confirm-character{position:sticky;bottom:0;z-index:2;box-shadow:0 -5px 12px #04182c}
}