:root{--bg: #f1f5f9;--panel: #ffffff;--muted: #6b7280;--accent: #0b78d1;--card: #ffffff;--text: #0f172a;--shadow: rgba(15, 23, 42, .06)}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;background:var(--bg);color:var(--text)}.app-root{display:flex;min-height:100vh}.sidebar{width:220px;background:var(--panel);border-right:1px solid rgba(0,0,0,.05);padding:22px}.brand{font-weight:700;font-size:18px;margin-bottom:18px}.side-nav{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}.nav-btn{background:transparent;border:1px solid transparent;padding:8px 10px;border-radius:6px;text-align:left;cursor:pointer;color:var(--text)}.nav-btn.active{background:linear-gradient(90deg,#eef6ff,#fff);border-color:#0b78d114;box-shadow:0 1px 0 var(--shadow)}.server-select{margin-top:18px}.server-select label{display:block;margin-bottom:8px;color:var(--muted);font-size:13px}.server-select select{width:100%;padding:8px;border-radius:6px;border:1px solid rgba(15,23,42,.06);background:var(--card)}.main-column{flex:1;display:flex;flex-direction:column}.header{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid rgba(0,0,0,.04);background:transparent}.header .btn-primary{background:var(--accent);color:#fff;padding:8px 12px;border-radius:8px;border:none;cursor:pointer}.header .btn-ghost{background:transparent;border:1px solid rgba(0,0,0,.05);padding:6px 10px;border-radius:6px;cursor:pointer}.content{padding:24px}.cards-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:16px}.card{background:var(--card);padding:16px;border-radius:10px;box-shadow:0 4px 12px #02061708;border:1px solid rgba(2,6,23,.02)}.card.stat .muted{color:var(--muted);font-size:13px}.big{font-size:20px;font-weight:700;margin-top:6px}.chart-card{padding:14px}.card-title{font-weight:700;margin-bottom:8px;color:var(--text)}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.channel-list{display:flex;flex-direction:column}.channel-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(15,23,42,.03)}.channel-name{font-weight:600}.channel-count{color:var(--muted)}.status.online{color:#10b981}.status.offline{color:var(--muted)}footer{padding:20px;text-align:center;color:var(--muted)}