:root{
  --bg:#0b0f14; --panel:#121821; --panel2:#182130; --line:#22303f;
  --txt:#e8eef5; --dim:#8ea3b8; --accent:#4fd1c5; --gold:#ffc857;
  --red:#ff6b6b; --amber:#ffb454; --green:#5ad48a; --purple:#a78bfa;
  --radius:10px;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--txt);
  font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
a{color:var(--accent)}
h1,h2,h3{margin:0}
.topbar{
  display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between;
  padding:18px 22px; background:linear-gradient(180deg,#121a24,#0d131b);
  border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20;
}
.brand{display:flex; gap:14px; align-items:center}
.logo{
  background:linear-gradient(135deg,var(--accent),#2b7f78); color:#06201e;
  font-weight:800; font-size:20px; padding:8px 12px; border-radius:var(--radius);
  letter-spacing:.5px;
}
.topbar h1{font-size:20px; letter-spacing:.2px}
.sub{margin:2px 0 0; color:var(--dim); font-size:13px}
.statbar{display:flex; flex-wrap:wrap; gap:8px}
.stat{
  background:var(--panel); border:1px solid var(--line); border-radius:8px;
  padding:7px 12px; min-width:92px;
}
.stat b{display:block; font-size:17px; color:var(--accent); line-height:1.2}
.stat span{font-size:11px; color:var(--dim); text-transform:uppercase; letter-spacing:.6px}

.controls{
  display:flex; flex-wrap:wrap; gap:14px; align-items:flex-end;
  padding:14px 22px; background:var(--panel); border-bottom:1px solid var(--line);
  position:sticky; top:74px; z-index:19;
}
.ctl{display:flex; flex-direction:column; gap:5px}
.ctl label{font-size:11px; color:var(--dim); text-transform:uppercase; letter-spacing:.6px}
.ctl input[type=search], .ctl select{
  background:var(--panel2); color:var(--txt); border:1px solid var(--line);
  border-radius:7px; padding:8px 10px; font-size:14px; min-width:190px;
}
.ctl input[type=search]:focus,.ctl select:focus{outline:none; border-color:var(--accent)}
.toggles{flex-direction:row; gap:16px; align-items:center}
.toggles label{
  display:flex; gap:6px; align-items:center; text-transform:none; letter-spacing:0;
  font-size:13px; color:var(--txt); cursor:pointer;
}
.board{padding:20px 22px 60px; display:grid; gap:18px; grid-template-columns:repeat(auto-fill,minmax(460px,1fr))}
.loading{grid-column:1/-1; color:var(--dim); padding:40px; text-align:center}

.team{
  background:var(--panel); border:1px solid var(--line); border-radius:14px; overflow:hidden;
  border-top:3px solid var(--tc,#444);
}
.team header{
  display:flex; align-items:center; gap:11px; padding:12px 14px;
  background:var(--panel2); border-bottom:1px solid var(--line);
}
.team img{width:34px; height:34px; object-fit:contain}
.team .tname{font-weight:700; font-size:15px}
.team .tmeta{font-size:11px; color:var(--dim); text-transform:uppercase; letter-spacing:.5px}
.team .tcount{margin-left:auto; font-size:12px; color:var(--dim); text-align:right}
.team .tcount b{color:var(--txt)}
table{width:100%; border-collapse:collapse; font-size:13px}
thead th{
  text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:.6px;
  color:var(--dim); padding:8px 6px; border-bottom:1px solid var(--line);
  position:sticky; top:0; background:var(--panel);
}
tbody td{padding:6px; border-bottom:1px solid rgba(34,48,63,.5); vertical-align:middle}
tbody tr:hover{background:rgba(79,209,197,.05)}
td.rank{width:34px; text-align:center; color:var(--dim); font-variant-numeric:tabular-nums}
td.pname{min-width:150px}
td.pname .n{font-weight:600}
td.pname .m{font-size:11px; color:var(--dim)}
td.ovr{width:44px; text-align:center}
.ovr-badge{
  display:inline-block; min-width:32px; padding:3px 5px; border-radius:6px;
  font-weight:700; font-size:12px; font-variant-numeric:tabular-nums;
}
.o99{background:rgba(255,200,87,.18); color:var(--gold); border:1px solid rgba(255,200,87,.5)}
.o95{background:rgba(167,139,250,.16); color:var(--purple); border:1px solid rgba(167,139,250,.45)}
.o90{background:rgba(79,209,197,.14); color:var(--accent); border:1px solid rgba(79,209,197,.4)}
.o85{background:rgba(90,212,138,.12); color:var(--green); border:1px solid rgba(90,212,138,.35)}
.o80{background:rgba(142,163,184,.12); color:var(--dim); border:1px solid rgba(142,163,184,.3)}
.oLow{background:rgba(142,163,184,.08); color:#6d8095; border:1px solid rgba(142,163,184,.2)}
.tag{
  display:inline-block; padding:2px 6px; border-radius:5px; font-size:10px; font-weight:700;
  letter-spacing:.4px; text-transform:uppercase; white-space:nowrap;
}
.t-out{background:rgba(255,107,107,.16); color:var(--red); border:1px solid rgba(255,107,107,.4)}
.t-q{background:rgba(255,180,84,.16); color:var(--amber); border:1px solid rgba(255,180,84,.4)}
.t-doubt{background:rgba(255,180,84,.12); color:#d99a4a; border:1px solid rgba(255,180,84,.3)}
.t-ir{background:rgba(142,163,184,.14); color:var(--dim); border:1px solid rgba(142,163,184,.35)}
.t-susp{background:rgba(167,139,250,.16); color:var(--purple); border:1px solid rgba(167,139,250,.4)}
.t-ea{background:rgba(255,200,87,.14); color:var(--gold); border:1px solid rgba(255,200,87,.35)}
.t-norating{background:transparent; color:#5d7085; border:1px dashed rgba(142,163,184,.3)}
.t-depth{color:var(--accent); font-weight:700}
.t-practice{color:#6d8095; font-size:11px}
tr.row-injured{background:rgba(255,107,107,.05)}
tr.row-start{background:rgba(255,200,87,.06)}
details.more{color:var(--dim); font-size:11px; cursor:pointer; padding:6px 8px}
details.more:hover{color:var(--accent)}
.attrgrid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:5px;
  padding:9px 10px; background:#0e141c; border-top:1px solid var(--line);
}
.attr{font-size:11px; color:var(--dim)}
.attr b{color:var(--txt); float:right; font-variant-numeric:tabular-nums}
.foot{padding:20px 22px 50px; border-top:1px solid var(--line); color:var(--dim); font-size:12px}
.foot .srcs{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:10px}
.foot .srcs a{
  background:var(--panel); border:1px solid var(--line); border-radius:7px;
  padding:6px 10px; text-decoration:none; font-size:11px;
}
.foot .srcs a:hover{border-color:var(--accent)}
.note{max-width:900px; line-height:1.6}
.dlbtn{
  display:inline-block; background:linear-gradient(135deg,var(--accent),#2b7f78); color:#06201e;
  font-weight:700; text-decoration:none; padding:9px 14px; border-radius:7px; font-size:13px;
  white-space:nowrap;
}
.dlbtn:hover{filter:brightness(1.1)}
.downloads{
  background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:20px 22px;
  margin-bottom:18px; max-width:1100px;
}
.downloads h2{font-size:19px; margin-bottom:6px}
.downloads .lede{color:var(--dim); font-size:14px; margin:0 0 14px; max-width:760px}
.dlgrid{display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.dlfile{
  display:flex; flex-direction:column; gap:3px; background:var(--panel2);
  border:1px solid var(--line); border-radius:9px; padding:11px 13px; text-decoration:none;
  transition:border-color .15s, transform .15s;
}
.dlfile:hover{border-color:var(--accent); transform:translateY(-1px)}
.dlfile b{color:var(--txt); font-size:14px}
.dlfile span{color:var(--dim); font-size:11px}
.dlfile .fmt{color:var(--accent); font-size:10px; letter-spacing:.5px; text-transform:uppercase}
.howto{margin-top:18px; border-top:1px solid var(--line); padding-top:16px}
.howto h3{font-size:15px; margin-bottom:10px}
.howto-cols{display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.howto h4{font-size:12px; color:var(--accent); text-transform:uppercase; letter-spacing:.6px; margin-bottom:6px}
.howto ol{margin:0; padding-left:18px; color:var(--dim); font-size:13px; line-height:1.7}
.howto p{margin:0; color:var(--dim); font-size:13px; line-height:1.7}
.howto code{background:var(--panel2); padding:1px 5px; border-radius:4px; font-size:12px; color:var(--txt)}
.foot .note{color:var(--dim)}
.hidden{display:none !important}
@media (max-width:760px){
  .board{grid-template-columns:1fr; padding:14px 12px 40px}
  .controls{position:static; padding:12px}
  .ctl input[type=search],.ctl select{min-width:0; width:100%}
  .ctl{flex:1 1 140px}
  .topbar{position:static}
}