.demo-root{background:var(--ru-canvas);min-height:100vh;color:var(--ru-text)}.demo-topbar{border-bottom:1px solid var(--ru-border);background:var(--ru-surface);justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;display:flex}.demo-topbar-right{align-items:center;gap:12px;display:flex}.demo-example-badge{color:var(--ru-degraded);border-color:color-mix(in srgb, var(--ru-degraded) 45%, var(--ru-border))}@media (max-width:480px){.demo-topbar{flex-wrap:wrap;row-gap:10px}.demo-topbar-right{flex-wrap:wrap;row-gap:8px}.demo-example-badge{white-space:normal;text-align:left}}.demo-main{max-width:var(--ru-content,1080px);margin:0 auto;padding:32px 24px 64px}.demo-title{font-family:var(--ru-font-display);letter-spacing:var(--ru-tracking-heading);margin:8px 0 10px;font-size:28px;line-height:1.15}.demo-lede{color:var(--ru-text-muted);max-width:68ch;line-height:1.6}.demo-section{margin-top:40px}.demo-section-first{margin-top:24px}.demo-section-head{align-items:center;gap:10px;margin-bottom:14px;display:flex}.demo-section-head h2{font-family:var(--ru-font-display);letter-spacing:var(--ru-tracking-heading);font-size:18px}.demo-card{border:1px solid var(--ru-border);background:var(--ru-surface);border-radius:var(--ru-radius-md,9px);padding:16px}.demo-mono{font-family:var(--ru-font-mono)}.demo-issues-card{overflow-x:auto}.demo-issues-table{border-collapse:collapse;width:100%;min-width:560px;font-size:13px}.demo-issues-table th{text-align:left;text-transform:uppercase;letter-spacing:.04em;color:var(--ru-text-muted);border-bottom:1px solid var(--ru-border);padding:0 8px 8px 0;font-size:11px}.demo-issues-table td{border-bottom:1px solid var(--ru-border);vertical-align:top;padding:10px 8px 10px 0}.demo-close-cta{border:1px solid var(--ru-border);border-radius:var(--ru-radius-md,9px);background:var(--ru-surface);justify-content:center;align-items:center;margin-top:48px;padding:24px;display:flex}.demo-section-head{flex-wrap:wrap}.demo-domain{color:var(--ru-text-muted);margin-left:auto;font-size:12px}.demo-status-frame,.demo-incident-frame{border:1px solid var(--ru-border);border-radius:var(--ru-radius-md,9px);background:var(--ru-surface);overflow:hidden}.demo-incident-frame{padding:16px}.demo-monitor-card{padding:4px 16px}@media (max-width:480px){.demo-main{padding:20px 16px 48px}.demo-title{font-size:24px}.demo-incident-frame{padding:10px}.demo-monitor-card{padding:4px 12px}}
