:root{
  --bg:#0b1220; --panel:#121b2c; --ink:#cfe7ff; --muted:#90a3c0;
  --accent:#34d399; --grid:#22314e; --sun:#f6a340; --moon:#64a2ff;
  --line:#3a527a; --warn:#f59e0b;
}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font:14px system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow-x:hidden}
.wrap{max-width:1200px;margin:24px auto;padding:0 16px}
h1{font-size:18px;margin:0 0 12px 0;color:#fff}
.row{display:grid;gap:16px}
/* Equal 1:1 columns for two-up layouts */
.row.grid-1-1{display:grid;gap:16px}
@media(min-width:980px){.row.grid-1-1{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(min-width:980px){.row.grid-2-3{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}}
.row.grid-3-2{display:grid;gap:16px}
@media(min-width:980px){.row.grid-3-2{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}}
.card{background:var(--panel);border-radius:12px;border:1px solid #16233a;box-shadow:0 8px 24px rgba(0,0,0,.25);min-width:0}
.pad{padding:14px 16px}
.toolbar{display:flex;gap:10px;align-items:center;justify-content:flex-start;margin-bottom:10px}
/* Top nav with burger and auth */
.topnav{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.burger{background:#0e1626;border:1px solid #253858;color:#cfe7ff;border-radius:8px;padding:8px 10px;cursor:pointer}
.menu{position:absolute;top:50px;left:16px;background:#0e1626;border:1px solid #1c2a45;border-radius:8px;display:none;min-width:200px;z-index:1000}
.menu.open{display:block}
.menu a{display:block;padding:10px 12px;color:#cfe7ff;text-decoration:none;border-bottom:1px solid #13243d}
.menu a:last-child{border-bottom:none}
.auth{display:flex;align-items:center;gap:8px}
.btn{background:#0e1626;border:1px solid #253858;color:#cfe7ff;border-radius:8px;padding:6px 10px;cursor:pointer}
.btn-bright{background:var(--accent);border-color:var(--accent);color:#072116;font-weight:700}
.right-controls{margin-left:auto;display:flex;align-items:center;gap:8px}
.avatar{width:32px;height:32px;border-radius:50%;border:1px solid #253858;display:none;object-fit:cover;margin-left:8px}
.avatar-initial{width:32px;height:32px;border-radius:50%;border:1px solid #253858;display:none;background:#0e1626;color:#cfe7ff;text-align:center;line-height:32px;font-weight:700;font-size:13px;margin-left:8px}
.menu .menu-section{padding:10px 12px;border-top:1px solid #13243d}
.menu .menu-section label{display:block;color:var(--muted);font-size:12px;margin-bottom:6px}
select{background:#0e1626;color:var(--ink);border:1px solid #253858;border-radius:8px;padding:8px 10px}
canvas{width:100%;height:420px;display:block;border-radius:12px;background:#0e1626}
table{width:100%;border-collapse:collapse;color:var(--ink)}
th,td{padding:10px 8px;border-bottom:1px dashed #203150}
th{color:var(--muted);font-weight:600;text-align:left}
.pill{padding:.15rem .5rem;border-radius:999px;background:#0e1a2e;border:1px solid #244163;color:#cfe7ff;font-size:12px}
.legend{display:flex;gap:14px;align-items:center;color:var(--muted);font-weight:600}
.dot{width:9px;height:9px;border-radius:50%}
.sun{background:var(--sun)}
.moon{background:var(--moon)}
.dash{border-bottom:2px dotted var(--muted); width:18px; height:0; display:inline-block; transform:translateY(-3px)}
.hint{color:var(--muted);font-size:12px}
.mini-vu{display:flex;align-items:flex-end;gap:2px;height:35px;margin-top:6px}
.mini-vu .seg{flex:1;min-width:2px;background:#0b1a2c;border:1px solid #12243d;border-radius:2px;position:relative;height:100%}
.mini-vu .seg .fill{position:absolute;bottom:0;left:0;right:0;background:#34d399;height:0;border-radius:2px}

/* VU grid (per-site bars) */
.vu-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));}
.vu-item{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:6px;align-items:center;background:#0e1626;border:1px solid #1c2a45;border-radius:8px;padding:8px}
.vu-label{grid-column:1/2;font-weight:600;color:#cfe7ff}
.vu-age{grid-column:2/3;justify-self:end;color:var(--muted);font-size:12px}
.vu-bar{grid-column:1/3;height:10px;background:#0b1a2c;border:1px solid #12243d;border-radius:6px;overflow:hidden}
.vu-fill{height:100%;width:0;background:#34d399;transition:width .25s ease}

/* Ticker */
.ticker{position:relative;overflow:hidden;background:#0e1626;border:1px solid #1c2a45;border-radius:8px;padding:8px 10px;height:42px;display:flex;align-items:center;max-width:100%}
.ticker-track{display:inline-flex;gap:22px;white-space:nowrap;will-change:transform;animation:ticker-scroll 28s linear infinite}
.ticker-item{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.ticker-name{color:#cfe7ff}
.ticker-val{color:#cfe7ff;opacity:.85}
.arrow-up{color:#34d399}
.arrow-down{color:#ef4444}
.arrow-flat{color:#90a3c0}
@keyframes ticker-scroll{from{transform:translateX(0)}to{transform:translateX(-50%);}}

/* Fact box */
.fact-box{min-height:42px}
.fact-text{margin:0 0 6px 0}
.fact-meta{margin:0;color:var(--muted)}

/* Links — keep themed, avoid default blue/purple */
a, a:visited{ color:#9fd0ff; text-decoration:none; }
a:hover{ color:#ffffff; text-decoration:underline; }
a:active{ color:#cfe7ff; }

/* Logs styling */
#logsBox{ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; }
.log-ts{ color: var(--muted); }
.log-svc{ color: #9fd0ff; }
.sev-error{ color: #ef4444; font-weight: 600; }
.sev-warn{ color: var(--warn); font-weight: 600; }
.sev-info{ color: var(--ink); }
.sev-debug{ color: #7aa2f7; opacity: 0.9; }
