:root{font-family:Inter,ui-rounded,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f8fafc;background:#07111f;--panel: rgba(15, 23, 42, .94);--panel-2: rgba(17, 27, 48, .92);--line: rgba(148, 163, 184, .18);--muted: rgba(226, 232, 240, .62);--accent: #facc15;--gap: clamp(4px, .7vmin, 10px)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;min-width:0;min-height:0;background:radial-gradient(circle at 14% 10%,rgba(59,130,246,.18),transparent 31%),radial-gradient(circle at 88% 90%,rgba(168,85,247,.14),transparent 32%),#07111f}body{width:100dvw;height:100dvh;overflow:hidden;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button{font:inherit}.rotate-notice{display:none}.app-shell{width:100%;height:100dvh;min-width:0;min-height:0;margin:0;padding:max(5px,env(safe-area-inset-top)) max(5px,env(safe-area-inset-right)) max(5px,env(safe-area-inset-bottom)) max(5px,env(safe-area-inset-left));display:grid;grid-template-rows:auto minmax(0,1fr);gap:var(--gap);overflow:hidden}.match-bar{height:clamp(46px,8dvh,66px);min-height:0;display:grid;grid-template-columns:minmax(130px,1fr) auto minmax(100px,1fr);align-items:center;gap:var(--gap);padding:clamp(5px,.8vmin,9px) clamp(7px,1vmin,12px);background:#080f1cd1;border:1px solid var(--line);border-radius:clamp(11px,1.6vmin,18px);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);overflow:hidden}.brand{min-width:0;display:flex;align-items:baseline;gap:6px;white-space:nowrap}.brand strong{font-size:clamp(.95rem,2.1vmin,1.4rem)}.eyebrow{font-size:clamp(.48rem,1vmin,.62rem);letter-spacing:.18em;opacity:.6}.version{font-size:clamp(.52rem,1.05vmin,.68rem);opacity:.45}.match-center{display:flex;gap:clamp(4px,.7vmin,8px)}.rank-pill,.timer-pill,.score-pill{min-width:clamp(58px,7vw,90px);height:clamp(34px,5.8dvh,48px);display:grid;place-items:center;align-content:center;padding:3px 7px;border-radius:clamp(9px,1.2vmin,13px);background:#1e293be0;border:1px solid var(--line)}.rank-pill span,.timer-pill span,.score-pill span{font-size:clamp(.46rem,.9vmin,.58rem);letter-spacing:.12em;opacity:.58}.rank-pill strong,.timer-pill strong,.score-pill strong{font-size:clamp(.92rem,2.1vmin,1.25rem);line-height:1}.status{justify-self:end;min-width:0;display:inline-flex;align-items:center;gap:7px;font-size:clamp(.58rem,1.15vmin,.76rem);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dot{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:#64748b}.dot.online{background:#22c55e;box-shadow:0 0 0 3px #22c55e1f}.play-layout{min-width:0;min-height:0;height:100%;display:grid;grid-template-columns:clamp(112px,13vw,190px) minmax(0,1fr) clamp(205px,21vw,315px);gap:var(--gap);overflow:hidden}.players-rail,.arena-panel,.action-panel{min-width:0;min-height:0;height:100%;overflow:hidden}.players-rail{display:grid;grid-template-rows:auto repeat(5,minmax(0,1fr));gap:clamp(3px,.55vmin,7px)}.rail-title{min-height:13px;padding:0 4px;font-size:clamp(.48rem,.92vmin,.62rem);letter-spacing:.16em;line-height:1.2;color:var(--muted)}.mini-player{min-width:0;min-height:0;overflow:hidden;padding:clamp(3px,.5vmin,6px);display:grid;grid-template-columns:minmax(35px,43%) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:clamp(3px,.5vmin,6px);align-items:stretch;color:inherit;text-align:left;border:1px solid var(--line);border-radius:clamp(8px,1.2vmin,13px);background:#0f172adb;cursor:pointer;transition:transform .1s ease,border-color .1s ease,background .1s ease}.mini-player:hover,.mini-player:active{border-color:#facc157a;background:#1e293bf5}.mini-player:active{transform:scale(.985)}.mini-meta{min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px;overflow:hidden;font-size:clamp(.48rem,1.05vmin,.66rem)}.mini-meta b{width:clamp(17px,2.6vmin,22px);height:clamp(17px,2.6vmin,22px);flex:0 0 auto;border-radius:6px;display:grid;place-items:center;background:#facc1521;color:#fde68a}.mini-meta span,.mini-meta em{display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-meta em{font-style:normal;color:var(--muted);font-size:.9em}.mini-board,.overlay-board{display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr);gap:1px;overflow:hidden;background:#020617e6;border-radius:clamp(4px,.75vmin,7px);padding:2px}.mini-board{height:100%;width:auto;max-width:100%;aspect-ratio:1 / 1;justify-self:end;align-self:center}.mini-cell,.overlay-cell{border-radius:1.5px;background:#5e6979}.mini-cell.blue,.overlay-cell.blue{background:#3b82f6}.mini-cell.gold,.overlay-cell.gold{background:#f6c445}.mini-cell.purple,.overlay-cell.purple{background:#9b6df0}.arena-panel{display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:clamp(4px,.7vmin,8px);border-radius:clamp(11px,1.6vmin,18px);border:1px solid var(--line);background:#09101ed6}.arena-head{min-height:clamp(26px,4.5dvh,38px);display:flex;justify-content:space-between;align-items:center;padding:0 4px 4px;overflow:hidden}.arena-head>div{min-width:0;display:flex;gap:6px;align-items:baseline}.arena-label,.kicker{font-size:clamp(.47rem,.9vmin,.59rem);letter-spacing:.13em;color:var(--muted)}.arena-head strong{min-width:0;max-width:32vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(.65rem,1.25vmin,.86rem)}.hint{font-size:clamp(.52rem,1.05vmin,.7rem);color:var(--muted);white-space:nowrap}.board-frame{min-width:0;min-height:0;width:100%;height:100%;display:grid;place-items:center;overflow:hidden;padding:clamp(3px,.6vmin,7px);border-radius:clamp(10px,1.5vmin,17px);background:linear-gradient(145deg,#1e293bcc,#080f1cdb);box-shadow:inset 0 0 0 1px #94a3b814}.board{display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr);gap:clamp(2px,.38vmin,5px);width:100px;height:100px;max-width:100%;max-height:100%;flex:0 0 auto;touch-action:manipulation;-webkit-user-select:none;user-select:none}.cell{position:relative;border:0;border-radius:clamp(3px,.65vmin,9px);min-width:0;min-height:0;background:linear-gradient(145deg,#7b8797,#525f70);cursor:pointer;box-shadow:inset 0 1px #ffffff1f,0 2px 6px #0000002e;transition:transform .07s ease,filter .07s ease}.cell:hover{filter:brightness(1.08)}.cell:active{transform:scale(.95)}.cell.blue{background:linear-gradient(145deg,#67b2ff,#2868d9)}.cell.preview:after{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border:clamp(2px,.35vmin,3px) solid var(--accent);border-radius:inherit;box-shadow:0 0 10px #facc1594;pointer-events:none;z-index:2}.cell.center:before{content:"●";position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:clamp(8px,1.7vmin,22px);color:#fff;text-shadow:0 2px 4px #000;z-index:3;pointer-events:none}.cell:disabled{cursor:default;opacity:.78}.test-switch{min-height:clamp(24px,4dvh,34px);display:flex;align-items:end;justify-content:center;gap:clamp(3px,.55vmin,6px);padding-top:4px;font-size:clamp(.48rem,.9vmin,.6rem);color:var(--muted);overflow:hidden}.character{border:1px solid var(--line);border-radius:999px;padding:clamp(3px,.55vmin,5px) clamp(6px,.8vmin,9px);color:#f8fafc;background:#1e293bb3;cursor:pointer;font-size:clamp(.52rem,1vmin,.65rem);font-weight:800;white-space:nowrap}.character.active{border-color:#facc15a6;color:#fde68a}.action-panel{display:flex;flex-direction:column;gap:clamp(4px,.65vmin,8px)}.character-card,.hud-card,.message{flex:0 0 auto;min-width:0;overflow:hidden;border:1px solid var(--line);background:var(--panel);border-radius:clamp(9px,1.3vmin,15px)}.character-card{display:grid;grid-template-columns:clamp(34px,5.5vmin,50px) minmax(0,1fr);gap:clamp(5px,.8vmin,10px);align-items:center;padding:clamp(5px,.8vmin,10px)}.avatar{width:clamp(34px,5.5vmin,50px);aspect-ratio:1;border-radius:clamp(9px,1.3vmin,15px);display:grid;place-items:center;font-size:clamp(1.15rem,3vmin,1.75rem);font-weight:1000;background:linear-gradient(145deg,#7c3aed,#4338ca);box-shadow:inset 0 1px #ffffff38}.character-card strong{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:clamp(.82rem,1.8vmin,1.12rem)}.character-card small{display:block;margin-top:1px;color:var(--muted);font-size:clamp(.5rem,1vmin,.66rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud-card{padding:clamp(5px,.8vmin,10px) clamp(6px,.9vmin,11px)}.hud-card>span,.card-row span{font-size:clamp(.47rem,.88vmin,.58rem);letter-spacing:.11em;color:var(--muted)}.points-card strong{display:block;font-size:clamp(1.2rem,3.5vmin,2.45rem);line-height:1;margin:2px 0}.points-card small,.charge-card small{color:var(--muted);font-size:clamp(.52rem,1.05vmin,.68rem)}.card-row{display:flex;justify-content:space-between;gap:6px;align-items:center}.card-row strong{font-size:clamp(.62rem,1.2vmin,.8rem);white-space:nowrap}.mask-preview{margin-top:clamp(3px,.6vmin,8px);min-height:clamp(30px,6dvh,50px);display:grid;place-items:center}.mask-grid{display:grid;grid-template-columns:repeat(7,clamp(7px,1.15vmin,11px));grid-template-rows:repeat(5,clamp(7px,1.15vmin,11px));gap:2px}.mask-dot{border-radius:3px;background:#4755695c}.mask-dot.hit{background:#facc15;box-shadow:0 0 6px #facc1540}.mask-dot.center{background:#fff}.charge-track{display:flex;gap:4px;margin:clamp(4px,.7vmin,9px) 0 clamp(3px,.55vmin,7px)}.charge-segment{flex:1;height:clamp(7px,1.2vmin,10px);border-radius:999px;background:#47556980;overflow:hidden}.charge-segment.ready{background:linear-gradient(90deg,#fde047,#f59e0b)}.charge-segment.loading{position:relative}.charge-segment.loading:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;width:var(--progress, 0%);background:linear-gradient(90deg,#fde047,#f59e0b)}.action-button{flex:1 1 64px;min-height:48px;max-height:92px;border:0;border-radius:clamp(10px,1.5vmin,17px);color:#fff;cursor:pointer;font-weight:1000;box-shadow:0 8px 18px #0000002e}.action-button span{display:block;font-size:clamp(.88rem,2.2vmin,1.2rem);letter-spacing:.04em}.action-button small{display:block;margin-top:1px;font-size:clamp(.5rem,1vmin,.66rem);opacity:.8}.action-button.attack{background:linear-gradient(145deg,#f59e0b,#ef4444)}.action-button.super{background:linear-gradient(145deg,#7c3aed,#2563eb)}.action-button:disabled{opacity:.38;filter:grayscale(.3);cursor:default}.message{flex:0 1 auto;min-height:34px;max-height:62px;padding:clamp(5px,.75vmin,9px) clamp(6px,.8vmin,10px);color:var(--muted);font-size:clamp(.52rem,1.05vmin,.72rem);line-height:1.25}.player-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:none;place-items:center;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}.player-overlay.open{display:grid}.overlay-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#020617c7;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.overlay-card{position:relative;z-index:1;width:min(78dvw,78dvh,660px);max-width:94dvw;max-height:94dvh;padding:clamp(8px,1.2vmin,13px);border-radius:clamp(12px,1.8vmin,20px);border:1px solid rgba(250,204,21,.34);background:#0c1628;box-shadow:0 28px 80px #00000085}.overlay-card header{display:flex;justify-content:space-between;align-items:end;gap:8px;margin-bottom:6px}.overlay-card header strong{display:block;font-size:clamp(.82rem,2vmin,1.15rem)}.overlay-score{color:#fde68a;font-weight:900;font-size:clamp(.62rem,1.3vmin,.82rem)}.overlay-board{width:min(100%,76dvh);margin:0 auto;aspect-ratio:1 / 1}.overlay-hint{display:block;text-align:center;margin-top:6px;color:var(--muted);font-size:clamp(.52rem,1vmin,.68rem)}@media(min-width:1500px){.play-layout{grid-template-columns:190px minmax(0,1fr) 315px}}@media(orientation:landscape)and (max-width:1000px){.app-shell{--gap: 4px}.play-layout{grid-template-columns:clamp(82px,15dvw,118px) minmax(0,1fr) clamp(150px,25dvw,210px)}.status span:last-child{display:none}.mini-meta em,.hint{display:none}}@media(orientation:landscape)and (max-height:520px){.app-shell{--gap: 3px;padding:max(3px,env(safe-area-inset-top)) max(3px,env(safe-area-inset-right)) max(3px,env(safe-area-inset-bottom)) max(3px,env(safe-area-inset-left))}.match-bar{height:42px;border-radius:10px;padding:3px 6px}.eyebrow,.version{display:none}.brand strong{font-size:.82rem}.rank-pill,.timer-pill,.score-pill{height:32px;min-width:54px;padding:2px 5px}.rank-pill strong,.timer-pill strong,.score-pill strong{font-size:.9rem}.status{font-size:.56rem}.players-rail{gap:2px;grid-template-rows:repeat(5,minmax(0,1fr))}.rail-title{display:none}.mini-player{padding:2px;gap:2px;border-radius:7px;grid-template-columns:minmax(24px,38%) minmax(0,1fr)}.mini-meta{gap:0;font-size:.46rem}.mini-meta b{width:15px;height:15px;border-radius:4px}.mini-meta em{display:none}.mini-board{padding:1px;border-radius:3px}.arena-panel{padding:3px;border-radius:9px}.arena-head{min-height:20px;padding:0 2px 2px}.arena-label{display:none}.arena-head strong{font-size:.55rem;max-width:24vw}.board-frame{padding:2px;border-radius:8px}.test-switch{min-height:22px;padding-top:2px;gap:2px}.test-switch>span{display:none}.character{padding:2px 6px;font-size:.48rem}.action-panel{gap:3px}.character-card{grid-template-columns:30px minmax(0,1fr);padding:3px 5px;gap:5px;border-radius:8px}.avatar{width:30px;border-radius:8px;font-size:1rem}.character-card .kicker,.character-card small{display:none}.character-card strong{font-size:.7rem}.hud-card{padding:4px 6px;border-radius:8px}.points-card strong{display:inline;font-size:1rem;margin-left:5px}.points-card small,.ability-card,.charge-card small{display:none}.charge-track{margin:3px 0 0}.charge-segment{height:6px}.action-button{flex:1 1 46px;min-height:42px;max-height:62px;border-radius:9px}.action-button span{font-size:.8rem}.action-button small{font-size:.47rem}.message{display:none}}@media(orientation:landscape)and (max-height:420px){.play-layout{grid-template-columns:clamp(72px,14dvw,94px) minmax(0,1fr) clamp(138px,23dvw,174px)}.match-bar{height:38px}.status{display:none}.match-center{justify-self:end}.mini-meta span{font-size:.43rem}}@media(orientation:portrait){body{overflow:auto;min-height:100dvh;height:auto}.rotate-notice{display:block;position:sticky;top:0;z-index:80;padding:calc(7px + env(safe-area-inset-top)) 10px 7px;text-align:center;font-size:.72rem;font-weight:800;background:#facc15;color:#111827}.app-shell{height:auto;min-height:calc(100dvh - 34px);overflow:visible;padding:7px}.match-bar{height:auto;min-height:54px;grid-template-columns:1fr auto}.match-center{grid-column:1 / -1;grid-row:2;justify-content:center}.status{grid-column:2;grid-row:1}.play-layout{height:auto;overflow:visible;grid-template-columns:1fr}.arena-panel{order:1;min-height:min(92dvw,620px)}.players-rail{order:2;height:150px;grid-template-columns:repeat(5,minmax(105px,1fr));grid-template-rows:auto minmax(0,1fr);overflow-x:auto;overflow-y:hidden}.rail-title{grid-column:1 / -1}.mini-player{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}.mini-meta{flex-direction:row;align-items:center}.mini-board{height:100%;justify-self:center}.action-panel{order:3;height:auto;overflow:visible;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.character-card,.message{grid-column:1 / -1}.action-button{min-height:64px;max-height:none}}