/* Junior Varsity arena. --u = one prefab pixel of the 720×1280 design. */
.arena-view{container-type:inline-size;--u:calc(100cqw / 720);position:relative;background:#6d88b5;overflow:hidden;color:#4a3a2e}
.arena-view[hidden]{display:none}
.ar-stage{position:relative;height:calc(1280 * var(--u));overflow:hidden}.ar-stage>*{position:absolute}
.ar-bg{object-fit:cover;pointer-events:none}
.ar-back,.ar-icon-btn{border:0;background:none;padding:0;cursor:pointer;z-index:3}.ar-back img,.ar-icon-btn img{width:100%;height:100%;object-fit:contain}
.ar-title{object-fit:contain}
.ar-ddl{text-align:center;font-size:calc(20 * var(--u));color:#fff;text-shadow:0 0 3px #1c3a6e,0 0 3px #1c3a6e}.ar-ddl b{color:#b8ff9a}
.ar-rank{box-sizing:border-box;border-style:solid;border-width:calc(30 * var(--u));border-image-slice:30 fill;padding:calc(4 * var(--u))}
.ar-rank-list{height:100%;overflow:auto;display:grid;align-content:start;gap:calc(8 * var(--u))}
.ar-row{display:grid;grid-template-columns:calc(70 * var(--u)) calc(64 * var(--u)) 1fr auto;align-items:center;gap:calc(10 * var(--u));background:#fff9;border-radius:calc(14 * var(--u));padding:calc(6 * var(--u)) calc(16 * var(--u));font-size:calc(22 * var(--u))}
.ar-row.me{background:#ffe9a8}.ar-rk{text-align:center;font-weight:bold;font-size:calc(28 * var(--u))}.ar-rk img{width:calc(60 * var(--u))}
.ar-av{width:calc(60 * var(--u));height:calc(60 * var(--u));object-fit:contain;border-radius:calc(10 * var(--u))}.ar-av.empty{display:grid;place-items:center;background:#ccd}
.ar-name{display:grid}.ar-name b{font-size:calc(24 * var(--u))}.ar-name small{font-size:calc(18 * var(--u));color:#7a6a5a}.ar-pts{font-weight:bold;font-size:calc(26 * var(--u));color:#c46a1a}
.ar-detail{background:linear-gradient(#fffaf0,#f3e1c4);border-radius:calc(20 * var(--u));box-shadow:0 calc(4 * var(--u)) calc(10 * var(--u)) #0004}
.ar-me-icon{display:grid;place-items:center;overflow:hidden;border-radius:calc(14 * var(--u))}.ar-me-icon .portrait{width:100%!important;height:100%!important}
.ar-power{display:grid;justify-items:center;font-size:calc(20 * var(--u))}.ar-power img{width:calc(44 * var(--u))}
.ar-stat{display:flex;justify-content:space-between;font-size:calc(22 * var(--u));border-bottom:1px dotted #b59c7a}.ar-stat b{color:#c46a1a}
.ar-deco{object-fit:contain;pointer-events:none}
.ar-res{display:flex;align-items:center;justify-content:center;gap:calc(6 * var(--u));font-size:calc(20 * var(--u));background:#0002;border-radius:calc(18 * var(--u))}.ar-res img{width:calc(32 * var(--u))}
.ar-plus{border:0;border-radius:50%;width:calc(28 * var(--u));height:calc(28 * var(--u));background:#5aa0e8;color:#fff;font-weight:bold;cursor:pointer;padding:0}
.ar-fight{border:0;background:center/100% 100% no-repeat;color:#fff;font-weight:bold;font-size:calc(34 * var(--u));text-shadow:0 2px 2px #1d4f8a;cursor:pointer}
.ar-side{border:0;background:center/100% 100% no-repeat;display:flex;align-items:center;gap:calc(8 * var(--u));padding-left:calc(14 * var(--u));font-size:calc(22 * var(--u));color:#6b5a48;font-weight:bold;cursor:pointer}.ar-side img{width:calc(44 * var(--u))}
.ar-note{margin:0;display:grid;place-items:center;background:#000a;color:#ffe08a;border-radius:calc(14 * var(--u));font-weight:bold;font-size:calc(24 * var(--u));z-index:4}
.ar-overlay{inset:0;background:#0008;z-index:10;display:grid;place-items:center}
.ar-win{position:relative;width:calc(640 * var(--u));max-height:calc(1000 * var(--u));overflow:auto;background:#fffaf0;border-radius:calc(22 * var(--u));padding:calc(20 * var(--u));display:grid;gap:calc(10 * var(--u));font-size:calc(22 * var(--u))}
.ar-win h2{margin:0;text-align:center;font-size:calc(32 * var(--u))}.ar-win h3{margin:calc(6 * var(--u)) 0 0;font-size:calc(24 * var(--u))}
.ar-close{position:absolute;right:calc(14 * var(--u));top:calc(10 * var(--u));border:0;background:none;font-size:calc(32 * var(--u));cursor:pointer}
.ar-small{justify-self:center;border:0;border-radius:calc(14 * var(--u));background:#5aa0e8;color:#fff;font-weight:bold;padding:calc(8 * var(--u)) calc(24 * var(--u));font-size:calc(22 * var(--u));cursor:pointer}.ar-small:disabled{background:#bbb}
.ar-enemy{display:grid;grid-template-columns:auto 1fr auto auto;gap:calc(12 * var(--u));align-items:center;background:#fff;border:2px solid #ead7b8;border-radius:calc(16 * var(--u));padding:calc(10 * var(--u))}
.ar-escore{display:grid;justify-items:center}.ar-escore b{color:#c46a1a;font-size:calc(26 * var(--u))}
.ar-go{border:0;background:center/100% 100% no-repeat;width:calc(150 * var(--u));height:calc(62 * var(--u));display:flex;align-items:center;justify-content:center;gap:calc(4 * var(--u));color:#fff;font-weight:bold;cursor:pointer}.ar-go img{width:calc(28 * var(--u))}
.ar-rec{display:grid;grid-template-columns:auto 1fr auto;gap:calc(4 * var(--u)) calc(12 * var(--u));background:#fff;border-radius:calc(12 * var(--u));padding:calc(8 * var(--u)) calc(14 * var(--u))}.ar-rec small{grid-column:1/-1;color:#998}.ar-rec.win b{color:#2f9e44}.ar-rec.lose b{color:#c0392b}
.ar-awards{display:flex;gap:calc(10 * var(--u));justify-content:center}.ar-award{position:relative;width:calc(80 * var(--u));height:calc(80 * var(--u));background:#f1e6d2;border-radius:calc(12 * var(--u))}.ar-award img{width:100%;height:100%;object-fit:contain}.ar-award b{position:absolute;right:calc(4 * var(--u));bottom:0;color:#fff;text-shadow:0 0 3px #000,0 0 3px #000}
.ar-empty{text-align:center;color:#8a7a6a;margin:0}
/* ArenaWindowItem rows (656×103), WindowTop, bottom nav and ArenaFormationWindow — shared by Junior Varsity and Varsity */
.ar-row2{position:relative;flex:none;width:calc(656 * var(--u));height:calc(103 * var(--u));margin:0 auto calc(6 * var(--u));box-sizing:border-box;border:calc(18 * var(--u)) solid transparent;border-image-slice:20 fill;border-image-width:calc(18 * var(--u));border-image-repeat:stretch}
.ar-row2>*{position:absolute;margin:calc(-18 * var(--u))}
.ar2-rk{object-fit:contain}.ar2-num{display:flex;align-items:center;justify-content:center;font-size:calc(30 * var(--u));color:#5a4e6e}
.ar2-icon{border:0;padding:0;background:none;cursor:pointer;border-radius:calc(10 * var(--u));overflow:hidden}.ar2-icon .ar2-av,.ar2-icon .portrait{width:100%!important;height:100%!important;object-fit:cover;display:block}
.ar2-lv{position:absolute;left:0;bottom:0;min-width:calc(26 * var(--u));padding:0 calc(3 * var(--u));background:#000a;color:#fff;font-size:calc(15 * var(--u));border-top-right-radius:calc(8 * var(--u));text-align:center}
.ar2-name{font-size:calc(22 * var(--u));color:#4b4a6e;white-space:nowrap;max-width:calc(260 * var(--u));overflow:hidden;text-overflow:ellipsis}
.ar2-power{display:flex;align-items:center;gap:calc(4 * var(--u));color:#d88d2c;font-size:calc(21 * var(--u))}.ar2-power img{width:calc(34 * var(--u))}
.ar2-server{display:flex;align-items:center;justify-content:center;gap:calc(8 * var(--u));background:center/100% 100% no-repeat;color:#4f7fb6;font-size:calc(17 * var(--u))}.ar2-server img{width:calc(26 * var(--u))}
.ar2-plabel{text-align:center;font-size:calc(15 * var(--u));color:#8a7e9a}.ar2-points{text-align:center;font-size:calc(28 * var(--u));color:#2f8fd8}
.ar-row2.me{filter:drop-shadow(0 0 calc(4 * var(--u)) #ffb400)}
.ar-top{display:flex;align-items:center;justify-content:center;gap:calc(16 * var(--u));z-index:6}
.ar-top-res{display:flex;align-items:center;gap:calc(8 * var(--u));min-width:calc(230 * var(--u));height:calc(44 * var(--u));padding:0 calc(14 * var(--u)) 0 calc(4 * var(--u));background:#fffffff0;border:calc(2 * var(--u)) solid #b9c8e3;border-radius:calc(24 * var(--u));box-sizing:border-box}
.ar-top-res img{width:calc(40 * var(--u))}.ar-top-res b{flex:1;text-align:center;font-size:calc(22 * var(--u));color:#43506e}
.ar-top-back{border:0;background:none;padding:0;width:calc(80 * var(--u));cursor:pointer}.ar-top-back img{width:100%}
.ar-stage .ar-nav{position:absolute!important;left:0;right:0;bottom:0;z-index:6}
.ar-inspect{max-width:92%}.ar-ins-head{display:flex;align-items:center;gap:12px;padding-right:30px}.ar-ins-head .ar2-icon{position:relative;width:64px;height:64px;flex:none}
.ar-ins-head div{display:grid}.ar-ins-head b{font-size:18px;color:#4b4a6e}.ar-ins-head small{color:#8a7e9a}
.ar-ins-def{display:flex;align-items:center;justify-content:space-between;margin:10px 0 6px;padding:6px 10px;background:#eef2fb;border-radius:8px}.ar-ins-def .ar2-power{font-size:16px}.ar-ins-def .ar2-power img{width:24px}
.ar-ins-team{display:flex;align-items:center;gap:6px;margin:6px 0}.ar-ins-n{width:18px;color:#5d6db0}
.ar-ins-slot{position:relative;width:56px;height:56px;border-radius:8px;background:#e7ecf6;overflow:hidden}.ar-ins-slot .portrait{width:100%!important;height:100%!important}
.ar-ins-slot small{position:absolute;left:0;bottom:0;background:#000a;color:#fff;font-size:10px;padding:0 3px;border-top-right-radius:6px}
.ar-row2{border-image-slice:30 19 fill;width:min(calc(656 * var(--u)),100%)}
.ar-rank-list{overflow-x:hidden}
.ar-rank-list{scrollbar-width:none}.ar-rank-list::-webkit-scrollbar{display:none}