:root { color-scheme: dark; --bg:#07100d; --panel:#0d1915; --line:#20332b; --text:#e8f2ed; --muted:#8da69b; --lime:#b7f36b; --amber:#ffc66d; --red:#ff8178; }
* { box-sizing:border-box; }
body { margin:0; background:radial-gradient(circle at 80% 0,#183325 0,transparent 38%),var(--bg); color:var(--text); font:15px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; min-height:100vh; }
main { width:min(1120px,calc(100% - 32px)); margin:auto; padding:56px 0 36px; }
header { display:flex; justify-content:space-between; align-items:flex-start; gap:32px; }
.eyebrow { color:var(--lime); letter-spacing:.15em; font-size:12px; margin:0 0 8px; }
h1 { font:700 clamp(42px,8vw,88px)/.95 system-ui,sans-serif; letter-spacing:-.06em; margin:0; }
.lede { color:var(--muted); max-width:650px; font-family:system-ui,sans-serif; font-size:17px; }
.status { border:1px solid var(--line); border-radius:999px; padding:10px 16px; display:grid; grid-template-columns:auto auto; column-gap:9px; white-space:nowrap; background:#0b1712cc; }
.status span { width:9px; height:9px; border-radius:50%; background:var(--amber); align-self:center; box-shadow:0 0 12px currentColor; }
.status small { color:var(--muted); grid-column:2; }
.metrics { display:grid; grid-template-columns:repeat(4,1fr); margin:42px 0 18px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--panel); }
.metrics div { padding:18px 20px; border-right:1px solid var(--line); }
.metrics div:last-child { border:0; }
.metrics span { display:block; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.metrics strong { font-size:18px; }
.notice { border-left:3px solid var(--amber); background:#261e10; padding:12px 16px; margin:0 0 38px; color:#e8d5b6; }
.section-title { display:flex; align-items:center; justify-content:space-between; }
h2 { font:650 24px system-ui,sans-serif; }
button { color:var(--lime); border:1px solid var(--line); background:var(--panel); border-radius:7px; padding:8px 13px; font:inherit; cursor:pointer; }
button:hover { border-color:var(--lime); }
.board { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.card { background:linear-gradient(135deg,#0f1d18,#0a1511); border:1px solid var(--line); border-radius:12px; padding:18px; }
.card-head { display:flex; justify-content:space-between; gap:14px; }
.rank { color:var(--muted); margin-right:10px; }
.symbol { font-size:20px; }
.score { color:var(--lime); font-size:22px; }
.score small { display:block; color:var(--muted); font-size:9px; text-align:right; }
.tags { display:flex; flex-wrap:wrap; gap:7px; margin:13px 0; }
.tag { border:1px solid var(--line); border-radius:999px; padding:3px 8px; color:var(--muted); font-size:11px; }
.long { color:var(--lime); }.short { color:var(--red); }.risk-high { color:var(--red); }.risk-low { color:var(--lime); }
.price { display:grid; grid-template-columns:1fr 1fr; gap:8px; border-top:1px solid var(--line); padding-top:12px; }
.price span { color:var(--muted); font-size:10px; display:block; text-transform:uppercase; }.price strong { overflow-wrap:anywhere; }
.reasons { color:#b7c8c0; padding-left:18px; margin:12px 0 0; font-family:system-ui,sans-serif; font-size:13px; }
.empty { color:var(--muted); grid-column:1/-1; border:1px dashed var(--line); padding:30px; text-align:center; }
details { margin-top:22px; color:var(--muted); } details ul { max-height:220px; overflow:auto; } footer { color:var(--muted); border-top:1px solid var(--line); margin-top:44px; padding-top:18px; font-size:12px; } a { color:var(--lime); }
@media(max-width:760px) { main{padding-top:28px} header{display:block}.status{display:inline-grid;margin-top:12px}.metrics{grid-template-columns:1fr 1fr}.metrics div:nth-child(2){border-right:0}.metrics div{border-bottom:1px solid var(--line)}.metrics div:nth-last-child(-n+2){border-bottom:0}.board{grid-template-columns:1fr} }