@import url('/fonts.css');
:root{--bg:#0c1014;--panel:#14191e;--line:#2b3036;--muted:#8e959b;--white:#eee9df;--gold:#d7b77a;--red:#d85c62}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font:14px 'Segoe UI',sans-serif}button,input{font:inherit}button{cursor:pointer;color:inherit;transition:background .18s,border-color .18s,transform .18s}button:hover{filter:brightness(1.15)}button:active{transform:translateY(1px)}button:disabled{opacity:.4;cursor:not-allowed;filter:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:4px}input{width:100%;height:47px;background:#0d1115;border:1px solid #373b3f;border-radius:3px;padding:0 14px;color:var(--white);outline:none}input:focus{border-color:var(--gold)}input::placeholder{color:#737c83}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400}a{color:inherit;text-decoration:none}.hidden{display:none!important}.topbar{height:80px;padding:0 4.2%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#0d1115}.brand{font-family:Georgia,serif;font-size:32px;letter-spacing:7px;display:flex;align-items:center;gap:21px}.brand span{font:9px 'Segoe UI',sans-serif;letter-spacing:2px;max-width:95px;line-height:1.8;border-left:1px solid #3b3b38;padding-left:20px}.topright{display:flex;align-items:center;gap:14px}.status{font-size:11px;color:#94baa9;margin-right:9px}.status:before{content:'';width:5px;height:5px;background:currentColor;border-radius:50%;display:inline-block;margin-right:7px}.small{background:transparent;border:1px solid #32373c;padding:9px 13px;border-radius:3px;font-size:11px;color:#b9b9b3}kbd{font:10px 'Segoe UI',sans-serif;background:#262b30;padding:4px 6px;border:1px solid #4b4d4d;border-radius:3px;color:#ddd8cb}.small kbd{margin-left:12px}.home{display:grid;grid-template-columns:1.24fr 1fr;max-width:1600px;margin:auto;min-height:720px}.hero{position:relative;isolation:isolate;overflow:hidden;padding:74px 8% 35px;border-right:1px solid var(--line);display:flex;flex-direction:column}.hero-art{position:absolute;inset:0;z-index:-3;background:url('/assets/cover.webp') 58% center/cover}.hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#090e13b0,transparent 80%),linear-gradient(0deg,#0c1014 2%,#0c101400 50%,#0c101466)}.eyebrow{font-size:10px;letter-spacing:2.6px;color:var(--gold);font-weight:600;line-height:1.7}.eyebrow i{display:inline-block;width:6px;height:6px;background:var(--gold);margin-right:8px;transform:rotate(45deg)}.hero h1{font-size:clamp(42px,4.3vw,70px);line-height:1.04;letter-spacing:-2px;margin-top:30px;text-shadow:0 2px 20px #0008}.hero h1 em{color:#debd85;font-weight:400}.hero-copy{color:#c2c1ba;font-size:14px;line-height:1.9;margin-top:25px}.hero-tags{display:flex;gap:15px;margin-top:30px;flex-wrap:wrap}.hero-tags span{font-size:8px;letter-spacing:1.5px;color:#d4c6b2;border-bottom:1px solid #c9b79755;padding-bottom:9px}.hero-bottom{display:flex;align-items:center;gap:15px;margin-top:auto;padding-top:210px;color:#959c9f;font-size:10px;line-height:1.8}.big-number{font:47px Georgia,serif;color:var(--gold)}.hero-rule{height:32px;width:1px;background:#4a4946;margin:0 7px}.setup{padding:40px 10% 30px;background:radial-gradient(ellipse at top right,#26262255,transparent 70%)}.section-top{display:flex;justify-content:space-between;align-items:center}.version{font-size:10px;color:#666f73}.setup h2{font-size:34px;margin:12px 0 24px;letter-spacing:-.8px}.label{display:block;font-size:9px;letter-spacing:1.8px;color:#a7aaa6;margin-bottom:9px}.class-label{margin-top:24px;display:flex;justify-content:space-between}.class-label span{color:var(--gold)}.classes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.class-card{height:93px;position:relative;overflow:hidden;border:1px solid #353c42;background:linear-gradient(#232930,#14191e);border-radius:3px}.class-card.active{border-color:var(--gold);background:linear-gradient(#534630,#22221e)}.class-card:after{content:'';position:absolute;inset:auto 0 0;height:35px;background:linear-gradient(transparent,#0a0e12)}.class-card img{width:100%;height:100%;object-fit:contain;transform:scale(1.1);filter:brightness(.83)}.class-card.active img{filter:brightness(1.08)}.class-card span{position:absolute;bottom:7px;left:0;right:0;font-size:10px;z-index:2;color:#cec9c0}.class-info{margin:17px 0 21px;min-height:142px}.class-info>div:first-child{display:flex;justify-content:space-between;align-items:center}.class-info h3{font-size:24px}.class-info #classTag{font-size:8px;letter-spacing:1px;color:var(--gold)}.class-info p{font-size:12px;line-height:1.7;color:#9ba1a2;margin-top:7px;min-height:40px}.stat-bars{display:flex;gap:22px;margin-top:11px}.stat{display:flex;align-items:center;gap:7px;font-size:9px;color:#a1a6a5}.stat i{display:inline-block;width:34px;height:3px;background:#353b3e}.stat i b{display:block;height:100%;background:var(--gold)}.class-skill{display:flex;gap:10px;margin-top:14px;align-items:center}.class-skill strong{font-size:10px;display:block;font-weight:500}.class-skill small{display:block;font-size:9px;color:#828b90;margin-top:3px}.primary{background:var(--gold);color:#191c1e;border:1px solid var(--gold);border-radius:3px;padding:15px 20px;font-size:12px;font-weight:650;display:flex;align-items:center;justify-content:space-between;gap:25px}.setup .primary{width:100%}.primary span{font-size:20px;line-height:14px}.secondary{background:#1a2026;border:1px solid #42484d;border-radius:3px;padding:12px 17px;font-size:11px}.join-row{display:flex;gap:9px;margin-top:10px}.join-row input{font-size:10px;letter-spacing:1.6px;height:43px;flex:1;min-width:60px}.join-row button{flex-shrink:0}.practice{display:flex;justify-content:space-between;width:100%;border:0;border-bottom:1px solid #30363c;background:transparent;font-size:11px;padding:19px 0 14px;color:#b9bfbc}.practice span{font-size:8px;letter-spacing:1px;color:var(--gold)}.hint{font-size:10px;color:#727c81;line-height:1.8;margin-top:13px}footer{padding:23px 4.2%;border-top:1px solid #272d31;display:flex;justify-content:space-between;font-size:8px;letter-spacing:2px;color:#697378}footer i{color:var(--gold);padding:0 8px}.lobby{max-width:1200px;margin:55px auto;padding:0 35px}.lobby-header h1{font-size:50px;margin:12px 0}.lobby-header p{font-size:13px;color:var(--muted)}.lobby-layout{display:grid;grid-template-columns:1fr 320px;gap:40px;margin-top:40px}.slots{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px}.slot{height:206px;background:radial-gradient(ellipse at bottom,#38382f,#161d23 70%);border:1px solid #383e41;border-radius:5px;position:relative;overflow:hidden;padding:19px}.slot img{position:absolute;height:178px;bottom:-8px;right:-3px;opacity:.9}.slot h3{font-size:22px;position:relative;z-index:1;max-width:150px;word-break:break-word}.slot .slot-label{font-size:9px;letter-spacing:1.4px;color:var(--gold);position:relative;z-index:1}.slot .slot-bottom{position:absolute;bottom:18px;left:19px;z-index:1}.slot select{display:block;background:#13191fdd;color:#e1d9c9;border:1px solid #646050;padding:7px;font-size:11px;max-width:130px}.slot.empty{display:flex;align-items:center;justify-content:center;border-style:dashed;color:#646f76;background:#11171c;font-size:12px}.slot .remove{position:absolute;right:10px;top:8px;z-index:2;background:#111b;border:1px solid #7776;color:#ddd;font-size:16px}.room-panel{padding:27px;background:#171d23;border:1px solid #343b40;border-radius:5px}.room-panel>strong{display:block;font:36px Georgia,serif;letter-spacing:7px;color:var(--gold);margin:9px 0 23px}.wide{width:100%}.spaced{margin-top:28px}.mode-buttons{display:flex;flex-direction:column;gap:7px}.mode-buttons button{padding:11px;text-align:left;border:1px solid #353e44;background:#11171d;font-size:11px}.mode-buttons button.selected{border-color:var(--gold);color:var(--gold)}.room-rules{margin:23px 0;color:#8e999e;font-size:11px;line-height:2.7}.room-rules b{color:#e0d0b7;margin-right:6px;font-weight:400}.text-btn{background:none;border:0;color:#969e9f;font-size:11px;padding:16px}.game{max-width:1540px;margin:0 auto;padding:0 20px}.match-top{display:flex;align-items:center;justify-content:space-between;height:80px;gap:20px}.scoreboard{display:flex;gap:25px;flex:1}.score-player{min-width:90px}.score-player b{font-size:11px;font-weight:500;display:block;margin-bottom:6px}.score-player b.dead{opacity:.4;text-decoration:line-through}.score-player .dots{letter-spacing:5px;color:var(--gold);font-size:13px}.match-info{text-align:center;display:flex;gap:20px;align-items:center;color:#b8b6a9}.match-info>span:first-child{font-size:10px;letter-spacing:1.8px}.match-info strong{font:28px Georgia,serif}.match-info>span:last-child{font-size:10px;color:#83938d;min-width:125px}.canvas-wrap{position:relative;max-width:1200px;margin:auto;aspect-ratio:1440/900;max-height:calc(100dvh - 270px);background:#13171b;box-shadow:0 10px 50px #0004;overflow:hidden;border:1px solid #41433e;border-radius:4px}.canvas-wrap canvas{display:block;width:100%;height:100%;cursor:crosshair;outline:0}.combat-hud{display:flex;align-items:center;justify-content:space-between;padding:18px 0 22px;max-width:1200px;margin:auto;gap:25px}.vitals{width:215px}.vitals>span{font-size:10px;letter-spacing:2px;color:#cec6b5;display:block;margin-bottom:8px}.health-track{height:17px;background:#30252a;position:relative;border:1px solid #76635955}.health-track div{height:100%;width:100%;background:linear-gradient(90deg,#974448,#e08177);transition:width .12s}.health-track span{position:absolute;inset:0;text-align:center;font-size:9px;line-height:15px;color:#fff}.rage-track{height:4px;background:#343028;margin-top:5px}.rage-track div{background:var(--gold);height:100%;transition:width .15s}.abilities{display:flex;gap:8px}.ability{position:relative;background:#1c232a;border:1px solid #43494b;border-radius:4px;width:83px;height:63px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;overflow:hidden}.ability kbd{font-size:8px;z-index:1}.ability span{font-size:10px;color:#c5c4b9;z-index:1}.ability small{position:absolute;right:4px;bottom:2px;color:var(--gold);font-size:9px;z-index:2}.ability.cool:after{content:'';position:absolute;inset:0;background:#05080bbb;transform:translateY(var(--cool,0%));pointer-events:none}.ability.ultimate{border-color:#998458;background:#403625}.ability.ready{box-shadow:0 0 20px #e3b55433;border-color:#f9d387}.move-hint{font-size:12px;letter-spacing:3px;color:#929891}.move-hint span{display:block;text-align:center;font-size:8px;margin-top:6px;letter-spacing:2px;color:#616e74}.round-overlay{pointer-events:none;position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse,#070b1266,transparent);color:var(--gold);text-shadow:0 4px 20px #000;font:86px Georgia,serif}.round-overlay span{display:block;font:11px 'Segoe UI',sans-serif;letter-spacing:4px;margin-bottom:18px;text-align:center;color:#e8decb}.round-overlay small{font:12px 'Segoe UI',sans-serif;letter-spacing:1px;margin-top:20px}.spectate{position:absolute;bottom:25px;left:0;right:0;text-align:center;pointer-events:none;letter-spacing:4px;font-size:15px;color:#dfad88}.spectate span{display:block;letter-spacing:1px;font-size:10px;color:#ddd1ba;margin-top:7px}.feed{position:absolute;right:18px;top:16px;pointer-events:none;font-size:10px}.feed div{padding:7px 12px;margin-bottom:4px;background:#0a101bd9;border-left:2px solid var(--gold);color:#e3d5ba}.network-warning{position:absolute;left:50%;top:12px;transform:translateX(-50%);padding:8px 15px;font-size:11px;background:#6e332ae8;color:#ffe2d0;border-radius:4px}.result{max-width:900px;margin:65px auto;text-align:center;padding:0 30px}.result h1{font-size:65px;color:var(--gold);margin:20px 0}.result>p{color:var(--muted);margin-bottom:35px}.result table{width:100%;border-collapse:collapse;text-align:left;margin-bottom:30px;font-size:13px}.result th{color:#868f94;font-size:9px;letter-spacing:1px;padding:15px;font-weight:400}.result td{padding:20px 15px;background:#181f25;border-bottom:5px solid var(--bg)}.result .primary{margin:0 auto}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#d7b77a;color:#191c1e;padding:14px 23px;border-radius:4px;z-index:20;box-shadow:0 10px 30px #0008;max-width:90vw;font-size:13px}dialog{background:#141b22;color:var(--white);border:1px solid #6a604b;border-radius:7px;width:min(800px,93vw);padding:40px;box-shadow:0 20px 100px #0009}dialog::backdrop{background:#030710cd;backdrop-filter:blur(4px)}dialog h2{font-size:36px;margin:13px 0 30px}.dialog-close{position:absolute;right:14px;top:10px;font-size:28px;background:none;border:0;color:#888}.help-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 23px}.help-grid p{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.help-grid b{font:20px Georgia,serif;color:#e5d4b8}.help-grid span{font-size:11px;line-height:1.7;color:#a7afb1}.help-note{font-size:11px;line-height:1.8;color:#969e9f;border-top:1px solid #353b3f;padding-top:20px;margin:25px 0}.loading{position:fixed;inset:0;z-index:100;background:#0c1014;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:30px}.loader-mark{font:90px Georgia,serif;color:var(--gold);border-bottom:1px solid var(--gold);padding:15px}.loading span{font-size:10px;letter-spacing:4px;color:#7f887f}.loading.failed span{max-width:400px;text-align:center;line-height:2}.loading.failed{cursor:pointer}@media(min-width:1600px){.home{margin:25px auto;border:1px solid var(--line)}.hero{padding-top:90px}.setup{padding-top:55px}}@media(max-width:1000px){.home{grid-template-columns:1fr 1fr}.hero{padding:55px 7% 30px}.hero h1{font-size:47px}.hero-tags{display:none}.setup{padding:35px 8%}.hero-bottom{padding-top:180px}.hero-rule,.hero-bottom>span:last-child{display:none}.topbar{padding:0 25px}.status{display:none}.lobby-layout{grid-template-columns:1fr 280px;gap:20px}.abilities{gap:5px}.ability{width:67px}.move-hint{display:none}.scoreboard{gap:12px}.match-info{gap:10px}.match-info>span:last-child{min-width:100px;font-size:8px}.canvas-wrap{max-height:calc(100dvh - 260px)}}@media(max-width:700px){.topbar{height:65px;padding:0 18px}.brand{font-size:26px;gap:10px}.brand span{display:none}.topright{gap:6px}.small{padding:8px}.small kbd{display:none}.home{display:block}.hero{min-height:370px;padding:38px 28px}.hero h1{font-size:47px;margin-top:20px}.hero-copy{font-size:12px;margin-top:15px}.hero-bottom{display:none}.hero-art{background-position:center 35%}.setup{padding:30px 28px}.setup h2{font-size:32px}.class-card{height:105px}footer{padding:20px;letter-spacing:1px}footer>span:nth-child(2){display:none}.lobby{margin-top:32px;padding:0 20px}.lobby-header h1{font-size:39px}.lobby-layout{display:block;margin-top:25px}.room-panel{margin-top:25px}.slot{height:190px}.game{padding:0 5px}.match-top{height:70px;gap:4px}.scoreboard{gap:5px}.score-player{min-width:45px}.score-player b{font-size:8px;max-width:75px;overflow:hidden}.match-info>span:first-child{display:none}.match-info strong{font-size:22px}.match-info{display:block}.match-info>span:last-child{display:block;font-size:7px}.combat-hud{padding:10px 5px;gap:10px;flex-wrap:wrap}.vitals{width:100%}.abilities{width:100%;justify-content:center}.ability{width:19%;height:53px}.round-overlay{font-size:48px}.help-grid{grid-template-columns:1fr 1fr}dialog{padding:28px 23px}dialog h2{font-size:27px}.result h1{font-size:42px}.result table{font-size:10px}.result th,.result td{padding:12px 7px}.canvas-wrap{max-height:none}.spectate{font-size:10px;bottom:10px}.spectate span{font-size:7px}.feed{font-size:7px;top:7px;right:5px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}