:root {
  color-scheme: light;
  --bg: #f4f6f8;
  --panel: #ffffff;
  --text: #17202a;
  --muted: #697586;
  --line: #e4e9ef;
  --primary: #2867d7;
  --primary-dark: #1f54b3;
  --good: #16794b;
  --good-bg: #e9f7f0;
  --bad: #b42318;
  --bad-bg: #fff0ee;
  --warn: #9a6700;
  --warn-bg: #fff6dd;
  --shadow: 0 12px 38px rgba(26, 38, 54, .08);
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--bg); color: var(--text); }
button, input, select { font: inherit; }
a { color: var(--primary); }
.topbar { height: 68px; padding: 0 max(24px, calc((100vw - 1240px)/2)); display: flex; align-items: center; justify-content: space-between; background: var(--panel); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 5; }
.brand, .top-actions, .hero-row, .panel-head, .dialog-head, .dialog-actions, .row-actions { display: flex; align-items: center; }
.brand { gap: 11px; }.brand strong,.brand small { display:block; }.brand small { color:var(--muted); font-size:12px; margin-top:2px; }
.brand-mark { width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; color: white; font-weight: 800; letter-spacing: -.04em; background: linear-gradient(145deg, #367bea, #174aa5); box-shadow: 0 8px 22px rgba(40, 103, 215, .28); }
.brand-mark.small { width: 38px; height: 38px; border-radius: 11px; font-size: 13px; }
.top-actions { gap: 8px; }
.container { width: min(1240px, calc(100% - 32px)); margin: 34px auto 70px; }
.hero-row { justify-content: space-between; gap: 20px; margin-bottom: 24px; }
h1,h2,p { margin-top:0; } h1 { font-size: clamp(28px,4vw,38px); letter-spacing:-.035em; margin-bottom:8px; } h2 { font-size:20px; margin-bottom:5px; }
.muted { color: var(--muted); }.compact { font-size: 13px; }.centered { text-align:center; }
.button { display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border: 1px solid var(--line); background: white; border-radius: 10px; padding: 10px 15px; font-weight: 650; cursor: pointer; color: var(--text); transition: .15s ease; }
.button:hover { transform: translateY(-1px); border-color:#cbd4df; }.button.primary { background: var(--primary); color:white; border-color:var(--primary); box-shadow:0 6px 16px rgba(40,103,215,.2); }.button.primary:hover { background:var(--primary-dark); }.button.ghost { background:transparent; }.button.full { width:100%; }
.summary-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:22px; }
.summary-card { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:18px 20px; box-shadow:0 4px 18px rgba(26,38,54,.035); }.summary-card span { color:var(--muted); font-size:13px; display:block; }.summary-card strong { display:block; font-size:31px; margin-top:7px; }.summary-card.good strong { color:var(--good); }.summary-card.bad strong { color:var(--bad); }
.panel { background:var(--panel); border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); overflow:hidden; }.panel-head { justify-content:space-between; padding:20px 22px; border-bottom:1px solid var(--line); gap:20px; }.search { width:min(330px,40vw); border:1px solid var(--line); border-radius:10px; padding:10px 12px; outline:none; }.search:focus,input:focus,select:focus { border-color:#7ba5ea; box-shadow:0 0 0 3px rgba(40,103,215,.12); }
.table-wrap { overflow-x:auto; } table { width:100%; border-collapse:collapse; min-width:900px; } th,td { text-align:left; padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:middle; } th { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.045em; background:#fafbfc; } tbody tr:hover { background:#fbfcfe; } tbody tr:last-child td { border-bottom:0; }
.site-cell { max-width:390px; }.site-cell strong,.site-cell a { display:block; }.site-cell a { margin-top:4px; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-decoration:none; }.error-line { color:var(--bad); font-size:12px; margin-top:5px; max-width:360px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.badge { display:inline-flex; align-items:center; gap:7px; padding:5px 9px; border-radius:999px; font-size:12px; font-weight:700; white-space:nowrap; }.badge i { width:7px;height:7px;border-radius:50%;background:currentColor; }.badge.good { color:var(--good);background:var(--good-bg); }.badge.bad { color:var(--bad);background:var(--bad-bg); }.badge.warn { color:var(--warn);background:var(--warn-bg); }.badge.neutral { color:#556273;background:#eef1f5; }
.row-actions { gap:6px; flex-wrap:wrap; min-width:260px; }.mini-btn { border:1px solid var(--line); background:white; border-radius:8px; padding:6px 9px; cursor:pointer; font-size:12px; }.mini-btn:hover { border-color:#b9c6d5; }.mini-btn.danger { color:var(--bad); }.mini-btn:disabled { opacity:.55;cursor:wait; }
.empty { display:flex; flex-direction:column; align-items:center; gap:5px; padding:46px 20px; color:var(--muted); }.hidden { display:none !important; }
dialog { border:0; border-radius:18px; width:min(680px,calc(100% - 24px)); padding:0; box-shadow:0 30px 90px rgba(9,18,31,.28); } dialog::backdrop { background:rgba(18,28,43,.52); backdrop-filter:blur(2px); }.dialog-form { padding:24px; }.dialog-head { justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:16px; margin-bottom:18px; }.icon-btn { border:0;background:#eef1f5;border-radius:9px;width:34px;height:34px;font-size:23px;line-height:1;cursor:pointer;color:#556273; }.form-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:15px; }.form-grid .wide { grid-column:1/-1; } label { font-size:13px;font-weight:650;color:#364152; } input,select { width:100%;margin-top:7px;border:1px solid #d9e0e8;border-radius:9px;padding:10px 11px;background:white;outline:none;color:var(--text); }.check-row { display:flex;align-items:center;gap:9px;margin-top:15px;font-weight:550; }.check-row input { width:auto;margin:0; }.check-row.warning { color:var(--warn); }.dialog-actions { justify-content:flex-end;gap:9px;margin-top:22px; }.alert { margin-top:16px;background:var(--bad-bg);color:var(--bad);border:1px solid #ffd0cb;border-radius:9px;padding:10px 12px;font-size:13px; }
.history-dialog { width:min(880px,calc(100% - 24px)); }.history-summary { margin-bottom:12px;color:var(--muted);font-size:13px; }.history-table { max-height:55vh;border:1px solid var(--line);border-radius:10px; }.history-table table { min-width:700px; }.history-error { max-width:320px;white-space:normal;font-size:12px;color:var(--bad); }
.toast { position:fixed;right:24px;bottom:24px;z-index:20;background:#17202a;color:white;border-radius:11px;padding:12px 16px;box-shadow:0 12px 30px rgba(0,0,0,.22);max-width:min(430px,calc(100% - 48px)); }.toast.bad { background:var(--bad); }
.login-page { min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 25% 15%,#eaf1ff 0,transparent 34%),var(--bg); }.login-card { width:min(400px,100%);background:white;border:1px solid var(--line);border-radius:20px;padding:34px;box-shadow:var(--shadow); }.login-card .brand-mark { margin-bottom:22px; }.login-card h1 { margin-bottom:4px; }.login-form { margin-top:25px; }.login-form .button { margin-top:18px; }

.public-page { min-height:100vh;background:linear-gradient(180deg,#f5f7fb 0%,#eef2f7 100%); }
.status-page { width:min(920px,calc(100% - 32px));margin:54px auto 36px; }
.status-header { text-align:center;margin-bottom:28px; }
.status-header .brand-mark { margin:0 auto 14px; }
.status-header h1 { margin:4px 0 8px;font-size:clamp(30px,5vw,44px); }
.eyebrow { margin:0;color:var(--primary);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase; }
.overall-status { display:flex;align-items:center;gap:14px;padding:17px 20px;margin-bottom:16px;background:white;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow); }
.overall-status strong,.overall-status small { display:block; }
.overall-status small { margin-top:4px;color:var(--muted); }
.overall-dot { width:12px;height:12px;border-radius:50%;background:#94a3b8;box-shadow:0 0 0 6px rgba(148,163,184,.14);flex:0 0 auto; }
.overall-status.good .overall-dot { background:#16a34a;box-shadow:0 0 0 6px rgba(22,163,74,.13); }
.overall-status.warn .overall-dot { background:#d97706;box-shadow:0 0 0 6px rgba(217,119,6,.13); }
.overall-status.bad .overall-dot { background:#dc2626;box-shadow:0 0 0 6px rgba(220,38,38,.13); }
.public-status-list { background:white;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden; }
.public-status-item { display:grid;grid-template-columns:minmax(220px,1fr) auto auto;align-items:center;padding:20px;border-bottom:1px solid var(--line);gap:24px; }
.public-status-item:last-child { border-bottom:0; }
.public-site-title { display:flex;align-items:center;gap:10px; }
.public-site-main strong,.public-site-main small { display:block; }
.public-site-main small { color:var(--muted);margin-top:7px; }
.status-indicator { width:9px;height:9px;border-radius:50%;background:#94a3b8;flex:0 0 auto; }
.status-indicator.good { background:#16a34a; }
.status-indicator.warn { background:#d97706; }
.status-indicator.bad { background:#dc2626; }
.uptime-group { display:grid;grid-template-columns:repeat(2,minmax(86px,1fr));gap:22px; }
.uptime-group div { text-align:right; }
.uptime-group span,.uptime-group strong { display:block;white-space:nowrap; }
.uptime-group span { color:var(--muted);font-size:12px;margin-bottom:4px; }
.uptime-group strong { font-variant-numeric:tabular-nums;font-size:16px; }
.status-footer { display:flex;justify-content:space-between;gap:16px;margin-top:16px;color:var(--muted);font-size:12px; }
@media (max-width:720px) {
  .status-page { margin-top:30px; }
  .public-status-item { grid-template-columns:1fr auto;gap:16px; }
  .uptime-group { grid-column:1 / -1;grid-row:2;order:3;padding-top:2px; }
  .uptime-group div { text-align:left; }
  .status-footer { display:block;text-align:center; }
  .status-footer span { display:block;margin-top:5px; }
}

@media(max-width:800px){.summary-grid{grid-template-columns:repeat(2,1fr)}.topbar{padding:0 16px}.top-actions .muted{display:none}.container{width:min(100% - 20px,1240px);margin-top:22px}.hero-row{align-items:flex-start}.panel-head{align-items:flex-start;flex-direction:column}.search{width:100%}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}}
@media(max-width:520px){.hero-row{flex-direction:column}.hero-row .button{width:100%}.summary-grid{gap:9px}.summary-card{padding:14px}.top-actions{gap:4px}.top-actions .button{padding:8px 9px}.brand small{display:none}.dialog-form{padding:18px}}
