/* VELORA File Studio v5.8 — Edge Studio */
@media (min-width: 1024px){
  body.v5-photo-mode{overflow:hidden!important}
  body.v5-photo-mode .v5-pro-banner,
  body.v5-photo-mode .account-bar{display:none!important}
  body.v5-photo-mode .studio-tabs{
    height:calc(100vh - 76px)!important;
    max-width:none!important;
    width:100%!important;
    padding:12px 18px 14px!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }
  body.v5-photo-mode .workspace-top{display:none!important}
  body.v5-photo-mode .workspace{
    flex:1 1 auto!important;
    min-height:0!important;
    width:min(100%,1460px)!important;
    max-width:1460px!important;
    margin:0 auto!important;
    padding:0!important;
    overflow:hidden!important;
  }
  body.v5-photo-mode .workspace>div:not([hidden]){height:100%!important;min-height:0!important}
  body.v5-photo-mode .tool-layout{
    height:100%!important;
    min-height:0!important;
    grid-template-columns:minmax(0,1fr) 330px!important;
    gap:14px!important;
    align-items:stretch!important;
  }
  body.v5-photo-mode .v5-preview-column{display:none!important}
  body.v5-photo-mode .work-panel,
  body.v5-photo-mode .photo-settings{
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }
  body.v5-photo-mode .work-panel>.panel-head,
  body.v5-photo-mode .photo-settings>.settings-title,
  body.v5-photo-mode .photo-settings>.settings-footer{flex:0 0 auto!important}
  body.v5-photo-mode .work-panel>.panel-body{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:auto!important;
    display:flex!important;
    flex-direction:column!important;
    padding:14px 16px 18px!important;
    scrollbar-gutter:stable;
  }
  body.v5-photo-mode .photo-settings>.settings-body{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:auto!important;
    scrollbar-gutter:stable;
  }
  /* Always keep before/after visible while the user changes sliders. */
  body.v5-photo-mode .photo-stage{
    order:-10!important;
    position:sticky!important;
    top:0!important;
    z-index:8!important;
    margin:0 0 12px!important;
    padding:8px 0 12px!important;
    background:linear-gradient(180deg,#fff 82%,rgba(255,255,255,.94))!important;
    box-shadow:0 10px 18px -18px rgba(26,45,82,.55)!important;
  }
  body.v5-photo-mode .photo-frame{height:clamp(220px,34vh,330px)!important}
  body.v5-photo-mode .photo-frame.output img{max-width:92%!important;max-height:94%!important}
  body.v5-photo-mode .photo-batch{margin-top:10px!important}
  body.v5-photo-mode .photo-batch-grid{
    grid-template-columns:repeat(auto-fill,minmax(104px,1fr))!important;
    max-height:150px!important;
    overflow:auto!important;
    gap:8px!important;
    margin:8px 0!important;
  }
  body.v5-photo-mode .photo-batch-card{padding:7px!important}
  body.v5-photo-mode .photo-batch-select img{height:78px!important}
  body.v5-photo-mode .photo-info{margin-top:10px!important;padding:10px!important}
  body.v5-photo-mode .photo-actions{margin-top:10px!important}
  body.v5-photo-mode .photo-settings .settings-title{min-height:52px!important;padding:14px 16px!important}
  body.v5-photo-mode .photo-settings .settings-body{padding:12px 14px!important}
  body.v5-photo-mode .photo-settings .settings-footer{padding:11px 14px!important}
  body.v5-photo-mode .photo-controls{margin-top:12px!important}
  body.v5-photo-mode .slider-label{margin:10px 0 8px!important}
  body.v5-photo-mode .field-block+.field-block{margin-top:14px!important}
  body.v5-photo-mode .output-note{margin-top:12px!important;padding:10px!important}
  body.v5-photo-mode .footer{display:none!important}
}

/* Better visual contrast for edge review. */
.photo-frame.output{
  background-size:12px 12px!important;
  background-position:0 0,0 6px,6px -6px,-6px 0!important;
}
.photo-frame.output img{image-rendering:auto!important}
#photo-edge{accent-color:#315eea}

:root[data-theme=dark] body.v5-photo-mode .photo-stage{
  background:linear-gradient(180deg,#1b2537 82%,rgba(27,37,55,.94))!important;
}

@media (max-width:1023px){
  body.v5-photo-mode{overflow:auto!important}
  body.v5-photo-mode .tool-layout{grid-template-columns:1fr!important}
  body.v5-photo-mode .photo-settings{position:static!important;height:auto!important}
  body.v5-photo-mode .photo-stage{position:static!important}
}