.preview-launch{overflow-anchor:none;width:100%;height:100%;position:relative}.preview-dialog{width:100%;max-width:none;max-height:none;color:var(--ink);background:0 0;border:0;margin:0;padding:0;transition-property:none;display:block;position:relative;inset:auto;overflow:visible}.preview-launch--mobile .preview-dialog,.preview-launch--mobile .preview-surface,.preview-launch--mobile .preview-live-content{height:100%}.preview-dialog[open]{z-index:100;place-items:center;width:100vw;height:100dvh;padding:clamp(12px,3vw,40px);display:grid;position:fixed;inset:0;overflow:hidden}.preview-dialog::backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:preview-fade .35s var(--e-soft) both;background:#12121180}.preview-dialog[data-closing]::backdrop{animation:preview-fade .24s var(--e-soft) reverse both}@keyframes preview-fade{0%{opacity:0}}.preview-backdrop{cursor:zoom-out;width:100%;height:100%;position:absolute;inset:0}.preview-dialog[open] .preview-surface{background:var(--paper);width:min(1320px,100%);max-height:100%;box-shadow:0 0 0 1px var(--rule-2), 0 40px 120px -30px #0000008c;border-radius:18px;flex-direction:column;display:flex;position:relative;overflow:hidden}.preview-chrome{border-bottom:1px solid var(--rule);justify-content:space-between;align-items:center;gap:16px;padding:10px 10px 10px 20px;display:flex}.preview-chrome>div{align-items:center;gap:12px;min-width:0;display:flex}.preview-chrome strong{letter-spacing:-.01em;white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:500;overflow:hidden}.preview-chrome small{font-family:var(--mono);letter-spacing:.12em;color:var(--ink-3);white-space:nowrap;font-size:10.5px}.preview-chrome button{background:var(--paper-2);border-radius:999px;align-items:center;gap:8px;min-height:40px;padding:0 14px;font-size:14px;font-weight:500;transition:background-color .2s;display:flex}.preview-chrome button:hover{background:var(--paper-3)}.preview-chrome button svg{width:16px;height:16px}.preview-live-dot{background:var(--orange);border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 4px #ff680029}.preview-dialog[open] .preview-live-content{overscroll-behavior:contain;min-height:0;overflow:auto}.preview-dialog[open] .demo-app{height:min(68cqw,100dvh - 140px)}.preview-dialog--mobile[open] .preview-surface{width:min(400px,100%);height:min(860px,100%)}.preview-dialog--mobile[open] .preview-live-content{flex:1}.preview-dialog--mobile[open] .mp-device{height:100%}.preview-dialog:not([open]) .preview-chrome,.preview-dialog:not([open]) .preview-backdrop{display:none}.preview-entry-target{z-index:4;cursor:zoom-in;touch-action:pan-y;background:0 0;border:0;width:100%;height:100%;padding:0;position:absolute;inset:0}.preview-entry-target:focus-visible{outline:2px solid var(--accent);outline-offset:-3px;border-radius:inherit}.preview-launch-button{background:var(--ink);color:var(--paper);letter-spacing:-.005em;pointer-events:none;transition:transform .5s var(--e-out), opacity .3s var(--e-soft), background-color .3s var(--e-soft);border-radius:999px;align-items:center;gap:10px;padding:6px 6px 6px 14px;font-size:13px;font-weight:500;display:inline-flex;position:absolute;bottom:14px;right:14px;box-shadow:0 10px 30px -10px #00000073}.preview-launch-button i{background:var(--orange);width:26px;height:26px;color:var(--on-orange);border-radius:50%;place-items:center;display:grid}.preview-launch-button i svg{width:14px;height:14px}@media (hover:hover) and (pointer:fine){.preview-launch-button{opacity:0;transform:translateY(6px)}.preview-entry-target:hover .preview-launch-button,.preview-entry-target:focus-visible .preview-launch-button{opacity:1;transform:none}}.preview-launch--mobile .preview-launch-button{padding:5px;bottom:12px;right:50%;transform:translate(50%)}.preview-launch--mobile .preview-launch-label{display:none}@media (hover:hover) and (pointer:fine){.preview-launch--mobile .preview-launch-button{transform:translate(50%,6px)}.preview-launch--mobile .preview-entry-target:hover .preview-launch-button,.preview-launch--mobile .preview-entry-target:focus-visible .preview-launch-button{transform:translate(50%)}}.preview-dialog[open]~.preview-entry-target .preview-launch-button{opacity:0;transition:none}@media (max-width:600px){.preview-launch-prompt{display:none}.preview-dialog[open]{padding:0}.preview-dialog[open] .preview-surface{border-radius:0;width:100%;height:100%}.preview-dialog[open] .demo-app{height:auto}}
