.demo-intro{padding-bottom:24px}.demo-intro .lead{max-width:860px}.demo-wrap{padding-top:0}.demo-stage{border:1px solid var(--line);border-radius:16px;overflow:visible;background:#fff}.demo-actions{padding:24px;display:flex;align-items:center;flex-wrap:wrap;gap:12px}.demo-actions>.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line)}.demo-actions p{width:100%;margin:0;color:var(--muted)}.demo-poster{width:100%;height:auto;display:block}.demo-content{scroll-margin-top:72px;position:relative;background:#0b1220}.demo-content iframe{display:block;border:0;width:100%;height:800px;max-height:85vh;min-height:540px;background:#0b1220}.demo-controls{position:sticky;top:72px;z-index:2;display:flex;justify-content:flex-end;gap:10px;padding:12px;background:#111a2e}.demo-controls .btn{background:#18243a;color:#e7ecf5;border-color:#5b6b8f}.demo-content:fullscreen{overflow:auto}.demo-content:fullscreen .demo-controls{top:0}.demo-content:fullscreen iframe{height:calc(100vh - 70px);max-height:none}.demo-content video{display:block;width:100%;height:auto;max-height:80vh;background:#0b1220}.demo-status{padding:0 24px 16px;margin:0;font-size:.9rem;color:var(--muted);min-height:1.5em}.demo-transcript{margin-top:24px}.demo-transcript li{margin:10px 0}.demo-scope{max-width:900px}.demo-entry{display:flex;gap:32px;align-items:center;justify-content:space-between}.demo-entry p{max-width:700px}.demo-entry .btn{flex:none}.demo-stage [hidden]{display:none!important}@media(max-width:640px){.demo-actions{padding:18px}.demo-entry{align-items:flex-start;flex-direction:column;gap:8px}.demo-content iframe{height:740px;max-height:86vh;min-height:520px}.demo-controls{padding:10px}.demo-status{padding:0 18px 16px}}

/* Keep the top-layer window anchored when iframe focus scrolls the underlying page. */
.demo-content:modal{position:fixed;inset:12px;margin:0 auto;box-sizing:border-box;display:flex;flex-direction:column;width:min(1440px,calc(100vw - 24px));height:calc(100vh - 24px);height:calc(100dvh - 24px);min-height:0;max-width:none;max-height:calc(100dvh - 24px);padding:0;border:1px solid #5b6b8f;border-radius:14px;overflow:hidden;color:#e7ecf5}.demo-content::backdrop{background:rgba(3,9,20,.82)}.demo-content:modal .demo-controls{position:static;flex:none}.demo-content:modal iframe{flex:1 1 0;min-height:0;min-width:0;height:0;max-height:none}.demo-content:modal video{flex:1;min-height:0;max-height:none;object-fit:contain}html:has(.demo-content[open]){overflow:hidden}

/* One vertical scroll area for the complete workspace, including Modern view. */
.demo-content iframe{min-height:0;max-height:none}
.demo-content:modal{overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;scroll-padding-top:80px;scroll-padding-bottom:24px}
.demo-content:modal .demo-controls{position:sticky;top:0;z-index:3}
.demo-content:modal iframe{flex:none;height:800px;max-height:none}