:root{--bg:#0f1420;--panel:#171d2b;--panel-2:#1e2536;--border:#2a3348;--text:#e6eaf2;--muted:#8d99b3;--up:#22c55e;--down:#ef4444;--warn:#f59e0b;--pause:#64748b;--accent:#3b82f6;--radius:10px}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);margin:0;padding:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans Thai,sans-serif;font-size:14px;line-height:1.5}a{color:inherit;text-decoration:none}.container{max-width:1200px;margin:0 auto;padding:24px 20px 64px}header.topbar{border-bottom:1px solid var(--border);background:var(--panel)}header.topbar .inner{justify-content:space-between;align-items:center;gap:16px;max-width:1200px;margin:0 auto;padding:14px 20px;display:flex}.brand{letter-spacing:.2px;font-size:16px;font-weight:700}.brand span{color:var(--muted);margin-left:8px;font-size:13px;font-weight:400}.stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:20px;display:grid}.stat{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px}.stat .label{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-size:12px}.stat .value{margin-top:4px;font-size:26px;font-weight:700}.stat.up .value{color:var(--up)}.stat.down .value{color:var(--down)}.stat.warn .value{color:var(--warn)}.toolbar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px;display:flex}.toolbar .grow{flex:1}input,select,textarea,button{font:inherit;color:var(--text)}input,select,textarea{background:var(--panel-2);border:1px solid var(--border);border-radius:8px;width:100%;padding:8px 10px}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px}select option{background:var(--panel-2)}.btn{background:var(--panel-2);border:1px solid var(--border);cursor:pointer;white-space:nowrap;border-radius:8px;padding:8px 14px}.btn:hover{background:#26304a}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.btn.primary:hover{background:#2f74e0}.btn.danger{color:#fca5a5;border-color:#582c2c}.btn.danger:hover{background:#3a1e1e}.btn.sm{padding:5px 10px;font-size:12px}.list{flex-direction:column;gap:10px;display:flex}.row{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);grid-template-columns:1fr auto;align-items:center;gap:12px;padding:14px 16px;display:grid}.row:hover{border-color:#3a4763}.row .main{min-width:0}.row .name{align-items:center;gap:8px;font-size:15px;font-weight:600;display:flex}.row .meta{color:var(--muted);flex-wrap:wrap;gap:4px 14px;margin-top:4px;font-size:12.5px;display:flex}.row .right{align-items:center;gap:14px;display:flex}.dot{border-radius:50%;flex:none;width:9px;height:9px}.dot.up{background:var(--up);box-shadow:0 0 0 3px #22c55e26}.dot.down{background:var(--down);box-shadow:0 0 0 3px #ef444426}.dot.pending{background:var(--warn)}.dot.paused{background:var(--pause)}.badge{border:1px solid var(--border);color:var(--muted);text-transform:uppercase;letter-spacing:.4px;border-radius:999px;padding:2px 7px;font-size:11px}.badge.up{color:var(--up);border-color:#22c55e59}.badge.down{color:var(--down);border-color:#ef444459}.badge.paused{color:var(--pause)}.badge.pending{color:var(--warn);border-color:#f59e0b59}.uptime{text-align:right;min-width:76px}.uptime .pct{font-size:15px;font-weight:700}.uptime .lbl{color:var(--muted);font-size:11px}.bars{align-items:flex-end;gap:2px;height:26px;display:flex}.bars .bar{background:#2b3448;border-radius:2px;width:4px;height:100%}.bars .bar.up{background:var(--up)}.bars .bar.down{background:var(--down)}.bars .bar.partial{background:var(--warn)}.backdrop{z-index:50;background:#05080fb3;justify-content:center;align-items:flex-start;padding:40px 16px;display:flex;position:fixed;inset:0;overflow:auto}.modal{background:var(--panel);border:1px solid var(--border);border-radius:14px;width:100%;max-width:720px;padding:22px}.modal h2{margin:0 0 4px;font-size:18px}.modal .sub{color:var(--muted);margin-bottom:18px;font-size:13px}.grid2{grid-template-columns:1fr 1fr;gap:12px;display:grid}.grid3{grid-template-columns:1fr 1fr 1fr;gap:12px;display:grid}.field{margin-bottom:12px}.field label{color:var(--muted);margin-bottom:5px;font-size:12px;display:block}.section-title{text-transform:uppercase;letter-spacing:.6px;color:var(--muted);border-bottom:1px solid var(--border);margin:20px 0 10px;padding-bottom:6px;font-size:12px}.actions{justify-content:flex-end;gap:10px;margin-top:20px;display:flex}.error{color:#fca5a5;background:#3a1e1e;border:1px solid #582c2c;border-radius:8px;margin-bottom:12px;padding:9px 12px}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px;padding:18px}.panel h3{text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin:0 0 14px;font-size:14px}.kv{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px 20px;display:grid}.kv .k{color:var(--muted);font-size:12px}.kv .v{word-break:break-word;margin-top:2px;font-size:14px}.kv .v.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid var(--border);padding:9px 10px;font-size:13px}th{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-size:11.5px;font-weight:500}td.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}.text-up{color:var(--up)}.text-down{color:var(--down)}.muted{color:var(--muted)}.empty{color:var(--muted);text-align:center;padding:40px 0}code.token{background:var(--panel-2);border:1px solid var(--border);word-break:break-all;border-radius:6px;padding:3px 7px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}@media (max-width:720px){.grid2,.grid3,.row{grid-template-columns:1fr}.bars{display:none}}