/* Observed Digits frame: 1440×900 scaled into 80vw, max height viewport−80. */
dialog.demo-dialog{width:100vw;max-width:none;height:100dvh;max-height:none;padding:0;margin:0;border:0;border-radius:0;background:transparent;overflow:visible;box-shadow:none}
dialog.demo-dialog::backdrop{background:#101824b8;backdrop-filter:blur(5px)}
.interactive-demo-frame{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(80vw,calc((100dvh - 80px)*1.6));aspect-ratio:1.6;background:white;border-radius:20px;overflow:hidden;box-shadow:0 25px 100px #0003;animation:demo-frame-in .2s ease-in-out}
.interactive-demo-frame iframe{position:absolute;top:50%;left:50%;width:1440px;height:900px;max-width:none;border:0;transform-origin:center;opacity:0;transition:opacity .3s}
.interactive-demo-frame.is-loaded iframe{opacity:1}
.demo-close{position:absolute;right:24px;top:18px;z-index:5;width:40px;height:40px;padding:8px;border:0;border-radius:50%;color:white;background:#ffffff20;cursor:pointer;transition:background .15s}
.demo-close:hover{background:#ffffff38}.demo-close:focus-visible{outline:3px solid #00edb8;outline-offset:4px}
.demo-loading,.demo-load-failure{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#344e86;font-size:15px}.demo-load-failure{inset:auto 0 12px;font-size:12px}.demo-loading[hidden],.demo-load-failure[hidden]{display:none}.demo-load-failure a{color:#344e86}
@keyframes demo-frame-in{from{opacity:0;scale:.97}to{opacity:1;scale:1}}
@media(max-width:600px){.interactive-demo-frame{width:calc(100vw - 24px);border-radius:14px}.demo-close{right:12px;top:12px}}
@media(prefers-reduced-motion:reduce){.interactive-demo-frame{animation:none}.interactive-demo-frame iframe,.demo-close{transition:none}}
