:root{
--bg:#07101f;--sidebar:#0b1424;--panel:#111d30;--panel2:#0d1828;--line:#24344d;
--text:#edf4ff;--muted:#89a0bd;--accent:#44b7ff;--accent2:#9ce3ff;--ok:#34d399;--warn:#fbbf24;--danger:#fb7185
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}
button,input,select{font:inherit}
button{cursor:pointer}
.app{min-height:100vh;display:grid;grid-template-columns:250px 1fr}
.sidebar{background:var(--sidebar);border-right:1px solid var(--line);padding:22px 16px;position:sticky;top:0;height:100vh}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:28px}
.brand-mark{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),#2563eb);font-weight:900;font-size:24px}
.brand strong{display:block;font-size:20px}.brand span{font-size:11px;color:var(--muted);letter-spacing:.08em}
.side-label{font-size:10px;letter-spacing:.16em;color:#607692;margin:22px 8px 8px}
nav{display:grid;gap:6px}
nav button{border:0;background:transparent;color:#a9bad0;text-align:left;padding:10px 12px;border-radius:10px;font-weight:700}
nav button:hover,nav button.active{background:#14243a;color:white}
nav button.active{box-shadow:inset 3px 0 0 var(--accent)}
.system-card{border:1px solid var(--line);background:#0c1728;border-radius:14px;padding:12px}
.system-card div{display:flex;justify-content:space-between;gap:10px;padding:7px 0;font-size:11px}
.system-card span{color:var(--muted)}.system-card b{font-size:11px;text-align:right}
.main{min-width:0;padding:24px}
.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.topbar h1{margin:0;font-size:26px}.topbar p{margin:6px 0 0;color:var(--muted);font-size:13px}
.top-actions{display:flex;align-items:center;gap:8px}.home-link{display:inline-block;text-decoration:none;color:var(--text);background:#14243a;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:11px;font-weight:900}.home-link:hover{border-color:var(--accent)}
.status-pill{padding:8px 12px;border:1px solid var(--line);border-radius:999px;font-size:11px;font-weight:900;color:var(--warn)}
.toolbar{margin-top:20px;background:var(--panel2);border:1px solid var(--line);border-radius:16px;padding:12px;display:grid;grid-template-columns:150px 150px auto auto minmax(260px,1fr);gap:10px;align-items:end}
.toolbar label{font-size:10px;color:var(--muted);display:grid;gap:5px}
input,select{background:#081321;color:white;border:1px solid var(--line);border-radius:10px;padding:10px;outline:none}
input:focus,select:focus{border-color:var(--accent)}
.toolbar button{border:1px solid var(--line);background:#14243a;color:white;border-radius:10px;padding:10px 13px;font-weight:800}
.toolbar .primary{background:var(--accent);color:#03101c;border-color:transparent}
.searchbox{display:grid;grid-template-columns:1fr auto;gap:8px}
.metrics{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:14px 0}
.metrics article{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:14px}
.metrics span{display:block;font-size:10px;color:#7f95b1;letter-spacing:.08em}
.metrics strong{display:block;font-size:24px;margin:7px 0 3px}
.metrics small{font-size:10px;color:var(--muted)}
.workspace{display:grid;grid-template-columns:minmax(360px,42%) 1fr;gap:14px;min-height:650px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:17px;overflow:hidden}
.panel-head{height:72px;padding:14px 16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.panel-head h2{margin:2px 0 0;font-size:19px}.eyebrow{font-size:9px;letter-spacing:.14em;color:var(--accent)}
.entity-list{height:calc(100vh - 280px);min-height:560px;overflow:auto}
.entity-row{width:100%;border:0;border-bottom:1px solid #1d2c42;background:transparent;color:white;padding:13px 15px;text-align:left;display:grid;grid-template-columns:1fr auto;gap:10px}
.entity-row:hover,.entity-row.active{background:#15253b}
.entity-row h3{font-size:13px;margin:0 0 5px}.entity-row .meta{color:var(--muted);font-size:10px}
.entity-row .right{text-align:right}.entity-row .reach{font-size:14px;font-weight:900}.entity-row .spots{font-size:10px;color:var(--muted)}
.detail-panel{min-width:0}.empty-detail{height:100%;min-height:650px;display:grid;place-content:center;text-align:center;padding:40px}
.empty-detail .empty-icon{font-size:56px;color:#31445f}.empty-detail p{color:var(--muted);max-width:430px}
.detail-wrap{padding:18px}.detail-title{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.detail-title h2{margin:4px 0;font-size:24px}.detail-title p{color:var(--muted);margin:0;font-size:11px}
.type-badge{padding:6px 9px;border-radius:999px;background:#17334a;color:var(--accent2);font-size:9px;font-weight:900;letter-spacing:.08em}
.detail-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:16px 0}
.detail-metrics div{background:#0c1728;border:1px solid var(--line);border-radius:12px;padding:11px}
.detail-metrics span{display:block;color:var(--muted);font-size:9px}.detail-metrics b{display:block;font-size:18px;margin-top:5px}
.section-title{font-size:11px;letter-spacing:.12em;color:#90a8c5;margin:22px 0 9px}
.daily-bars{display:grid;gap:7px}.bar-row{display:grid;grid-template-columns:82px 1fr 92px;gap:8px;align-items:center;font-size:10px}
.bar{height:8px;border-radius:999px;background:#0a1422;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#2563eb);border-radius:999px}
.related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.related-card{border:1px solid var(--line);background:#0c1728;border-radius:12px;padding:10px}
.related-card h4{margin:0 0 6px;font-size:11px}.related-card p{margin:0;color:var(--muted);font-size:9px}
.timeline{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.timeline-row{display:grid;grid-template-columns:145px 1fr 100px 80px;gap:10px;padding:10px;border-bottom:1px solid var(--line);font-size:10px}
.timeline-row:last-child{border-bottom:0}.timeline-row b{font-size:11px}.timeline-row span{color:var(--muted)}
.loading,.error-box{padding:26px;text-align:center;color:var(--muted)}
.error-box{color:#fecdd3}
#toast{position:fixed;right:20px;bottom:20px;background:#13243a;border:1px solid var(--line);border-radius:12px;padding:12px 15px;opacity:0;pointer-events:none;transform:translateY(10px);transition:.2s}
#toast.show{opacity:1;transform:translateY(0)}
@media(max-width:1150px){.metrics{grid-template-columns:repeat(3,1fr)}.toolbar{grid-template-columns:repeat(2,1fr)}.searchbox{grid-column:1/-1}.workspace{grid-template-columns:1fr}.entity-list{height:480px;min-height:480px}}
@media(max-width:760px){.app{display:block}.sidebar{position:static;height:auto}.main{padding:14px}.metrics{grid-template-columns:repeat(2,1fr)}.toolbar{grid-template-columns:1fr}.searchbox{grid-column:auto}.detail-metrics{grid-template-columns:repeat(2,1fr)}.related-grid{grid-template-columns:1fr}.timeline-row{grid-template-columns:1fr}.topbar{display:block}.status-pill{display:inline-block;margin-top:12px}}
