
/* Studio V6D — keep real photo/video unobscured while settings are open.
   The transparent controls sit in available canvas space, not over the subject. */
.studio.editor-v6-active #preview{
  position:absolute!important;
  left:50%!important;
  top:var(--v6-image-center,355px)!important;
  transform:translate(-50%,-50%)!important;
  max-height:var(--v6-safe-height,430px)!important;
  max-width:calc(100vw - 24px)!important;
  width:auto!important;height:auto!important;
  object-fit:contain!important;
  display:block;
  z-index:1;
}
.studio.editor-v6-active .canvas-ambient{pointer-events:none}
.studio.editor-v6-active .canvas-box .editor-v6-guide{display:none!important}
.studio.editor-v6-active.editor-v6-side-tools .tools{
  position:absolute;
  left:auto!important;
  top:var(--v6-side-top,130px)!important;
  right:var(--v6-side-right,16px)!important;
  bottom:auto!important;
  transform:none!important;
  width:var(--v6-side-width,360px)!important;
  max-height:var(--v6-side-height,460px)!important;
  overflow:auto;
}
.studio.editor-v6-active .tools .range-wrap input[type=color]{
  width:42px!important;
  min-width:42px;
  max-width:42px;
  flex:0 0 42px;
  height:38px;
  border:1px solid #ffffff51;
  border-radius:10px;
  background:#ffffff17;
  padding:3px;
  cursor:pointer;
}
.studio.editor-v6-active .toast:not([hidden]){
  position:fixed!important;
  top:70px!important;
  bottom:auto!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  margin:0!important;
  max-width:min(420px,calc(100vw - 30px))!important;
  background:#17212df2!important;
  color:#fff!important;
  border:1px solid #ffffff40;
  border-radius:12px;
  padding:12px 16px;
  text-align:center;
  z-index:50;
  pointer-events:none;
}
.studio.editor-v6-active .tools .editor-v6-move{
  margin-top:10px;
}

/* A narrow desktop rail should not squeeze three effect descriptions into tiny cards. */
.studio.editor-v6-active.editor-v6-side-tools .editor-v5-options{grid-template-columns:1fr;gap:7px}
.studio.editor-v6-active.editor-v6-side-tools .editor-v5-option{min-height:53px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;padding:10px 13px}
.studio.editor-v6-active.editor-v6-side-tools .editor-v5-option b{font-size:13px;flex:0 0 auto}
.studio.editor-v6-active.editor-v6-side-tools .editor-v5-option small{max-width:55%;font-size:11px;text-align:right}
