@font-face{font-family:"ESL Legend";src:url(/fonts/ESLLegend.woff2) format("woff2"),url(/fonts/ESLLegend.otf) format("opentype"),url(/fonts/ESLLegend.ttf) format("truetype");font-display:swap}
:root{--ink:#0b0e1f;--deep:#141a38;--steel:#222a56;--ice:#e9edff;--mute:#8d97c7;--gold:#ffb627;--s0:#3d8bff;--s1:#ff8a1f;--ban:#ff3b5c;--ok:#2fe0a0;--h:"ESL Legend","Alfa Slab One",Impact,sans-serif;--b:Montserrat,system-ui,sans-serif}
*{box-sizing:border-box;margin:0}
body{background:var(--ink);color:var(--ice);font:400 16px/1.5 var(--b);min-height:100vh}
.bg{position:fixed;inset:0;z-index:-1;background:linear-gradient(115deg,transparent 0 55%,rgba(61,139,255,.12) 55% 56%,transparent 56% 70%,rgba(255,182,39,.08) 70% 70.6%,transparent 70.6%),radial-gradient(900px 500px at 85% -10%,rgba(61,139,255,.28),transparent 70%),radial-gradient(700px 500px at -10% 110%,rgba(255,138,31,.2),transparent 70%),var(--ink)}
.peek{position:fixed;right:1.5vw;bottom:0;height:min(34vh,300px);pointer-events:none;display:none;filter:drop-shadow(0 10px 30px rgba(0,0,0,.5))}
@media(min-width:1560px){.peek{display:block}}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:12px clamp(16px,4vw,48px);border-bottom:1px solid rgba(233,237,255,.08);backdrop-filter:blur(8px);position:sticky;top:0;z-index:5;background:rgba(11,14,31,.75)}
.brand{display:flex;align-items:center;gap:14px;color:var(--ice);text-decoration:none;font:400 22px var(--h)}
.brand img{height:50px}
.logo-fallback{font:400 34px var(--h);color:var(--gold);letter-spacing:2px}
nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
nav .who{color:var(--mute);font-weight:600;font-size:14px;margin:0 6px}
main{position:relative;z-index:1;max-width:1240px;margin:0 auto;padding:clamp(20px,4vw,48px)}
h1,h2,h3{font-family:var(--h);font-weight:400;letter-spacing:.5px}
h1{font-size:clamp(34px,6vw,72px);line-height:1.02}
h2{font-size:clamp(24px,3vw,36px);margin-bottom:16px}
.btn{font:800 14px var(--b);letter-spacing:.06em;text-transform:uppercase;border:0;cursor:pointer;color:var(--ink);background:var(--gold);padding:12px 22px;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);text-decoration:none;display:inline-block;transition:transform .15s,filter .15s}
.btn:hover{transform:translateY(-2px);filter:brightness(1.1)}
.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.map:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.btn.ghost{background:var(--steel);color:var(--ice)}
.btn.danger{background:var(--ban);color:#fff}
.btn.ok{background:var(--ok)}
.btn.sm{padding:8px 16px;font-size:12px}
.btn.s0{background:var(--s0);color:#fff}
.btn.s1{background:var(--s1)}
.panel{background:linear-gradient(160deg,rgba(34,42,86,.75),rgba(20,26,56,.75));border:1px solid rgba(233,237,255,.1);padding:24px;border-radius:4px 22px 4px 22px}
label{display:block;font-weight:600;font-size:13px;color:var(--mute);margin:12px 0 4px}
input,select,textarea{width:100%;background:var(--ink);color:var(--ice);border:1px solid var(--steel);padding:12px 14px;font:600 15px var(--b);border-radius:3px}
textarea{min-height:120px;resize:vertical}
input[type=file]{padding:9px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px}
.hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:32px;min-height:70vh}
.hero h1{margin-bottom:8px}
.hero .lead{color:var(--mute);margin-bottom:22px;max-width:46ch}
.hero .btn.full{margin-top:20px;width:100%}
.hero .mascot{width:100%;max-height:68vh;object-fit:contain;filter:drop-shadow(0 24px 50px rgba(61,139,255,.35));animation:rise .8s cubic-bezier(.2,.8,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(40px) scale(.96)}to{opacity:1;transform:none}}
@media(max-width:860px){.hero{grid-template-columns:1fr}.hero .mascot{max-height:30vh;order:-1}}
table{width:100%;border-collapse:collapse}
td,th{padding:10px 8px;border-bottom:1px solid rgba(233,237,255,.08);text-align:left;font-size:14px}
th{color:var(--mute);font-weight:600}
.pill{display:inline-block;padding:2px 10px;font-weight:800;font-size:12px;background:var(--steel);border-radius:20px}
.pill.bo{background:var(--gold);color:var(--ink)}
.pill.open{background:var(--s1);color:var(--ink)}
.pill.resolved{background:var(--ok);color:var(--ink)}
.mrow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid rgba(233,237,255,.08);flex-wrap:wrap}
.mrow .vs{font:400 22px var(--h)}
.mrow .vs i{font-style:normal;color:var(--gold);margin:0 10px;font-size:16px}
.mrow .actions{display:flex;gap:8px}
.muted{color:var(--mute)}
.hint{font-size:13px;color:var(--mute);margin-top:8px}
.section-title{margin:34px 0 14px}
.versus{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;margin-bottom:26px}
.team{font:400 clamp(26px,4.5vw,56px)/1 var(--h);padding:18px 24px;background:var(--deep);border-bottom:4px solid var(--steel);transition:.3s}
.team small{display:block;font:600 13px var(--b);color:var(--mute);margin-top:8px;letter-spacing:.04em}
.team.B{text-align:right}
.team.active{border-color:var(--gold);box-shadow:0 12px 40px -16px var(--gold);background:linear-gradient(180deg,var(--steel),var(--deep))}
.vsmark{font:400 30px var(--h);color:var(--gold);text-align:center}
.vsmark small{display:block;font:600 12px var(--b);color:var(--mute)}
.bar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:22px;padding:16px 34px;background:var(--gold);color:var(--ink);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 100%,22px 100%)}
.bar h2{margin:0;font-size:clamp(20px,2.6vw,30px)}
.bar.wait{background:var(--steel);color:var(--ice)}
.bar.done{background:var(--ok)}
.bar .me{font-weight:800}
.maps{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.maps.small{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));margin:6px 0 18px}
.map{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--steel) center/cover;border:2px solid transparent;cursor:default;color:var(--ice);font:inherit;text-align:left;padding:0;transition:transform .2s,border-color .2s}
.map .shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(11,14,31,.95))}
.map .name{position:absolute;left:16px;right:12px;bottom:14px;font:400 26px/1.1 var(--h)}
.map .sub{position:absolute;left:16px;bottom:52px;font-weight:800;font-size:12px;letter-spacing:.08em}
.map.can{cursor:pointer}
.map.can:hover{transform:translateY(-6px) rotate(-.6deg);border-color:var(--gold)}
.map.banned{filter:grayscale(1) brightness(.45)}
.map.banned::after{content:"BAN";position:absolute;inset:0;display:grid;place-items:center;font:400 64px var(--h);color:var(--ban);transform:rotate(-14deg);text-shadow:0 4px 20px #000}
.map.banned .sub{color:var(--ban)}
.map.kept{border-color:var(--ok)}
.map .x{position:absolute;top:10px;right:10px}
.sides{position:absolute;right:12px;top:12px}
.tag{display:inline-block;font:800 13px var(--b);padding:4px 12px;letter-spacing:.04em}
.tag.s0{background:var(--s0);color:#fff}
.tag.s1{background:var(--s1);color:var(--ink)}
.choose{position:absolute;left:12px;right:12px;top:12px;display:flex;gap:8px}
.choose .btn{flex:1;padding:12px 6px}
.final{display:grid;gap:12px}
.final .row{display:grid;grid-template-columns:60px 1fr auto auto;align-items:center;gap:18px;padding:14px 18px;background:var(--deep);border-left:6px solid var(--ok)}
.final .n{font:400 26px var(--h);color:var(--gold)}
.final .m{font:400 26px var(--h)}
.copy{margin-top:30px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.copy input{max-width:420px}
.copy .btn{margin-left:auto}
.ghead{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.ghead h2{margin:0}
.ghead .btn{margin-left:auto}
.game{margin-top:24px}
.addmap{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:center}
@media(max-width:700px){.addmap{grid-template-columns:1fr}}
.ticket{padding:18px 0;border-bottom:1px solid rgba(233,237,255,.08)}
.ticket header{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.ticket h3{font-size:20px}
.ticket p{white-space:pre-wrap;max-width:80ch}
.reply{margin-top:10px;padding:12px 16px;background:var(--deep);border-left:4px solid var(--gold)}
.ticket .tools{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(120px);background:var(--ban);color:#fff;padding:12px 22px;font-weight:800;transition:transform .3s;z-index:9}
#toast.ok{background:var(--ok);color:var(--ink)}
#toast.on{transform:translateX(-50%)}
@media(max-width:700px){.versus{grid-template-columns:1fr}.team.B{text-align:left}.final .row{grid-template-columns:40px 1fr auto}.bar{padding:16px 24px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}