.studio-preview-frame{position:static;border:0;margin:0;padding:0;width:100%;max-width:none;max-height:none;min-height:600px;background:var(--studio-panel);color:var(--studio-text);display:flex;flex-direction:column;min-width:0}.studio-preview-frame-toolbar{display:flex;align-items:center;gap:10px;padding:16px;border-bottom:1px solid var(--studio-rule);flex-wrap:wrap}.studio-preview-frame .studio-preview-frame-toolbar .ui-segmented{width:auto}.studio-preview-frame-toolbar>.ui-button:last-child{margin-left:auto}.studio-preview-instruction{margin:0;padding:12px 18px;color:var(--studio-muted);font-size:12px;line-height:1.6}.studio-preview-viewport{position:relative;min-height:720px;display:flex;justify-content:center;overflow:auto;padding:12px;background:#101112;flex:1 1}.studio-preview-viewport iframe{display:block;width:100%;height:720px;min-height:600px;border:1px solid var(--studio-rule);background:#171819;border-radius:6px}.studio-preview-viewport[data-device=mobile] iframe{width:min(390px,100%);flex-shrink:0}.studio-preview-frame-loading{position:absolute;inset:12px;display:flex;align-items:center;justify-content:center;gap:12px;background:#171819;z-index:2;font-size:13px}.studio-preview-frame[data-fullscreen=true]{position:fixed;inset:16px;width:calc(100vw - 32px);height:calc(100dvh - 32px);min-height:0;box-sizing:border-box;border:1px solid var(--studio-rule);border-radius:10px;overflow:hidden;font-family:var(--font-body)}.studio-preview-frame[data-fullscreen=true] .studio-preview-viewport{min-height:0;height:0;padding:0;overflow:hidden}.studio-preview-frame[data-fullscreen=true] .studio-preview-frame-toolbar{flex-shrink:0;padding:8px 12px}.studio-preview-frame[data-fullscreen=true] .studio-preview-instruction{display:none}.studio-preview-frame[data-fullscreen=true] .studio-preview-anatomy{max-height:25%;overflow:auto;flex-shrink:0}.studio-preview-frame[data-fullscreen=true] iframe{height:100%;min-height:0;border:0;border-radius:0;box-sizing:border-box}.studio-preview-anatomy{list-style:none;padding:22px;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:22px;border-top:1px solid var(--studio-rule)}.studio-preview-anatomy li{display:flex;gap:10px;align-items:flex-start;font-size:12px}.studio-preview-anatomy b{color:#191b14;background:var(--studio-accent);border-radius:50%;display:grid;place-items:center;width:22px;height:22px;flex-shrink:0;font-size:11px}.studio-preview-anatomy strong{font-weight:500}.studio-preview-anatomy p{margin:6px 0 0;color:var(--studio-muted);line-height:1.6;font-size:11px}[data-anatomy=true] :is(.studio-topbar,.studio-stage,.studio-inspector,.studio-statusbar){outline:1px dashed var(--studio-accent);outline-offset:-3px}[data-anatomy=true] :is(.tool-rail,.studio-topbar,.studio-stage,.studio-statusbar){position:relative}[data-anatomy=true] :is(.tool-rail,.studio-topbar,.studio-stage,.studio-inspector,.studio-statusbar):after{position:absolute;top:8px;right:8px;z-index:90;width:23px;height:23px;display:grid;place-items:center;background:var(--studio-accent,#d9f18b);color:#171819;border-radius:50%;font:12px var(--font-mono);box-shadow:0 1px 8px #0008;pointer-events:none}[data-anatomy=true] .tool-rail:after{content:"1";top:4px;right:1px}[data-anatomy=true] .studio-topbar:after{content:"2"}[data-anatomy=true] .studio-stage:after{content:"3";left:8px;right:auto}[data-anatomy=true] .studio-inspector:after{content:"4";top:48px}[data-anatomy=true] .studio-statusbar:after{content:"5";right:50%;top:4px}@media (max-width:600px){.studio-preview-frame[data-fullscreen=true]{inset:8px;width:calc(100vw - 16px);height:calc(100dvh - 16px)}.studio-preview-frame-toolbar{padding:12px;gap:6px}.studio-preview-frame-toolbar .ui-button{font-size:11px}.studio-preview-viewport{padding:0}}.studio-preview-frame::backdrop{background:#000b;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}