/* NOVA Studio v11 — adaptive preview, accessible mobile toolbar, immersive mode. */
.canvas{min-width:0;min-height:0}
.canvas-label{z-index:5;pointer-events:auto}
.canvas-label .canvas-indicator{pointer-events:none}
.canvas-label small{white-space:nowrap}
.studio-preview-expand{display:inline-flex;align-items:center;justify-content:center;gap:7px;margin-inline-start:12px;min-height:35px;padding:6px 11px;border:1px solid #516d89;border-radius:10px;background:#1b314a;color:#e9f6ff;font:700 11px/1.2 'Plus Jakarta Sans','Cairo',sans-serif;letter-spacing:0;cursor:pointer;transition:background .2s,border-color .2s}
.studio-preview-expand:hover{background:#294664;border-color:#8ce5ee}
.studio-preview-expand:focus-visible{outline:2px solid #85e2ed;outline-offset:2px}
.studio-preview-expand svg{width:16px;height:16px}
.frame-wrap.mobile{--studio-scale:.7}
.frame-wrap.mobile iframe{touch-action:auto}
@media(max-width:900px){
 .app .canvas{height:clamp(540px,78dvh,800px);padding:46px 12px 57px}
 .canvas-label{top:9px;inset-inline:12px;left:12px;right:12px;letter-spacing:.045em}
 .canvas-label small{display:none}
 .studio-preview-expand{min-height:34px;margin-inline-start:auto;padding:6px 10px}
 .tools .seg{display:flex}
 .bar{gap:6px;padding-inline:8px;min-height:62px}
 .bar .brand{gap:0}
 .tools{gap:3px;min-width:0}
 .tools .tb{min-width:34px;height:36px;padding-inline:7px}
 .tools .seg{gap:1px;padding:2px;border-radius:11px}
 .tools .seg button{height:32px;min-width:32px;padding:0 6px}
 .bar .publish{height:38px;min-width:40px;padding:0 10px}
 .rail button{min-width:74px;min-height:66px;font-size:11px}
 .panel :is(input.inp,textarea,select){font-size:16px;min-height:44px}
 .panel :is(.btn,.chip,.opt){min-height:42px}
 .panel .icbtn,.panel .soc button{min-height:44px}
 .panel{padding-bottom:max(40px,env(safe-area-inset-bottom))}
 .canvas-edit-jump{min-height:40px}
 .sheet{max-height:calc(100dvh - 28px);overscroll-behavior:contain}
}
@media(max-width:450px){
 .bar .tb.wide{display:none}
 .canvas-label{font-size:9px}
}
@media(max-width:350px){
 .tools .tb{min-width:31px;padding-inline:5px}
 .tools .seg button{min-width:29px;padding:0 4px}
 .bar .publish{min-width:36px;padding-inline:8px}
 .bar .logo{width:30px;height:30px}
 .bar{gap:4px;padding-inline:6px}
}
/* Fullscreen live preview remains in the page: same iframe, same edits, no duplicate render. */
body.nova-preview-fullscreen{overflow:hidden!important}
.nova-preview-fullscreen .app .canvas{
 position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
 min-height:0!important;max-height:none!important;z-index:95!important;
 display:flex!important;justify-content:center!important;align-items:stretch!important;
 padding:53px 0 env(safe-area-inset-bottom)!important;overflow:hidden!important;
 background:#080f1c!important
}
.nova-preview-fullscreen .canvas-label{
 position:absolute!important;top:0!important;left:0!important;right:0!important;
 height:53px!important;padding:0 max(12px,env(safe-area-inset-left))!important;
 border-bottom:1px solid #304660;background:#111e32;display:flex;align-items:center;
 pointer-events:auto!important;z-index:100!important
}
.nova-preview-fullscreen .canvas-label small{display:none}
.nova-preview-fullscreen .studio-preview-expand{margin-inline-start:auto;background:#324f6d}
.nova-preview-fullscreen .app .frame-wrap{
 width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;
 aspect-ratio:auto!important;margin:0!important;padding:0!important;
 border-radius:0!important;box-shadow:none!important;background:#080e18!important;
 flex:1;min-width:0
}
.nova-preview-fullscreen .frame-wrap .frame-screen{width:100%;height:100%;border-radius:0!important}
.nova-preview-fullscreen .frame-wrap iframe{
 display:block!important;position:relative!important;inset:auto!important;
 transform:none!important;transform-origin:top left!important;
 width:100%!important;height:100%!important;border:0!important;border-radius:0!important
}
.nova-preview-fullscreen .notch,.nova-preview-fullscreen .canvas-hint,.nova-preview-fullscreen .canvas-edit-jump{display:none!important}
@media(prefers-reduced-motion:reduce){.studio-preview-expand{transition:none}}

/* Compact, visible draft status for phone editors. */
.canvas-save{display:none;color:#8df0d4;letter-spacing:0;font-size:10px;font-weight:700;white-space:nowrap}
.canvas-save[data-state="saving"]{color:#c9d8ed}
.canvas-save[data-state="failed"]{color:#ffacb2}
@media(max-width:900px){
 .canvas-save{display:inline-flex;margin-inline-start:auto}
 .canvas-label .studio-preview-expand{margin-inline-start:3px}
}
.nova-preview-fullscreen .canvas-save{display:inline-flex;margin-inline-start:auto}
.nova-preview-fullscreen .canvas-label .studio-preview-expand{margin-inline-start:8px}
@media(max-width:350px){.canvas-save{font-size:9px}.canvas-label .studio-preview-expand{gap:4px;padding:6px 8px}}