:root{color-scheme:light;--bg: #f5f7fb;--surface: #ffffff;--surface-soft: #f9fafb;--text: #111827;--muted: #6b7280;--border: #e5e7eb;--shadow: 0 10px 30px rgba(15, 23, 42, .08);--radius-xl: 24px;--radius-lg: 18px;--radius-md: 12px}html[data-theme=dark]{color-scheme:dark;--bg: #0f172a;--surface: #111827;--surface-soft: #1f2937;--text: #f3f4f6;--muted: #9ca3af;--border: #374151;--shadow: 0 10px 30px rgba(0, 0, 0, .35)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;font-family:Inter,Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}body{min-height:100vh}.pageShell{width:100%;padding:8px 20px 20px}.pageContainer{max-width:1200px;margin:0 auto}.brandBar{margin:0}.brandLogo{height:130px;width:auto;display:block}.hero{display:grid;grid-template-columns:1.8fr minmax(280px,360px);gap:20px;margin-bottom:18px}.heroLeft,.overallCard{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow)}.heroLeft{padding:36px}.heroLeft .heroTitle{margin:0 0 16px;font-size:clamp(1.7rem,2.2vw,2.2rem);line-height:1.05;letter-spacing:-.03em}.heroText{margin:0;max-width:40ch;color:var(--muted);font-size:1rem;line-height:1.5}.heroRight{display:flex;flex-direction:column;gap:14px}.overallCard{min-height:100%;padding:24px;display:flex;flex-direction:column;justify-content:center;gap:14px;position:relative;overflow:hidden}.overallLabel{font-size:14px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.updatedText{font-size:14px;color:var(--muted);line-height:1.4}.summaryGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.summaryPill{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px 20px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:4px}.summaryPillValue{font-size:1.6rem;font-weight:800;line-height:1;letter-spacing:-.03em}.summaryPillLabel{font-size:.92rem;color:var(--muted)}.serviceGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}.serviceCard{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow);padding:22px;display:flex;flex-direction:column;gap:16px;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.serviceCard:hover{transform:translateY(-2px);box-shadow:0 14px 40px #0f172a1f}.serviceTopRow{display:flex;align-items:center;gap:16px}.serviceIdentity{flex:1;min-width:0}.serviceIdentity h2{margin:0 0 6px;font-size:1.2rem;line-height:1.2}.serviceUrl{display:block;max-width:100%;font-size:.92rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.serviceStatusWrap{flex-shrink:0}.expandIndicator{font-size:1.4rem;color:var(--muted);margin-left:8px;transition:transform .2s ease;transform:rotate(90deg)}.expandIndicator.open{transform:rotate(270deg)}.serviceMeta{display:flex;flex-wrap:wrap;gap:10px}.serviceMetaItem{background:var(--surface-soft);border:1px solid var(--border);border-radius:999px;padding:8px 12px;display:inline-flex;align-items:center;gap:8px}.serviceCard.status-unhealthy{border-left:6px solid #dc2626}.serviceCard.status-warning,.serviceCard.status-degraded{border-left:6px solid #f59e0b}.serviceCard.status-healthy{border-left:6px solid #16a34a}.metaLabel{font-size:.82rem;color:var(--muted)}.metaValue{font-size:.88rem;font-weight:700}.checkList{display:flex;flex-direction:column;gap:10px;animation:fadeIn .2s ease}.checkRow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;min-height:60px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-soft)}.checkName{font-size:.92rem;font-weight:700;letter-spacing:.04em}.checkRight{display:flex;align-items:center;gap:10px}.checkDuration{font-size:.82rem;color:var(--muted);white-space:nowrap}.serviceError{display:flex;align-items:center;min-height:60px;padding:12px 14px;border-radius:var(--radius-md);background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;font-size:.92rem}.statusBadge{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:8px 14px;border-radius:999px;font-size:.85rem;font-weight:700;letter-spacing:.02em}.statusBadge.healthy{background:#dcfce7;color:#166534}.statusBadge.warning{background:#fef3c7;color:#92400e}.statusBadge.unhealthy{background:#fee2e2;color:#991b1b}.statusBadge.unknown{background:#e5e7eb;color:#374151}.overallCardProgressBar{position:absolute;bottom:0;left:0;height:3px;width:100%;transform-origin:left center;animation:overallProgress 60s linear forwards;opacity:.9}.overallCard.status-healthy .overallCardProgressBar{background:linear-gradient(90deg,#16a34a,#4ade80)}.overallCard.status-warning .overallCardProgressBar{background:linear-gradient(90deg,#f59e0b,#fcd34d)}.overallCard.status-unhealthy .overallCardProgressBar{background:linear-gradient(90deg,#dc2626,#f87171)}.overallCard.status-unknown .overallCardProgressBar{background:linear-gradient(90deg,#9ca3af,#d1d5db)}@keyframes overallProgress{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media(max-width:980px){.hero{grid-template-columns:1fr}.summaryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.serviceGrid{grid-template-columns:1fr}}@media(max-width:640px){.pageShell{padding:8px 12px 12px}.brandLogo{height:88px}.heroLeft,.overallCard,.serviceCard,.summaryPill{border-radius:18px}.heroLeft,.overallCard,.serviceCard{padding:18px}.summaryGrid{grid-template-columns:1fr 1fr;gap:10px}.serviceTopRow,.checkRow{flex-direction:column;align-items:flex-start}.checkRight{width:100%;justify-content:space-between}.checkDuration{order:2}}.themeToggleFloating{position:fixed;bottom:22px;right:22px;width:44px;height:44px;border-radius:50%;border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:1.2rem;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow);transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.themeToggleFloating:hover{transform:translateY(-2px);box-shadow:0 18px 40px #0f172a40;background:var(--surface-soft)}:root{color-scheme:light}
