:root{
  --red:#b71c1c; --red-d:#8e1414; --red-l:#e53935; --bg:#eceff1; --card:#fff; --line:#e6e8ea; --line2:#f2f3f4;
  --text:#212121; --muted:#8a9197; --muted2:#b0b6bb; --green:#43a047; --green-bg:#e8f5e9; --blue:#1e88e5; --gold:#f9a825;
  --win:#2e7d32; --loss:#c62828; --head:#fafafa;
  --font:'Exo 2',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--text);font:14px/1.4 var(--font);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:hover{color:var(--red)}
img{max-width:100%}
.hide{display:none!important}
.muted{color:var(--muted)}
.upper{text-transform:uppercase}

/* ---------- header ---------- */
.header{background:var(--red);color:#fff;position:sticky;top:0;z-index:50;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.header .in{max-width:1240px;margin:0 auto;height:56px;display:flex;align-items:center;gap:18px;padding:0 16px}
.logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:22px;letter-spacing:.5px;color:#fff!important}
.logo svg{width:30px;height:30px}
.nav{display:flex;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav a{color:#fff;font-weight:700;text-transform:uppercase;font-size:14px;padding:8px 9px;white-space:nowrap;border-radius:3px;opacity:.95}
.nav a:hover,.nav a.on{background:rgba(0,0,0,.18);color:#fff}
.nav a.gold{color:#ffd54f}
.hsearch{position:relative}
.hsearch input{width:190px;height:32px;border:0;border-radius:3px;padding:0 10px 0 32px;background:rgba(255,255,255,.16);color:#fff;font:inherit;outline:0}
.hsearch input::placeholder{color:rgba(255,255,255,.75)}
.hsearch input:focus{background:#fff;color:var(--text)}
.hsearch svg{position:absolute;left:9px;top:8px;width:16px;height:16px;opacity:.85;pointer-events:none}
.burger{display:none;background:none;border:0;color:#fff;padding:6px;cursor:pointer}

/* ---------- ticker (top strip like dltv) ---------- */
.ticker{max-width:1240px;margin:14px auto 0;padding:0 16px}
.ticker .row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin;padding-bottom:4px}
.tk{flex:0 0 auto;background:linear-gradient(135deg,#2b2f3a,#1b1e26);color:#fff;border-radius:4px;display:flex;align-items:center;gap:10px;padding:8px 12px;min-width:210px}
.tk img{width:30px;height:30px;object-fit:contain}
.tk .mid{text-align:center;flex:1;font-size:11px;line-height:1.2}
.tk .mid b{display:block;font-size:13px}
.tk .mid .lv{color:#ff5252;font-weight:800}
.tk:hover{color:#fff;filter:brightness(1.2)}

/* ---------- layout ---------- */
.wrap{max-width:1240px;margin:0 auto;padding:14px 16px 40px}
.grid3{display:grid;grid-template-columns:330px 1fr 320px;gap:16px;align-items:start}
.grid2{display:grid;grid-template-columns:1fr 320px;gap:16px;align-items:start}
.card{background:var(--card);border-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.06);margin-bottom:16px;overflow:hidden}
.card.pad{padding:16px}
.h{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 0}
.h h2,.h h1{margin:0;font-size:15px;font-weight:800;text-transform:uppercase;letter-spacing:.3px;position:relative;padding-bottom:9px}
.h h2:after,.h h1:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:var(--red)}
.h a.more{font-size:11px;font-weight:800;color:var(--red);text-transform:uppercase}
.h a.more:after{content:" ›";font-size:14px}
.crumbs{font-size:11px;color:var(--muted);text-transform:uppercase;margin:2px 0 12px}
.crumbs a:hover{color:var(--red)}
.crumbs span{margin:0 6px}

/* tabs */
.tabs{display:flex;border-bottom:1px solid var(--line);margin-top:10px;overflow-x:auto;scrollbar-width:none}
.tabs button,.tabs a{flex:1;background:none;border:0;border-bottom:2px solid transparent;padding:11px 12px;font:700 12px var(--font);text-transform:uppercase;color:var(--text);cursor:pointer;white-space:nowrap;text-align:center}
.tabs .on{border-bottom-color:var(--red);color:var(--red)}
.tabs.left button,.tabs.left a{flex:0 0 auto}

/* ---------- match list (left column) ---------- */
.day{background:var(--head);text-align:center;font-size:10px;font-weight:800;padding:5px;color:#555;border-bottom:1px solid var(--line);letter-spacing:.3px}
.ml{display:block;border-bottom:1px solid var(--line);padding:8px 14px 8px}
.ml:hover{background:#fafafa;color:inherit}
.ml .tn{font-size:10px;color:var(--muted);margin-bottom:4px;display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ml .tn img{width:13px;height:13px;object-fit:contain}
.ml .tn .star{color:var(--gold)}
.ml .tr{display:grid;grid-template-columns:24px 1fr 26px 60px;align-items:center;gap:8px;height:28px}
.ml .tr img{width:24px;height:24px;object-fit:contain}
.ml .tr .nm{font-weight:700;font-size:12px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ml .tr .sc{font-weight:800;color:var(--red);text-align:center;font-size:15px}
.ml .tr .sc.w{color:var(--win)}
.ml .tr .sc.l{color:var(--muted)}
.ml .tr .st{font-size:12px;font-weight:700;text-align:right;color:#333}
.ml .tr .st.bo{color:var(--muted);font-weight:600}
.live-badge{display:inline-block;background:var(--red-l);color:#fff;font-size:10px;font-weight:800;padding:2px 7px;border-radius:2px;letter-spacing:.4px;animation:blink 1.6s infinite}
@keyframes blink{50%{opacity:.55}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--red);color:#fff!important;border:0;border-radius:3px;padding:9px 16px;font:800 12px var(--font);text-transform:uppercase;cursor:pointer}
.btn:hover{background:var(--red-d)}
.btn.ghost{background:#fff;color:var(--red)!important;border:1px solid var(--red)}
.btn.block{display:flex;margin:12px 14px 14px}
.empty{padding:28px 16px;text-align:center;color:var(--muted)}

/* ---------- news ---------- */
.hero{position:relative;display:block;height:330px;background:#222 center/cover no-repeat;color:#fff;border-radius:4px;overflow:hidden}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(0,0,0,.85))}
.hero .t{position:absolute;left:18px;right:18px;bottom:18px;z-index:1}
.hero h3{margin:8px 0 0;font-size:24px;line-height:1.15;text-transform:uppercase;font-weight:800}
.hero:hover{color:#fff}
.cat{display:inline-block;background:var(--red);color:#fff;font-size:10px;font-weight:800;padding:3px 8px;text-transform:uppercase;border-radius:2px}
.news2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.news2 .hero{height:190px}
.news2 .hero h3{font-size:15px}
.nl{display:flex;justify-content:space-between;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);font-weight:700;text-transform:uppercase;font-size:13px}
.nl .d{font-size:11px;color:var(--muted);text-transform:none;white-space:nowrap;font-weight:500}
.newsgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:16px}
.nc{display:block}
.nc .im{height:150px;background:#ddd center/cover;border-radius:4px}
.nc h4{margin:8px 0 4px;text-transform:uppercase;font-size:14px;line-height:1.2}
.article{padding:20px 24px}
.article h1{font-size:28px;text-transform:uppercase;line-height:1.15;margin:8px 0}
.article .body{font-size:16px;line-height:1.65}
.article .body img{border-radius:4px}
.article .cover{width:100%;max-height:420px;object-fit:cover;border-radius:4px;margin:10px 0}
.video{position:relative;padding-top:56.25%;background:#000;border-radius:4px;overflow:hidden}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- right column: primary leagues / standings ---------- */
.ev-card{padding:14px 16px}
.ev-card .banner{height:130px;border-radius:4px;background:#1b1e26 center/contain no-repeat;margin-bottom:10px}
.ev-card h3{margin:0;text-align:center;text-transform:uppercase;font-size:14px}
.ev-card .dates{text-align:center;font-size:11px;color:var(--muted);margin-top:2px}
.kv{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line2);font-size:12px}
.kv span:first-child{color:var(--muted);text-transform:uppercase;font-size:11px}
.kv span:last-child{font-weight:700}
.stand{width:100%;border-collapse:collapse;font-size:12px}
.stand th{font-size:10px;text-transform:uppercase;color:var(--muted);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);font-weight:700}
.stand td{padding:7px 10px;border-bottom:1px solid var(--line2)}
.stand td.n{width:26px;color:var(--muted);font-weight:700}
.stand td.tm a{display:flex;align-items:center;gap:8px;font-weight:700;text-transform:uppercase}
.stand td.tm img{width:22px;height:22px;object-fit:contain}
.stand td.r{text-align:right;font-weight:800;white-space:nowrap}
.stand tr.q td{background:var(--green-bg)}
.pager{display:flex;align-items:center;gap:8px}
.pager button{background:none;border:0;font-size:18px;cursor:pointer;color:var(--muted);padding:0 4px}
.pager button:hover{color:var(--red)}

/* ---------- tables (events, stats, ranking) ---------- */
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{font-size:10px;text-transform:uppercase;color:var(--muted);text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);font-weight:700;white-space:nowrap;background:var(--head)}
.tbl th.s{cursor:pointer}
.tbl th.s:hover{color:var(--red)}
.tbl td{padding:9px 12px;border-bottom:1px solid var(--line2);vertical-align:middle}
.tbl tr:hover td{background:#fafafa}
.tbl .ent{display:flex;align-items:center;gap:10px;font-weight:700;text-transform:uppercase}
.tbl .ent img{width:28px;height:28px;object-fit:contain;border-radius:2px}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums}
.tbl .c{text-align:center}
.tier{display:inline-block;font-size:10px;font-weight:800;padding:2px 7px;border-radius:2px;background:#eceff1;text-transform:uppercase}
.tier.S{background:#ffecb3;color:#8d6e00}.tier.A{background:#ffcdd2;color:#b71c1c}.tier.B{background:#e3f2fd;color:#0d47a1}
.tscroll{overflow-x:auto}

/* ---------- match page ---------- */
.mhead{padding:18px 16px 16px;text-align:center}
.mhead .tt{font-weight:800;text-transform:uppercase;font-size:13px}
.mhead .bl{font-size:11px;color:var(--muted)}
.mh-row{display:grid;grid-template-columns:1fr 150px 180px 150px 1fr;align-items:center;margin-top:14px}
.mh-row .tn{font-weight:800;font-size:18px;text-transform:uppercase}
.mh-row .tn.l{text-align:right;padding-right:16px}
.mh-row .tn.r{text-align:left;padding-left:16px}
.mh-row .lg{width:110px;height:110px;object-fit:contain;justify-self:center}
.mh-row .score{font-size:40px;font-weight:800;line-height:1}
.mh-row .score .w{color:var(--win)}
.mh-row .when{font-size:12px;color:var(--muted);margin-bottom:6px}
.mh-row .sub{margin-top:8px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase}
.countdown{font-size:26px;font-weight:800;letter-spacing:1px}
.form{display:flex;gap:3px;justify-content:center;margin-top:6px}
.form i{width:8px;height:8px;border-radius:50%;background:var(--loss)}
.form i.w{background:var(--win)}
.streams{display:flex;gap:6px;flex-wrap:wrap;padding:10px 16px}
.streams button{border:1px solid var(--line);background:#fff;border-radius:3px;padding:6px 10px;font:700 11px var(--font);cursor:pointer;text-transform:uppercase}
.streams button.on{border-color:var(--red);color:var(--red)}
.gtabs{display:flex;gap:6px;padding:12px 16px 0;flex-wrap:wrap}
.gtabs button{border:1px solid var(--line);background:#fff;border-radius:3px;padding:7px 14px;font:800 12px var(--font);text-transform:uppercase;cursor:pointer}
.gtabs button.on{background:var(--red);color:#fff;border-color:var(--red)}
.gtabs button .dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-left:6px;vertical-align:middle}
.gsum{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;padding:14px 16px}
.gsum .side{display:flex;align-items:center;gap:10px;font-weight:800;text-transform:uppercase}
.gsum .side.r{justify-content:flex-end}
.gsum .side img{width:34px;height:34px;object-fit:contain}
.gsum .mid{text-align:center}
.gsum .mid .k{font-size:28px;font-weight:800}
.gsum .mid .k .b{color:var(--blue)} .gsum .mid .k .rr{color:var(--red-l)}
.sidetag{font-size:10px;font-weight:800;padding:2px 6px;border-radius:2px;color:#fff}
.sidetag.blue{background:var(--blue)} .sidetag.red{background:var(--red-l)}
.wtag{font-size:10px;font-weight:800;color:var(--win);border:1px solid var(--win);padding:1px 5px;border-radius:2px}
.obj{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:0 16px 12px}
.obj div{background:var(--head);border-radius:3px;text-align:center;padding:7px 4px;font-size:11px;color:var(--muted);text-transform:uppercase}
.obj b{display:block;font-size:14px;color:var(--text)}
.obj b .b{color:var(--blue)} .obj b .rr{color:var(--red-l)}
.golddiff{height:8px;border-radius:4px;background:var(--red-l);margin:0 16px 14px;overflow:hidden}
.golddiff i{display:block;height:100%;background:var(--blue)}
.sb{width:100%;border-collapse:collapse;font-size:12px}
.sb th{background:var(--head);font-size:10px;text-transform:uppercase;color:var(--muted);padding:7px 8px;text-align:center;font-weight:700}
.sb th:first-child{text-align:left}
.sb td{padding:6px 8px;border-bottom:1px solid var(--line2);text-align:center;white-space:nowrap}
.sb td.pl{text-align:left}
.sb .plc{display:flex;align-items:center;gap:8px}
.sb .champ{width:34px;height:34px;border-radius:3px;position:relative}
.sb .champ img{width:34px;height:34px;border-radius:3px;display:block}
.sb .champ em{position:absolute;right:-3px;bottom:-3px;background:#222;color:#fff;font-size:9px;font-style:normal;border-radius:2px;padding:0 3px}
.sb .pn{font-weight:800;text-transform:uppercase}
.sb .role{font-size:10px;color:var(--muted);text-transform:uppercase}
.sb .items{display:flex;gap:2px;justify-content:center}
.sb .items img,.sb .items span{width:22px;height:22px;border-radius:2px;background:#eee;display:block}
.sb tr.blue td:first-child{box-shadow:inset 3px 0 var(--blue)}
.sb tr.red td:first-child{box-shadow:inset 3px 0 var(--red-l)}
.lineups{display:grid;grid-template-columns:1fr 1fr;gap:0}
.lineups .col{padding:12px 16px}
.lineups .col+.col{border-left:1px solid var(--line)}
.pl-row{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid var(--line2)}
.pl-row img{width:40px;height:40px;object-fit:cover;border-radius:50%;background:#eee}
.pl-row b{text-transform:uppercase;display:block}
.pl-row small{color:var(--muted);text-transform:uppercase;font-size:10px}
.h2h{display:flex;justify-content:space-around;padding:14px;text-align:center}
.h2h b{font-size:26px;display:block}

/* ---------- profile (team/player/event) ---------- */
.prof{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:18px}
.prof .ph{width:200px;height:200px;background:#f4f5f6 center/contain no-repeat;border-radius:4px}
.prof h1{margin:0 0 4px;text-transform:uppercase;font-size:26px}
.prof .real{color:var(--muted);margin-bottom:10px}
.prof .kvs{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:0 18px}
.roster{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:16px}
.pcard{background:var(--head);border-radius:4px;text-align:center;padding:12px 8px;display:block}
.pcard img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:4px;background:#e6e6e6}
.pcard b{display:block;text-transform:uppercase;margin-top:6px}
.pcard small{color:var(--muted);text-transform:uppercase;font-size:10px}
.statbox{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;padding:16px}
.statbox div{background:var(--head);border-radius:4px;padding:10px;text-align:center}
.statbox b{display:block;font-size:20px}
.statbox span{font-size:10px;color:var(--muted);text-transform:uppercase}
.desc{padding:0 18px 18px;line-height:1.6}
.bracket{display:flex;gap:24px;overflow-x:auto;padding:16px}
.bracket .rnd{display:flex;flex-direction:column;justify-content:space-around;gap:12px;min-width:210px}
.bm{border:1px solid var(--line);border-radius:3px;display:block}
.bm div{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:5px 8px;font-size:12px;font-weight:700;text-transform:uppercase}
.bm div+div{border-top:1px solid var(--line2)}
.bm img{width:18px;height:18px;object-fit:contain}
.bm .w{color:var(--win)}
.datestrip{display:flex;align-items:center;gap:4px;padding:12px 10px;overflow-x:auto}
.datestrip a{flex:1;min-width:46px;text-align:center;padding:6px 2px;border-radius:3px;font-size:10px;color:var(--muted);text-transform:uppercase;line-height:1.2}
.datestrip a b{display:block;font-size:15px;color:var(--text)}
.datestrip a.on{background:var(--red);color:#fff}.datestrip a.on b{color:#fff}
.datestrip a.today b{color:var(--red)}.datestrip a.on.today b{color:#fff}
.chip{display:inline-block;padding:5px 11px;border-radius:14px;background:#eceff1;font-size:11px;font-weight:700;text-transform:uppercase;margin:0 4px 6px 0}
.chip.on{background:var(--red);color:#fff}
.filters{padding:12px 16px 6px}
.mrow{display:grid;grid-template-columns:130px 1fr 90px 1fr 110px;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--line)}
.mrow:hover{background:#fafafa;color:inherit}
.mrow .tt{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow .tm{display:flex;align-items:center;gap:10px;font-weight:800;text-transform:uppercase;font-size:13px;min-width:0}
.mrow .tm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow .tm.l{justify-content:flex-end;text-align:right}
.mrow .tm img{width:30px;height:30px;object-fit:contain;flex:0 0 30px}
.mrow .c{text-align:center;font-weight:800;font-size:18px}
.mrow .c small{display:block;font-size:10px;color:var(--muted);font-weight:600}
.mrow .r{text-align:right}
.vods{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:16px}
.vod{display:block;cursor:pointer}
.vod .th{position:relative;padding-top:56.25%;background:#000 center/cover;border-radius:4px}
.vod .th:after{content:"▶";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;background:rgba(183,28,28,.9);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px}
.vod h4{margin:8px 0 2px;text-transform:uppercase;font-size:13px}
.footer{background:#1b1e26;color:#aab;padding:28px 16px;font-size:12px}
.footer .in{max-width:1240px;margin:0 auto;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer a{color:#dde}

@media (max-width:1100px){
  .grid3{grid-template-columns:1fr 300px}
  .grid3>.c-left{grid-column:1/-1;order:2}
  .grid3>.c-main{order:1}
  .grid3>.c-right{order:1}
}
@media (max-width:860px){
  .grid3,.grid2{grid-template-columns:1fr}
  .burger{display:block}
  .nav{display:none;position:absolute;top:56px;left:0;right:0;background:var(--red-d);flex-direction:column;padding:8px}
  .nav.open{display:flex}
  .hsearch input{width:120px}
  .hero{height:230px}.hero h3{font-size:18px}
  .news2,.newsgrid,.vods{grid-template-columns:1fr}
  .roster{grid-template-columns:repeat(2,1fr)}
  .prof{grid-template-columns:1fr}.prof .ph{width:120px;height:120px}
  .mh-row{grid-template-columns:1fr 70px 110px 70px 1fr}
  .mh-row .lg{width:60px;height:60px}.mh-row .tn{font-size:12px}.mh-row .score{font-size:28px}
  .mrow{grid-template-columns:1fr 60px 1fr;row-gap:4px}
  .mrow .tt,.mrow .r{grid-column:1/-1;text-align:center}
  .lineups{grid-template-columns:1fr}.lineups .col+.col{border-left:0}
  .obj{grid-template-columns:repeat(3,1fr)}
}
/* many LoL team logos are white-on-transparent: give them a soft outline on light backgrounds */
.ml img,.mrow img,.stand img,.tbl .ent img,.pcard img,.mh-row .lg,.gsum img,.bm img,.prof .ph,.search img{filter:drop-shadow(0 0 1px rgba(0,0,0,.55)) drop-shadow(0 0 .5px rgba(0,0,0,.4))}
.pcard img[src*="/players/"],.tbl .ent img[src*="/players/"],.tbl .ent img[src*="ddragon"]{filter:none}
.grid3>*,.grid2>*,.card{min-width:0}
@media (max-width:860px){
  .wrap{padding:12px 10px 30px}
  .gsum{grid-template-columns:1fr auto 1fr;gap:6px}
  .gsum .side{font-size:11px;gap:5px;flex-wrap:wrap}
  .gsum .side img{width:24px;height:24px}
  .gsum .mid .k{font-size:22px}
  .mh-row .tn.l{padding-right:6px}.mh-row .tn.r{padding-left:6px}
  .ticker{padding:0 10px}
  .hsearch input{width:110px}
}
@media (max-width:860px){
  .mh-row{grid-template-columns:1fr auto 1fr;grid-template-areas:"l1 c l2" "n1 c n2";row-gap:6px}
  .mh-row>:nth-child(1){grid-area:n1}.mh-row>:nth-child(2){grid-area:l1}.mh-row>:nth-child(3){grid-area:c;padding:0 6px}
  .mh-row>:nth-child(4){grid-area:l2}.mh-row>:nth-child(5){grid-area:n2}
  .mh-row .tn.l,.mh-row .tn.r{text-align:center;padding:0}
  .mh-row .lg{width:64px;height:64px}
}

/* ---------- streams (dltv "watch match") ---------- */
.ptabs{display:flex;gap:4px;padding:12px 16px 0;border-bottom:1px solid var(--line);overflow-x:auto}
.ptabs button{display:flex;align-items:center;gap:6px;background:none;border:0;border-bottom:2px solid transparent;padding:8px 12px;font:700 12px var(--font);text-transform:uppercase;cursor:pointer;white-space:nowrap}
.ptabs button em{font-style:normal;color:var(--muted);font-weight:600}
.ptabs button.on{border-bottom-color:var(--red);color:var(--red)}
.slist{display:flex;gap:6px;flex-wrap:wrap;padding:12px 16px;max-height:160px;overflow:auto}
.sbtn{display:flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;border-radius:3px;padding:6px 10px;font:600 12px var(--font);cursor:pointer}
.sbtn.on{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}
.sbtn .fl{font-size:14px}.sbtn .vw,.tsr .vw{color:var(--muted);font-size:11px;font-weight:700}
.sbtn .off{font-size:9px;text-transform:uppercase;background:var(--red);color:#fff;border-radius:2px;padding:1px 4px}
.tsr{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line2)}
.tsr-t{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--muted)}
.tsr-t img{width:24px;height:24px;object-fit:contain;filter:drop-shadow(0 0 1px rgba(0,0,0,.5))}

/* ---------- group / swiss table (dltv) ---------- */
.gtbl{width:100%;border-collapse:separate;border-spacing:0;font-size:12px}
.gtbl th{font-size:10px;text-transform:uppercase;color:var(--muted);padding:8px 6px;border-bottom:1px solid var(--line);font-weight:700;text-align:left;white-space:nowrap}
.gtbl th.c,.gtbl td.c{text-align:center}
.gtbl td{padding:0 6px;height:50px;border-bottom:1px solid var(--line2)}
.gtbl td.n{width:28px;color:var(--muted);font-weight:800;text-align:center}
.gtbl td.tm a{display:flex;align-items:center;gap:10px;font-weight:800;text-transform:uppercase;min-width:170px}
.gtbl td.tm img{width:28px;height:28px;object-fit:contain;filter:drop-shadow(0 0 1px rgba(0,0,0,.5))}
.gtbl td.rec{font-weight:800;font-size:13px;white-space:nowrap;width:70px}
.gtbl tr.q td:not(.rc){background:#e8f5e9}
.gtbl tr.e td:not(.rc){background:#ffebee}
.gtbl td.rc{padding:3px;width:62px;border-left:1px solid #fff}
.gc{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;height:44px;border-radius:3px;font-size:10px;font-weight:800;background:#f5f6f7;color:#555}
.gc img{width:20px;height:20px;object-fit:contain;filter:drop-shadow(0 0 1px rgba(0,0,0,.5))}
.gc.w{background:#e8f5e9;color:var(--win)}.gc.l{background:var(--lose-bg);color:var(--loss)}.gc.lv{background:#fff3e0;color:#e65100}
.gc:hover{outline:1px solid var(--red)}

/* ---------- playoff bracket (dltv) ---------- */
.bk-title{padding:14px 16px 0;font-weight:800;text-transform:uppercase;font-size:12px;color:var(--muted)}
.bk{display:flex;overflow-x:auto;padding:12px 16px 16px;align-items:stretch}
.bk-col{display:flex;flex-direction:column;flex:0 0 190px;margin-right:32px}
.bk-col:last-child{margin-right:0}
.bk-col .rh{background:#f1f2f4;border:1px solid var(--line);text-align:center;font-size:11px;font-weight:700;padding:7px 6px;margin-bottom:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bk-body{flex:1;display:flex;flex-direction:column}
.bk-pair{flex:2;display:flex;flex-direction:column;position:relative}
.bk-cell{flex:1;display:flex;align-items:center;position:relative;padding:6px 0}
.bk-card{position:relative;display:flex;width:100%;background:#fff;border:1px solid #dcdfe3;border-radius:2px;min-height:62px}
.bk-card:hover{border-color:var(--red);color:inherit}
.bk-card.live{border-color:var(--red-l)}
.bk-card.empty{border-style:dashed;background:#fafafa}
.bk-card .bd{width:34px;flex:0 0 34px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:9px;font-weight:800;color:var(--muted);border-right:1px solid var(--line2);line-height:1.2}
.bk-card .bd .live-badge{font-size:8px;padding:1px 3px;transform:rotate(-90deg)}
.bts{flex:1;min-width:0;padding:3px 0}
.bts i{display:block;font-size:9px;color:var(--muted2);font-style:normal;padding-left:34px;line-height:1}
.bt{display:flex;align-items:center;gap:7px;padding:3px 8px;font-size:11px;font-weight:700;text-transform:uppercase}
.bt img{width:20px;height:20px;object-fit:contain;filter:drop-shadow(0 0 1px rgba(0,0,0,.5))}
.bt .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bt b{font-size:13px;color:#555}
.bt.w b{color:var(--red)}.bt.w .nm{color:var(--text)}
.bt:not(.w) .nm{color:#555}
/* connectors */
.bk-col.merge .bk-pair::after{content:"";position:absolute;right:-16px;top:25%;bottom:25%;width:16px;border:1px solid #c5c9ce;border-left:0}
.bk-col.merge .bk-card::after,.bk-col.straight .bk-card::after{content:"";position:absolute;top:50%;right:-17px;width:16px;border-top:1px solid #c5c9ce}
.bk-col.straight .bk-card::after{width:32px;right:-33px}
.bk-col.in.merge .bk-card::before,.bk-col.in.straight .bk-card::before,.bk-col.in.end .bk-card::before{content:"";position:absolute;top:50%;left:-16px;width:15px;border-top:1px solid #c5c9ce}
.bk-col.in .bk-body .bk-cell:only-child .bk-card::before{left:-18px}
.bk-col .place{margin-top:8px;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase}

/* event day grid */
.dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;padding:12px 16px 16px}
.dcol{border:1px solid var(--line);border-radius:3px;overflow:hidden}
.dh{background:var(--head);text-align:center;font-size:10px;font-weight:800;padding:7px;border-bottom:1px solid var(--line)}
.drow{display:grid;grid-template-columns:26px 1fr auto 1fr 26px;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line2);font-size:11px;font-weight:800;text-transform:uppercase}
.drow:last-child{border-bottom:0}
.drow img{width:26px;height:26px;object-fit:contain;filter:drop-shadow(0 0 1px rgba(0,0,0,.5))}
.drow .n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.drow .n.r{text-align:right}
.drow .sc,.drow .tm{text-align:center;font-size:13px;min-width:54px}
.drow .sc b.w{color:var(--red)}
.drow .sc .live-badge{display:block;margin:2px auto 0;width:max-content}
.drow.w1{background:linear-gradient(90deg,#e8f5e9 0 50%,#ffebee 50%)}
.drow.w2{background:linear-gradient(90deg,#ffebee 0 50%,#e8f5e9 50%)}
.wr{position:relative;height:18px;background:#eef0f2;border-radius:2px;overflow:hidden}
.wr i{position:absolute;inset:0 auto 0 0;background:#90caf9}
.wr span{position:relative;font-size:11px;font-weight:700;padding-left:6px;line-height:18px}

/* ---------- disciplines: theme + switcher ---------- */
body.g-cs2{--red:#c8870a;--red-d:#9a6604;--red-l:#e8a317}
body.g-valorant{--red:#1f4fa3;--red-d:#163b7c;--red-l:#2f6bd6}
.live-badge{background:#e53935!important}
.header .in{height:64px}
.brand{display:flex;flex-direction:column;justify-content:center;gap:3px;flex:0 0 auto}
.brand .logo{font-size:20px;line-height:1}
.brand .logo svg{width:24px;height:24px}
.gsw{display:flex;gap:3px}
.gsw a{display:flex;align-items:center;gap:3px;font-size:9px;font-weight:800;letter-spacing:.3px;color:rgba(255,255,255,.75);padding:2px 6px 2px 4px;border-radius:9px;background:rgba(0,0,0,.18);line-height:1.3}
.gsw a svg{width:11px;height:11px}
.gsw a:hover{color:#fff;background:rgba(0,0,0,.3)}
.gsw a.on{background:#fff;color:var(--red)}
.gsw a[data-game=lol]:not(.on):hover{box-shadow:inset 0 0 0 1px #e57373}
.gsw a[data-game=cs2]:not(.on):hover{box-shadow:inset 0 0 0 1px #f0b429}
.gsw a[data-game=valorant]:not(.on):hover{box-shadow:inset 0 0 0 1px #5c8ee6}
@media (max-width:860px){.nav{top:64px}}
/* shooter scoreboards */
.mapchip{display:inline-block;background:#263238;color:#fff;font-size:10px;font-weight:800;text-transform:uppercase;padding:2px 7px;border-radius:2px;letter-spacing:.3px}
.gtabs button .ms{font-weight:600;color:var(--muted);margin-left:6px}
.gtabs button.on .ms{color:#fff}
.sb .agent{width:28px;height:28px;border-radius:3px;background:#263238}
.sb td.num{font-variant-numeric:tabular-nums}
.sb .good{color:var(--win);font-weight:800}.sb .bad{color:var(--loss)}
.sb tr.t1 td:first-child{box-shadow:inset 3px 0 var(--red)}
.sb tr.t2 td:first-child{box-shadow:inset 3px 0 #546e7a}
.sb .teamrow td{background:var(--head);font-weight:800;text-transform:uppercase;text-align:left}
.sb .teamrow img{width:20px;height:20px;object-fit:contain;vertical-align:-5px;margin-right:6px}
.rk{display:inline-block;min-width:28px;text-align:center;font-weight:800}
.rk-d{font-size:10px;font-weight:700}.rk-d.up{color:var(--win)}.rk-d.dn{color:var(--loss)}

/* live round state (CS2) */
.lvb{margin:12px 16px 4px;border:1px solid var(--line);border-radius:4px;overflow:hidden}
.lv-top{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--head);font-size:13px;border-bottom:1px solid var(--line)}
.lv-grid{display:grid;grid-template-columns:1fr 1fr}
.lv-team{padding:10px 12px}.lv-team+.lv-team{border-left:1px solid var(--line)}
.lv-team.ct{box-shadow:inset 0 3px #5d79ae}.lv-team.t{box-shadow:inset 0 3px #de9b35}
.lv-h{display:flex;align-items:center;gap:8px;font-size:14px;text-transform:uppercase}
.lv-h img{width:26px;height:26px;object-fit:contain}
.lv-side{font-size:10px;font-weight:800;color:#fff;padding:1px 6px;border-radius:2px}.lv-side.ct{background:#5d79ae}.lv-side.t{background:#de9b35}
.lv-sc{margin-left:auto;font-size:22px;font-weight:800}
.lv-meta{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:11px;color:var(--muted);margin:6px 0}
.lv-meta b{color:var(--text)}
.lv-p td,.lv-p th{padding:4px 6px;font-size:11px}
.lv-p tr.dead td{opacity:.45}
.hp{position:relative;width:54px;height:14px;background:#eceff1;border-radius:2px;overflow:hidden;margin:auto}
.hp i{position:absolute;inset:0 auto 0 0;background:#66bb6a}.hp span{position:relative;font-size:10px;font-weight:700;line-height:14px}
@media (max-width:860px){.lv-grid{grid-template-columns:1fr}.lv-team+.lv-team{border-left:0;border-top:1px solid var(--line)}}

/* LoL live: health bars */
.hpb{position:relative;width:96px;height:12px;margin-top:3px;background:#e0e3e6;border-radius:2px;overflow:hidden}
.hpb i{position:absolute;inset:0 auto 0 0;background:#43a047;transition:width .6s}
.hpb.mid i{background:#f9a825}.hpb.low i{background:#e53935}
.hpb span{position:relative;display:block;font-size:9px;font-weight:700;line-height:12px;text-align:center;color:#263238}
.hpb.dead{background:#37474f}.hpb.dead span{color:#fff;text-transform:uppercase;letter-spacing:.4px}
.sb tr.dead td{opacity:.5}.sb tr.dead td.pl{opacity:1}.sb tr.dead .champ img{filter:grayscale(1)}

/* ---------- charts ---------- */
.charts{padding:6px 16px 16px}
.ctabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:10px}
.ctabs button{background:none;border:0;border-bottom:2px solid transparent;padding:8px 10px;font:700 12px var(--font);text-transform:uppercase;cursor:pointer;color:var(--muted)}
.ctabs button.on{color:var(--text);border-bottom-color:var(--red)}
.chart{position:relative}
.chart svg{display:block;max-width:100%;font-family:var(--font)}
.ctip{position:absolute;z-index:5;min-width:150px;background:#fff;border:1px solid var(--line);border-radius:4px;box-shadow:0 6px 18px rgba(0,0,0,.12);padding:8px 10px;font-size:12px;pointer-events:none}
.ctip b{font-weight:800}.ctip .r{display:flex;align-items:center;gap:6px;margin-top:3px;white-space:nowrap}
.ctip .r i{width:10px;height:10px;border-radius:2px;flex:0 0 10px}
.clegend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:11px;color:var(--muted);margin-top:6px}
.clegend span{display:flex;align-items:center;gap:5px}
.clegend i{width:14px;height:14px;border-radius:50%;color:#fff;font:800 8px/14px var(--font);text-align:center;font-style:normal}
.cmult{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hbgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px 24px}
.hb-t{font-size:11px;font-weight:800;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.hb-r{display:grid;grid-template-columns:22px 90px 1fr 42px;align-items:center;gap:8px;padding:3px 0;font-size:12px}
.hb-r img{width:22px;height:22px;border-radius:3px}
.hb-r .n{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hb-r .bar{height:10px;background:var(--line2);border-radius:0 4px 4px 0;overflow:hidden}
.hb-r .bar i{display:block;height:100%;border-radius:0 4px 4px 0}
.hb-r b{text-align:right;font-variant-numeric:tabular-nums}
.flash{animation:flash 1s ease-out}
@keyframes flash{from{background:rgba(249,168,37,.45)}to{background:transparent}}
@media (max-width:860px){.cmult,.hbgrid{grid-template-columns:1fr}}

/* ---------- accounts ---------- */
.uarea{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.login-btn{background:#fff!important;color:var(--red)!important;padding:7px 14px}
.ubtn{position:relative;display:flex;padding:6px;border-radius:4px}
.ubtn:hover{background:rgba(0,0,0,.18)}
.ubtn em{position:absolute;top:0;right:-2px;min-width:16px;height:16px;border-radius:8px;background:#ffd54f;color:#212121;font:800 10px/16px var(--font);text-align:center;font-style:normal;padding:0 4px}
.umenu{position:relative}
.uava{display:flex;align-items:center;gap:7px;background:none;border:0;color:#fff;font:700 13px var(--font);cursor:pointer;padding:4px 6px;border-radius:4px}
.uava:hover{background:rgba(0,0,0,.18)}
.uava b{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.udrop{display:none;position:absolute;right:0;top:calc(100% + 6px);background:#fff;border-radius:4px;box-shadow:0 8px 24px rgba(0,0,0,.18);min-width:170px;padding:6px;z-index:60}
.umenu.open .udrop{display:block}
.udrop a,.udrop button{display:block;width:100%;text-align:left;padding:8px 10px;border-radius:3px;color:var(--text);background:none;border:0;font:600 13px var(--font);cursor:pointer}
.udrop a:hover,.udrop button:hover{background:var(--head);color:var(--red)}
.uav{width:26px;height:26px;border-radius:50%;object-fit:cover;flex:0 0 26px;display:inline-flex;align-items:center;justify-content:center;background:#90a4ae;color:#fff;font:800 12px var(--font)}
.uava .uav{background:rgba(255,255,255,.25)}
.uav.xl{width:120px;height:120px;flex-basis:120px;font-size:44px}
.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:200;align-items:center;justify-content:center;padding:16px}
.modal.open{display:flex}
.mbox{position:relative;background:#fff;border-radius:6px;width:min(380px,100%);padding:18px 20px 16px}
.mclose{position:absolute;right:10px;top:8px;background:none;border:0;font-size:18px;cursor:pointer;color:var(--muted)}
.mbox .tabs{margin:0 0 14px}
.fl{display:block;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;margin-bottom:10px}
.fl input,.fl textarea,.dmfind input{display:block;width:100%;margin-top:4px;border:1px solid var(--line);border-radius:4px;padding:9px 10px;font:500 14px var(--font);color:var(--text);text-transform:none}
.fl textarea{min-height:80px;resize:vertical}
.fl input:focus,.fl textarea:focus{outline:2px solid rgba(183,28,28,.2);border-color:var(--red)}
.err-t{color:var(--loss);font-size:13px;min-height:18px}
.mnote{font-size:11px;margin:10px 0 0}
.setrow{display:flex;align-items:center;gap:16px;margin-bottom:14px}
#stoast{position:fixed;right:16px;bottom:16px;z-index:300;display:flex;flex-direction:column;gap:8px}
#stoast div{background:#263238;color:#fff;padding:10px 14px;border-radius:4px;box-shadow:0 6px 18px rgba(0,0,0,.2);max-width:320px;font-size:13px}
#stoast div.err{background:var(--loss)}

/* ---------- chat ---------- */
.chatcard .h{align-items:center}
.online{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--muted)}
.online i{width:7px;height:7px;border-radius:50%;background:#43a047}
.chatlist{overflow-y:auto;padding:6px 0;overscroll-behavior:contain}
.cday{text-align:center;font-size:10px;color:var(--muted);text-transform:uppercase;font-weight:700;margin:6px 0}
.cmsg{display:flex;gap:8px;padding:5px 14px;position:relative}
.cmsg:hover{background:#fafafa}
.cmsg .uav{width:28px;height:28px;flex-basis:28px;font-size:12px}
.cb{min-width:0;flex:1}
.ch{display:flex;align-items:baseline;gap:6px}
.cn{font-weight:800;font-size:12px}
.cn.staff{color:var(--red)}
.crole{font-size:9px;font-weight:800;background:var(--red);color:#fff;border-radius:2px;padding:0 4px}
.ct{font-size:10px;color:var(--muted2)}
.ctext{font-size:13px;line-height:1.4;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere}
.ctext a{color:var(--blue);text-decoration:underline}
.cq{font-size:11px;color:var(--muted);border-left:2px solid var(--line);padding-left:6px;margin:2px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ca{display:none;gap:10px;font-size:10px;margin-top:1px}
.cmsg:hover .ca{display:flex}
.ca button,.ca a{background:none;border:0;padding:0;color:var(--muted);font:600 10px var(--font);cursor:pointer}
.ca button:hover,.ca a:hover{color:var(--red)}
.ca .del:hover{color:var(--loss)}
.chatform{border-top:1px solid var(--line);padding:8px 10px}
.chatform .row{display:flex;gap:6px;align-items:flex-end}
.chatform textarea{flex:1;resize:none;border:1px solid var(--line);border-radius:4px;padding:8px 10px;font:500 13px var(--font);max-height:120px;min-height:36px}
.chatform textarea:focus{outline:0;border-color:var(--red)}
.chatform .btn{padding:9px 12px}
.replying{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--muted);padding:0 2px 6px;white-space:nowrap;overflow:hidden}
.replying button{background:none;border:0;cursor:pointer;color:var(--muted)}
.chatcard.hasnew .chatlist{box-shadow:inset 0 -3px 0 var(--red)}

/* ---------- private messages ---------- */
.dmwrap{display:grid;grid-template-columns:300px 1fr;min-height:560px}
.dmside{border-right:1px solid var(--line)}
.dmfind{display:flex;gap:6px;padding:10px 14px}
.dmfind input{margin:0;padding:7px 9px;font-size:13px}
.dmfind .btn{padding:7px 10px}
.conv{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line2)}
.conv:hover,.conv.on{background:var(--head)}
.conv .uav{width:36px;height:36px;flex-basis:36px}
.cvt{min-width:0;flex:1;display:flex;flex-direction:column;font-size:12px}
.cvt span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge{background:var(--red);color:#fff;border-radius:9px;min-width:18px;height:18px;font:800 10px/18px var(--font);text-align:center;font-style:normal;padding:0 5px}
.dmmain{display:flex;flex-direction:column;min-width:0}
.dmhead{padding:12px 16px;border-bottom:1px solid var(--line);min-height:52px;display:flex;align-items:center}
.dmpeer{display:flex;align-items:center;gap:10px;font-size:15px}
.dmmain .chatlist{flex:1;padding:12px 16px}
.dmm{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:8px}
.dmm.mine{align-items:flex-end}
.bub{max-width:72%;background:#eceff1;border-radius:12px 12px 12px 3px;padding:8px 12px;font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere}
.dmm.mine .bub{background:var(--red);color:#fff;border-radius:12px 12px 3px 12px}
.dmm.mine .bub a{color:#fff}
@media (max-width:860px){
  .uava b{display:none}
  .dmwrap{grid-template-columns:1fr}.dmside{border-right:0;border-bottom:1px solid var(--line);max-height:260px;overflow:auto}
}

/* sign-in providers */
.mh{margin:0 0 4px;font-size:20px;text-transform:uppercase}
.oauth{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:11px 14px;border-radius:4px;font:800 14px var(--font);margin-bottom:8px;color:#fff!important;border:0}
.oauth.steam{background:#171a21}.oauth.steam:hover{background:#2a475e}
.oauth.riot{background:#d13639}.oauth.riot:hover{background:#b02a2d}
.oauth-tg{display:flex;justify-content:center;min-height:44px;margin-bottom:8px}
.oauth.soon{background:var(--head);color:var(--muted)!important;font-weight:700;gap:14px;cursor:default}
.oauth.soon em{font-style:normal;font-size:10px;text-transform:uppercase;background:#cfd8dc;color:#455a64;padding:2px 6px;border-radius:2px}
.idrow{display:grid;grid-template-columns:120px 1fr auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line2)}
.idname{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prov{display:inline-block;font-size:11px;font-weight:800;color:#fff;border-radius:3px;padding:3px 8px;text-transform:uppercase;text-align:center}
.prov-steam{background:#171a21}.prov-riot{background:#d13639}.prov-telegram{background:#229ed9}.prov-google{background:#4285f4}.prov-facebook{background:#1877f2}

/* language switcher */
.lsw{position:relative;flex:0 0 auto}
.lsw-b{display:flex;align-items:center;gap:4px;background:rgba(0,0,0,.18);border:0;color:#fff;font:800 12px var(--font);padding:6px 8px;border-radius:4px;cursor:pointer}
.lsw-b:hover{background:rgba(0,0,0,.3)}
.lsw-d{display:none;position:absolute;right:0;top:calc(100% + 6px);background:#fff;border-radius:4px;box-shadow:0 8px 24px rgba(0,0,0,.18);min-width:140px;padding:6px;z-index:60}
.lsw.open .lsw-d{display:block}
.lsw-d a{display:block;padding:8px 10px;border-radius:3px;font:600 13px var(--font);color:var(--text)}
.lsw-d a:hover{background:var(--head);color:var(--red)}
.lsw-d a.on{color:var(--red);font-weight:800}

/* counter-pick matrix */
.cpick{padding:12px 16px 16px;border-top:1px solid var(--line)}
.cpbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin:4px 0 2px}
.cpbar .side{display:flex;align-items:baseline;gap:8px;font-weight:800;text-transform:uppercase;font-size:12px}
.cpbar .side span{font-size:20px;color:#2a78d6}.cpbar .side.r span{color:#e34948}
.cpbar .bar{height:12px;border-radius:6px;background:#e34948;overflow:hidden}
.cpbar .bar i{display:block;height:100%;background:#2a78d6;border-right:2px solid #fff}
.cpcap{font-size:11px;text-align:center;margin-bottom:10px}
.cpt-t{border-collapse:separate;border-spacing:2px;width:100%;font-size:12px}
.cpt-t th{font-weight:700;padding:4px}
.cpt-t td{text-align:center;padding:6px 4px;border-radius:3px;min-width:62px;border:2px solid transparent}
.cpt-t td.lane{border-color:#263238}
.cpt-t td b{display:block;font-size:13px}.cpt-t td small{font-size:9px;color:var(--muted)}
.cph{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10px;text-transform:uppercase}
.cph small{color:var(--muted);font-size:9px;text-transform:none}
.cph.row{flex-direction:row;justify-content:flex-start;gap:8px;text-align:left}
.cph.row div{display:flex;flex-direction:column}
.cpi{width:30px;height:30px;border-radius:3px}
.cpr{text-align:left;min-width:150px}
.cpt{font-weight:800;font-size:12px;background:var(--head)}
.cpt.up,.cpt.dnr{color:#2a78d6}.cpt.dn,.cpt.upr{color:#e34948}
.cpnote{font-size:11px;margin-top:8px;line-height:1.5}

/* polymarket */
.pmr{display:flex;gap:4px}
.pmr button{background:var(--head);border:1px solid var(--line);border-radius:3px;padding:4px 9px;font:700 11px var(--font);cursor:pointer;color:var(--muted)}
.pmr button.on{background:var(--text);border-color:var(--text);color:#fff}
.pmhead{display:flex;justify-content:space-between;align-items:center;padding:10px 16px 0;font-size:12px}
.pmchart{padding:6px 16px 4px}
.pmnote{font-size:11px;padding:0 16px 14px}

/* bookmaker odds */
.bkt td.best{background:#e8f5e9;font-weight:800;color:#1b5e20}
.bkt i{font-style:normal;font-size:9px;margin-left:4px}.bkt i.up{color:#2e7d32}.bkt i.dn{color:#c62828}
.bkt tfoot td{border-top:2px solid var(--line);background:var(--head)}

/* ================= dark theme ================= */
:root{--c-blue:#2a78d6;--c-red:#e34948;--ink-text:#212121;--ink-sub:#52514e;--ink-muted:#8a9197;--ink-grid:#eceff1;--ink-axis:#cfd4d8;--ink-surface:#ffffff;
  --s1:#2a78d6;--s2:#eb6834;--s3:#1baf7a;--s4:#eda100;--s5:#e87ba4;--lose-bg:#ffebee;--chip:#eceff1;color-scheme:light}
html[data-theme=dark]{
  --bg:#0f1115;--card:#181b21;--line:#2a2e36;--line2:#22262d;--text:#e8eaed;--muted:#9aa3ad;--muted2:#6b737c;--head:#1f232a;
  --green-bg:#15301f;--lose-bg:#3a1d1f;--chip:#262a31;--win:#5cbf62;--loss:#ef6b6b;--blue:#5a9bef;
  --c-blue:#3987e5;--c-red:#e66767;--ink-text:#f2f3f4;--ink-sub:#c3c7cc;--ink-muted:#8f98a1;--ink-grid:#262a31;--ink-axis:#3a3f48;--ink-surface:#181b21;
  --s1:#3987e5;--s2:#d95926;--s3:#199e70;--s4:#c98500;--s5:#d55181;color-scheme:dark}
html[data-theme=dark] body{background:var(--bg);color:var(--text)}
html[data-theme=dark] .card,html[data-theme=dark] .mbox,html[data-theme=dark] .udrop,html[data-theme=dark] .lsw-d,html[data-theme=dark] .ctip,
html[data-theme=dark] .bk-card,html[data-theme=dark] .login-btn,html[data-theme=dark] .sbtn,html[data-theme=dark] .streams button,
html[data-theme=dark] .gtabs button,html[data-theme=dark] .btn.ghost,html[data-theme=dark] .vod h4,html[data-theme=dark] #stoast div{background:var(--card);color:var(--text)}
html[data-theme=dark] .login-btn{background:#fff!important}
html[data-theme=dark] .ml:hover,html[data-theme=dark] .mrow:hover,html[data-theme=dark] .tbl tr:hover td,html[data-theme=dark] .cmsg:hover,html[data-theme=dark] .conv:hover,html[data-theme=dark] .conv.on{background:var(--head)}
html[data-theme=dark] .tbl th,html[data-theme=dark] .sb th,html[data-theme=dark] .day,html[data-theme=dark] .rh,html[data-theme=dark] .bk-col .rh,html[data-theme=dark] .dh{background:var(--head);color:var(--muted);border-color:var(--line)}
html[data-theme=dark] .chip,html[data-theme=dark] .tier,html[data-theme=dark] .statbox div,html[data-theme=dark] .pcard,html[data-theme=dark] .obj div,html[data-theme=dark] .gc,
html[data-theme=dark] .bub,html[data-theme=dark] .hpb,html[data-theme=dark] .wr,html[data-theme=dark] .hb-r .bar,html[data-theme=dark] .kv,html[data-theme=dark] .pmr button{background:var(--chip);color:var(--text)}
html[data-theme=dark] .chip.on{background:var(--red);color:#fff}
html[data-theme=dark] .pmr button.on{background:var(--text);color:var(--bg)}
html[data-theme=dark] .gc.w,html[data-theme=dark] .stand tr.q td,html[data-theme=dark] .gtbl tr.q td:not(.rc),html[data-theme=dark] .bkt td.best{background:var(--green-bg);color:#b9f0bf}
html[data-theme=dark] .gc.l,html[data-theme=dark] .gtbl tr.e td:not(.rc){background:var(--lose-bg);color:#ffb4b4}
html[data-theme=dark] .drow.w1{background:linear-gradient(90deg,var(--green-bg) 0 50%,var(--lose-bg) 50%)}
html[data-theme=dark] .drow.w2{background:linear-gradient(90deg,var(--lose-bg) 0 50%,var(--green-bg) 50%)}
html[data-theme=dark] .tier.S{background:#4a3b0b;color:#ffd666}html[data-theme=dark] .tier.A{background:#4a1b1b;color:#ff9a9a}html[data-theme=dark] .tier.B{background:#132c4a;color:#9cc7ff}
html[data-theme=dark] .bk-card{border-color:var(--line)}
html[data-theme=dark] .bt:not(.w) .nm,html[data-theme=dark] .bt b,html[data-theme=dark] .ml .tr .st{color:var(--muted)}
html[data-theme=dark] .bt.w .nm{color:var(--text)}
html[data-theme=dark] .bk-col.merge .bk-pair::after,html[data-theme=dark] .bk-col .bk-card::after,html[data-theme=dark] .bk-col.in .bk-card::before{border-color:#3a3f48}
html[data-theme=dark] input,html[data-theme=dark] textarea,html[data-theme=dark] select{background:var(--head);color:var(--text);border-color:var(--line)}
html[data-theme=dark] .hsearch input:focus{background:var(--card);color:var(--text)}
html[data-theme=dark] .hpb span{color:#e8eaed}html[data-theme=dark] .hpb.dead{background:#0b0d10}
html[data-theme=dark] .cpt-t td.lane{border-color:#e8eaed}
html[data-theme=dark] .mapchip{background:#3a3f48}
html[data-theme=dark] .footer{background:#0a0b0e}
html[data-theme=dark] .modal{background:rgba(0,0,0,.7)}
html[data-theme=dark] .tabs .on,html[data-theme=dark] .ctabs button.on{color:#ff8a80}
html[data-theme=dark] .h h2:after,html[data-theme=dark] .h h1:after{background:#e53935}
html[data-theme=dark] .ctext a{color:#8ab4f8}
/* dark logos on a dark background: light outline instead of a dark one */
html[data-theme=dark] .ml img,html[data-theme=dark] .mrow img,html[data-theme=dark] .stand img,html[data-theme=dark] .tbl .ent img,html[data-theme=dark] .pcard img,html[data-theme=dark] .mh-row .lg,
html[data-theme=dark] .gsum img,html[data-theme=dark] .bm img,html[data-theme=dark] .bt img,html[data-theme=dark] .drow img,html[data-theme=dark] .gc img,html[data-theme=dark] .gtbl td.tm img,html[data-theme=dark] .lv-h img,html[data-theme=dark] .tsr-t img{filter:drop-shadow(0 0 1px rgba(255,255,255,.85)) drop-shadow(0 0 .5px rgba(255,255,255,.6))}
html[data-theme=dark] .pcard img[src*="players"],html[data-theme=dark] .tbl .ent img[src*="players"],html[data-theme=dark] .tbl .ent img[src*="ddragon"]{filter:none}
/* theme toggle */
.thm{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:rgba(0,0,0,.18);border:0;border-radius:4px;cursor:pointer;color:#fff;flex:0 0 auto}
.thm:hover{background:rgba(0,0,0,.3)}
.thm .sun{display:none}html[data-theme=dark] .thm .sun{display:block}html[data-theme=dark] .thm .moon{display:none}

/* ================= mobile header ================= */
@media (max-width:860px){
  .header .in{gap:6px;padding:0 10px}
  .brand{flex:0 0 auto}
  .logo{font-size:18px}.logo svg{width:26px;height:26px}
  .hsearch{margin-left:auto}
  /* search collapses to an icon; tapping it opens a full-width field over the header */
  .hsearch input{width:34px;padding:0 0 0 30px;cursor:pointer;color:transparent}
  .hsearch input::placeholder{color:transparent}
  .hsearch input:focus{position:fixed;left:8px;right:8px;top:8px;width:auto;height:40px;z-index:80;padding:0 12px;cursor:text;color:var(--text);box-shadow:0 6px 20px rgba(0,0,0,.3)}
  .hsearch input:focus::placeholder{color:var(--muted)}
  .thm{width:32px}
  .lsw-b{padding:6px}
  .login-btn{padding:6px 10px;font-size:12px}
  .ubtn{padding:4px}
  .burger{padding:4px;flex:0 0 auto}
  .nav{top:56px;max-height:calc(100vh - 56px);overflow-y:auto;box-shadow:0 8px 20px rgba(0,0,0,.25);z-index:55}
  .nav a{padding:12px 10px;font-size:15px}
}
@media (max-width:360px){.logo{font-size:0;gap:0}}
/* ================= mobile content ================= */
@media (max-width:860px){
  .card .h{flex-wrap:wrap;row-gap:8px}
  /* long filter chip lists: one swipeable strip instead of a wall of tags */
  .filters{white-space:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-16px;padding-right:16px}
  .filters::-webkit-scrollbar{display:none}
  .filters .chip{margin-bottom:8px}
  .chatcard .chatlist{height:300px!important}
  .dmmain .chatlist{height:60vh!important}
  .pmr button{padding:4px 8px}
}
