:root{--bg:#0b0f17;--ink:#e2e8f0;--muted:#94a3b8;--panel:#111827;--ring:#1e293b;--shadow:0 8px 30px rgba(0,0,0,.7);--up:#00ff9d;--warn:#facc15;--down:#ff375f;--idle:#64748b;--nav:#0f172a}*{box-sizing:border-box}body,html{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial}a{color:inherit;text-decoration:none}.wrap{max-width:1000px;margin:0 auto;padding:0 20px}.small{font-size:12px}.muted{color:var(--muted)}.topbar{background:linear-gradient(90deg,#0f172a,#1e293b);color:#e2e8f0;padding:18px 0;position:-webkit-sticky;position:sticky;top:0;z-index:10;box-shadow:0 2px 10px rgba(0,0,0,.6)}.topbar-inner{justify-content:space-between}.left,.topbar-inner{display:flex;align-items:center}.left{gap:12px}.brand-logo{width:32px;height:32px;border-radius:999px;box-shadow:0 0 12px rgba(0,255,157,.6)}.brand{font-size:22px;font-weight:800;color:#00ff9d;text-shadow:0 0 8px rgba(0,255,157,.5)}.right{text-align:right;color:var(--muted)}.hero{display:flex;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--ring);border-radius:14px;padding:20px;margin:18px 0 22px;box-shadow:0 0 25px rgba(0,255,157,.05),var(--shadow)}.hero-dot{width:26px;height:26px;border-radius:50%}.hero.up .hero-dot{background:var(--up);animation:pulseGreen 2.5s ease-out infinite}.hero.warn .hero-dot{background:var(--warn);box-shadow:0 0 12px rgba(250,204,21,.6)}.hero.down .hero-dot{background:var(--down);animation:blinkRed 1.2s step-end infinite}.hero-text{font-weight:800;font-size:24px;letter-spacing:.5px}.hero-actions{margin-left:auto;display:flex;align-items:center;gap:10px}.btn{padding:6px 12px;border:1px solid var(--ring);border-radius:8px;background:#1e293b;color:var(--ink);cursor:pointer;transition:all .2s ease}.btn:hover{background:#0f172a;box-shadow:0 0 10px rgba(0,255,157,.4)}.btn:disabled{opacity:.6}.input,.select{padding:6px 10px;border:1px solid var(--ring);border-radius:8px;background:#0f172a;color:var(--ink)}.w-full{width:100%}.sep{width:1px;height:20px;background:var(--ring)}.controls{gap:12px;flex-wrap:wrap;margin:8px 0}.control,.controls{display:flex;align-items:center}.control{gap:8px}.lbl{font-size:12px;color:var(--muted)}.seg{display:flex;border:1px solid var(--ring);border-radius:10px;overflow:hidden}.seg-btn{font-size:17px;padding:6px 12px;background:#1e293b;color:var(--ink);border:none;border-right:1px solid var(--ring);cursor:pointer;transition:background .2s}.seg-btn:last-child{border-right:none}.seg-btn.active{background:#00ff9d;color:#0f172a;font-weight:700}.section-title{margin:10px 2px 14px;font-size:22px;font-weight:700}.card{background:var(--panel);border:1px solid var(--ring);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}.empty{padding:24px;text-align:center;color:var(--muted)}.svc{display:flex;flex-direction:column;gap:12px;padding:18px 20px;border-bottom:1px solid var(--ring)}.svc:last-child{border-bottom:0}.svc-top{display:grid;grid-template-columns:1.2fr 1fr;grid-gap:16px;gap:16px;align-items:center}@media (max-width:900px){.svc-top{grid-template-columns:1fr}}.svc-left{display:flex;align-items:center;gap:10px;min-width:0}.svc-name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}.status-dot{width:10px;height:10px;border-radius:999px;background:var(--idle)}.status-dot.up{background:var(--up);box-shadow:0 0 8px rgba(0,255,157,.5)}.status-dot.warn{background:var(--warn)}.status-dot.down{background:var(--down);animation:blinkRed 1s step-end infinite}.svc-state{margin-left:8px;font-weight:600}.svc-state.up{color:var(--up)}.svc-state.warn{color:var(--warn)}.svc-state.down{color:var(--down)}.svc-right{display:flex;flex-direction:column;gap:6px;justify-content:center}.kv{display:flex;justify-content:space-between;gap:12px}.k{color:var(--muted)}.v{font-weight:700;color:var(--ink)}.svc-bottom{display:flex;align-items:center}.pbar,.pbar-wrap{width:100%}.pbar{position:relative;height:12px;background:#1e293b;border-radius:999px;overflow:hidden}.pbar-fill{height:100%;background:linear-gradient(90deg,var(--up),#0ff)}.ticks{height:6px;background:repeating-linear-gradient(90deg,transparent 0 16px,hsla(0,0%,100%,.08) 16px 17px)}.svc-url,.ticks{margin-top:6px}.svc-url a{color:#38bdf8;text-decoration:none;display:none}.svc-url a:hover{text-decoration:underline;text-shadow:0 0 6px #38bdf8}.note{margin:10px 0;padding:10px;border-radius:8px;background:#1e293b;color:var(--ink)}.note.warn{background:#452626;border:1px solid var(--down);color:#fecaca}.footer{display:flex;justify-content:space-between;align-items:center;margin:24px 0;color:var(--muted)}@keyframes blinkRed{0%,49%{opacity:1;box-shadow:0 0 8px rgba(255,55,95,.9)}50%,to{opacity:.3;box-shadow:0 0 20px rgba(255,55,95,0)}}@keyframes pulseGreen{0%{box-shadow:0 0 0 0 rgba(0,255,157,.7)}70%{box-shadow:0 0 0 15px rgba(0,255,157,0)}to{box-shadow:0 0 0 0 rgba(0,255,157,0)}}@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media (max-width:1024px){.svc-right{gap:12px}.svc-name{max-width:48vw}}@media (max-width:640px){.topbar-inner{flex-wrap:wrap;gap:8px}.hero{flex-wrap:wrap;gap:10px}.hero-actions{width:100%;justify-content:space-between}.controls{align-items:stretch}.controls,.svc-top{flex-direction:column}.svc-top{display:flex}.svc-right{width:100%;justify-content:space-between;gap:8px}.kv{align-items:flex-start}.svc-name{max-width:80vw}.seg,.w-full{width:100%}.seg{display:flex;flex-direction:column;border:1px solid var(--ring);border-radius:10px;overflow:hidden}}