:root{font:13px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#dce5ee;background:#0a1119;color-scheme:dark}*{box-sizing:border-box}body{margin:0}main{max-width:930px;margin:auto;padding:20px}.page-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:17px}.brand{font-size:14px;color:#dbe8ff;letter-spacing:.13em;text-decoration:none;font-weight:700}.brand span{display:block;font-size:9px;color:#738599;margin:4px 0 0 18px}.tools,.map-tools{display:flex;gap:6px}button,input{font:inherit;border:1px solid #2a3948;border-radius:7px;background:#1a2837;color:inherit;padding:8px 10px}button{cursor:pointer}button:hover,button:focus-visible{border-color:#76b7e8}button:disabled{opacity:.5;cursor:default}.tools button{font-size:10px;padding:7px 9px}.join{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:15px}.join form{display:flex;align-items:center;gap:7px}.join label{font-size:11px;color:#8ea0b5}.join input{width:107px;letter-spacing:.14em;text-transform:uppercase}.join form button{background:#326998;border-color:#497ba5}#pair{flex-basis:100%;font-size:11px;color:#9db6cd;margin:4px 0}.battle-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;align-items:start;gap:16px}.map-panel,.roster-panel,.session-panel{border:1px solid #24333f;border-radius:13px;background:linear-gradient(145deg,#131e29,#101b25);overflow:hidden;box-shadow:0 8px 24px #0000001c}.map-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 12px 10px}.map-toolbar h1{font-size:13px;line-height:1.4;margin:0;font-weight:650}.map-toolbar p{font-size:10px;color:#8595a6;margin:4px 0 0}.map-tools button{font-size:10px;min-width:32px;height:32px;padding:0 8px}.map-tools #fullscreen{font-size:20px}.map-stage{margin:0 6px;position:relative;border:1px solid #314350;background:#0c151e;box-shadow:inset 0 0 0 2px #162b34}canvas{display:block;width:100%;aspect-ratio:1;touch-action:manipulation;cursor:pointer}.map-message{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:35px;text-align:center;background:#08111a9c;backdrop-filter:blur(1px);font-size:12px;color:#b6c6d1;pointer-events:none}.map-message[hidden]{display:none}.legend{display:flex;gap:13px;flex-wrap:wrap;padding:10px 11px;font-size:9px;color:#8495a6}.enemy{color:#e9797d}.ally{color:#5acbde}.monster{color:#d7b777}aside{display:grid;gap:16px}.roster-panel{padding:17px 15px 0}.section-title{display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid #25333f}.eyebrow{font-size:8px;letter-spacing:.2em;color:#9aabba}.section-title h2{font-size:14px;font-weight:650;margin:7px 0 0}.count{font:18px ui-monospace,SFMono-Regular,monospace;color:#d6c69c;background:#242b2a;border:1px solid #4e4a38;border-radius:7px;padding:6px 8px}.tracked{padding:13px 0}.tracked-row{display:flex;align-items:center;gap:12px}.portrait-wrap{flex:none;width:49px;text-align:center}.portrait-wrap img{width:47px;height:47px;display:block;border:1px solid #d2ae68;border-radius:14px;background:#152633;object-fit:cover}.portrait-wrap span{display:block;font-size:10px;margin-top:6px;line-height:1.3}.tracked-detail{flex:1;min-width:0}.hero-tag{font-size:9px;color:#95a6b6;margin-bottom:9px}.hp-line{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#a6b2c0;font-variant-numeric:tabular-nums;gap:5px}.hp-line strong{font-size:10px;color:#d3dfe8;white-space:nowrap}.hp-bar{height:4px;border-radius:3px;background:#293542;margin-top:7px;overflow:hidden}.hp-bar i{height:100%;display:block;background:#e37d81;width:0;transition:width .1s linear}.hp-bar i.ally-hp{background:#63cbdc}.roster{display:flex;flex-wrap:wrap;gap:6px;padding:0 0 11px}.roster:empty{padding:0}.hero-button{padding:2px;border-radius:50%;background:#132330;position:relative;border:1px solid #e5797b80}.hero-button.ally-button{border-color:#61cadd80}.hero-button.selected{border-color:#dbc17b;box-shadow:0 0 0 1px #dbc17b66}.hero-button img{display:block;width:29px;height:29px;border-radius:50%;object-fit:cover}.hero-button:focus-visible{outline:2px solid #e2c877;outline-offset:2px}.empty{font-size:11px;color:#91a4b5;line-height:1.6;margin:3px 0}.live-note{margin:0 -15px;padding:12px 15px;border-top:1px solid #22303c;font-size:9px;letter-spacing:.03em;color:#8296a6}.live-note i{display:inline-block;background:#71cbb4;width:4px;height:4px;border-radius:50%;margin-right:5px}.session-panel{padding:14px 15px}.session-panel h2{font-size:12px;margin:0 0 11px;font-weight:600}dl{margin:0}dl div{display:flex;justify-content:space-between;gap:12px;margin-top:10px;font-size:10px;line-height:1.4}dt{color:#778c9e}dd{margin:0;text-align:right;max-width:65%;font-variant-numeric:tabular-nums}#room{letter-spacing:.1em;color:#d9c68d}#latency{color:#93cbbc}footer{font-size:10px;color:#73889b;line-height:1.6;padding:14px 3px}.qa-label{padding:7px 10px;margin:0 0 12px;border:1px solid #685735;background:#28251d;border-radius:6px;color:#d6c397;font-size:10px}.map-panel:fullscreen{border-radius:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#0a1119}.map-panel:fullscreen .map-toolbar,.map-panel:fullscreen .map-stage,.map-panel:fullscreen .legend{width:min(100vw,calc(100dvh - 87px));margin:0}.map-panel:fullscreen canvas{width:100%}body.compact main{padding:4px;max-width:min(100%,calc(100dvh - 67px))}body.compact .page-head,body.compact .join,body.compact aside,body.compact footer,body.compact .qa-label{display:none}body.compact .battle-layout{display:block}body.compact .map-panel{border-radius:7px}body.compact .map-toolbar{padding:5px 8px}body.compact .map-toolbar h1{font-size:11px}body.compact .map-toolbar p{font-size:8px;margin:1px 0 0}body.compact .map-tools button{height:25px;min-width:25px;padding:0 5px}body.compact .map-tools #fullscreen{font-size:17px}body.compact .legend{padding:6px 8px;font-size:8px;gap:10px}body.compact .map-stage{margin:0 4px}@media(max-width:670px){main{max-width:450px;padding:12px}.battle-layout{display:block}.map-panel{margin-bottom:16px}aside{gap:16px}.roster-panel{padding:16px 16px 0}.live-note{margin:0 -16px;padding:12px 16px}.page-head{margin-bottom:13px}.join label{display:none}.join button{font-size:11px}.map-toolbar{padding:12px 10px}.map-toolbar h1{font-size:12px}.map-toolbar p{font-size:9px}.map-tools button{height:30px;min-width:30px}body.compact .map-panel{margin:0}}
.expand{display:none}body.compact .expand{display:block}
.map-notice{font-size:10px;line-height:1.4;color:#d7bc83;background:#29261e;padding:7px 9px;margin:0 6px 6px;border-radius:5px}.map-notice[hidden]{display:none}
.map-panel{position:relative}body.compact .map-notice{position:absolute;z-index:2;top:41px;left:4px;right:4px;margin:0}
#pip-video{position:absolute;bottom:0;right:0;width:1px;height:1px;opacity:.01;pointer-events:none}
.cooldown-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin-top:10px}.cooldown-cell{display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:28px;padding:5px 6px;border:1px solid #293a46;border-radius:5px;background:#172530}.cooldown-label{font-size:9px;color:#95a8b7;white-space:nowrap}.cooldown-cell strong{font-size:10px;color:#e9c88b;font-variant-numeric:tabular-nums;white-space:nowrap}.cooldown-cell strong.ready{font-size:9px;color:#78d1b4}.cooldown-cell strong.unknown{color:#7e92a1}
.recall-alert{margin:0;padding:9px 12px;background:#2b2440;color:#dcc9ff;border-top:1px solid #685187;font-size:12px}.recall-alert[hidden],#vision-panel[hidden]{display:none}.vision-row{display:flex;align-items:center;gap:8px;padding:7px 0;font-size:12px;border-bottom:1px solid #29323e}.vision-type{color:#f5a577;font-size:19px}#vision-count{float:right;color:#f5a577}