:root{--bg:#08131f;--panel:#0e1d2b;--raised:#122536;--line:#21394a;--text:#f4f7f8;--muted:#8fa5b3;--clay:#e77b43;--green:#36c98f;--amber:#e6b85c;--red:#f06464}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:radial-gradient(circle at 75% 0,#102b3b 0,transparent 35%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-variant-numeric:tabular-nums}
.app-shell{min-height:100vh;padding-bottom:24px}
button,input{font:inherit}
header{height:76px;display:flex;align-items:center;padding:0 28px;border-bottom:1px solid var(--line);background:#071521e8;gap:24px;position:sticky;top:0;z-index:5;backdrop-filter:blur(16px)}
.brand{font-size:21px;font-weight:800;letter-spacing:.04em;white-space:nowrap}
.ball{color:var(--clay);font-size:28px;margin-right:10px}
.mode-badge{border-radius:8px;padding:6px 12px;font-weight:800;font-size:12px;letter-spacing:.06em}
.mode-badge.shadow{background:#25384a;color:#9fc0d5}
.mode-badge.demo{background:#5b471d;color:#f2cb70}
.mode-badge.live{background:#662b31;color:#ff9da3;box-shadow:0 0 14px #f0646455}
.feed{margin-left:auto;border:1px solid #285044;border-radius:9px;padding:9px 13px;color:var(--green);font-weight:650;font-size:13px}
.feed i{width:9px;height:9px;display:inline-block;border-radius:50%;margin-right:8px;background:var(--green);box-shadow:0 0 10px #36c98f88}
.feed i.off{background:var(--red);box-shadow:none}
.feed small{margin-left:8px;color:var(--muted)}
.bankroll{color:var(--muted);white-space:nowrap;font-size:13px}
.bankroll b{color:#fff;font-size:17px;margin-left:8px}
.killbtn{border:0;border-radius:9px;padding:11px 18px;font-weight:800;cursor:pointer;background:linear-gradient(180deg,#f06464,#c73737);color:#fff;letter-spacing:.04em}
.killbtn.armed{background:linear-gradient(180deg,#3a4c5c,#2b3a48);color:#ffb3b3;border:1px solid #f0646488}
.latency-bar{min-height:38px;display:flex;align-items:center;justify-content:flex-end;gap:26px;padding:4px 28px;border-bottom:1px solid #173142;background:#091925;color:var(--muted);font-size:12px;flex-wrap:wrap}
.latency-bar div{margin-right:auto}
.latency-bar i{width:9px;height:9px;display:inline-block;border-radius:50%;margin-right:8px;background:var(--green)}
.latency-bar i.bad{background:var(--red)}
.latency-bar b,.latency-bar strong{color:#dbe7eb}
.banner{margin:14px 26px 0;border:1px solid #6b2b31;background:#2b1418;color:#ff9da3;border-radius:10px;padding:12px 16px;font-size:13px;font-weight:650}
.banner.hidden{display:none}
.kpis{margin:22px 26px 18px;display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);border-radius:12px;background:linear-gradient(180deg,#102437,#0d1d2b);overflow:hidden}
.kpis article{padding:17px 24px;border-right:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:3px}
.kpis article:last-child{border:0}
.kpis small{color:#a5b6c1}
.kpis b{grid-row:1/3;grid-column:2;font-size:24px;align-self:center}
.kpis span{font-size:12px;color:var(--green)}
.kpis span.neg{color:var(--red)}
.dashboard{display:grid;grid-template-columns:minmax(640px,1.7fr) minmax(390px,1fr);gap:18px;margin:0 26px}
.panel{background:linear-gradient(145deg,#0e1e2d,#0b1926);border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 40px #02080e2b}
.matches{padding:18px 10px 12px}
.section-head{display:flex;justify-content:space-between;align-items:center;padding:0 14px 14px}
.section-head h2{font-size:15px;letter-spacing:.06em;margin:0}
.section-head span{font-size:11px;color:var(--green)}
.empty{padding:26px 16px;color:var(--muted);font-size:13px;line-height:1.6}
.match{width:100%;display:grid;grid-template-columns:1.7fr .9fr 1.2fr .9fr;align-items:center;text-align:left;color:var(--text);border:1px solid #1b3445;border-radius:10px;background:#0d2030;margin-bottom:9px;padding:14px;cursor:pointer;transition:150ms ease}
.match:hover{border-color:#396174}
.match.selected{border:2px solid var(--clay);box-shadow:0 0 0 2px #e77b4315}
.match small{display:block;color:var(--muted);margin-top:5px;font-size:11px}
.players b{display:block;font-size:14px}
.players .vs{color:var(--muted);font-size:11px}
.signal{display:inline-block;margin-top:9px;border-radius:5px;padding:3px 6px;font-style:normal;font-size:9px;font-weight:800}
.signal.entry{background:#1c5a46;color:#7af1bf}
.signal.watch{background:#5b471d;color:#f2cb70}
.signal.exit{background:#662b31;color:#ff9da3}
.signal.nosignal{background:#253845;color:#8fa5b3}
.signal.upcoming{background:#1e2831;color:#66788a}
.signal.done{background:#2a2f36;color:#7d8894}
.state-tag{display:inline-block;margin-left:6px;border-radius:5px;padding:3px 6px;font-size:9px;font-weight:800;background:#1d3a52;color:#8fc4e8}
.score b{display:block;color:var(--clay);font-size:19px;margin:3px 0}
.score span{font-size:11px;color:#b6c6d0}
.prices{display:flex;gap:18px}
.prices b{display:block;font-size:21px}
.prices small{font-size:9px}
.pos-line{color:#7af1bf;font-size:11px;margin-top:6px}
aside{display:grid;gap:16px;align-content:start}
.decision{padding:20px 22px;border-color:#315266}
.decision.entry{border-color:#8c4c2d}
.decision-title small{color:var(--muted)}
.decision-title h2{font-size:18px;margin:4px 0}
.states{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0 12px}
.states span{text-align:center;border:1px solid #3c5969;border-radius:999px;padding:9px;color:#9fb2bd;font-size:12px;font-weight:750}
.states span.active{color:#fff;background:linear-gradient(180deg,#ec8a51,#d8622d);border-color:#f8a676;box-shadow:0 5px 16px #e77b4333}
.reason{background:#132a38;border-left:3px solid var(--clay);padding:10px 12px;font-size:12px;color:#c6d4dc}
.trade-grid{display:grid;grid-template-columns:repeat(3,1fr);margin:16px 0;border-bottom:1px solid var(--line);padding-bottom:15px}
.trade-grid div{border-right:1px solid var(--line);padding:0 12px}
.trade-grid div:first-child{padding-left:0}
.trade-grid div:last-child{border:0}
.trade-grid small{display:block;color:var(--muted);font-size:11px;margin-bottom:5px}
.trade-grid b{font-size:19px}
.meters{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.meters span{display:flex;justify-content:space-between;color:var(--muted);font-size:11px}
.meters b{color:var(--green);font-size:14px}
progress{width:100%;height:6px;border:0;border-radius:5px;overflow:hidden;background:#203747}
progress::-webkit-progress-bar{background:#203747}
progress::-webkit-progress-value{background:var(--green);border-radius:5px}
.exitbtn{width:100%;border:0;border-radius:9px;background:linear-gradient(180deg,#ed8950,#d8622d);color:#fff;font-weight:750;padding:13px;margin:16px 0 4px;cursor:pointer}
.exitbtn:disabled{opacity:.35;cursor:default}
.exact-rules{display:flex;gap:5px;flex-wrap:wrap;margin-top:12px}
.exact-rules b{width:100%;font-size:10px;color:#78909d;text-transform:uppercase}
.exact-rules span{font-size:9px;padding:3px 6px;border:1px solid #304654;border-radius:4px;color:#637986}
.exact-rules span.pass{color:#72e0b0;border-color:#23664f;background:#123b2f}
.risk{padding:18px 20px}
.risk-row{display:grid;grid-template-columns:1fr auto;gap:4px;border-top:1px solid #193244;padding:9px 2px;font-size:12px}
.risk-row b{color:#fff}
.risk p{font-size:10px;line-height:1.5;color:#718a99;margin-bottom:0}
.loglist{max-height:340px;overflow:auto;font-size:11px}
.loglist .row{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:7px 4px;border-top:1px solid #16293a;color:#b6c6d0}
.loglist .row time{color:#7690a0;white-space:nowrap}
.loglist .veto{color:#e6b85c}
.loglist .win{color:#7af1bf}
.loglist .loss{color:#ff9da3}
#login-overlay{position:fixed;inset:0;background:#08131fee;display:flex;align-items:center;justify-content:center;z-index:50}
#login-overlay form{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:34px;width:340px;text-align:center}
#login-overlay h1{font-size:20px;margin:0 0 6px}
#login-overlay p{color:var(--muted);font-size:12px;margin:0 0 18px}
#login-overlay input{width:100%;background:#0a1826;border:1px solid var(--line);border-radius:8px;color:#fff;padding:12px;margin-bottom:12px}
#login-overlay button{width:100%;border:0;border-radius:8px;background:linear-gradient(180deg,#ed8950,#d8622d);color:#fff;font-weight:750;padding:12px;cursor:pointer}
#login-error{color:var(--red);font-size:12px;min-height:16px;margin-top:8px}
.hidden{display:none!important}
.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,80px);background:#123b2f;border:1px solid #23664f;color:#72e0b0;padding:12px 22px;border-radius:10px;font-weight:700;font-size:13px;z-index:99;transition:transform .25s ease;pointer-events:none}
.toast.show{transform:translate(-50%,0)}
.toast.bad{background:#3b1216;border-color:#66232a;color:#ff9da3}
@media(max-width:1100px){.dashboard{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){header{padding:0 14px;gap:12px}.feed{display:none}.kpis{margin:12px;grid-template-columns:1fr 1fr}.dashboard{margin:0 12px}.match{grid-template-columns:1fr 1fr;gap:12px}.brand{font-size:16px}}
