:root{color-scheme:light;--page:#f5f5f4;--surface:#fff;--text:#171717;--muted:#737373;--border:#e5e5e5}:root.dark{color-scheme:dark;--page:#0a0a0a;--surface:#171717;--text:#fafafa;--muted:#a3a3a3;--border:#2e2e2e}:root.contrast{color-scheme:dark;--page:#000;--surface:#000;--text:#fff;--muted:#fff;--border:#ff0}*{box-sizing:border-box}html,body{width:100%;min-height:100%;color:var(--text);margin:0;font-family:ui-sans-serif,system-ui,sans-serif}body:not([data-page=embed]){background:var(--page)}body[data-page=embed]{overflow:hidden}body[data-page=embed]>canvas{opacity:0;width:100%;height:100%;position:fixed;inset:0}body[data-page=embed]:not([data-captured])>canvas{touch-action:pan-y!important}body[data-page=embed][data-ready]>canvas{opacity:1;transition:opacity .14s ease-out}@media (prefers-reduced-motion:reduce){body[data-page=embed][data-ready]>canvas{transition:none}}[hidden]{display:none!important}.fallback{place-items:center;padding:24px;display:grid;position:fixed;inset:0}.fallback-card{border:1px solid var(--border);background:var(--surface);border-radius:14px;width:min(420px,100%);padding:20px;box-shadow:0 18px 45px #0000001a}.fallback-card p{color:var(--muted);margin:6px 0 0;line-height:1.5}.fallback-card [data-error]{font-family:ui-monospace,monospace;font-size:12px}.showcase{width:min(1080px,100% - 40px);margin:0 auto;padding:56px 0 80px}.showcase header{justify-content:space-between;align-items:end;gap:24px;margin-bottom:32px;display:flex}.showcase h1{letter-spacing:-.045em;margin:0;font-size:clamp(32px,6vw,64px)}.showcase header p{max-width:620px;color:var(--muted);line-height:1.6}.showcase button{border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:999px;padding:10px 14px}.demo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.demo{border:1px solid var(--border);background:var(--surface);border-radius:18px;overflow:hidden}.demo h2{border-bottom:1px solid var(--border);align-items:center;gap:12px;margin:0;padding:14px 16px;font-size:14px;display:flex}.demo-status{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin-left:auto;font-size:11px;font-weight:400}.demo iframe{background:var(--surface);border:0;width:100%;height:430px;display:block}@media (width<=760px){.demo-grid{grid-template-columns:1fr}.showcase header{flex-direction:column;align-items:start}}
