@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;-webkit-tap-highlight-color:transparent;padding-bottom:env(safe-area-inset-bottom)}
.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)}
a{color:inherit}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:calc(10px + env(safe-area-inset-top)) clamp(14px,3vw,40px) 10px;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,.85)}
.brand{display:flex;align-items:center;gap:12px;color:var(--ice);text-decoration:none;font:400 24px var(--h)}
.brand img{height:48px}
.logo-fallback{font:400 30px var(--h);color:var(--gold);letter-spacing:2px}
nav{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
nav .who{color:var(--mute);font-weight:600;font-size:13px;margin:0 6px}
main{max-width:1280px;margin:0 auto;padding:clamp(18px,3.5vw,44px)}
h1,h2,h3{font-family:var(--h);font-weight:400;letter-spacing:.5px;line-height:1.05}
h1{font-size:clamp(34px,6vw,70px)}
h2{font-size:clamp(24px,3vw,36px);margin-bottom:14px}
h3{font-size:21px}
.btn{font:800 13px var(--b);letter-spacing:.06em;text-transform:uppercase;border:0;cursor:pointer;color:var(--ink);background:var(--gold);padding:12px 20px;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,summary: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:7px 14px;font-size:11px}
.btn.s0{background:var(--s0);color:#fff}
.btn.s1{background:var(--s1)}
.bell{position:relative}
.bell i{position:absolute;top:-6px;right:-4px;min-width:18px;height:18px;border-radius:9px;background:var(--ban);color:#fff;font:800 10px/18px var(--b);text-align:center;font-style:normal;padding:0 4px}
#np{position:fixed;top:calc(64px + env(safe-area-inset-top));right:clamp(8px,3vw,40px);width:min(380px,calc(100vw - 16px));max-height:70vh;overflow:auto;background:var(--deep);border:1px solid rgba(233,237,255,.15);z-index:20;padding:14px;box-shadow:0 20px 60px rgba(0,0,0,.6)}
#np[hidden]{display:none}
#np a.n{display:block;text-decoration:none;padding:10px 8px;border-bottom:1px solid rgba(233,237,255,.08);font-size:14px}
#np a.n.new{background:rgba(255,182,39,.1);border-left:3px solid var(--gold)}
#np small{color:var(--mute);display:block;font-size:11px}
.panel{background:linear-gradient(160deg,rgba(34,42,86,.75),rgba(20,26,56,.75));border:1px solid rgba(233,237,255,.1);padding:22px;border-radius:4px 22px 4px 22px}
label{display:block;font-weight:600;font-size:12px;color:var(--mute);margin:10px 0 4px}
input,select,textarea{width:100%;background:var(--ink);color:var(--ice);border:1px solid var(--steel);padding:10px 12px;font:600 14px var(--b);border-radius:3px}
textarea{min-height:100px;resize:vertical}
input[type=file]{padding:8px}
input[type=checkbox]{width:auto}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:22px}
.grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.row.between{justify-content:space-between}
.muted{color:var(--mute)}
.hint{font-size:13px;color:var(--mute);margin-top:8px}
.section-title{margin:34px 0 14px}
.pill{display:inline-block;padding:2px 10px;font-weight:800;font-size:11px;background:var(--steel);border-radius:20px;letter-spacing:.04em}
.pill.gold{background:var(--gold);color:var(--ink)}
.pill.ok,.pill.resolved{background:var(--ok);color:var(--ink)}
.pill.open{background:var(--s1);color:var(--ink)}
table{width:100%;border-collapse:collapse}
td,th{padding:9px 8px;border-bottom:1px solid rgba(233,237,255,.08);text-align:left;font-size:14px}
th{color:var(--mute);font-weight:600}
tr.adv td:first-child{box-shadow:inset 3px 0 var(--gold)}
.scroll{overflow-x:auto}
.tl{width:22px;height:22px;object-fit:contain;vertical-align:middle;margin-right:8px;border-radius:4px;background:rgba(255,255,255,.04)}
.tl.big{width:92px;height:92px;margin:0 18px 0 0;border-radius:10px}
.hero{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:30px;min-height:64vh}
.hero h1 span{color:var(--gold);display:block}
.hero .lead{color:var(--mute);margin:14px 0 22px;max-width:48ch}
.hero .mascot{width:100%;max-height:62vh;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}}
.tabs{display:flex;gap:8px;margin-bottom:6px}
@media(max-width:860px){.hero{grid-template-columns:1fr}.hero .mascot{max-height:28vh;order:-1}}
.card{display:block;text-decoration:none;padding:20px;background:var(--deep);border-bottom:4px solid var(--steel);transition:border-color .2s,transform .2s}
.card:hover{border-color:var(--gold);transform:translateY(-4px)}
.card h3{margin:8px 0 6px;font-size:24px}
.card p{color:var(--mute);font-size:14px}
.mrow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 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:15px}
.champ{display:flex;align-items:center;gap:16px;padding:18px 26px;background:linear-gradient(100deg,var(--gold),#ffd36b);color:var(--ink);margin-bottom:22px;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 100%,20px 100%)}
.champ b{font:400 34px var(--h)}
.groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:20px}
.gm{display:grid;gap:12px;margin-top:14px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.bracket{display:flex;gap:34px;overflow-x:auto;padding:6px 4px 22px}
.round{display:flex;flex-direction:column;justify-content:space-around;gap:16px;min-width:270px}
.round>h3{color:var(--gold);font-size:17px;text-align:center}
.mcard{background:var(--deep);border-left:4px solid var(--steel)}
.mcard.live{border-color:var(--gold)}
.mcard.done{border-color:var(--ok)}
.trow{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 12px;font-weight:600;border-bottom:1px solid rgba(233,237,255,.06)}
.trow b{font:400 20px var(--h)}
.trow.win{background:rgba(47,224,160,.12)}
.trow.win .tn{color:var(--ok)}
.trow.mine{outline:2px solid var(--gold);outline-offset:-2px}
.trow .pk{font:800 10px var(--b);background:var(--gold);color:var(--ink);border:0;padding:4px 10px;cursor:pointer;letter-spacing:.06em}
.mmeta{display:flex;justify-content:space-between;gap:6px;padding:6px 12px;font-size:11px;color:var(--mute);font-weight:600}
.mmaps{display:flex;gap:10px;flex-wrap:wrap;padding:4px 12px;font-size:11px;color:var(--mute)}
.mmaps b{color:var(--ice)}
.adm{border-top:1px solid rgba(233,237,255,.08);padding:6px 12px}
.adm summary{cursor:pointer;font-size:11px;font-weight:800;color:var(--gold);letter-spacing:.06em;text-transform:uppercase}
.adm .row{margin:8px 0}
.adm input{padding:6px 8px;width:64px}
.adm input.nm{width:110px}
.adm input[type=datetime-local]{width:190px}
.versus{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;margin-bottom:24px}
.team{font:400 clamp(24px,4.2vw,52px)/1 var(--h);padding:16px 22px;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}
.team.B{text-align:right}
.team.active{border-color:var(--gold);box-shadow:0 12px 40px -16px var(--gold)}
.vsmark{font:400 28px 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:20px;padding:14px 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(18px,2.4vw,28px)}
.bar.wait{background:var(--steel);color:var(--ice)}
.bar.done{background:var(--ok)}
.maps{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.maps.small{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));margin:6px 0 16px}
.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:14px;right:10px;bottom:12px;font:400 24px/1.1 var(--h)}
.map .sub{position:absolute;left:14px;bottom:48px;font-weight:800;font-size:11px;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 60px 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)}
.sides{position:absolute;right:10px;top:10px}
.tag{display:inline-block;font:800 12px var(--b);padding:4px 10px;letter-spacing:.04em}
.tag.s0{background:var(--s0);color:#fff}
.tag.s1{background:var(--s1);color:var(--ink)}
.choose{position:absolute;left:10px;right:10px;top:10px;display:flex;gap:8px}
.choose .btn{flex:1;padding:12px 6px}
.final{display:grid;gap:10px}
.final .row2{display:grid;grid-template-columns:50px 1fr auto auto;align-items:center;gap:16px;padding:12px 16px;background:var(--deep);border-left:6px solid var(--ok)}
.final .n{font:400 24px var(--h);color:var(--gold)}
.final .m{font:400 24px var(--h)}
.copy{margin-top:26px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.copy input{max-width:400px}
.ghead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.ghead h2{margin:0}
.game{margin-top:22px}
.addmap{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:center}
.member{display:grid;grid-template-columns:1fr 1fr 130px auto auto;gap:8px;align-items:center;margin-bottom:8px}
.member input,.member select{padding:8px 10px}
.checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px;max-height:220px;overflow:auto;padding:6px;background:var(--ink);border:1px solid var(--steel)}
.checks label{display:flex;gap:8px;align-items:center;margin:0;color:var(--ice);font-size:14px}
.ticket{padding:16px 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 p{white-space:pre-wrap;max-width:80ch}
.reply{margin-top:10px;padding:10px 14px;background:var(--deep);border-left:4px solid var(--gold)}
.res{display:inline-block;width:26px;height:26px;line-height:26px;text-align:center;font-weight:800;font-size:12px;margin-right:8px}
.res.w{background:var(--ok);color:var(--ink)}
.res.l{background:var(--ban);color:#fff}
.day{margin:22px 0 8px;color:var(--gold);font:400 22px var(--h)}
.thead{display:flex;align-items:center;margin:10px 0}
#toast{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%) translateY(140px);background:var(--ban);color:#fff;padding:12px 22px;font-weight:800;transition:transform .3s;z-index:30;max-width:92vw}
#toast.ok{background:var(--ok);color:var(--ink)}
#toast.on{transform:translateX(-50%)}
@media(max-width:760px){.versus{grid-template-columns:1fr}.team.B{text-align:left}.final .row2{grid-template-columns:36px 1fr auto}.bar{padding:14px 24px}.addmap,.member{grid-template-columns:1fr}.round{min-width:240px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}