:root{--bg: #f4f5f7;--card-bg: #ffffff;--text: #1f2328;--text-muted: #6b7280;--border: #e2e4e8;--healthy: #16a34a;--healthy-bg: #ecfdf3;--failed: #dc2626;--failed-bg: #fef2f2;--unknown: #6b7280;--unknown-bg: #f3f4f6;--warning: #d97706;--warning-bg: #fef3c7;--accent: #2563eb;--radius: 10px;--shadow: 0 1px 3px rgba(0, 0, 0, .08);--card-radius: 14px;--card-shadow: 0 1px 2px rgba(15, 23, 42, .04);--card-pad-y: 18px;--card-pad-x: 20px;--card-pad-left: 24px;--card-row-gap: 14px;--card-col-gap: 16px;--hairline: #e3e6eb;--strip-bg: #fafbfc;--label-ink: #6b7280;--ink-2: #334155;--rail-width: 4px}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}.app{max-width:820px;margin:0 auto;padding:24px 20px 48px}.header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px}.header h1{margin:0;font-size:22px;letter-spacing:-.01em}.generated-at{margin:4px 0 0;color:var(--text-muted);font-size:14px;cursor:default}.header-actions{display:flex;align-items:center;gap:10px}.refreshing{font-size:13px;color:var(--text-muted)}.refresh-button{font:inherit;font-size:14px;padding:7px 14px;border:1px solid var(--border);background:var(--card-bg);color:var(--text);border-radius:8px;cursor:pointer}.refresh-button:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.refresh-button:disabled{opacity:.6;cursor:default}.critical-banner{background:var(--failed);color:#fff;font-weight:600;padding:12px 16px;border-radius:var(--radius);margin-bottom:16px}.check-list{display:flex;flex-direction:column;gap:12px}.check-card{position:relative;background:var(--card-bg);border:1px solid var(--hairline);border-radius:var(--card-radius);padding:var(--card-pad-y) var(--card-pad-x) var(--card-pad-y) var(--card-pad-left);box-shadow:var(--card-shadow);overflow:hidden;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto auto auto;column-gap:var(--card-col-gap);row-gap:var(--card-row-gap)}.check-card:before{content:"";position:absolute;inset:0 auto 0 0;width:var(--rail-width);background:var(--unknown)}.check-card.status-healthy:before{background:var(--healthy)}.check-card.status-failed:before{background:var(--failed)}.check-card.status-unknown:before{background:var(--unknown)}.check-card.critical-failed{border-color:var(--failed);background:var(--failed-bg)}.check-card.critical-failed:before{width:6px}.check-status-col{grid-column:2;grid-row:1 / -1;align-self:stretch;padding-left:16px;border-left:1px solid var(--hairline);display:flex;align-items:center}.check-head{grid-column:1;display:flex;flex-direction:column;gap:6px}.check-title-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.check-name{margin:0;font-size:16px;font-weight:700;letter-spacing:-.01em;color:var(--text)}.check-description{margin:0;font-size:14px;line-height:1.5;color:var(--ink-2);max-width:64ch;text-wrap:pretty}.badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;padding:0 9px;height:22px;border-radius:6px;background:var(--unknown-bg);color:var(--text-muted);border:1px solid transparent;white-space:nowrap}.badge.severity-critical{background:var(--failed-bg);color:var(--failed);border-color:#fecdd3}.badge.severity-critical:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--failed)}.badge.outcome-ok{background:var(--healthy-bg);color:var(--healthy);border-color:#a7f3d0}.badge.outcome-down{background:var(--failed-bg);color:var(--failed);border-color:#fecdd3}.badge.outcome-degraded{background:var(--warning-bg);color:var(--warning);border-color:#fde68a}.check-times{grid-column:1;display:grid;grid-template-columns:repeat(3,minmax(0,max-content));column-gap:48px;row-gap:4px;padding:10px 0;margin-left:calc(var(--card-pad-left) * -1);margin-right:calc(var(--card-col-gap) * -1);padding-left:var(--card-pad-left);padding-right:var(--card-col-gap);background:var(--strip-bg);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}.time-field{display:flex;flex-direction:column;gap:2px;min-width:0}.time-label{font-size:10.5px;font-weight:600;letter-spacing:.08em;color:var(--label-ink);text-transform:uppercase}.time-value{font-size:14px;font-weight:500;color:var(--text);font-variant-numeric:tabular-nums;cursor:default}.check-detail{grid-column:1;display:flex;flex-direction:column;gap:4px;padding-top:2px}.check-detail-text{margin:0;font-size:14px;line-height:1.45;color:var(--ink-2);word-break:break-word}.check-extra-wrap{grid-column:1;display:flex;flex-direction:column;gap:6px;padding-top:4px;border-top:1px dashed var(--hairline)}.check-extra{margin:0;display:flex;flex-wrap:wrap;gap:16px}.extra-field dt{font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--label-ink)}.extra-field dd{margin:2px 0 0;font-size:14px;color:var(--ink-2);word-break:break-word}.status-pill{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 14px 0 11px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap;border:1px solid transparent}.status-pill.status-healthy{background:var(--healthy-bg);color:var(--healthy);border-color:#a7f3d0}.status-pill.status-failed{background:var(--failed-bg);color:var(--failed);border-color:#fecdd3}.status-pill.status-unknown{background:var(--unknown-bg);color:var(--unknown);border-color:var(--border)}.status-dot{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px #16a34a2e}.status-pill.status-failed .status-dot{box-shadow:0 0 0 3px #dc26262e}.status-pill.status-unknown .status-dot{box-shadow:0 0 0 3px #6b72802e}@media(max-width:640px){.check-card{grid-template-columns:1fr}.check-status-col{grid-column:1;grid-row:1;justify-self:start;padding-left:0;margin-bottom:4px;border-left:none}.check-head{grid-column:1}.check-times{margin-right:calc(var(--card-pad-x) * -1);padding-right:var(--card-pad-x);column-gap:28px}}.error-banner{background:var(--failed-bg);border:1px solid var(--failed);border-radius:var(--radius);padding:20px}.error-banner h2{margin:0 0 6px;color:var(--failed);font-size:18px}.error-banner p{margin:0 0 10px;color:var(--text)}.error-detail{margin:0;background:#fff;border:1px solid var(--border);border-radius:8px;padding:10px;font-size:13px;white-space:pre-wrap;word-break:break-word;color:var(--text-muted)}.loading,.empty{color:var(--text-muted);text-align:center;padding:32px 0}.footer{margin-top:32px;text-align:center;font-size:12px;color:var(--text-muted)}
