:root{--bg:#f6f8fb;--ink:#0f172a;--muted:#6b7280;--panel:#fff;--ring:#e5e7eb;--shadow:0 20px 45px rgba(2,6,23,.08);--green:#16a34a;--orange:#f59e0b;--red:#ef4444;--nav:#cfc4f7}*{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:#64748b}.pc-header{margin:20px 0;background:linear-gradient(90deg,#c4d9ff,#d7c7f9);border:1px solid #ccc;border-radius:10px;padding:10px 20px;box-shadow:0 4px 12px rgba(0,0,0,.1)}.pc-header-inner{justify-content:space-between}.pc-header-inner,.pc-left{display:flex;align-items:center}.pc-left{gap:10px}.pc-logo{height:36px}.pc-brand{font-weight:600;font-size:16px}.pc-right{font-size:14px;color:#333}.hero{display:flex;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--ring);border-radius:12px;padding:18px 20px;margin:18px 0 22px;box-shadow:var(--shadow)}.hero-dot{width:28px;height:28px;border-radius:999px}.hero.up .hero-dot{background:var(--green);box-shadow:0 0 0 6px rgba(22,163,74,.18)}.hero.warn .hero-dot{background:var(--orange);box-shadow:0 0 0 6px rgba(245,158,11,.18)}.hero-text{font-weight:800;font-size:26px}.section-title{margin:10px 2px 12px;font-size:24px}.card{background:var(--panel);border:1px solid var(--ring);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}.svc{display:flex;flex-direction:column;gap:10px;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}.status-dot{width:10px;height:10px;border-radius:999px;background:#9ca3af}.status-dot.up{background:var(--green)}.status-dot.warn{background:var(--orange)}.status-dot.down{background:var(--red)}.svc-state{margin-left:8px;font-weight:600;color:#111827;opacity:.85}.svc-state.up{color:var(--green)}.svc-state.warn{color:var(--orange)}.svc-state.down{color:var(--red)}.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}.svc-bottom{display:flex;align-items:center}.pbar,.pbar-wrap{width:100%}.pbar{position:relative;height:12px;background:#eef2f7;border-radius:999px;border:1px solid #e5e7eb;overflow:hidden}.pbar-fill{height:100%;background:linear-gradient(90deg,#16a34a,#16a34a)}.ticks{height:6px;margin-top:6px;background:repeating-linear-gradient(90deg,transparent 0 16px,rgba(0,0,0,.06) 16px 17px)}.footer{display:flex;justify-content:space-between;align-items:center;margin:24px 0;color:#64748b}