:root { --bg:#0f1115; --card:#181b22; --line:#262a33; --text:#e6e8ee; --muted:#8b93a7; --accent:#4f8cff; --up:#3ccf7a; --down:#ff5d6c; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; }
a { color:var(--accent); text-decoration:none; }
.nav { display:flex; align-items:center; gap:24px; padding:12px 20px; border-bottom:1px solid var(--line); }
.brand { color:var(--text); font-weight:600; }
.tabs { display:flex; gap:16px; }
.tabs a { color:var(--muted); padding:6px 0; border-bottom:2px solid transparent; }
.tabs a.active { color:var(--text); border-color:var(--accent); }
.who { margin-left:auto; color:var(--muted); }
main { max-width:1200px; margin:0 auto; padding:20px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px 20px; margin-bottom:16px; }
.card.narrow { max-width:420px; margin:60px auto; }
.muted { color:var(--muted); }
h1 { font-size:22px; margin:0 0 12px; }
h2 { font-size:17px; margin:0 0 10px; }
.dev-login { display:flex; gap:8px; margin-top:16px; }
input, select, button { background:var(--bg); color:var(--text); border:1px solid var(--line); border-radius:6px; padding:6px 10px; }
button { cursor:pointer; }

.head { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.period a, .filters a { display:inline-block; padding:4px 10px; border:1px solid var(--line); border-radius:6px; color:var(--muted); margin-right:6px; }
.period a.active, .filters a.active { color:var(--text); border-color:var(--accent); }
.filters { margin-bottom:12px; }
.filters .sep { color:var(--line); margin:0 8px; }
.banner { padding:10px 14px; border-radius:8px; margin-bottom:12px; }
.banner.err { background:#3a1a1f; color:#ffb3ba; } .banner.warn { background:#3a2f16; color:#ffd58a; } .banner.info { background:#16283a; color:#9fc4ff; }
.kpis { display:flex; gap:28px; margin:8px 0 14px; flex-wrap:wrap; }
.kpis div { display:flex; flex-direction:column; } .kpis b { font-size:22px; } .kpis span { color:var(--muted); font-size:13px; }
.up, .up b { color:var(--up); } .down, .down b { color:var(--down); }
.tbl { width:100%; border-collapse:collapse; } .tbl th, .tbl td { padding:8px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.tbl th a { color:var(--muted); } .tbl th a.active { color:var(--text); }
.tbl td.text { max-width:480px; }
.grid3 { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:16px; }
.big { font-size:28px; font-weight:600; margin:0 0 8px; }
.kv td { padding:4px 0; } .kv td:last-child { text-align:right; } .kv tr.sep td { border-top:1px solid var(--line); padding-top:8px; }
.tag { font-size:11px; padding:1px 6px; border:1px solid var(--line); border-radius:4px; color:var(--muted); }