:root{--color-bg:#f5f9fc;--color-surface:#fff;--color-surface-alt:#edf3f7;--color-text:#0a1319;--color-muted:#4c5459;--color-border:#d1d9df;--color-accent:#007db2;--color-accent-dark:#004f74;--color-good:#00863b;--color-warn:#c48800;--color-bad:#c5372f;--radius-sm:4px;--radius-md:8px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--shadow-panel:0 1px 2px #0000000d;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}@supports (color:lab(0% 0 0)){:root{--color-bg:lab(97.6925% -1.04767 -1.94156);--color-surface:lab(100.004% -.35134 -.648332);--color-surface-alt:lab(95.3765% -1.3926 -2.58628);--color-text:lab(5.28032% -1.98641 -4.97594);--color-muted:lab(35.0648% -2.35519 -4.48332);--color-border:lab(86.104% -2.07326 -3.87075);--color-accent:lab(47.7495% -20.9647 -50.5072);--color-accent-dark:lab(30.1982% -14.7031 -44.6332);--color-good:lab(48.6115% -48.8411 32.8522);--color-warn:lab(61.5769% 20.2861 87.084);--color-bad:lab(46.045% 56.2354 39.5994);--shadow-panel:0 1px 2px lab(0% 0 0/.05)}}*{box-sizing:border-box}body{background:var(--color-bg);min-height:100dvh;color:var(--color-text);margin:0}button,input,textarea{font:inherit}button{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);min-height:40px;color:var(--color-text);justify-content:center;align-items:center;gap:var(--space-2);padding:0 var(--space-4);cursor:pointer;display:inline-flex}button:hover{border-color:#8ea9bb;border-color:lab(67.579% -6.48385 -12.7007)}button:focus-visible,input:focus-visible,textarea:focus-visible{outline-offset:2px;outline:3px solid #55bef073;outline:3px solid lab(72.3778% -20.0846 -34.5297/.45)}button.primary{background:var(--color-accent);border-color:var(--color-accent);color:#fff}input,textarea{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);width:100%;color:var(--color-text);padding:10px 12px}textarea{resize:vertical}label{gap:var(--space-2);color:var(--color-muted);font-size:.9rem;display:grid}.app-shell{grid-template-columns:264px minmax(0,1fr);min-height:100dvh;display:grid}.shell{min-height:100dvh;padding:var(--space-6)}.center-shell{place-items:center;display:grid}.sidebar{border-right:1px solid var(--color-border);padding:var(--space-5);gap:var(--space-6);background:#f9fcfe;background:lab(98.8485% -.700504 -1.29553);flex-direction:column;display:flex}.brand-row{gap:var(--space-3);align-items:center;display:flex}.brand-row h1,.brand-row p,.topbar h2,.topbar p,.section-heading h3{margin:0}.brand-row h1{font-size:1.05rem}.brand-row p,.eyebrow,.muted-text{color:var(--color-muted)}.sidebar nav{gap:var(--space-2);display:grid}.nav-item{justify-content:flex-start;width:100%}.nav-item.active{color:var(--color-accent-dark);background:#d2edfc;background:lab(91.9906% -6.90007 -10.4124);border-color:#82c1e2;border-color:lab(74.6758% -14.54 -23.3254)}.sidebar-footer{align-items:center;gap:var(--space-2);color:var(--color-muted);flex-wrap:wrap;margin-top:auto;font-size:.86rem;display:flex}.dot{background:var(--color-border);border-radius:999px;width:8px;height:8px}.dot.good{background:var(--color-good)}.main{min-width:0;padding:var(--space-6);gap:var(--space-5);align-content:start;display:grid}.topbar{justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}.topbar h2{font-size:1.6rem;line-height:1.15}.toolbar,.section-heading{align-items:center;gap:var(--space-3);display:flex}.panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-panel);padding:var(--space-5);gap:var(--space-4);display:grid}.compact-panel,.login-panel{width:min(100%,420px)}.settings-grid{gap:var(--space-5);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.wide{grid-column:1/-1}.two-col,.metric-grid{gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.metric{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);padding:var(--space-4);gap:var(--space-2);display:grid}.metric span{color:var(--color-muted)}.metric strong{font-size:1.6rem}.metric.good svg{color:var(--color-good)}.metric.warn svg{color:var(--color-warn)}.stack{gap:var(--space-5);display:grid}.status-list{gap:var(--space-3);display:grid}.status-list>div{border-bottom:1px solid var(--color-border);padding-bottom:var(--space-3);justify-content:space-between;align-items:center;display:flex}.badge{border-radius:var(--radius-sm);background:var(--color-surface-alt);min-height:24px;color:var(--color-muted);white-space:nowrap;align-items:center;padding:2px 8px;font-size:.8rem;display:inline-flex}.badge.good{color:#00451a;color:lab(24.7846% -33.7378 22.911);background:#d5f5da;background:lab(93.7045% -14.8141 9.47404)}.badge.warn{color:#5c3b00;color:lab(27.8591% 17.0159 59.6057);background:#ffeccd;background:lab(94.2943% 5.07358 23.217)}.badge.bad{color:#751613;color:lab(25.6421% 40.7161 29.4784);background:#ffe2dd;background:lab(92.6002% 15.0149 9.23889)}.callout{border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);border:1px solid var(--color-border)}.callout.good{background:#e0fae4;background:lab(95.8936% -11.84 7.56052);border-color:#94cf9f;border-color:lab(77.9735% -26.8126 17.2964)}.callout.bad{background:#ffedea;background:lab(95.0098% 11.985 7.36105);border-color:#eba297;border-color:lab(73.6682% 27.3299 17.0478)}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:760px}th,td{border-bottom:1px solid var(--color-border);text-align:left;vertical-align:top;padding:10px 12px;font-size:.88rem}th{color:var(--color-muted);background:var(--color-surface-alt);font-weight:650}td span{text-overflow:ellipsis;white-space:nowrap;max-width:520px;display:inline-block;overflow:hidden}.empty-cell{color:var(--color-muted);text-align:center}.switch-row{color:var(--color-text);grid-template-columns:auto 1fr;align-items:center}.switch-row input{width:18px;height:18px}.spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:880px){.app-shell{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--color-border)}.sidebar nav{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar,.toolbar{flex-direction:column;align-items:stretch}.settings-grid,.two-col,.metric-grid{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.spin{animation:none}}
