:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#edf1f7;font-synthesis:none;background:#0b0e13;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:#0b0e13;min-width:320px;min-height:100vh;margin:0}button{font:inherit}.auth-loading,.login-shell{place-items:center;min-height:100vh;display:grid}.auth-loading .refresh-dot{width:10px;height:10px}.login-shell{width:min(100% - 32px,440px);margin:0 auto;padding:32px 0}.login-card{background:#10141b;border:1px solid #222934;border-radius:16px;width:100%;padding:38px}.login-card h1{font-size:38px}.login-description{color:#929dac;margin:18px 0 28px;line-height:1.5}.login-form{gap:12px;display:grid}.login-form label{color:#c5ccd6;font-size:13px;font-weight:650}.login-form input{color:#edf1f7;width:100%;font:inherit;background:#0b0e13;border:1px solid #343e4d;border-radius:9px;outline:none;padding:12px 13px}.login-form input:focus{border-color:#65a9ff;box-shadow:0 0 0 3px #65a9ff1f}.login-form button{color:#10141b;cursor:pointer;background:#edf1f7;border:0;border-radius:9px;margin-top:6px;padding:12px 16px;font-weight:700}.login-form button:disabled{cursor:wait;opacity:.65}.login-error{color:#efb4b5;margin:0;font-size:13px}.shell{width:min(1120px,100% - 48px);margin:0 auto;padding:64px 0 80px}.topbar{justify-content:space-between;align-items:flex-start;gap:32px;margin-bottom:38px;display:flex}.eyebrow{color:#677386;letter-spacing:.16em;margin:0 0 10px;font-size:11px;font-weight:700}h1{letter-spacing:-.045em;margin:0;font-size:clamp(32px,5vw,48px);line-height:1}.summary{color:#929dac;margin:16px 0 0;font-size:16px}.summary strong{color:#50d890;font-weight:650}.summary span{color:#4c5665;margin:0 4px}.header-stats{flex-direction:column;align-items:flex-end;gap:8px;margin-top:8px;display:flex}.status-line,.throughput{align-items:center;gap:16px;display:flex}.cpu-load,.uptime,.refresh{color:#7d899a;text-transform:uppercase;letter-spacing:.09em;align-items:center;gap:8px;font-size:12px;display:flex}.cpu-load,.uptime{font-variant-numeric:tabular-nums;border-right:1px solid #29313d;padding-right:16px}.cpu-load strong,.uptime strong{color:#c5ccd6;text-align:right;min-width:42px;font-weight:650}.refresh-dot{background:#50d890;border-radius:50%;width:7px;height:7px}.refresh.active .refresh-dot{background:#e9b65b}.throughput,.total-today{color:#c5ccd6;font-variant-numeric:tabular-nums;font-size:13px}.throughput b{margin-right:3px;font-size:14px}.download b{color:#65a9ff}.upload b{color:#bd8cff}.total-today{color:#7d899a}.total-today strong{color:#c5ccd6;font-weight:650}.logout-button{color:#7d899a;cursor:pointer;background:0 0;border:0;padding:2px 0;font-size:12px}.logout-button:hover{color:#edf1f7}.clients{background:#10141b;border:1px solid #222934;border-radius:14px;overflow:hidden}.table-header,.client-row{grid-template-columns:minmax(220px,1.3fr) minmax(115px,.55fr) minmax(115px,.55fr) minmax(185px,.8fr) minmax(150px,.65fr);align-items:center;column-gap:28px;display:grid}.table-header{color:#657083;letter-spacing:.09em;text-transform:uppercase;border-bottom:1px solid #222934;padding:13px 22px;font-size:11px;font-weight:650}.client-row{min-height:88px;padding:18px 22px}.client-row+.client-row{border-top:1px solid #1d232d}.identity{align-items:center;gap:14px;min-width:0;display:flex}.status-dot{border:2px solid #5a6473;border-radius:50%;flex:none;width:9px;height:9px}.status-dot.online{background:#50d890;border:0;box-shadow:0 0 0 4px #50d89017}.identity strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:15px;font-weight:400;overflow:hidden}.period-traffic{color:#c5ccd6;font-variant-numeric:tabular-nums;font-size:13px}.period-traffic strong{font-weight:500}.client-throughput{color:#c5ccd6;font-variant-numeric:tabular-nums;white-space:nowrap;align-items:center;gap:12px;font-size:12px;display:flex}.client-throughput b{margin-right:2px;font-size:13px}.mobile-label{display:none}.connection{color:#c5ccd6;font-variant-numeric:tabular-nums;font-size:13px}.error-banner{color:#efb4b5;background:#251719;border:1px solid #5b3738;border-radius:10px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px;padding:13px 16px;font-size:13px;display:flex}.error-banner button{color:#10141b;cursor:pointer;background:#edf1f7;border:0;border-radius:7px;padding:7px 12px;font-size:12px;font-weight:650}.skeleton-list{padding:4px 22px}.skeleton{background:linear-gradient(90deg,#0000,#ffffff06,#0000);border-bottom:1px solid #1d232d;height:80px}.skeleton:last-child{border-bottom:0}.empty{color:#7d8998;text-align:center;margin:0;padding:48px 22px}@media (width<=1000px){.shell{width:min(100% - 28px,620px);padding:36px 0 48px}.topbar{margin-bottom:28px}.table-header{display:none}.clients{background:0 0;border:0;overflow:visible}.client-list{gap:10px;display:grid}.client-row{background:#10141b;border:1px solid #222934;border-radius:12px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(170px,1fr);grid-template-areas:"identity identity identity""today month traffic""connection connection connection";gap:22px 16px;min-height:0;padding:19px}.client-row+.client-row{border-top:1px solid #222934}.identity{grid-area:identity/1/identity/-1}.traffic-today{grid-area:today}.traffic-month{grid-area:month}.client-throughput{grid-area:traffic;place-self:start end}.period-traffic{flex-direction:column;gap:5px;display:flex}.mobile-label{color:#657083;letter-spacing:.09em;text-transform:uppercase;font-size:10px;font-weight:650;display:block}.connection{grid-area:connection/1/connection/-1;padding-top:4px}.skeleton-list{gap:10px;padding:0;display:grid}.skeleton{background-color:#10141b;border:1px solid #222934;border-radius:12px;height:124px}}@media (width<=520px){.login-card{padding:28px 22px}.shell{width:calc(100% - 24px);padding-top:28px}.header-stats{align-items:flex-start;width:100%;margin-top:5px}.topbar{flex-wrap:wrap;gap:16px}.client-row{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"identity identity""today traffic""month traffic""connection connection";gap:18px}.identity strong{font-size:18px}.connection{text-align:left;grid-column:1/-1}}
