.demo-modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px}.demo-modal.active{display:flex}.demo-backdrop{position:absolute;inset:0;background:rgba(3,19,39,.78);backdrop-filter:blur(12px)}.demo-shell{position:relative;z-index:1;width:min(1120px,100%);aspect-ratio:16/9;border-radius:24px;overflow:hidden;background:#081727;box-shadow:0 30px 80px rgba(4,26,45,.45)}.demo-close{position:absolute;top:12px;right:12px;z-index:3;width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font-size:28px;cursor:pointer}.demo-frame{width:100%;height:100%;border:0;background:#081727}.demo-frame.is-loading{opacity:.2}.demo-status{position:absolute;inset:0;z-index:2;display:grid;place-content:center;text-align:center;color:#fff;pointer-events:none}.demo-status strong{font-size:22px}.demo-status span{margin-top:8px;color:rgba(255,255,255,.72)}.demo-status[data-state="ready"]{display:none}.demo-status[data-state="error"] strong{color:#ffd267}@media(max-width:760px){.demo-modal{padding:8px}.demo-shell{aspect-ratio:9/16;border-radius:18px;max-height:92vh}}