@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/barlow-condensed-latin-600-normal.215a93c696.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/barlow-condensed-latin-700-normal.3787a5a419.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:italic;font-weight:700;font-display:swap;src:url(/assets/barlow-condensed-latin-700-italic.3e91132781.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:italic;font-weight:800;font-display:swap;src:url(/assets/barlow-condensed-latin-800-italic.59b4810062.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/jost-latin-400-normal.f94cffda16.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/jost-latin-500-normal.98dce4f076.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/jost-latin-600-normal.d0487d6845.woff2) format('woff2')}

/* Layout: hero-select screen that already knows the answer. Top bar of match settings; scoreboard (allies over enemies) on the left; lock-in panel + ranked portrait strip on the right; enemy intel and full table below. */
:root{
  --ground:#0a1424; --ground-hi:#10203a; --panel:#13223a;
  --line:rgba(205,214,236,.14); --line-hi:rgba(205,214,236,.34);
  --text:#ffffff; --text-2:#b4c0d4; --text-3:#9aa8bf;
  --orange:#f99e1a; --orange-ink:#1b1304;
  --ally:#3fb8f0; --ally-row:rgba(63,184,240,.13);
  --enemy:#ff5a67; --enemy-row:rgba(232,65,79,.15);
  --display:"Barlow Condensed","Arial Narrow",sans-serif;
  --body:"Jost","Futura","Century Gothic",system-ui,sans-serif;
  --cut:12px; --skew:-10deg;
  --ease:cubic-bezier(.16,.84,.24,1);
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--ground)}
body{margin:0;min-height:100vh;color:var(--text);font:400 15px/1.45 var(--body);
  background:radial-gradient(1200px 600px at 78% -10%,#18305a 0%,rgba(24,48,90,0) 60%),linear-gradient(180deg,var(--ground-hi) 0,var(--ground) 520px)}
::selection{background:var(--orange);color:var(--orange-ink)}
:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
button,select,input{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
*{scrollbar-width:thin;scrollbar-color:#2c4268 transparent}
::-webkit-scrollbar{height:8px;width:8px}::-webkit-scrollbar-thumb{background:#2c4268}
a{color:var(--text-2);text-underline-offset:3px}
a:hover{color:var(--text)}

.cond{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.02em}
.ital{font-family:var(--display);font-style:italic;font-weight:800;text-transform:uppercase;letter-spacing:0}
.num{font-family:var(--display);font-weight:700;font-variant-numeric:tabular-nums}

/* Portrait from the sprite */
.pt{display:block;flex:none;background-image:var(--sprite);background-size:800% 700%;background-repeat:no-repeat;background-color:#1d3152}
.pt.none{background-image:none;display:grid;place-items:center;font:italic 800 14px/1 var(--display);color:var(--text-2)}
.frame{clip-path:polygon(14% 0,100% 0,86% 100%,0 100%)}
.ico{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Top bar ---------- */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:rgba(8,17,32,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
.top-in{max-width:1440px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:14px 22px;flex-wrap:wrap}
.mark{display:flex;align-items:baseline;gap:6px;font:italic 800 24px/1 var(--display);text-transform:uppercase;white-space:nowrap}
.mark b{color:var(--text-2);font-weight:800}
.roles{display:flex;gap:4px}
.skew{transform:skewX(var(--skew))}
.skew>*{transform:skewX(calc(var(--skew) * -1))}
.rtab{display:flex;align-items:center;height:38px;padding:0 16px;background:var(--panel);border:1px solid var(--line);transition:background .15s var(--ease),border-color .15s}
.rtab>span{display:flex;align-items:center;gap:8px;font:italic 800 17px/1 var(--display);text-transform:uppercase;letter-spacing:.02em;color:var(--text-2)}
.rtab:hover{border-color:var(--line-hi)}
.rtab:hover>span{color:var(--text)}
.rtab[aria-pressed="true"]{background:var(--orange);border-color:var(--orange)}
.rtab[aria-pressed="true"]>span{color:var(--orange-ink)}
@media (max-width:420px){.roles{width:100%}.rtab{flex:1 1 0;min-width:0;padding:0 6px;justify-content:center}.rtab>span{font-size:15px;gap:6px}}
.mapsel{position:relative;flex:1 1 240px;max-width:340px;height:38px;background:var(--panel);border:1px solid var(--line)}
.mapsel:hover{border-color:var(--line-hi)}
.mapsel{display:flex;align-items:center;gap:10px;padding:0 12px 0 0;text-align:left;overflow:hidden}
.mapsel .mth{width:64px;height:100%;flex:none;background-image:var(--maps);background-size:600% 600%;background-color:#1d3152;clip-path:polygon(0 0,100% 0,82% 100%,0 100%)}
.mapsel .mnm{flex:1;min-width:0;font:italic 800 17px/1 var(--display);text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mapsel .mnm small{font:700 12px/1 var(--display);font-style:normal;letter-spacing:.06em;color:var(--text-3);margin-left:8px}
.mapsel .ico{color:var(--text-2);position:static}
.mapsel select{appearance:none;-webkit-appearance:none;width:100%;height:100%;background:transparent;border:0;padding:0 34px 0 14px;font:italic 800 17px/1 var(--display);text-transform:uppercase;letter-spacing:.02em;color:var(--text);cursor:pointer}
.mapsel select option,.mapsel select optgroup{background:#13223a;color:#fff;text-transform:none;font-family:var(--body)}
.mapsel .ico{position:absolute;right:12px;top:11px;pointer-events:none;color:var(--text-2)}
.toggles{display:flex;gap:10px;margin-left:auto;flex-wrap:wrap}
.tog{display:flex;gap:3px}
.tog button{height:30px;padding:0 11px;border:1px solid var(--line);background:transparent;transform:skewX(var(--skew))}
.tog button>span{display:block;transform:skewX(calc(var(--skew) * -1));font:italic 800 14px/1 var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--text-2)}
.tog button:hover{border-color:var(--line-hi)}.tog button:hover>span{color:var(--text)}
.tog button[aria-pressed="true"]{background:var(--orange);border-color:var(--orange)}
.tog button[aria-pressed="true"]>span{color:var(--orange-ink)}
.tog .sh{display:none}
@media (max-width:760px){.tog .lg{display:none}.tog .sh{display:inline}}

@media (max-width:760px){.top{position:static}.top-in{padding:10px 16px;gap:10px}.mark{width:100%}.mapsel{max-width:none;flex:1 1 100%;order:3}.toggles{margin-left:0;order:4}.roles{order:2}}
/* ---------- Page grid ---------- */
.page{max-width:1440px;margin:0 auto;padding-inline:20px;padding-block:22px 48px;display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:1060px){.page{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){.page{padding-inline:16px;padding-block:16px 96px;gap:18px}.mapinfo p.mnote:not(.stage){display:none}.teams{display:flex;flex-direction:column}.team.enemy{order:-1}.mapinfo h2{font-size:22px}.bslot .pt{width:46px;height:46px}.row{height:44px}.row .pt{width:34px;height:34px}.row .nm{font-size:18px}}

/* ---------- Scoreboard ---------- */
.board{display:grid;gap:14px}
.mapinfo{display:grid;gap:8px;padding:14px 16px;background:var(--panel);border:1px solid var(--line);clip-path:polygon(var(--cut) 0,100% 0,100% 100%,0 100%,0 var(--cut))}
.mapinfo h2{margin:0;font:italic 800 26px/1 var(--display);text-transform:uppercase}
.mbanner{position:relative;margin:-14px -16px 2px;height:112px;background-image:var(--maps);background-size:600% 600%;background-color:#1d3152;display:flex;align-items:flex-end;padding:12px 16px}
.mbanner::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,20,36,0) 30%,rgba(10,20,36,.92) 100%)}
.mbanner h2{position:relative;text-shadow:0 2px 6px rgba(0,0,0,.6)}
.mbanner .mode{color:var(--text-2)}
.mbanner .chg{position:absolute;top:10px;right:12px;z-index:1}
@media (max-width:760px){.mbanner{height:44px;padding:8px 14px}.mbanner h2{font-size:20px}.mbanner .mode{display:none}}
.mapinfo .mode{font:700 13px/1 var(--display);text-transform:uppercase;letter-spacing:.06em;color:var(--text-3);margin-left:8px;font-style:normal}
.mapinfo p{margin:0;color:var(--text-2);font-size:14px;max-width:60ch}
.mapinfo p.stage b{color:var(--text);font-weight:600}
.stages,.sides{display:flex;flex-wrap:wrap;gap:3px}
.stg,.sd{height:32px;padding:0 11px;border:1px solid var(--line);transform:skewX(var(--skew));transition:background .15s var(--ease),border-color .15s}
.stg>span,.sd>span{display:flex;align-items:center;gap:6px;transform:skewX(calc(var(--skew) * -1));font:italic 800 15px/1 var(--display);text-transform:uppercase;color:var(--text-2)}
.stg:hover,.sd:hover{border-color:var(--line-hi)}.stg:hover>span,.sd:hover>span{color:var(--text)}
.stg[aria-pressed="true"],.sd[aria-pressed="true"]{background:var(--orange);border-color:var(--orange)}
.stg[aria-pressed="true"]>span,.sd[aria-pressed="true"]>span{color:var(--orange-ink)}
.sd{flex:1}.sd>span{justify-content:center}
.tag.fav.bad{border-color:var(--enemy);color:var(--enemy)}
.tag.fav.good{border-color:var(--ally);color:var(--ally)}
.tags{display:flex;flex-wrap:wrap;gap:5px}
.tag{font:700 12px/1 var(--display);text-transform:uppercase;letter-spacing:.06em;padding:5px 7px;border:1px solid var(--line-hi);color:var(--text-2)}
.tag.warn{border-color:var(--text-2);color:var(--text)}
.teams{display:grid;gap:14px}
@media (max-width:1060px) and (min-width:560px){.teams{grid-template-columns:1fr 1fr}}
.team{display:grid;gap:3px}
.thead{display:flex;align-items:center;justify-content:space-between;height:30px;padding:0 12px;font:italic 800 17px/1 var(--display);text-transform:uppercase}
.thead .cnt{font:700 14px/1 var(--display);font-style:normal;letter-spacing:.06em;opacity:.85}
.team.ally .thead{background:repeating-linear-gradient(-60deg,rgba(255,255,255,.16) 0 2px,transparent 2px 7px) right/38% 100% no-repeat,var(--ally);color:#04131f}
.bans .thead{background:repeating-linear-gradient(-60deg,rgba(255,255,255,.08) 0 2px,transparent 2px 7px) right/38% 100% no-repeat,#2a3a55;color:#fff}
.bans{background:rgba(8,17,32,.35);padding-bottom:10px}
.bslots{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:10px 10px 2px}
.bslot{display:grid;gap:5px;justify-items:center;min-width:0}
.bslot .fr{position:relative;isolation:isolate}
.bslot .pt{width:54px;height:54px;filter:grayscale(.6) brightness(.8)}
.bslot.empty .pt{background:rgba(205,214,236,.07);filter:none;display:grid;place-items:center;color:var(--text-3)}
.bslot.empty:hover .pt{color:var(--text)}
.bslot .bx{position:absolute;inset:0;display:grid;place-items:center;color:#fff}
.bslot .bx .ico{width:30px;height:30px;stroke-width:2;color:var(--enemy);filter:drop-shadow(0 1px 2px rgba(0,0,0,.8))}
.bslot .bl{font:700 12px/1.1 var(--display);text-transform:uppercase;letter-spacing:.04em;color:var(--text-3);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bslot:hover .bl{color:var(--text)}
.bslot:hover .fr::before{content:"";position:absolute;inset:-2px;background:#fff;clip-path:polygon(14% 0,100% 0,86% 100%,0 100%);z-index:-1}
.bwarn{margin:6px 12px 0;font-size:13px;color:var(--enemy)}
.bsugd{margin:8px 10px 0;border-top:1px solid var(--line)}
.bsugd>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:8px 0 0;font:700 12px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--text-2)}
.bsugd>summary::-webkit-details-marker{display:none}
.bsugd>summary:hover{color:var(--text)}
.bsugd .sm{display:flex;gap:3px;margin-left:auto}
.bsugd .sm .pt{width:22px;height:22px}
.bsugd>summary .ico{transition:transform .2s var(--ease)}
.bsugd[open]>summary .ico{transform:rotate(180deg)}
.bsug{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 0 0}
.bsug .lab{width:100%;font:700 12px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--text-3)}
.bsug .why{width:100%;margin:2px 0 0;font-size:13px;color:var(--text-2)}
.bsug .why b{color:var(--text);font-weight:600}
.row.is-banned .nm{text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:var(--enemy)}
.row.is-banned .sub{color:var(--enemy)}
.team.enemy .thead{background:repeating-linear-gradient(-60deg,rgba(255,255,255,.14) 0 2px,transparent 2px 7px) right/38% 100% no-repeat,#e8414f;color:#fff}
.row{display:flex;align-items:center;gap:10px;width:100%;height:50px;padding:0 12px 0 10px;text-align:left;border:1px solid transparent;transition:background .15s var(--ease),border-color .15s}
.team.ally .row{background:var(--ally-row)}
.team.enemy .row{background:var(--enemy-row)}
.row:hover{border-color:var(--line-hi)}
.row .ri{color:var(--text-2)}
.row .pt{width:40px;height:40px}
.row .nm{flex:1;min-width:0;font:italic 800 20px/1 var(--display);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .sub{font:700 12px/1 var(--display);text-transform:uppercase;letter-spacing:.06em;color:var(--text-3)}
.row.empty .nm{font-style:normal;font-weight:700;font-size:15px;letter-spacing:.05em;color:var(--text-3)}
.row.empty .pt{background:transparent;border:1px dashed var(--line-hi)}
.row.empty{background:transparent!important;border:1px dashed var(--line)}
.row.empty:hover{border-color:var(--line-hi)}
.row.empty:hover .nm{color:var(--text)}
.row.you{cursor:default;border-color:var(--orange);background:linear-gradient(90deg,rgba(249,158,26,.2),rgba(249,158,26,.05))!important}
.row.you .nm{color:var(--orange)}
.row.you:hover{border-color:var(--orange)}
.utils{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ghost{height:32px;padding:0 12px;border:1px solid var(--line)}
.ghost>span{font:italic 800 14px/1 var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--text-2)}
.ghost:hover{border-color:var(--line-hi)}.ghost:hover>span{color:var(--text)}
.check{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--text-2);cursor:pointer}
.check input{appearance:none;-webkit-appearance:none;width:18px;height:18px;margin:0;border:1px solid var(--line-hi);display:grid;place-items:center;transform:skewX(var(--skew));cursor:pointer}
.check input:checked{background:var(--orange);border-color:var(--orange)}
.check input:checked::after{content:"";width:8px;height:4px;border:2px solid var(--orange-ink);border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}

/* ---------- Lock-in panel ---------- */
.main{display:grid;gap:22px;min-width:0}
.lock{position:relative;background:linear-gradient(115deg,#1b3053 0%,#13223a 46%,#101d33 100%);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px));padding:22px 24px 22px 22px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 26px}
@media (max-width:640px){.lock{grid-template-columns:92px minmax(0,1fr);gap:8px 14px;padding:16px}.lock .reasons,.lock .plan{grid-column:1/-1}}
.lock .big{width:clamp(120px,15vw,188px);height:clamp(120px,15vw,188px);grid-row:span 3}
.lhead>div:first-child{min-width:0}
@media (max-width:640px){.lname{font-size:clamp(34px,11vw,46px);overflow-wrap:anywhere}.lock .big{width:92px;height:92px;grid-row:auto}.lside{width:100%;justify-content:space-between}.verdict{justify-items:start}}
.lhead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;min-width:0}
.lname{margin:0;font:italic 800 clamp(46px,6.2vw,84px)/.86 var(--display);text-transform:uppercase;letter-spacing:-.005em;text-wrap:balance}
.lmeta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:10px;font:700 14px/1 var(--display);text-transform:uppercase;letter-spacing:.06em;color:var(--text-2)}
.lmeta .rk{color:var(--text)}
.lmeta .ri{display:flex;align-items:center;gap:6px}
.lside{display:flex;align-items:center;gap:10px}
.verdict{display:grid;gap:6px;justify-items:end}
.vlabel{font:italic 800 20px/1 var(--display);text-transform:uppercase;color:var(--text)}
.pips{display:flex;gap:3px}
.pips i{width:14px;height:8px;background:rgba(205,214,236,.18);transform:skewX(var(--skew))}
.pips i.on{background:#fff}
.pips.low i.on{background:var(--enemy)}
.star{width:38px;height:38px;border:1px solid var(--line-hi);display:grid;place-items:center;color:var(--text-2)}
.star:hover{color:var(--text);border-color:var(--text-2)}
.star[aria-pressed="true"]{color:var(--orange);border-color:var(--orange)}
.star .ico{fill:none}.star[aria-pressed="true"] .ico{fill:currentColor}
.reasons{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:2px;min-width:0}
.rs{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:42px;padding:5px 12px 5px 6px;background:rgba(8,17,32,.45)}
.rs .pt{width:30px;height:30px}
.rs .gl{width:30px;height:30px;display:grid;place-items:center;color:var(--text-2);border:1px solid var(--line)}
.rs .tx{min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.rs .hd{font:italic 800 17px/1.1 var(--display);text-transform:uppercase;letter-spacing:.01em}
.rs .dt{font-size:14px;color:var(--text-2)}
.rs .v{font:italic 800 19px/1 var(--display);font-variant-numeric:tabular-nums;min-width:34px;text-align:right}
.rs.pos .v,.rs.pos .hd{color:var(--ally)}
.rs.neg .v,.rs.neg .hd{color:var(--enemy)}
.brk{grid-column:2;display:flex;flex-wrap:wrap;gap:4px}
@media (max-width:640px){.brk{grid-column:1/-1}}
.brk .tot{border:1px solid var(--line-hi);background:transparent;color:var(--text-2)}
.brk .tot b{color:var(--text)}
.brk span{display:inline-flex;align-items:baseline;gap:6px;padding:5px 8px;background:rgba(8,17,32,.45);font:700 12px/1 var(--display);letter-spacing:.05em;text-transform:uppercase;color:var(--text-3)}
.brk b{font:italic 800 15px/1 var(--display);letter-spacing:0;font-variant-numeric:tabular-nums}
.brk .p b{color:var(--ally)} .brk .n b{color:var(--enemy)} .brk .z b{color:var(--text-3)}
.lmeta .conf.low{color:var(--enemy)} .lmeta .conf.mid{color:var(--text-2)}
.cand .dl{position:absolute;right:4px;top:2px;display:flex;align-items:center;gap:1px;font:italic 800 13px/1 var(--display);padding:2px 4px;background:rgba(8,17,32,.85)}
.cand .dl.up{color:var(--ally)} .cand .dl.dn{color:var(--enemy)}
.cand .dl .ico{width:10px;height:10px;stroke-width:2.4}
.plan{grid-column:2;margin:6px 0 0;font-size:15px;color:var(--text-2)}
.plan b{font:italic 800 16px/1 var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--ally);margin-right:8px}
.ultrow{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding-top:10px;border-top:1px solid var(--line)}
@media (max-width:640px){.ultrow{grid-column:1/-1}}
.ulab{display:flex;align-items:center;gap:6px;font:italic 800 17px/1 var(--display);text-transform:uppercase;color:var(--text);margin-right:4px}
.ulab .ico{color:var(--orange)}
.combo{display:inline-flex;align-items:center;gap:8px;padding:3px 10px 3px 3px;background:rgba(8,17,32,.45);font-size:13px;color:var(--text-2);max-width:100%}
.combo .pt{width:26px;height:26px}
.combo b{font:italic 800 15px/1 var(--display);text-transform:uppercase;color:var(--ally);margin-right:4px}
.nocombo{font-size:13px;color:var(--text-3)}
.notice{grid-column:1/-1;font-size:14px;color:var(--text-2);padding:9px 12px;border:1px solid var(--line);background:rgba(8,17,32,.4)}
.notice b{color:var(--text);font-weight:600}

/* name wipe — signature */
@media (prefers-reduced-motion:no-preference){
  .lock.swap .lname{animation:wipe .2s var(--ease) both}
  .lock.swap .big{animation:fadein .24s var(--ease) both}
  .lock.swap .rs{animation:rowin .26s var(--ease) both}
  .lock.swap .rs:nth-child(2){animation-delay:.02s}.lock.swap .rs:nth-child(3){animation-delay:.04s}
  .lock.swap .rs:nth-child(4){animation-delay:.06s}.lock.swap .rs:nth-child(5){animation-delay:.08s}.lock.swap .rs:nth-child(6){animation-delay:.1s}
}
@keyframes wipe{from{clip-path:polygon(0 0,0 0,-12% 100%,-12% 100%);transform:translateX(-14px)}to{clip-path:polygon(0 0,112% 0,100% 100%,-12% 100%);transform:none}}
@keyframes fadein{from{opacity:.35;transform:translateX(-8px)}to{opacity:1;transform:none}}
@keyframes rowin{from{opacity:.4;transform:translateX(-6px)}to{opacity:1;transform:none}}

/* ---------- Candidate strip ---------- */
.strip-wrap{display:grid;gap:10px;min-width:0}
.sec{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.sec h3{margin:0;font:italic 800 24px/1 var(--display);text-transform:uppercase}
.sec .aside{font-size:13px;color:var(--text-3)}
.strip{display:flex;gap:6px;overflow-x:auto;padding:4px 2px 10px;scroll-snap-type:x proximity}
.cand{position:relative;flex:none;width:86px;display:grid;gap:5px;justify-items:center;scroll-snap-align:start;transition:transform .15s var(--ease)}
.cand .pt{width:86px;height:86px;transition:filter .15s}
.cand .fr{position:relative}
.cand .fr::after{content:"";position:absolute;inset:0;border:2px solid transparent;clip-path:polygon(14% 0,100% 0,86% 100%,0 100%)}
.cand .rk{position:absolute;left:8px;top:2px;font:italic 800 16px/1 var(--display);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8)}
.cand .sb{position:absolute;right:6px;bottom:4px;color:var(--orange)}
.cand .sb .ico{width:13px;height:13px;fill:currentColor}
.cand .cn{font:italic 800 14px/1.1 var(--display);text-transform:uppercase;letter-spacing:.01em;color:var(--text-2);max-width:86px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cand .bar{width:62px;height:4px;background:rgba(205,214,236,.14);transform:skewX(var(--skew))}
.cand .bar i{display:block;height:100%;background:var(--ally)}
.cand.weak .bar i{background:var(--enemy)}
.cand.weak .pt{filter:grayscale(.85) brightness(.75)}
.cand:hover{transform:translateY(-2px)}
.cand:hover .cn{color:var(--text)}
.cand:hover.weak .pt{filter:none}
.cand[aria-pressed="true"] .pt{background-color:#2a426b}
.cand[aria-pressed="true"] .cn{color:var(--orange)}
.cand[aria-pressed="true"]{transform:translateY(-3px)}
.cand[aria-pressed="true"] .fr::before{content:"";position:absolute;inset:-3px;background:var(--orange);clip-path:polygon(14% 0,100% 0,86% 100%,0 100%);z-index:-1}
.cand .fr{isolation:isolate}
.divider{flex:none;width:1px;align-self:stretch;margin:0 8px;background:var(--line-hi);position:relative}
.divider span{position:absolute;top:28px;left:50%;transform:translateX(-50%) rotate(-90deg);font:700 11px/1 var(--display);letter-spacing:.1em;color:var(--text-3);white-space:nowrap}

/* ---------- Team swaps ---------- */
.swaps{display:grid;gap:3px}
.swp{display:grid;grid-template-columns:44px auto 44px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:8px 14px 8px 10px;background:var(--ally-row)}
.swp.keep{grid-template-columns:44px minmax(0,1fr) auto;background:rgba(63,184,240,.06)}
.swp .pt{width:44px;height:44px}
.swp .arr{color:var(--orange)}
.swto{position:relative;isolation:isolate}
.swto::before{content:"";position:absolute;inset:-3px;background:var(--orange);clip-path:polygon(14% 0,100% 0,86% 100%,0 100%);z-index:-1;opacity:0;transition:opacity .15s}
.swto:hover::before{opacity:1}
.swp h4{margin:0 0 3px;font:italic 800 19px/1 var(--display);text-transform:uppercase}
.swp h4 span{color:var(--text-3);font-size:15px;margin:0 2px}
.swp p{margin:0;font-size:13px;color:var(--text-2)}
.swp .gain{font:italic 800 22px/1 var(--display);color:var(--ally)}
.swto::after{content:"";position:absolute;inset:-3px;border:2px solid var(--orange);clip-path:polygon(14% 0,100% 0,86% 100%,0 100%);opacity:.0}
.swbtn{border-color:var(--orange)}.swbtn>span{color:var(--orange)}
.swbtn:hover{background:var(--orange)}.swbtn:hover>span{color:var(--orange-ink)}
@media (max-width:560px){.swp{grid-template-columns:40px auto 40px minmax(0,1fr)}.swp .gain{grid-column:4;grid-row:2;justify-self:start;align-self:center;font-size:18px}.swp .swbtn{grid-column:4;grid-row:2;justify-self:end}.swp .pt{width:40px;height:40px}.swp.keep{grid-template-columns:40px minmax(0,1fr) auto}}
/* ---------- Enemy intel ---------- */
.intel{display:grid;gap:3px}
.irow{display:grid;grid-template-columns:52px minmax(0,1fr) minmax(0,1.1fr);gap:16px;align-items:center;padding:10px 14px 10px 10px;background:var(--enemy-row)}
@media (max-width:760px){.irow{grid-template-columns:52px minmax(0,1fr)}.irow .ans{grid-column:1/-1}}
.irow .pt{width:52px;height:52px}
.irow h4{margin:0 0 3px;font:italic 800 20px/1 var(--display);text-transform:uppercase}
.irow h4 small{font:700 12px/1 var(--display);font-style:normal;letter-spacing:.06em;color:var(--text-3);margin-left:6px}
.irow p{margin:0;font-size:14px;color:var(--text-2);max-width:62ch}
.irow .hit{margin-top:4px;font-size:13px;color:var(--enemy)}
.ans{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.ans .lab{font:700 12px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);width:100%}
.chip{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 10px 0 2px;background:rgba(8,17,32,.55);border:1px solid var(--line);transition:border-color .15s}
.chip .pt{width:28px;height:28px}
.chip span{font:italic 800 15px/1 var(--display);text-transform:uppercase;letter-spacing:.01em}
.chip:hover{border-color:var(--ally)}
.none-ans{font-size:13px;color:var(--text-3)}

@media (max-width:760px){.sec{flex-direction:column;align-items:flex-start;gap:4px}.ans{display:grid;grid-template-columns:1fr 1fr}.ans .lab{grid-column:1/-1}.chip{min-width:0}.chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
/* ---------- Table ---------- */
details.full{border:1px solid var(--line);background:rgba(19,34,58,.6)}
details.full>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;font:italic 800 20px/1 var(--display);text-transform:uppercase}
details.full>summary::-webkit-details-marker{display:none}
details.full>summary .ico{transition:transform .2s var(--ease)}
details.full[open]>summary .ico{transform:rotate(180deg)}
.tw{overflow-x:auto;padding:0 16px 14px}
table{border-collapse:collapse;width:100%;min-width:640px;font-variant-numeric:tabular-nums}
th{font:700 12px/1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);text-align:right;padding:8px 8px;border-bottom:1px solid var(--line-hi)}
td{font:700 16px/1 var(--display);text-align:right;padding:6px 8px;border-bottom:1px solid var(--line)}
th:nth-child(2),td:nth-child(2){text-align:left}
td .hc{display:flex;align-items:center;gap:10px;font-style:italic;font-weight:800;text-transform:uppercase}
td .pt{width:28px;height:28px}
td.p{color:var(--ally)} td.n{color:var(--enemy)} td.z{color:var(--text-3)}
td.tot{color:var(--text);font-size:18px}
tbody tr{cursor:pointer}
tbody tr:hover td{background:rgba(205,214,236,.05)}
tbody tr.sel td{background:rgba(249,158,26,.1)}
td.tier{color:var(--text-2)}

/* ---------- Footer ---------- */
footer{max-width:1440px;margin:0 auto;padding:0 20px 40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;color:var(--text-3);font-size:13px}
footer h5{margin:0 0 8px;font:700 14px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--text-2)}
footer p,footer ul{margin:0;max-width:62ch}
footer ul{padding-left:16px;display:grid;gap:3px}

/* ---------- Lock-in bar (narrow screens) ---------- */
.lockbar{position:fixed;left:0;right:0;bottom:0;z-index:6;display:none;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(8,17,32,.96);border-top:2px solid var(--orange);transition:transform .2s var(--ease)}
@media (max-width:1060px){.lockbar{display:flex}}
.lockbar.away{transform:translateY(110%)}
.lockbar .pt{width:44px;height:44px}
.lockbar .lb-t{flex:1;min-width:0;font:italic 800 26px/1 var(--display);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lockbar .lb-v{font:700 13px/1.15 var(--display);text-transform:uppercase;letter-spacing:.05em;color:var(--text-2);text-align:right}
.lockbar .go{height:38px;padding:0 16px;background:var(--orange)}
.lockbar .go>span{font:italic 800 17px/1 var(--display);text-transform:uppercase;letter-spacing:.02em;color:var(--orange-ink)}
/* ---------- Hero select overlay ---------- */
.ov{position:fixed;inset:0;z-index:20;background:rgba(4,9,18,.82);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px}
.sel{width:min(820px,100%);max-height:min(88vh,760px);display:grid;grid-template-rows:auto auto minmax(0,1fr);background:linear-gradient(180deg,#152744,#0e1a2f);border:1px solid var(--line-hi);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px))}
@media (max-width:600px){.ov{padding:0;align-items:flex-end}.sel{max-height:90vh;clip-path:none;padding-bottom:env(safe-area-inset-bottom,0px)}}
.selhead{display:flex;align-items:center;gap:12px;padding:16px 18px 10px}
.selhead h2{margin:0;flex:1;font:italic 800 30px/1 var(--display);text-transform:uppercase}
.selhead h2 em{font-style:inherit;color:var(--ally)}
.selhead h2 em.en{color:var(--enemy)}
.x{width:38px;height:38px;border:1px solid var(--line-hi);display:grid;place-items:center;color:var(--text-2)}
.x:hover{color:#fff;border-color:#fff}
.selbar{display:flex;gap:10px;padding:0 18px 12px;flex-wrap:wrap}
.search{flex:1 1 220px;display:flex;align-items:center;gap:8px;height:38px;padding:0 12px;border:1px solid var(--line-hi);background:rgba(8,17,32,.6);color:var(--text-2)}
.search input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#fff;font-size:15px}
.search:focus-within{border-color:var(--orange)}
.grid{overflow:auto;padding:4px 18px 20px;display:grid;gap:16px;align-content:start}
.grp h3{margin:0 0 8px;font:700 13px/1 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px 6px}
.tile{display:grid;gap:6px;justify-items:center;transition:transform .14s var(--ease)}
.tile .fr{position:relative;isolation:isolate}
.tile .pt{width:84px;height:84px}
.tile span{font:italic 800 15px/1.1 var(--display);text-transform:uppercase;letter-spacing:.01em;color:var(--text-2);text-align:center}
.tile:hover{transform:translateY(-2px)}
.tile:hover span{color:#fff}
.tile:hover .fr::before,.tile.cur .fr::before{content:"";position:absolute;inset:-3px;background:#fff;clip-path:polygon(14% 0,100% 0,86% 100%,0 100%);z-index:-1}
.tile.cur .fr::before{background:var(--orange)}
.tile.cur span{color:var(--orange)}
.tile[disabled]{opacity:.32;cursor:not-allowed;transform:none}
.tile[disabled] .pt{filter:grayscale(1)}
.tile[disabled] .fr::before{display:none}
.empty-res{color:var(--text-3)}
.sel.wide{width:min(1040px,100%)}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:10px}
.mcard{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:0;min-width:0;width:100%;text-align:left;background:#0e1a2f;border:1px solid var(--line);transition:transform .14s var(--ease),border-color .14s}
.mcard .mi{display:block;aspect-ratio:16/9;max-width:100%;background-image:var(--maps);background-size:600% 600%;background-color:#1d3152}
.mcard .mt{display:flex;align-items:baseline;justify-content:space-between;gap:6px;padding:7px 9px 8px}
.mcard .mt b{font:italic 800 16px/1.05 var(--display);text-transform:uppercase;min-width:0;overflow-wrap:anywhere}
.mcard .mt small{font:700 11px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);white-space:nowrap}
.mcard:hover{transform:translateY(-2px);border-color:#fff}
.mcard.cur{border-color:var(--orange);box-shadow:0 0 0 1px var(--orange)}
.mcard.cur .mt b{color:var(--orange)}
.mcard.any .mi{display:grid;place-items:center;background-image:none;color:var(--text-3)}
.mcard.any .mi .ico{width:34px;height:34px}
.mcard .flag{position:absolute;top:6px;left:6px;font:700 11px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;padding:4px 6px;background:rgba(8,17,32,.82);border:1px solid var(--line-hi);color:var(--text)}
.mcard .mp{display:flex;align-items:center;gap:4px;padding:0 9px 9px;font:700 11px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--text-3)}
.mcard .mp .pt{width:22px;height:22px}
@media (max-width:600px){.mgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mcard .mt b{font-size:14px}}
.pdone{margin-left:auto}
.tile .fr em{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);font:italic 800 12px/1 var(--display);text-transform:uppercase;padding:3px 6px;white-space:nowrap}
.tile .fr em.tb{background:var(--enemy);color:#fff}
.tile .fr em.tr{background:#e9eef7;color:#0b1626}
.tile[disabled]:has(em.tb){opacity:.55}
.pnote{margin:0;font-size:13px;color:var(--text-3)}

a.mark{color:inherit;text-decoration:none}