.preview-frame-wrap{background:#faf9f5;position:relative}.preview-frame-wrap>iframe{opacity:0;transition:opacity .2s;display:block}.preview-frame-wrap>iframe.is-ready{opacity:1}.preview-frame-status{text-align:center;color:#68735e;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:25px;font:12px/1.6 Arial,Helvetica,sans-serif;display:flex;position:absolute;inset:0}.preview-frame-status p{margin:0}html[data-color-mode=dark] .preview-frame-wrap:has(.preview-frame-status){background:#272b25}html[data-color-mode=dark] .preview-frame-status{color:#d6dacb}@media (prefers-reduced-motion:reduce){.preview-frame-wrap>iframe{transition:none}}.demo-viewer{--toolbar-height:58px;width:100%;height:100vh;background:#faf9f5;max-width:none;height:100dvh;margin:0;position:fixed;inset:0;overflow:hidden}.demo-viewer-toolbar{z-index:3;height:var(--toolbar-height);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#4e5147;background:#faf9f5f5;border-bottom:1px solid #dedbd2;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:0 20px;font:13px/1.4 Arial,sans-serif;transition:transform .32s,opacity .32s;display:grid;position:absolute;inset:0 0 auto}.demo-viewer-toolbar>a{color:inherit;justify-self:start;align-items:center;min-height:42px;text-decoration:none;display:flex}.demo-viewer-toolbar>span{text-align:center;font:22px Georgia,serif}.demo-viewer-toolbar>.demo-choose{text-align:right;justify-self:end}.demo-viewer>.preview-frame-wrap{width:100%;max-width:none;height:100%;box-shadow:none;border:0;border-radius:0;margin:0;position:absolute;inset:0;overflow:hidden}.demo-viewer .preview-frame-wrap>iframe{background:#faf9f5;border:0;width:100%;height:100%}.demo-viewer[data-toolbar-hidden=true]>.demo-viewer-toolbar{opacity:0;pointer-events:none;transform:translateY(-100%)}.demo-viewer[data-toolbar-hidden=true]>.preview-frame-wrap{top:0}@media (max-width:700px){.demo-viewer{--toolbar-height:50px}.demo-viewer-toolbar{gap:8px;padding:0 12px;font-size:12px}.demo-viewer-toolbar>span{font-size:20px}.demo-choose{font-size:11px}}@media (prefers-reduced-motion:reduce){.demo-viewer-toolbar,.demo-viewer>.preview-frame-wrap{transition:none}}
