:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f5f6f8;--surface:#fff;--surface-2:#f0f3f5;--surface-3:#e8eef2;--ink:#17202a;--muted:#64717d;--line:#d9e0e6;--line-strong:#bdc8d1;--primary:#0e756f;--primary-strong:#095e59;--primary-soft:#e0f3f1;--info:#2454a6;--info-soft:#e7efff;--warning:#a5610c;--warning-soft:#fff2d8;--danger:#aa2a1f;--danger-soft:#ffe8e4;--success:#197245;--success-soft:#e2f4e9;--shadow:0 18px 48px #17202a14;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{min-height:100%}body{background:var(--bg);color:var(--ink);letter-spacing:0;margin:0;font-size:15px}body.modal-open{overflow:hidden}button,input,select,textarea{font:inherit}button{cursor:pointer}[hidden]{display:none!important}.auth-shell{background:linear-gradient(180deg, #ffffffb8, #f5f6f8eb), var(--bg);place-items:center;min-height:100vh;padding:28px;display:grid}.auth-panel{border:1px solid var(--line);background:var(--surface);width:min(100%,440px);box-shadow:var(--shadow);border-radius:8px;padding:24px}.auth-brand{margin-bottom:24px}.auth-form{gap:14px;margin-top:22px;display:grid}.auth-submit{width:100%;margin-top:4px}.user-chip{border:1px solid var(--line);background:var(--surface);max-width:240px;min-height:38px;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;border-radius:8px;align-items:center;padding:8px 11px;font-size:13px;font-weight:800;display:flex;overflow:hidden}.app-shell{grid-template-columns:248px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{color:#f6f8fa;background:#17202a;flex-direction:column;gap:28px;min-height:100vh;padding:20px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-mark{color:#183b66;background:#e3f2ff;border-radius:8px;place-items:center;width:42px;height:42px;font-weight:800;display:grid}.brand strong,.brand span{display:block}.brand span{color:#b7c2cc;margin-top:3px;font-size:13px}.nav-list{gap:8px;display:grid}.nav-item{color:#d9e2ea;text-align:left;background:0 0;border:1px solid #0000;border-radius:8px;padding:11px 12px}.nav-item:hover,.nav-item.is-active{color:#fff;background:#ffffff14;border-color:#ffffff24}.sidebar-footer{color:#c5d0da;align-items:center;gap:9px;margin-top:auto;font-size:13px;display:flex}.status-dot{background:#48d597;border-radius:999px;width:9px;height:9px;box-shadow:0 0 0 5px #48d59724}.workspace{min-width:0;padding:28px}.topbar{justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:22px;display:flex}.topbar p{margin-bottom:0}.topbar-actions,.toolbar,.form-actions,.detail-actions,.modal-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.eyebrow{color:var(--primary);letter-spacing:0;text-transform:uppercase;margin:0 0 5px;font-size:12px;font-weight:800}h1,h2,h3,p{margin-top:0}h1{margin-bottom:6px;font-size:30px;line-height:1.15}h2{margin-bottom:4px;font-size:17px;line-height:1.25}h3{margin-bottom:12px;font-size:14px;line-height:1.25}.button{border:1px solid var(--line-strong);background:var(--surface);min-height:38px;color:var(--ink);border-radius:8px;padding:9px 13px;font-weight:700}.button:hover{border-color:#8fa0ad}.button.primary{background:var(--primary);border-color:var(--primary);color:#fff}.button.primary:hover{background:var(--primary-strong)}.button.ghost{background:0 0}.button.danger{color:var(--danger);background:var(--danger-soft);border-color:#f0b8b2}.button.small{min-height:32px;padding:6px 9px;font-size:13px}.link-button{color:var(--info);background:0 0;border:0;margin:0 0 10px;padding:0;font-weight:800}.icon-button{border:1px solid var(--line);width:34px;height:34px;color:var(--ink);background:#fff;border-radius:8px;font-weight:800}.view{display:none}.view.is-active{display:block}.metrics-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px;display:grid}.metric{border:1px solid var(--line);background:var(--surface);border-radius:8px;min-height:92px;padding:16px}.metric span{color:var(--muted);font-size:13px}.metric strong{margin-top:8px;font-size:28px;line-height:1;display:block}.overview-grid{grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);align-items:start;gap:16px;display:grid}.hero-panel{background:linear-gradient(135deg,#fff 0%,#eef7f6 100%);justify-content:space-between;align-items:flex-start;gap:18px;min-height:188px;padding:22px;display:flex}.hero-panel h2{margin-bottom:8px;font-size:24px}.panel{border:1px solid var(--line);background:var(--surface);min-width:0;box-shadow:var(--shadow);border-radius:8px}.panel-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:14px;min-height:76px;padding:16px;display:flex}.panel-header.compact{min-height:auto}.panel-header p,.hero-panel p{color:var(--muted);margin-bottom:0;font-size:13px}.toolbar{justify-content:flex-end}.search-field{color:var(--muted);gap:5px;font-size:12px;font-weight:700;display:grid}.search-field input{width:280px}input,select,textarea{border:1px solid var(--line-strong);width:100%;color:var(--ink);background:#fff;border-radius:8px;outline:none;padding:10px 11px}select{min-height:40px}textarea{resize:vertical}input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #0e756f24}.table-wrap{width:100%;max-width:100%;overflow:auto}table{border-collapse:collapse;table-layout:fixed;width:100%}th,td{border-bottom:1px solid var(--line);vertical-align:middle;text-align:left;padding:13px 14px}th{color:var(--muted);text-transform:uppercase;font-size:12px;font-weight:800}td{color:#2d3740}th:first-child,td:first-child{width:26%}th:nth-child(2),td:nth-child(2),th:nth-child(3),td:nth-child(3),th:nth-child(5),td:nth-child(5),th:nth-child(6),td:nth-child(6){width:11%}th:nth-child(4),td:nth-child(4){width:18%}th:nth-child(7),td:nth-child(7){width:22%}.monitor-name{gap:3px;display:grid}.monitor-name strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.monitor-name span,.muted{color:var(--muted);font-size:12px}.right{text-align:right}.row-actions{flex-wrap:wrap;justify-content:flex-end;gap:7px;display:flex}.badge{white-space:nowrap;border-radius:999px;align-items:center;min-height:26px;padding:4px 9px;font-size:12px;font-weight:800;display:inline-flex}.badge.ok{background:var(--success-soft);color:var(--success)}.badge.warn{background:var(--warning-soft);color:var(--warning)}.badge.error{background:var(--danger-soft);color:var(--danger)}.badge.neutral{background:var(--surface-2);color:#4b5964}.card-list,.alert-list-large,.history-list{gap:10px;padding:16px;display:grid}.summary-card,.alert-item,.history-item,.empty-card{border:1px solid var(--line);background:#fbfcfd;border-radius:8px;padding:13px}.summary-card,.alert-item,.history-item{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.summary-card strong,.alert-item strong,.history-item strong,.empty-card strong{margin-bottom:4px;display:block}.summary-card p,.alert-item p,.history-item p,.empty-card p{color:var(--muted);margin:0;font-size:13px;line-height:1.4}.summary-card-meta{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.empty-state{min-height:220px;color:var(--muted);align-content:center;place-items:center;gap:8px;display:grid}.empty-state strong{color:var(--ink)}.detail-shell{gap:16px;display:grid}.detail-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:16px;display:grid}.detail-block{border:1px solid var(--line);background:#fbfcfd;border-radius:8px;min-height:78px;padding:14px}.detail-block span{color:var(--muted);font-size:12px;font-weight:800;display:block}.detail-block strong{margin-top:8px;font-size:18px;display:block}.diff-layout{grid-template-columns:1fr 1fr;gap:12px;padding:16px;display:grid}.diff-box{border:1px solid var(--line);background:#fbfcfd;border-radius:8px;min-height:150px;overflow:hidden}.diff-title{border-bottom:1px solid var(--line);color:var(--muted);text-transform:uppercase;padding:10px 12px;font-size:12px;font-weight:800}.diff-box ul{min-height:112px;max-height:260px;margin:0;padding:10px 12px 10px 28px;overflow:auto}.diff-box li{margin-bottom:7px;line-height:1.45}.modal{z-index:40;place-items:center;padding:22px;display:grid;position:fixed;inset:0}.modal-backdrop{background:#17202a7a;position:absolute;inset:0}.modal-dialog{border:1px solid var(--line);background:var(--surface);border-radius:8px;width:min(880px,100%);max-height:min(820px,100vh - 44px);position:relative;overflow:auto;box-shadow:0 24px 72px #17202a38}.modal-dialog.run-dialog{width:min(980px,100%)}.modal-header{z-index:1;border-bottom:1px solid var(--line);background:#fffffff5;justify-content:space-between;align-items:center;gap:14px;padding:18px;display:flex;position:sticky;top:0}.modal-header h2{margin-bottom:0;font-size:22px}.modal form{padding:18px}.form-section{border:1px solid var(--line);background:#fbfcfd;border-radius:8px;margin-bottom:14px;padding:16px}.form-help{color:var(--muted);margin:-4px 0 14px;font-size:13px;line-height:1.4}.form-help.is-warning{color:var(--warning)}.form-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.form-grid.compact{grid-template-columns:220px 180px}.field{color:var(--muted);gap:7px;margin-bottom:13px;font-size:13px;font-weight:700;display:grid}.form-grid .field{margin-bottom:0}.segmented-field{border:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:14px 0 0;padding:0;display:grid}.segmented-field legend{color:var(--muted);grid-column:1/-1;margin-bottom:7px;font-size:13px;font-weight:700}.segmented-field label{position:relative}.segmented-field input{opacity:0;position:absolute;inset:0}.segmented-field span{border:1px solid var(--line-strong);min-height:36px;color:var(--muted);background:#fff;border-radius:8px;place-items:center;font-weight:800;display:grid}.segmented-field input:checked+span{border-color:var(--primary);background:var(--primary-soft);color:var(--primary-strong)}.toggle-row{min-height:42px;color:var(--ink);align-items:center;gap:10px;margin:14px 0 0;font-weight:700;display:flex}.toggle-row input{width:18px;height:18px}.modal-actions{border-top:1px solid var(--line);background:#fffffff5;justify-content:flex-end;padding-top:14px;position:sticky;bottom:0}.run-detail-body{padding:18px}.run-detail-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px;display:grid}.run-detail-field{border:1px solid var(--line);background:#fbfcfd;border-radius:8px;min-width:0;padding:12px}.run-detail-field span{color:var(--muted);text-transform:uppercase;margin-bottom:6px;font-size:12px;font-weight:800;display:block}.run-detail-field strong{overflow-wrap:anywhere;font-size:13px;line-height:1.4;display:block}.run-detail-section{border:1px solid var(--line);background:#fbfcfd;border-radius:8px;margin-top:14px;padding:14px}.run-detail-section h3{margin-bottom:8px}.run-detail-section p{color:var(--muted);margin-bottom:0;line-height:1.45}.run-detail-section ul{margin:0;padding-left:20px}.run-detail-section li{margin-bottom:6px;line-height:1.45}.run-detail-section pre{white-space:pre-wrap;overflow-wrap:anywhere;color:#24313d;max-height:260px;margin:0;font-size:13px;line-height:1.5;overflow:auto}.error-text{color:var(--danger)!important;margin-top:8px!important}.toast{color:#fff;max-width:min(420px,100vw - 40px);box-shadow:var(--shadow);opacity:0;pointer-events:none;z-index:50;background:#17202a;border-radius:8px;padding:12px 14px;transition:all .18s;position:fixed;bottom:20px;right:20px;transform:translateY(20px)}.toast.is-visible{opacity:1;transform:translateY(0)}@media (max-width:1180px){.overview-grid{grid-template-columns:1fr}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:920px){.app-shell{grid-template-columns:1fr}.sidebar{flex-flow:wrap;align-items:center;gap:16px;max-width:100vw;min-height:auto;overflow-x:auto}.nav-list{width:100%;min-width:0;display:flex;overflow-x:auto}.sidebar-footer{display:none}.workspace{padding:18px}.topbar,.panel-header,.hero-panel{flex-direction:column;align-items:flex-start}.toolbar{justify-content:flex-start;width:100%}.search-field,.search-field input,.toolbar select{width:100%}.metrics-grid,.detail-grid,.diff-layout,.run-detail-grid,.form-grid,.form-grid.compact{grid-template-columns:1fr}table{min-width:980px}}@media (max-width:640px){h1{font-size:24px}.workspace{padding:14px}.topbar-actions,.modal-actions{width:100%}.button{flex:1}.summary-card,.alert-item,.history-item{display:grid}.summary-card-meta{justify-content:flex-start}.modal{padding:10px}.modal-dialog{max-height:calc(100vh - 20px)}th,td{padding:11px 10px}}
