*{box-sizing:border-box}
:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#0e1117;color:#f4f7fb}
body{margin:0;background:radial-gradient(circle at top right,rgba(70,120,255,.16),transparent 35%),#0e1117;min-height:100vh}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px clamp(18px,4vw,48px);border-bottom:1px solid #252b35;background:rgba(14,17,23,.88);position:sticky;top:0;backdrop-filter:blur(10px);z-index:5}
.brand{font-size:24px;font-weight:800}.muted{color:#93a0b4}.grid{width:min(1200px,94%);margin:28px auto;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.card,.login-card{background:#171c24;border:1px solid #252b35;border-radius:22px;box-shadow:0 18px 50px rgba(0,0,0,.24)}.card{padding:24px}.wide{grid-column:1/-1}
.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px}h1,h2,p{margin-top:0}h2{margin-bottom:16px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stat{background:#10151c;border-radius:16px;padding:16px;min-height:86px}.stat span{display:block;color:#93a0b4;font-size:13px;margin-bottom:8px}
.button-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}button,input{font:inherit}button{border:0;border-radius:14px;padding:13px 16px;cursor:pointer;background:#2b3340;color:#fff}button:hover{filter:brightness(1.08)}.primary{background:#f4f7fb;color:#101217;font-weight:800}.ghost{background:transparent;border:1px solid #384251}
.result{margin-top:14px;padding:12px;border-radius:12px;background:#10151c;color:#c8d2e3;min-height:44px}.badge{border-radius:999px;padding:8px 12px;background:#2f3642;font-size:12px;font-weight:800}.good{background:#173d2b;color:#6ff3a2}.bad{background:#482025;color:#ff8d98}
.network-list{display:grid;gap:8px}.network-row{display:flex;justify-content:space-between;gap:12px;padding:12px;border-radius:12px;background:#10151c;color:#bdc8d9}
.chat{height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:9px;padding:12px;border-radius:14px;background:#0a0e13;border:1px solid #232a34}.message{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:baseline;padding:10px 12px;background:#171f2a;border-radius:12px}.message small{color:#718096}
.chat-form{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:12px}input{width:100%;border:1px solid #333c4a;border-radius:14px;padding:13px 15px;color:#fff;background:#0c1118;outline:none}input:focus{border-color:#617089}
.login-page{display:grid;place-items:center;padding:24px}.login-card{width:min(430px,100%);padding:30px}.logo{font-size:56px;text-align:center}.login-card h1{text-align:center;margin-bottom:8px}.login-card p{text-align:center;margin-bottom:24px}
label{display:block;margin:14px 0 7px;color:#cbd5e1;font-weight:700}.login-card button{width:100%;margin-top:18px}.alert{background:#4c2027;color:#ffb8c0;border:1px solid #73323c;padding:11px 13px;border-radius:12px}
@media(max-width:800px){.grid{grid-template-columns:1fr}.wide{grid-column:auto}.stats{grid-template-columns:1fr 1fr}}
@media(max-width:500px){.topbar{align-items:flex-start}.stats,.button-grid{grid-template-columns:1fr}.chat-form{grid-template-columns:1fr}.message{grid-template-columns:1fr}}