@import url('data:text/css,');
:root{--navy:#071724;--panel:#0a2131ee;--cyan:#62e3ff;--blue:#20a9f6;--gold:#ffcb69;--muted:#9ab1c0;--pink:#ff58bb;--line:#5bd7ff45;font-family:Inter,Segoe UI,Arial,sans-serif;color:#f5faff;background:#06121e;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input{font:inherit}button{color:inherit;cursor:pointer;border:0}button:disabled{cursor:default;opacity:.5}button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button{touch-action:none;-webkit-tap-highlight-color:transparent}input{color:white;background:#081a28;border:1px solid var(--line);padding:12px 14px;border-radius:4px}#arena{position:fixed;inset:0;width:100%;height:100%;touch-action:none}.hidden{display:none!important}.screen{position:fixed;inset:0;padding:max(24px,env(safe-area-inset-top)) max(32px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(32px,env(safe-area-inset-left));background:linear-gradient(90deg,#041222f5 0%,#041222a1 42%,transparent 76%),linear-gradient(0deg,#041222df,transparent 24%,transparent 80%,#04122266);pointer-events:none}.screen button,.screen input{pointer-events:auto}.brand{font-size:25px;letter-spacing:5px;font-weight:800;color:#91edff;display:flex;align-items:center;gap:16px;text-shadow:0 0 30px #1b91aa}.crest{font-size:55px;color:#85e8ff;text-shadow:0 0 30px #65ceff}.brand .crest{font-size:48px}.lobby-header,.selection-header{display:flex;align-items:center;gap:20px}.version{margin-left:auto;font-size:10px;letter-spacing:3px;color:#a8c4d7}.icon-button{display:grid;place-items:center;border:1px solid var(--line);background:#08243cbb;border-radius:8px;min-width:42px;height:42px;font-size:23px}.intro{position:absolute;left:6%;top:29%}.eyebrow{font-size:11px;font-weight:800;letter-spacing:3px;color:var(--cyan)}.intro h1{font-size:clamp(42px,5.7vw,85px);font-weight:800;line-height:1.06;letter-spacing:-3px;margin:24px 0}.intro h1 span{color:var(--cyan)}.intro>p:not(.eyebrow){font-size:clamp(14px,1.3vw,18px);color:#bfd0dc;line-height:1.7}.mode-tag{margin-top:27px;display:flex;gap:15px;align-items:center;letter-spacing:3px;font-size:12px;font-weight:700}.mode-tag i{width:4px;height:4px;background:var(--cyan);border-radius:100%}.lobby-action{position:absolute;bottom:13%;right:6%;width:clamp(300px,30vw,460px)}.feature{display:flex;align-items:center;gap:15px;padding:20px 0}.feature b{font-size:38px;color:var(--cyan)}.feature div{display:flex;flex-direction:column;gap:5px}.feature strong{font-size:18px}.feature span,.lobby-action p{color:#a4becb;font-size:12px}.gold-button{background:linear-gradient(135deg,#fff0a7,#ffc057 45%,#d68a28);color:#291b06;font-weight:900;font-size:17px;letter-spacing:1px;border:1px solid #fff0ae;box-shadow:0 0 25px #d8933045,inset 0 0 0 4px #b8832830;padding:18px 22px;display:flex;justify-content:center;gap:30px;align-items:center;border-radius:3px;width:100%}.gold-button:hover{filter:brightness(1.13)}.lobby-footer{position:absolute;bottom:22px;left:32px;right:32px;display:flex;justify-content:space-between;font-size:10px;color:#89a8bb;letter-spacing:1px}.small{font-size:16px}.selection-header{justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:18px;font-size:11px;letter-spacing:2px}.text-button{padding:12px 16px;background:transparent;color:#b9dfef;font-size:12px;font-weight:700;letter-spacing:1px}.selection-body{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;max-width:1350px;margin:4vh auto 0;height:calc(100% - 100px)}.hero-detail{position:relative;overflow:hidden;background:linear-gradient(140deg,#0b2239dd,#09152888);border:1px solid var(--line);border-radius:4px;padding:32px;pointer-events:auto}.hero-detail:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 70% 30%,var(--hero-color,#ff5bbb)25,transparent 60%);pointer-events:none}.hero-art{position:absolute;right:0;top:0;width:60%;height:76%;object-fit:contain;object-position:center;mix-blend-mode:lighten;opacity:.68;mask-image:linear-gradient(#000 50%,transparent 95%)}.hero-detail h1{position:relative;font-size:clamp(38px,5vw,70px);letter-spacing:-2px;margin:26px 0 8px;text-transform:uppercase}.hero-detail .role{position:relative;color:var(--gold);font-size:11px;letter-spacing:3px}.hero-description{position:relative;color:#bbd3df;font-size:13px;line-height:1.65;max-width:240px;margin:24px 0}.hero-passive{position:relative;color:#c4dce7;font-size:11px;line-height:1.6;max-width:250px;background:#071728bb;padding:12px;border-left:2px solid var(--hero-color)}.hero-ability-list{position:absolute;left:24px;right:24px;bottom:24px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.hero-ability{display:flex;align-items:center;gap:10px;padding:12px;background:#071728d9;border:1px solid var(--line);border-radius:4px}.hero-ability b{font-size:25px;color:var(--hero-color)}.hero-ability strong{font-size:11px}.hero-ability small{display:block;color:#8daaba;font-size:10px;margin-top:5px}.selection-right{overflow:auto;padding-right:4px;pointer-events:auto}.section-title{display:flex;justify-content:space-between;align-items:center;color:#94becf;letter-spacing:3px;font-size:11px;margin-bottom:18px}.section-title b{font-size:30px;color:#467b92}.hero-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.hero-card{position:relative;min-height:115px;display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(150deg,#18374ac9,#071521ea);border:1px solid #4f81965c;border-radius:4px;gap:9px}.hero-card.selected{border:2px solid var(--hero-color);box-shadow:0 0 25px color-mix(in srgb,var(--hero-color),transparent 80%)}.hero-card .hero-symbol{color:var(--hero-color);font-size:34px}.hero-card .hero-thumb{width:48px;height:48px;object-fit:cover;border-radius:50%;object-position:50% 6%}.hero-card strong{font-size:11px;letter-spacing:1px}.hero-card small{font-size:9px;color:#a6b8c6}.hero-card.selected:after{content:'✓';position:absolute;right:6px;top:6px;color:var(--hero-color);font-size:13px}.team-rule{display:flex;align-items:center;gap:14px;background:#0b253aaa;border-left:2px solid var(--cyan);padding:14px;margin:18px 0}.team-rule b{font-size:21px;color:var(--cyan)}.team-rule span{font-size:11px;color:#b4ccda}.name-field{display:flex;flex-direction:column;gap:8px;letter-spacing:2px;font-size:10px;color:#9ab1c0}.name-field input{letter-spacing:0}.actions{display:flex;gap:12px;margin-top:15px}.actions .gold-button{width:60%;padding:15px 12px;font-size:14px}.blue-button{padding:16px;background:linear-gradient(135deg,#153e5b,#0b273b);border:1px solid #539eb8;color:#aaeaff;border-radius:3px;font-size:11px;font-weight:800;letter-spacing:1px;flex:1}.join-row{display:flex;gap:10px;margin-top:12px}.join-row input{width:58%;text-transform:uppercase;font-size:12px}.panel{background:linear-gradient(130deg,#112f43f5,#06131ff5);border:1px solid #65d5f975;box-shadow:0 20px 100px #0009;border-radius:7px}.wait-card{pointer-events:auto;max-width:740px;margin:8vh auto;padding:30px;text-align:center}.wait-card h1{letter-spacing:12px;color:var(--gold);font-size:38px}.wait-card p{font-size:12px;line-height:1.8;color:#a9c3d3}.wait-roster{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}.wait-member{padding:15px;border:1px solid var(--line);display:flex;justify-content:space-between;font-size:12px}.wait-member small{color:#a1b8c6}.match-header{position:fixed;top:0;left:0;right:0;height:68px;display:flex;align-items:center;justify-content:center;gap:18px;padding:0 16px;background:linear-gradient(180deg,#061728ef,#061728be);border-bottom:1px solid #6ad8ff50;pointer-events:none}.match-header button{pointer-events:auto}.match-brand{position:absolute;left:20px;display:flex;align-items:center;gap:8px;color:var(--cyan);font-size:28px}.match-brand span{font-size:14px;letter-spacing:2px;font-weight:800}.match-brand small{font-size:9px;color:#bfd9e5;border:1px solid var(--line);padding:3px}.team-strip{display:flex;gap:6px}.team-portrait{width:39px;height:39px;border:1px solid var(--hero-color);border-radius:50%;display:grid;place-items:center;font-size:21px;background:#081d2bec;position:relative;color:var(--hero-color)}.team-portrait small{position:absolute;bottom:-6px;font-size:6px;background:#081725;color:#d0dde3;padding:1px 3px;white-space:nowrap}.scoreboard{display:flex;align-items:center;gap:20px;height:100%;min-width:155px;justify-content:center;background:#091b2ccc;border-inline:1px solid var(--line);transform:skew(-10deg)}.scoreboard>*{transform:skew(10deg)}.scoreboard>b{font-size:32px;color:#66dfff}.scoreboard>b:last-child{color:#ff727d}.scoreboard div{text-align:center}.scoreboard span{font-variant-numeric:tabular-nums;font-size:17px}.scoreboard small{display:block;color:#729db2;letter-spacing:2px;font-size:7px;margin-top:4px}.match-tools{position:absolute;right:16px;display:flex;align-items:center;gap:10px}.match-tools>span{font-size:9px;color:#8ae8b4}.map-area{position:fixed;left:16px;top:85px;display:flex;gap:7px}.map-area>button{padding:0;background:#071b2eed;border:1px solid #63c7e17d;border-radius:8px;overflow:hidden}#minimap{display:block;width:130px;height:173px}.map-area button span{display:block;font-size:8px;letter-spacing:2px;padding:5px;background:#0b2736}.zoom{display:flex;flex-direction:column;gap:7px}.zoom button{border:1px solid var(--line);background:#082033d9;border-radius:50%;width:32px;height:32px;font-size:23px}.objective{position:fixed;top:81px;left:50%;transform:translateX(-50%);background:#081925d9;border:1px solid #d2aaff66;color:#dab9ff;font-size:10px;padding:9px 14px;border-radius:3px;min-width:235px;text-align:center}.objective>div{height:2px;background:var(--cyan);width:0;position:absolute;bottom:0;left:0}.player-portrait{position:fixed;left:16px;bottom:calc(26px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:9px;background:#071a2cef;border:1px solid var(--line);border-radius:5px;padding:9px;min-width:205px;text-align:left}.player-portrait>span{font-size:28px;color:var(--hero-color);width:32px;text-align:center}.player-portrait strong{font-size:11px;display:block;text-transform:uppercase}.player-portrait small{font-size:8px;color:#9fbfcc}.health-bar{height:4px;width:85px;background:#08202a;margin-top:5px}.health-bar i{display:block;height:100%;background:#61e1a5}.player-portrait>b{color:var(--gold);font-size:11px;margin-left:auto}.joystick{position:fixed;left:46px;bottom:110px;width:155px;height:155px;touch-action:none;background:radial-gradient(circle,#112c4040 45%,#377baf1b 47%,#164a7345 70%);border:2px solid #57caf95c;border-radius:50%;box-shadow:inset 0 0 30px #4595e622;user-select:none}.joystick:after{content:'MOVE';position:absolute;left:0;right:0;bottom:14px;text-align:center;font-size:7px;letter-spacing:3px;color:#80b2ce;pointer-events:none}#stick{position:absolute;left:calc(50% - 26px);top:calc(50% - 26px);width:52px;height:52px;background:radial-gradient(circle at 30% 25%,#3096c5,#0b243f 80%);border:2px solid #72ceff;border-radius:50%;box-shadow:0 0 12px #50a7ec55;pointer-events:none}.utilities{position:fixed;bottom:25px;left:50%;display:flex;gap:9px;transform:translateX(-50%)}.utilities button{background:#091d2de6;border:1px solid #5f99b260;border-radius:5px;min-width:60px;padding:8px 7px}.utilities b{display:block;color:#7bdcff;font-size:21px}.utilities span{display:block;font-size:7px;letter-spacing:.5px;margin-top:5px}.utilities button:nth-child(2) b{color:#7bedb1}.utilities button:nth-child(4) b{color:var(--gold)}.skills{position:fixed;right:25px;bottom:35px;width:265px;height:205px;pointer-events:none}.skill{position:absolute;border:2px solid var(--hero-color);border-radius:50%;background:radial-gradient(circle at 25% 25%,#23466a,#081524 80%);box-shadow:0 0 15px color-mix(in srgb,var(--hero-color),transparent 70%),inset 0 0 25px #0005;color:var(--hero-color);display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:auto;touch-action:none;width:67px;height:67px;user-select:none}.skill .symbol{font-size:27px}.skill .cooldown{position:absolute;inset:0;border-radius:50%;background:#06121ddd;display:grid;place-items:center;font-size:24px;color:#d9ecf4}.skill small{position:absolute;bottom:-19px;font-size:8px;white-space:nowrap;color:#d0e5f2;letter-spacing:0;text-shadow:0 1px 3px black}.skill .key{position:absolute;top:-6px;right:-1px;color:#c6dce5;font-size:9px;background:#071622;padding:3px 4px;border:1px solid var(--line);border-radius:4px}.skill[data-slot='0']{right:0;bottom:0;width:100px;height:100px;border:3px solid var(--gold);box-shadow:0 0 20px #d1a94566;color:var(--gold)}.skill[data-slot='0'] .symbol{font-size:38px}.skill[data-slot='1']{left:26px;top:25px}.skill[data-slot='2']{left:0;bottom:1px}.skill[data-slot='3']{right:8px;top:0;border-color:#b997ff;background:radial-gradient(circle,#594170,#071321 80%)}.skill[data-slot='3'] .symbol{color:#d4b5ff}.hint{position:fixed;right:25px;bottom:8px;font-size:7px;color:#8eafc2}.target{position:fixed;top:115px;left:50%;transform:translateX(-50%);background:#061622d9;border:1px solid #ff777b66;padding:8px 13px;color:#ffb1b4;font-size:10px;border-radius:3px}.death{position:fixed;top:40%;left:50%;transform:translateX(-50%);text-align:center;background:#091321d9;padding:25px;font-size:20px;letter-spacing:1px;border:1px solid var(--line);border-radius:4px;pointer-events:none}.modal{position:fixed;inset:0;background:#0008;backdrop-filter:blur(4px);display:grid;place-items:center;z-index:25}.modal>.panel{position:relative;padding:28px;width:min(90vw,480px)}.close-button{position:absolute;top:10px;right:12px;font-size:27px;background:transparent;color:#a8d2e3;z-index:3}.modal h2{font-size:25px;letter-spacing:-.5px}.modal p{font-size:11px;line-height:1.7;color:#a6c2d1}.settings-panel label{display:block;padding:13px 0;font-size:13px;cursor:pointer}.settings-panel input{accent-color:#59cffa;margin-right:8px}.controls{border-top:1px solid var(--line);padding-top:14px}#performance{color:#9bc9d9;font-size:11px;margin-top:15px}.full-map-panel{text-align:center;max-height:95vh}.full-map-panel canvas{max-height:65vh;max-width:100%;height:auto;width:auto}#characterPanel{position:fixed;left:16px;bottom:105px;width:300px;max-height:55vh;overflow:auto;z-index:11;padding:20px}#characterPanel h2{font-size:22px;margin:5px 0}#characterPanel p{font-size:11px;color:#bdd4de;line-height:1.7}#characterPanel .power-row{font-size:11px;border-top:1px solid var(--line);padding:10px 0}#characterPanel button.upgrade{background:#193e55;color:var(--gold);border:1px solid var(--line);font-size:10px;padding:5px 9px;margin-top:5px}.shop-item{background:#0a2035;border:1px solid var(--line);padding:14px;margin:12px 0;width:100%;display:flex;align-items:center;justify-content:space-between;text-align:left}.shop-item strong{font-size:13px}.shop-item small{display:block;font-size:10px;color:#9ebdd0;margin-top:6px}.shop-item b{color:var(--gold);font-size:13px}.result-card{text-align:center;max-height:95vh;overflow:auto}.result-card h1{font-size:50px;letter-spacing:5px;color:var(--gold);margin:8px 0}.result-card .crest{font-size:65px}#resultRoster{margin:18px 0;display:grid;gap:6px}.result-row{display:flex;justify-content:space-between;font-size:11px;border-bottom:1px solid var(--line);padding:6px}.veil{position:fixed;inset:0;z-index:40;background:#061320;display:flex;flex-direction:column;align-items:center;justify-content:center}.veil h1{letter-spacing:7px;font-size:23px}.veil p{color:#94b6c9;font-size:13px}.veil progress{width:250px;height:3px;accent-color:var(--cyan);border:0}#toast{position:fixed;left:50%;bottom:32%;transform:translateX(-50%);background:#092338ef;border:1px solid #8ee3ff78;border-radius:5px;padding:12px 20px;font-size:12px;opacity:0;transition:opacity .2s;z-index:60;pointer-events:none;max-width:75vw;text-align:center}#toast.visible{opacity:1}#orientation{position:fixed;inset:0;background:#061320ef;z-index:55;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;font-size:50px}#orientation span{font-size:15px}
@media(max-width:1100px){.match-brand span{display:none}.match-brand{left:12px}.match-header{gap:12px;height:58px}.team-portrait{width:32px;height:32px;font-size:18px}.scoreboard{min-width:125px;gap:14px}.match-tools>span{display:none}.match-tools .icon-button{min-width:32px;height:32px;font-size:19px}.selection-body{gap:20px}.hero-detail{padding:22px}.hero-ability-list{left:16px;right:16px;bottom:16px;gap:6px}.hero-ability{padding:10px 7px}.hero-card{min-height:90px}.hero-description{font-size:12px}.objective{top:68px}.map-area{top:70px}.screen{padding:20px}.lobby-footer{left:20px;right:20px}.hero-detail h1{margin-top:18px}.selection-header{padding-bottom:12px}.selection-body{margin-top:20px;height:calc(100% - 70px)}}
@media(max-height:650px){.intro{top:24%}.intro h1{font-size:45px;margin:16px 0}.intro .mode-tag{margin-top:12px}.intro>p:not(.eyebrow){font-size:12px}.lobby-action{bottom:17%}.feature{padding:10px 0}.selection-body{margin-top:12px;height:calc(100% - 60px)}.hero-card{min-height:72px;gap:4px}.hero-card .hero-symbol{font-size:25px}.hero-card .hero-thumb{width:32px;height:32px}.hero-detail h1{font-size:40px;margin:14px 0 6px}.hero-description{font-size:11px;margin:12px 0;max-width:200px}.hero-passive{font-size:9px;padding:8px;max-width:205px}.hero-ability-list{bottom:12px}.hero-ability{padding:7px}.hero-ability b{font-size:19px}.hero-ability strong{font-size:9px}.hero-ability small{font-size:8px}.section-title{margin-bottom:8px}.section-title b{font-size:20px}.team-rule{margin:9px 0;padding:8px}.name-field{gap:5px}.name-field input{padding:8px}.actions{margin-top:9px}.actions .gold-button,.blue-button{padding:11px}.join-row{margin-top:8px}.join-row input{padding:8px}.screen{padding:14px 20px}.selection-header{padding-bottom:10px}.brand{font-size:19px}.brand .crest{font-size:34px}.small{font-size:13px}.lobby-footer{font-size:8px;bottom:13px}.match-header{height:48px}.match-brand{font-size:23px}.match-brand small{font-size:7px}.team-portrait{width:29px;height:29px;font-size:16px}.scoreboard>b{font-size:25px}.scoreboard span{font-size:14px}.map-area{left:10px;top:60px}#minimap{width:94px;height:125px}.objective{top:58px;padding:7px;font-size:9px}.joystick{left:33px;bottom:81px;width:120px;height:120px}#stick{width:44px;height:44px;left:calc(50% - 22px);top:calc(50% - 22px)}.player-portrait{left:10px;bottom:12px;min-width:165px;padding:7px}.player-portrait>span{font-size:23px}.player-portrait strong{font-size:9px}.player-portrait small{font-size:7px}.player-portrait>b{font-size:9px}.health-bar{width:62px}.skills{right:19px;bottom:32px;width:224px;height:175px}.skill{width:57px;height:57px}.skill[data-slot='0']{width:83px;height:83px}.skill small{font-size:7px;bottom:-16px}.skill .symbol{font-size:23px}.skill[data-slot='0'] .symbol{font-size:30px}.utilities{bottom:15px;gap:6px}.utilities button{min-width:46px;padding:6px}.utilities b{font-size:17px}.utilities span{font-size:6px}.hint{right:15px;bottom:5px;font-size:6px}#characterPanel{bottom:80px;max-height:60vh;width:260px}.wait-card{margin:4vh auto;padding:16px}.wait-card h1{font-size:25px;margin:10px}.wait-card p{font-size:10px}.wait-roster{margin:12px 0}.wait-member{padding:9px}.modal>.panel{padding:22px}.result-card h1{font-size:33px}.result-card .crest{font-size:37px}.modal h2{font-size:20px}.settings-panel label{padding:8px 0;font-size:11px}}
@media(max-width:700px){.screen{padding:10px 14px}.brand{font-size:15px;letter-spacing:3px}.version{display:none}.intro{left:5%;top:24%}.intro h1{font-size:36px;letter-spacing:-1px}.lobby-action{right:5%;width:260px;bottom:17%}.feature{display:none}.lobby-action p{font-size:9px}.lobby-footer span:first-child{display:none}.selection-body{gap:12px;grid-template-columns:.9fr 1fr}.selection-header{font-size:8px}.selection-header .brand{display:none}.hero-detail{padding:12px}.hero-detail h1{font-size:30px}.hero-description{max-width:150px;font-size:9px}.hero-passive{font-size:8px}.hero-art{width:65%;opacity:.45}.hero-cards{gap:6px}.hero-card strong{font-size:8px}.hero-card small{font-size:7px}.hero-card{min-height:62px}.hero-ability-list{left:8px;right:8px;gap:4px}.hero-ability{gap:5px}.hero-ability b{display:none}.team-rule span{font-size:8px}.team-rule b{font-size:15px}.actions .gold-button{font-size:11px;gap:8px}.blue-button{font-size:8px}.match-brand small{display:none}.match-header{gap:7px}.team-strip{gap:3px}.team-portrait{width:24px;height:24px;font-size:13px}.scoreboard{min-width:106px;gap:12px}.match-tools{right:6px;gap:5px}.match-tools .icon-button{min-width:26px;height:26px;font-size:16px}.utilities{left:46%}.skills{right:10px;width:204px}.skill[data-slot='1']{left:19px}.skill[data-slot='2']{left:0}.hint{display:none}.objective{font-size:8px;min-width:185px}.joystick{left:23px;bottom:78px;width:108px;height:108px}}
.face{display:inline-grid;place-items:center;width:100%;height:100%;border-radius:50%;background-size:cover;background-position:center;color:var(--hero-color);overflow:hidden}.face.hero-thumb{width:48px;height:48px;font-size:30px}.team-portrait .face{width:100%;height:100%}.player-portrait #portraitIcon .face{width:32px;height:32px;font-size:25px}@media(max-height:650px){.face.hero-thumb{width:32px;height:32px;font-size:25px}}
