:root{
  --bg:#0a0e17; --bg2:#111725; --bg3:#161e2f; --line:#233047; --line2:#2f3f5c;
  --tx:#e6edf7; --tx2:#93a4c0; --tx3:#63758f;
  --pos:#25d07a; --neg:#f2555a; --warn:#f5a524; --hi:#4cc4f5; --gold:#ffd166; --pur:#a78bfa;
  --qb:#f5a524; --rb:#25d07a; --wr:#4cc4f5; --te:#f2699a; --pick:#a78bfa;
  --r:10px; --mono:ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--tx);font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;
  font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;font-weight:650;letter-spacing:-.01em}
button{font:inherit;cursor:pointer}
a{color:var(--hi)}

/* ---------- chrome ---------- */
.top{display:flex;align-items:center;gap:20px;padding:14px 22px;background:linear-gradient(180deg,#121a2b,#0d1320);
  border-bottom:1px solid var(--line);z-index:40;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px;flex:1;min-width:220px}
.logo{font-size:26px;color:var(--gold);line-height:1}
.top h1{font-size:17px}
.top p{margin:1px 0 0;font-size:12px;color:var(--tx2)}
.lgswitch{display:flex;gap:6px;background:var(--bg);padding:4px;border-radius:var(--r);border:1px solid var(--line)}
.lgswitch button{background:none;border:0;color:var(--tx2);padding:7px 14px;border-radius:7px;font-size:13px;font-weight:600;white-space:nowrap}
.lgswitch button.on{background:var(--bg3);color:var(--tx);box-shadow:inset 0 0 0 1px var(--line2)}
.ghost{background:var(--bg3);border:1px solid var(--line);color:var(--tx2);padding:8px 12px;border-radius:8px;font-size:12px}
.ghost:hover{color:var(--tx);border-color:var(--line2)}
.tabs{display:flex;gap:2px;padding:0 18px;background:var(--bg);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:30;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{background:none;border:0;border-bottom:2px solid transparent;color:var(--tx3);padding:13px 15px;font-size:13px;font-weight:600;white-space:nowrap}
.tabs button:hover{color:var(--tx2)}
.tabs button.on{color:var(--tx);border-bottom-color:var(--gold)}
main{padding:22px;max-width:1420px;margin:0 auto}
.foot{padding:18px 22px 40px;color:var(--tx3);font-size:11px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  border-top:1px solid var(--line);margin-top:30px}

/* ---------- boot ---------- */
.boot{text-align:center;padding:90px 20px;color:var(--tx2)}
.spinner{width:34px;height:34px;margin:0 auto 18px;border:3px solid var(--line2);border-top-color:var(--gold);border-radius:50%;animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.err{background:#2a1518;border:1px solid #5d2a2f;padding:16px;border-radius:var(--r);color:#ffc9cc}

/* ---------- layout ---------- */
.grid{display:grid;gap:16px}
.g4{grid-template-columns:repeat(4,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.g21{grid-template-columns:1.35fr 1fr}
@media(max-width:1040px){.g4{grid-template-columns:repeat(2,1fr)}.g3,.g2,.g21{grid-template-columns:1fr}}
@media(max-width:620px){.g4{grid-template-columns:1fr}main{padding:14px}}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.card>h3{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--tx2);margin-bottom:12px;font-weight:700}
.sec{margin-bottom:22px}
.sec>h2{font-size:15px;margin-bottom:12px;display:flex;align-items:center;gap:9px}
.sec>h2 .sub{font-size:12px;color:var(--tx3);font-weight:400}

/* ---------- kpi ---------- */
.kpi{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:15px 16px;position:relative;overflow:hidden}
.kpi .lb{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--tx3);font-weight:700}
.kpi .vl{font-size:29px;font-weight:700;letter-spacing:-.02em;margin:5px 0 2px;line-height:1.05}
.kpi .nt{font-size:11.5px;color:var(--tx2)}
.kpi.good{border-color:#1c5e3f}.kpi.good .vl{color:var(--pos)}
.kpi.bad{border-color:#5f2427}.kpi.bad .vl{color:var(--neg)}
.kpi.warn{border-color:#5f4415}.kpi.warn .vl{color:var(--warn)}
.kpi.hi .vl{color:var(--hi)}

/* ---------- verdict ---------- */
.verdict{background:linear-gradient(135deg,#141d30,#0f1523);border:1px solid var(--line2);border-radius:var(--r);padding:18px 20px}
.verdict h2{font-size:16px;margin-bottom:8px}
.verdict p{margin:0 0 10px;color:var(--tx2);font-size:13.5px;max-width:none}
.verdict p:last-child{margin-bottom:0}
.verdict b{color:var(--tx)}
.tag{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
  padding:3px 8px;border-radius:5px;vertical-align:middle}
.t-cont{background:#123a2a;color:#4ade80}.t-fringe{background:#3d3013;color:#fbbf24}
.t-reb{background:#3a1620;color:#fb7185}.t-neutral{background:var(--bg3);color:var(--tx2)}

/* ---------- tables ---------- */
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--tx3);
  font-weight:700;padding:7px 8px;border-bottom:1px solid var(--line);white-space:nowrap;cursor:pointer;user-select:none}
th:hover{color:var(--tx2)}
td{padding:7px 8px;border-bottom:1px solid #1a2233;white-space:nowrap}
tbody tr:hover{background:#141c2c}
tr.me{background:#132033}
tr.me:hover{background:#17273e}
.num{text-align:right;font-family:var(--mono);font-size:12.5px}
.pos{display:inline-block;width:26px;text-align:center;font-size:10px;font-weight:800;padding:2px 0;border-radius:4px;color:#08101c}
.p-QB{background:var(--qb)}.p-RB{background:var(--rb)}.p-WR{background:var(--wr)}.p-TE{background:var(--te)}.p-PICK{background:var(--pick)}
.up{color:var(--pos)}.dn{color:var(--neg)}.mut{color:var(--tx3)}
.chip{font-size:10px;padding:2px 6px;border-radius:4px;background:var(--bg3);color:var(--tx2);border:1px solid var(--line2)}
.chip.sur{background:#3a2a10;color:#f5b942;border-color:#5c4318}
.chip.core{background:#10321f;color:#4ade80;border-color:#1c5e3f}
.chip.inj{background:#3a1418;color:#fb7185;border-color:#5d2126}
.scroll{overflow-x:auto}
.bar{height:5px;border-radius:3px;background:var(--bg3);overflow:hidden;min-width:52px}
.bar i{display:block;height:100%;border-radius:3px}

/* ---------- lineup ---------- */
.lu{display:flex;flex-direction:column;gap:5px}
.lu .row{display:flex;align-items:center;gap:9px;padding:7px 9px;background:var(--bg);border:1px solid var(--line);border-radius:7px}
.lu .slot{font-size:9.5px;font-weight:800;color:var(--tx3);width:52px;letter-spacing:.04em}
.lu .nm{flex:1;font-size:13px;overflow:hidden;text-overflow:ellipsis}
.lu .pts{font-family:var(--mono);font-size:13px;font-weight:600}
.lu .row.weak{border-color:#5d2126;background:#1c1216}
.lu .row.strong{border-color:#1c5e3f}

/* ---------- trade cards ---------- */
.deal{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:11px}
.deal .hd{display:flex;align-items:center;gap:12px;padding:11px 14px;cursor:pointer;background:#121a29}
.deal .hd:hover{background:#162032}
.deal .rk{font-family:var(--mono);font-size:11px;color:var(--tx3);width:20px}
.deal .who{font-weight:650;font-size:13.5px;flex:1;min-width:120px}
.deal .mini{display:flex;gap:14px;font-size:11.5px;color:var(--tx2);flex-wrap:wrap;justify-content:flex-end}
.deal .mini b{font-family:var(--mono);font-size:12.5px}
.deal .bd{padding:14px;border-top:1px solid var(--line);display:none}
.deal.open .bd{display:block}
.sides{display:grid;grid-template-columns:1fr 34px 1fr;gap:10px;align-items:center}
@media(max-width:620px){.sides{grid-template-columns:1fr;gap:6px}}
.side{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px}
.side h5{margin:0 0 7px;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--tx3)}
.side .a{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:3px 0;font-size:13px}
.arrow{text-align:center;color:var(--tx3);font-size:18px}
.why{margin-top:12px;font-size:12.5px;color:var(--tx2);background:var(--bg);border-left:2px solid var(--gold);padding:9px 12px;border-radius:0 7px 7px 0}
.why b{color:var(--tx)}
.acts{display:flex;gap:8px;margin-top:11px;flex-wrap:wrap}
.acts button{background:var(--bg3);border:1px solid var(--line2);color:var(--tx2);padding:6px 11px;border-radius:7px;font-size:12px}
.acts button:hover{color:var(--tx)}
.pitch{margin-top:10px;width:100%;min-height:88px;background:var(--bg);border:1px solid var(--line);color:var(--tx2);
  border-radius:8px;padding:10px;font:12.5px/1.55 inherit;resize:vertical;display:none}
.pitch.on{display:block}

/* ---------- controls ---------- */
.ctl{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
select,input[type=text]{background:var(--bg2);border:1px solid var(--line);color:var(--tx);padding:8px 10px;border-radius:8px;font:13px inherit}
input[type=text]{min-width:220px}
select:focus,input:focus{outline:0;border-color:var(--line2)}
label.f{font-size:11px;color:var(--tx3);text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.seg{display:flex;background:var(--bg2);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.seg button{background:none;border:0;color:var(--tx3);padding:8px 13px;font-size:12px;font-weight:600}
.seg button.on{background:var(--bg3);color:var(--tx)}

/* ---------- eval ---------- */
.pk{background:var(--bg);border:1px solid var(--line);border-radius:8px;min-height:140px;padding:9px}
.pk .it{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:5px 7px;background:var(--bg2);
  border:1px solid var(--line);border-radius:6px;margin-bottom:5px;font-size:13px}
.pk .it button{background:none;border:0;color:var(--tx3);font-size:15px;padding:0 3px;line-height:1}
.pk .it button:hover{color:var(--neg)}
.pk .empty{color:var(--tx3);font-size:12px;text-align:center;padding:24px 0}
.ac{position:relative}
.aclist{position:absolute;z-index:50;top:calc(100% + 3px);left:0;right:0;background:var(--bg3);border:1px solid var(--line2);
  border-radius:8px;max-height:250px;overflow:auto;display:none;box-shadow:0 12px 30px rgba(0,0,0,.55)}
.aclist.on{display:block}
.aclist div{padding:7px 10px;font-size:13px;display:flex;gap:8px;align-items:center;cursor:pointer}
.aclist div:hover{background:#1d283c}
.aclist .o{margin-left:auto;font-size:11px;color:var(--tx3)}
.vbox{padding:16px;border-radius:var(--r);border:1px solid var(--line);background:var(--bg2)}
.vbox .hl{font-size:22px;font-weight:700;margin-bottom:4px}

/* ---------- radar ---------- */
.tcard{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:14px}
.tcard.me{border-color:#2d4a6b;background:#101a2a}
.tcard h4{font-size:13.5px;display:flex;align-items:center;gap:7px;margin-bottom:9px}
.tcard h4 .r{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--tx3)}
.kv{display:flex;justify-content:space-between;font-size:12px;padding:3px 0;color:var(--tx2)}
.kv b{font-family:var(--mono);color:var(--tx)}
.needs{margin-top:9px;font-size:11.5px;color:var(--tx2);line-height:1.7}
.needs .h{color:var(--tx3);text-transform:uppercase;font-size:10px;letter-spacing:.05em;font-weight:700}
svg{display:block;max-width:100%}
.lgnd{display:flex;gap:14px;font-size:11px;color:var(--tx2);margin-top:8px;flex-wrap:wrap}
.lgnd i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px}
.note{font-size:11.5px;color:var(--tx3);margin-top:9px}
.deal .swap{display:block;font-size:11.5px;color:var(--tx2);font-weight:400;margin-top:2px}
.deal .swap b{color:var(--gold);font-weight:700}
