:root {
    --bg:#f4f7fb; --card:#ffffff; --line:#e2e8f0; --text:#0f172a; --muted:#64748b;
    --blue:#2563eb; --red:#ef4444; --green:#16a34a; --amber:#f59e0b;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { min-height:100%; }
body {
    min-height:100vh;
    background:
        radial-gradient(circle at top left, rgba(37,99,235,.12), transparent 32%),
        radial-gradient(circle at top right, rgba(239,68,68,.08), transparent 28%),
        var(--bg);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color:var(--text); padding:28px;
}
.hidden { display:none !important; }
.container { max-width:1480px; margin:0 auto; }
.header { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:26px; }
.brand { display:flex; align-items:center; gap:14px; }
h1 { font-size:30px; letter-spacing:-.04em; }
.badge { margin-top:5px; background:#e2e8f0; padding:6px 13px; border-radius:999px; font-size:13px; color:#334155; display:inline-flex; gap:7px; align-items:center; }
.logout-btn { background:var(--red); color:white; border:0; text-decoration:none; border-radius:6px; padding:10px 18px; min-height:42px; font-weight:700; display:inline-flex; gap:8px; align-items:center; cursor:pointer; }
.card { background:rgba(255,255,255,.92); border:1px solid rgba(148,163,184,.22); border-radius:24px; padding:24px; margin-bottom:24px; box-shadow:0 12px 32px rgba(15,23,42,.06); backdrop-filter:blur(12px); }
.card h3 { font-size:19px; margin-bottom:16px; display:flex; align-items:center; gap:10px; }
.add-title-icon { color:#2563eb; }
textarea, input, select { background:#f8fafc; border:1px solid #cbd5e1; border-radius:16px; padding:12px 14px; color:#0f172a; font:inherit; }
textarea { width:100%; min-height:110px; font-family:ui-monospace, SFMono-Regular, Menlo, monospace; resize:vertical; }
textarea:focus, input:focus, select:focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 4px rgba(37,99,235,.1); }
button { font-family:inherit; }
.primary-btn, .secondary-btn, .action-btn { border:0; border-radius:6px; padding:10px 18px; min-height:42px; font-weight:700; cursor:pointer; display:inline-flex; gap:8px; align-items:center; justify-content:center; box-shadow:none; }
.primary-btn { background:var(--blue); color:white; margin-top:12px; }
.secondary-btn { background:#e2e8f0; color:#0f172a; }
.secondary-btn:hover, .action-btn:hover { background:#cbd5e1; }
.danger-btn { background:#fee2e2; color:#b91c1c; }
.danger-btn:hover { background:#fecaca; }
.button-group { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px; }
.tab-bar { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; border-bottom:1px solid var(--line); padding-bottom:10px; }
.tab { border:0; background:#f1f5f9; color:#475569; border-radius:6px; padding:10px 16px; min-height:42px; font-weight:700; cursor:pointer; }
.tab.active { background:var(--blue); color:white; }
.table-wrap { overflow:auto; border:1px solid #e5e7eb; border-radius:18px; background:white; max-height:650px; }
table { width:100%; min-width:1200px; border-collapse:collapse; font-size:13px; }
thead th { background:#f8fafc; border-bottom:1px solid var(--line); color:#0f172a; padding:12px 10px; text-align:left; white-space:nowrap; position:sticky; top:0; z-index:2; }
tbody td { border-bottom:1px solid #f1f5f9; vertical-align:top; padding:10px; }
tbody tr:hover td { background:#f8fafc; }
td.url-col { max-width:430px; overflow-wrap:anywhere; line-height:1.35; }
a.link-url { color:#2563eb; text-decoration:none; font-weight:700; }
a.link-url:hover { text-decoration:underline; }
.status-badge { display:inline-block; border-radius:999px; padding:4px 10px; font-size:12px; font-weight:900; text-transform:uppercase; }
.status-active { background:#dcfce7; color:#166534; }
.status-medium { background:#fef3c7; color:#92400e; }
.status-down { background:#fee2e2; color:#991b1b; }
.status-pending, .status-unknown { background:#fef9c3; color:#854d0e; }
.actions { display:flex; flex-wrap:wrap; gap:5px; }
.action-btn { background:#e2e8f0; color:#0f172a; padding:7px 10px; min-height:36px; font-size:12px; }
.delete-btn { background:#fee2e2; color:#dc2626; }
.delete-btn:hover { background:#fecaca; }
.count-pill { display:inline-flex; align-items:center; gap:7px; background:#eaf2ff; color:#1d4ed8; padding:8px 14px; border-radius:999px; font-weight:900; margin:2px 0 14px; }
.local-table-top { display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; margin:0 0 12px; }
.local-table-left, .local-table-right { display:flex; align-items:center; gap:8px; font-weight:800; color:#334155; }
.local-table-left select, .local-table-right input { border:1px solid var(--line); background:#f8fafc; border-radius:999px; padding:10px 14px; font-weight:700; outline:none; }
.local-table-right input { width:310px; max-width:70vw; }
.local-table-right input:focus { border-color:#2563eb; box-shadow:0 0 0 4px rgba(37,99,235,.10); }
.local-table-bottom { display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; margin-top:12px; font-weight:800; color:#64748b; }
.local-pages { display:flex; gap:5px; flex-wrap:wrap; justify-content:flex-end; }
.local-page-btn { border:0; border-radius:6px; background:#e2e8f0; color:#0f172a; padding:7px 11px; min-height:36px; font-weight:900; cursor:pointer; }
.local-page-btn:disabled { opacity:.45; cursor:not-allowed; }
.footer { text-align:center; color:#94a3b8; font-size:13px; margin-top:24px; }
.admin-grid { display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; }
.admin-grid label { display:grid; gap:6px; font-size:13px; font-weight:700; color:#334155; }
.modal { position:fixed; inset:0; z-index:2147483646; background:rgba(15,23,42,.45); backdrop-filter:blur(4px); display:flex; align-items:center; justify-content:center; padding:20px; }
.modal-content { position:relative; z-index:2147483647; width:min(1000px,94vw); max-height:86vh; overflow:auto; background:#fff; border:1px solid #e5e7eb; border-radius:24px; box-shadow:0 30px 90px rgba(0,0,0,.35); padding:26px; color:#0f172a; }
.modal-content h2 { padding-right:42px; margin-bottom:16px; font-size:20px; overflow-wrap:anywhere; }
.modal-close { position:absolute; top:10px; right:16px; border:0; background:transparent; color:#94a3b8; font-size:34px; line-height:1; cursor:pointer; font-weight:900; }
.result-banner { font-size:22px; font-weight:900; text-align:center; padding:15px; border-radius:16px; margin:12px 0 18px; }
.result-active { background:#dcfce7; color:#166534; }
.result-medium { background:#fef3c7; color:#92400e; }
.result-down { background:#fee2e2; color:#991b1b; }
.result-pending, .result-failed { background:#e2e8f0; color:#475569; }
.history-list { max-height:62vh; overflow:auto; }
.history-item { border-bottom:1px solid #e2e8f0; padding:10px 0; }
.history-item:last-child { border-bottom:0; }
.history-item pre { white-space:pre-wrap; word-break:break-word; margin:6px 0 0; }
.toast { position:fixed; top:18px; right:18px; z-index:2147483647; max-width:430px; background:#0f172a; color:white; padding:12px 16px; border-radius:16px; box-shadow:0 10px 22px rgba(15,23,42,.16); }
.login-shell { min-height:calc(100vh - 56px); display:flex; align-items:center; justify-content:center; }
.login-card { background:rgba(255,255,255,.92); border:1px solid rgba(148,163,184,.25); border-radius:30px; padding:38px; width:100%; max-width:420px; box-shadow:0 24px 55px rgba(15,23,42,.14); backdrop-filter:blur(14px); }
.login-card h2 { font-size:28px; margin-bottom:7px; letter-spacing:-.03em; }
.login-sub { color:#64748b; margin-bottom:28px; font-size:14px; }
.login-card input { width:100%; margin-bottom:16px; }
.login-button { width:100%; }
.login-error { background:#fee2e2; color:#991b1b; border-radius:14px; padding:12px; margin-bottom:16px; }
.empty-row { text-align:center; color:#64748b; padding:28px !important; }
@media (max-width:768px) {
    body { padding:14px; }
    .card { padding:18px; }
    table { font-size:13px; }
    h1 { font-size:24px; }
    .local-table-right input { width:220px; }
}