/* NOVA Studio V13: preview-first mobile editing with a compact/resizable tool sheet. */
@media(max-width:900px){
  body.nova-inline-edit{--nova-sheet-height:min(45dvh,440px);--nova-keyboard-offset:0px}
  .nova-inline-edit .nova-edit-backdrop{background:rgba(2,8,23,.15);backdrop-filter:none}
  .nova-inline-edit .app .panel{
    bottom:var(--nova-keyboard-offset,0px)!important;
    height:var(--nova-sheet-height)!important;
    max-height:calc(100dvh - 65px)!important;
    border-radius:22px 22px 0 0!important;
    padding-top:68px!important;
    box-shadow:0 -18px 66px rgba(0,6,21,.5)!important;
    touch-action:pan-y;
    scroll-padding-top:78px
  }
  .nova-inline-edit .nova-edit-toolbar{
    bottom:calc(var(--nova-keyboard-offset,0px) + var(--nova-sheet-height) - 55px)!important;
    padding-inline:max(10px,env(safe-area-inset-left))!important;
    gap:7px;
    background:linear-gradient(120deg,#172e49,#17253b)
  }
  .nova-edit-expand{font-size:11px!important;min-width:76px;min-height:37px;flex:none}
  .nova-edit-expand svg{width:13px;height:13px;transition:transform .2s}
  .nova-edit-expand[aria-expanded=true] svg{transform:rotate(180deg)}
  .nova-inline-edit .app .canvas{filter:none!important}
  .nova-inline-edit .canvas-label{opacity:1!important}
  .nova-inline-edit .app .panel .inp:focus-visible,
  .nova-inline-edit .app .panel textarea:focus-visible{
    outline:2px solid #88e3ef!important;outline-offset:1px
  }
  .nova-inline-edit .app .panel .flash{box-shadow:0 0 0 1px rgba(128,230,241,.6)}
}
@media(max-width:360px){
  .nova-inline-edit .nova-edit-toolbar{gap:4px}
  .nova-edit-expand{min-width:66px;padding-inline:6px!important;font-size:10px!important}
  .nova-inline-edit .nova-edit-toolbar #novaEditFull{padding-inline:7px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){.nova-edit-expand svg{transition:none}}

/* Fix legacy phone-frame height/padding overriding the immersive viewport. */
body.nova-preview-fullscreen .app #frameWrap{
  width:100%!important;
  height:calc(100dvh - 53px - env(safe-area-inset-bottom))!important;
  min-height:0!important;max-height:none!important;
  padding:0!important;margin:0!important;border-radius:0!important;
  box-shadow:none!important;aspect-ratio:auto!important;flex:1 1 auto!important
}
body.nova-preview-fullscreen .app #frameWrap .frame-screen{
  width:100%!important;height:100%!important;border-radius:0!important
}
body.nova-preview-fullscreen .app #frameWrap #frame{
  position:relative!important;inset:auto!important;
  width:100%!important;height:100%!important;
  transform:none!important;border-radius:0!important
}
body.nova-preview-fullscreen .app #frameWrap .notch{display:none!important}