.vip-hero{padding:28px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,var(--panel),var(--bg2));margin-bottom:18px}
.vip-kicker{color:var(--gold);font-weight:950;letter-spacing:5px;font-size:12px}.vip-hero h1{font-size:clamp(30px,5vw,58px);letter-spacing:4px;margin:8px 0}.vip-hero p{color:var(--muted);max-width:780px}
.vip-access-badge{display:inline-flex;margin-top:12px;padding:7px 11px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:12px}.vip-access-badge.admin{border-color:rgba(212,175,85,.7);color:var(--gold)}
.vip-tool-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}.vip-tool-card{position:relative;min-height:230px;padding:20px;border:1px solid var(--line);border-radius:20px;background:var(--panel);display:flex;flex-direction:column;align-items:flex-start}.vip-tool-card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:rgba(3,3,5,.28);pointer-events:none}.vip-tool-card>*{position:relative;z-index:1}.vip-tool-card.unlocked::after{display:none}.vip-tool-card.unlocked{border-color:rgba(212,175,85,.55);box-shadow:0 10px 40px rgba(0,0,0,.22)}.vip-tool-icon{font-size:34px}.vip-tool-card h2{margin:12px 0 6px}.vip-tool-card p{color:var(--muted);line-height:1.5;flex:1}.vip-lock,.vip-coming{display:inline-flex;padding:6px 9px;border-radius:999px;background:var(--bg2);color:var(--muted);font-size:11px;font-weight:800}.vip-lock{position:absolute;right:14px;top:14px}
.vip-workspace{display:grid;grid-template-columns:minmax(280px,1fr) minmax(300px,420px);gap:16px;align-items:start}.vip-preview{min-height:440px;display:grid;place-items:center;border:1px solid var(--line);border-radius:18px;background:#08090b;overflow:hidden}.vip-preview canvas{display:block;max-width:100%;max-height:72vh}.vip-controls{display:grid;gap:10px;padding:16px;border:1px solid var(--line);border-radius:18px;background:var(--panel);position:sticky;top:80px}.vip-controls label{display:grid;gap:5px}.vip-controls .grid-two{display:grid;grid-template-columns:1fr 1fr;gap:8px}.vip-note{padding:11px;border-left:3px solid var(--gold);background:var(--bg2);color:var(--muted);border-radius:8px}
@media(max-width:850px){.vip-workspace{grid-template-columns:1fr}.vip-controls{position:static}.vip-preview{min-height:300px}}

/* V5.3.32 VIP Studio professional workspace */
.vip-studio-page{max-width:1560px}.vip-hero-pro{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;background:radial-gradient(circle at 85% 15%,rgba(212,175,85,.12),transparent 34%),linear-gradient(145deg,var(--panel),var(--bg2))}.vip-hero-access{min-width:min(100%,320px);text-align:right}.vip-dashboard{display:grid;grid-template-columns:220px minmax(0,1fr) 280px;gap:16px;align-items:start}.vip-sidebar,.vip-properties{padding:16px;border-radius:20px}.vip-sidebar{position:sticky;top:82px;display:grid;gap:8px}.vip-sidebar h2{font-size:14px;text-transform:uppercase;letter-spacing:2px;color:var(--muted)}.vip-sidebar>a{padding:10px 11px;border-radius:10px;color:var(--text);text-decoration:none}.vip-sidebar>a:hover{background:var(--bg2);color:var(--gold)}.vip-sidebar-note{margin-top:12px;padding:12px;border:1px solid rgba(212,175,85,.25);border-radius:12px;background:rgba(212,175,85,.05)}.vip-sidebar-note strong{color:var(--gold)}.vip-sidebar-note p{font-size:12px;color:var(--muted);line-height:1.45;margin:6px 0 0}.vip-properties-sticky{position:sticky;top:82px}.vip-properties ul{padding-left:18px;color:var(--muted);line-height:1.55;font-size:13px}.vip-properties hr{border:0;border-top:1px solid var(--line);margin:18px 0}.vip-access-card{padding:14px;border-radius:14px;background:var(--bg2);border:1px solid var(--line)}.vip-access-card strong{color:var(--gold)}.vip-access-card p{color:var(--muted);font-size:13px;line-height:1.5;margin-bottom:0}.vip-catalogue{min-width:0}.vip-section-head{display:flex;align-items:center;gap:12px;margin:8px 0 12px}.vip-section-head>div{display:flex;align-items:center;gap:10px;white-space:nowrap}.vip-section-head h2{margin:0}.vip-section-kicker{color:var(--gold);font-size:11px;font-weight:900}.vip-section-line{height:1px;background:var(--line);flex:1}.vip-tool-grid+.vip-section-head{margin-top:28px}.vip-tool-card{overflow:hidden}.vip-tool-card::after{background:rgba(3,3,5,.13)}.vip-tool-card.unlocked::after{display:none}.vip-tool-card h3{font-size:20px;margin:12px 0 6px}.vip-state{position:absolute;right:12px;top:12px;z-index:3;padding:5px 8px;border-radius:999px;font-size:10px;font-weight:950;letter-spacing:.7px;border:1px solid var(--line);background:var(--bg2);color:var(--muted)}.vip-state.active{border-color:rgba(71,191,121,.45);color:#82d6a6}.vip-state.preview{border-color:rgba(212,175,85,.45);color:var(--gold)}.vip-state.coming{color:var(--muted)}.vip-preview-link.is-static{pointer-events:none}.vip-tool-card[data-status="active"]{border-color:rgba(71,191,121,.22)}.vip-tool-card[data-status="preview"]{border-color:rgba(212,175,85,.2)}
.vip-editor-toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.vip-editor-toolbar .btn{min-width:42px}.vip-control-group{display:grid;gap:8px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--bg2)}.vip-control-group h3{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--gold);margin:0 0 2px}.vip-controls input[type="number"],.vip-controls input[type="text"],.vip-controls select,.vip-controls input[type="file"]{width:100%}.vip-preview.checker{background-color:#111;background-image:linear-gradient(45deg,#171717 25%,transparent 25%),linear-gradient(-45deg,#171717 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#171717 75%),linear-gradient(-45deg,transparent 75%,#171717 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}.vip-preview canvas{box-shadow:0 10px 45px rgba(0,0,0,.35)}.vip-output-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.vip-inline-checks{display:flex;gap:14px;flex-wrap:wrap}.vip-inline-checks label{display:flex;grid-template-columns:auto 1fr;align-items:center;gap:6px}.vip-range-row{display:grid;grid-template-columns:1fr 64px;gap:8px;align-items:center}.vip-range-row output{text-align:right;color:var(--gold);font-variant-numeric:tabular-nums}.vip-logo-preview{max-width:90px;max-height:50px;object-fit:contain;border:1px solid var(--line);border-radius:8px;background:#111}.vip-lock-message{padding:20px;border:1px solid rgba(212,175,85,.35);border-radius:16px;background:rgba(212,175,85,.05);max-width:720px}.vip-lock-message strong{color:var(--gold)}
@media(max-width:1180px){.vip-dashboard{grid-template-columns:190px minmax(0,1fr)}.vip-properties{grid-column:1/-1}.vip-properties-sticky{position:static}.vip-properties ul{columns:2}}@media(max-width:850px){.vip-hero-pro{align-items:flex-start;flex-direction:column}.vip-hero-access{text-align:left}.vip-dashboard{grid-template-columns:1fr}.vip-sidebar{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.vip-sidebar h2,.vip-sidebar-note{grid-column:1/-1}.vip-properties{grid-column:auto}.vip-properties ul{columns:1}.vip-output-row{grid-template-columns:1fr}}

.vip-locked-workspace{position:relative;filter:saturate(.55);opacity:.78}.vip-locked-workspace .vip-preview{pointer-events:none}.vip-locked-workspace input:disabled,.vip-locked-workspace select:disabled,.vip-locked-workspace button:disabled{cursor:not-allowed;opacity:.65}

.vip-tool-card .vip-open{display:none}.vip-tool-card.unlocked .vip-open{display:inline-flex}.vip-tool-card.unlocked .vip-preview-link{display:none}

/* V5.3.34 — editor viewport + internal panel scrolling
   Keep the media preview visible while the user scrolls long tool/property panels. */
body[data-page="vip-photo"] .vip-workspace,
body[data-page="vip-watermark"] .vip-workspace{
  grid-template-columns:minmax(0,1fr) minmax(310px,380px);
  gap:14px;
  align-items:stretch;
  height:calc(100dvh - 230px);
  min-height:500px;
  max-height:820px;
  overflow:hidden;
}
body[data-page="vip-photo"] .vip-workspace > :first-child,
body[data-page="vip-watermark"] .vip-workspace > :first-child{
  min-width:0;
  min-height:0;
}
body[data-page="vip-photo"] .vip-workspace > :first-child{
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
body[data-page="vip-photo"] .vip-editor-toolbar{
  flex:0 0 auto;
}
body[data-page="vip-photo"] .vip-preview,
body[data-page="vip-watermark"] .vip-preview{
  min-height:0;
  height:100%;
  max-height:none;
}
body[data-page="vip-photo"] .vip-preview{
  flex:1 1 auto;
}
body[data-page="vip-photo"] .vip-preview canvas,
body[data-page="vip-watermark"] .vip-preview canvas{
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
}
body[data-page="vip-photo"] .vip-controls,
body[data-page="vip-watermark"] .vip-controls{
  position:static;
  top:auto;
  height:100%;
  min-height:0;
  max-height:none;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-right:10px;
}
body[data-page="vip-photo"] .vip-controls::-webkit-scrollbar,
body[data-page="vip-watermark"] .vip-controls::-webkit-scrollbar{width:10px}
body[data-page="vip-photo"] .vip-controls::-webkit-scrollbar-thumb,
body[data-page="vip-watermark"] .vip-controls::-webkit-scrollbar-thumb{
  background:rgba(212,175,85,.42);
  border:2px solid transparent;
  border-radius:999px;
  background-clip:padding-box;
}
body[data-page="vip-photo"] .vip-controls::-webkit-scrollbar-track,
body[data-page="vip-watermark"] .vip-controls::-webkit-scrollbar-track{background:rgba(255,255,255,.025)}

/* Do not collapse the editor into a long one-column rail on ordinary tablet /
   narrow desktop widths. That was the cause of the disappearing preview. */
@media (max-width:850px) and (min-width:621px){
  body[data-page="vip-photo"] .vip-workspace,
  body[data-page="vip-watermark"] .vip-workspace{
    grid-template-columns:minmax(0,1fr) minmax(285px,42vw);
    height:calc(100dvh - 205px);
    min-height:460px;
  }
  body[data-page="vip-photo"] .vip-controls,
  body[data-page="vip-watermark"] .vip-controls{
    position:static;
    overflow-y:auto;
  }
}

/* Real small-screen fallback: preview remains visible in the upper editor pane,
   controls scroll only inside the lower pane instead of creating a huge page. */
@media (max-width:620px){
  body[data-page="vip-photo"] .vip-workspace,
  body[data-page="vip-watermark"] .vip-workspace{
    grid-template-columns:1fr;
    grid-template-rows:minmax(220px,40dvh) minmax(240px,1fr);
    height:calc(100dvh - 170px);
    min-height:520px;
    max-height:none;
    overflow:hidden;
  }
  body[data-page="vip-photo"] .vip-workspace > :first-child{
    min-height:0;
  }
  body[data-page="vip-photo"] .vip-editor-toolbar{
    margin-bottom:6px;
  }
  body[data-page="vip-photo"] .vip-controls,
  body[data-page="vip-watermark"] .vip-controls{
    height:100%;
    min-height:0;
    overflow-y:auto;
  }
}

/* V5.3.35 — professional fixed editor shell for every VIP media tool */
.vip-tool-page .platform-main{
  width:min(1680px,100%);
  max-width:1680px;
  height:calc(100dvh - 74px);
  min-height:0;
  padding:14px 18px 16px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.vip-tool-page .global-back-row{flex:0 0 auto;margin-bottom:4px}
.vip-tool-page .page-heading{flex:0 0 auto;margin:2px 0 8px;align-items:flex-end}
.vip-tool-page .page-heading h1{font-size:clamp(25px,3vw,40px);margin:0 0 3px}
.vip-tool-page .page-heading p{font-size:13px;line-height:1.35;max-width:820px}
.vip-tool-page>.platform-main>.vip-note,
.vip-tool-page .platform-main> .vip-note{flex:0 0 auto;margin:0 0 8px;padding:7px 10px;font-size:12px}
.vip-tool-page .vip-workspace{
  flex:1 1 auto;
  min-height:0;
  height:auto;
  max-height:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,390px);
  gap:12px;
  align-items:stretch;
  overflow:hidden;
}
.vip-tool-page .vip-stage-column{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:8px;
  overflow:hidden;
}
.vip-tool-page .vip-editor-toolbar{flex:0 0 auto;margin:0;gap:6px}
.vip-tool-page .vip-editor-toolbar .btn{padding:8px 12px;font-size:13px}
.vip-tool-page .vip-preview{
  flex:1 1 auto;
  min-width:0;
  min-height:0;
  height:auto;
  max-height:none;
  border-radius:14px;
  overflow:hidden;
  position:relative;
}
.vip-tool-page .vip-preview canvas,
.vip-tool-page .vip-preview video,
.vip-tool-page .vip-preview img{
  display:block;
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
}
.vip-tool-page .vip-controls{
  position:static;
  top:auto;
  height:100%;
  min-height:0;
  max-height:none;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding:10px 9px 18px 10px;
  gap:8px;
  border-radius:14px;
}
.vip-tool-page .vip-control-group{padding:10px;gap:7px;border-radius:11px}
.vip-tool-page .vip-control-group h3{font-size:11px}
.vip-tool-page .vip-controls input,
.vip-tool-page .vip-controls select,
.vip-tool-page .vip-controls textarea{padding:9px 10px;font-size:14px;border-radius:9px}
.vip-tool-page .vip-controls .btn{padding:9px 14px;font-size:13px}
.vip-tool-page .vip-controls::-webkit-scrollbar{width:11px}
.vip-tool-page .vip-controls::-webkit-scrollbar-track{background:rgba(255,255,255,.025);border-radius:999px}
.vip-tool-page .vip-controls::-webkit-scrollbar-thumb{background:rgba(212,175,85,.52);border:3px solid transparent;border-radius:999px;background-clip:padding-box}
.vip-tool-page .vip-controls{scrollbar-color:rgba(212,175,85,.52) rgba(255,255,255,.025);scrollbar-width:thin}
.vip-media-empty{display:grid;place-items:center;min-height:220px;text-align:center;padding:24px;color:var(--muted)}
.vip-media-empty strong{display:block;color:var(--text);font-size:18px;margin-bottom:5px}
.vip-preview-status{position:absolute;left:10px;bottom:10px;z-index:4;padding:5px 8px;border-radius:999px;background:rgba(0,0,0,.7);border:1px solid var(--line);font-size:11px;color:#fff;pointer-events:none}
.vip-preview-tabs{display:flex;gap:6px;flex-wrap:wrap}
.vip-preview-tabs button.active{background:var(--gold);color:#090909;border-color:var(--gold)}
.vip-progress{height:8px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.07);border:1px solid var(--line)}
.vip-progress>span{display:block;width:0;height:100%;background:var(--gold);transition:width .15s linear}
.vip-mask-canvas{cursor:crosshair;touch-action:none}
.vip-tool-chip-row{display:flex;gap:6px;flex-wrap:wrap}
.vip-tool-chip{padding:5px 8px;border:1px solid var(--line);border-radius:999px;font-size:11px;color:var(--muted)}
.vip-tool-chip.ok{color:#83d7a7;border-color:rgba(71,191,121,.45)}
.vip-danger-note{padding:8px 10px;border-left:3px solid #d09c4d;background:rgba(208,156,77,.06);font-size:12px;color:var(--muted);border-radius:8px}
.vip-inline-actions{display:flex;gap:7px;flex-wrap:wrap}
.vip-inline-actions>.btn{flex:1;min-width:110px}
.vip-time-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vip-toggle-row{display:flex!important;grid-template-columns:none!important;align-items:center;gap:8px!important}
.vip-toggle-row input{width:auto!important}
.vip-hidden-media{position:absolute!important;width:1px!important;height:1px!important;opacity:.001!important;pointer-events:none!important;left:-10000px!important}
.vip-readout{font-variant-numeric:tabular-nums;color:var(--gold);font-weight:800;font-size:12px}
.vip-canvas-overlay{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}

/* Dashboard remains a catalogue; only actual tool editors use the viewport lock. */
.vip-studio-page .vip-dashboard{align-items:start}

@media (max-width:1100px){
  .vip-tool-page .platform-main{height:calc(100dvh - 74px);padding:10px 12px 12px}
  .vip-tool-page .vip-workspace{grid-template-columns:minmax(0,1fr) minmax(285px,36vw)}
}
@media (max-width:760px){
  .vip-tool-page .platform-main{height:calc(100dvh - 64px);padding:8px 10px 10px}
  .vip-tool-page .page-heading{margin:0 0 6px;display:block}
  .vip-tool-page .page-heading p{display:none}
  .vip-tool-page .vip-workspace{grid-template-columns:minmax(0,1fr) minmax(270px,43vw);gap:8px}
  .vip-tool-page .vip-controls{padding:8px 7px 14px 8px}
}
@media (max-width:620px){
  .vip-tool-page .platform-main{height:calc(100dvh - 64px);overflow:hidden}
  .vip-tool-page .vip-workspace{
    grid-template-columns:1fr;
    grid-template-rows:minmax(220px,42dvh) minmax(220px,1fr);
    height:auto;
    min-height:0;
    max-height:none;
  }
  .vip-tool-page .vip-stage-column{grid-row:1}
  .vip-tool-page .vip-controls{grid-row:2;height:100%;min-height:0;overflow-y:auto}
  .vip-tool-page .vip-preview{min-height:0;height:100%}
}
.audio-pro-stage{width:100%;height:100%;min-height:0;display:flex;flex-direction:column;background:radial-gradient(circle at 50% 20%,rgba(212,175,85,.08),transparent 36%),#08090b}.audio-pro-stage canvas{width:100%!important;height:calc(100% - 58px)!important;max-width:none!important;max-height:none!important;object-fit:fill!important;box-shadow:none!important}.audio-pro-readout{height:58px;flex:0 0 58px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 18px;border-top:1px solid var(--line);background:rgba(0,0,0,.36)}.audio-pro-readout strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.audio-pro-readout span{color:var(--gold);font-variant-numeric:tabular-nums;font-weight:900}
.vip-remover-stage>canvas{position:absolute;inset:0;margin:auto}.vip-remover-stage #rmMaskCanvas{z-index:3;opacity:.55}.vip-remover-stage #rmCanvas{z-index:1}.vip-remover-stage .vip-media-empty{position:absolute;inset:0;z-index:2}.vip-remover-stage .vip-preview-status{z-index:5}
/* V5.3.36 cover editor */
.cover-layer-list{display:flex;gap:6px;flex-wrap:wrap}.cover-layer-btn{border:1px solid var(--line);background:var(--bg2);color:var(--text);border-radius:999px;padding:6px 9px;font-size:12px}.cover-layer-btn.active{background:var(--gold);color:#090909;border-color:var(--gold)}body[data-page="vip-cover-art"] #caCanvas{cursor:move;touch-action:none}

/* ========================================================================== */
/* V5.3.37 — UNIFIED STICKER-STYLE VIP EDITOR FRAME                          */
/* Every visual Studio tool now uses the same compact square editor viewport  */
/* as Sticker Creator. Export dimensions remain untouched and full-resolution. */
/* ========================================================================== */
.vip-tool-page{
  --vip-sticker-frame-size:min(520px,calc(100dvh - 285px));
}
body[data-page="vip-video"]{--vip-sticker-frame-size:min(430px,calc(100dvh - 390px));}
body[data-page="vip-remover"]{--vip-sticker-frame-size:min(480px,calc(100dvh - 330px));}

/* Same two-pane composition as the known-good Sticker Creator. */
.vip-tool-page .vip-workspace{
  grid-template-columns:minmax(390px,1fr) minmax(330px,430px)!important;
  gap:14px!important;
  align-items:stretch!important;
}
.vip-tool-page .vip-stage-column{
  min-width:0!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  padding:0 14px 0 0!important;
  border-right:1px solid var(--line)!important;
  overflow:hidden!important;
}
.vip-tool-page .vip-editor-toolbar{
  width:min(100%,var(--vip-sticker-frame-size))!important;
  max-width:var(--vip-sticker-frame-size)!important;
  margin:0 auto 8px!important;
  flex:0 0 auto!important;
}

/* The EDITOR frame is always the same square window. The media inside keeps  */
/* its own ratio (1:1, 16:9, 9:16, custom). This affects display only.         */
.vip-tool-page .vip-preview{
  flex:0 0 auto!important;
  width:min(100%,var(--vip-sticker-frame-size))!important;
  height:auto!important;
  min-width:0!important;
  min-height:0!important;
  max-width:var(--vip-sticker-frame-size)!important;
  max-height:none!important;
  aspect-ratio:1 / 1!important;
  margin:0 auto!important;
  display:grid!important;
  place-items:center!important;
  position:relative!important;
  overflow:hidden!important;
  border:2px solid rgba(212,175,85,.78)!important;
  border-radius:10px!important;
  background-color:#0b0c0f!important;
  background-image:
    linear-gradient(45deg,#15161a 25%,transparent 25%),
    linear-gradient(-45deg,#15161a 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#15161a 75%),
    linear-gradient(-45deg,transparent 75%,#15161a 75%)!important;
  background-size:18px 18px!important;
  background-position:0 0,0 9px,9px -9px,-9px 0!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.75) inset!important;
}

/* Full-resolution canvas/video/image is scaled ONLY for viewing. Never stretch. */
.vip-tool-page .vip-preview>canvas:not(.vip-hidden-media),
.vip-tool-page .vip-preview>video:not(.vip-hidden-media),
.vip-tool-page .vip-preview>img:not(.vip-hidden-media),
.vip-tool-page .vip-preview>.audio-pro-stage{
  max-width:100%!important;
  max-height:100%!important;
}
.vip-tool-page .vip-preview>canvas:not(.vip-mask-canvas),
.vip-tool-page .vip-preview>video:not(.vip-hidden-media),
.vip-tool-page .vip-preview>img:not(.vip-hidden-media){
  width:auto!important;
  height:auto!important;
  object-fit:contain!important;
  margin:auto!important;
}

/* Overlay canvases must remain pixel-perfect on top of the source canvas. */
.vip-tool-page .vip-remover-stage>canvas,
.vip-tool-page .vip-preview>.vip-mask-canvas{
  position:absolute!important;
  inset:0!important;
  margin:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
}

/* Sticker-style independent scrolling settings pane. */
.vip-tool-page .vip-controls{
  min-width:0!important;
  height:100%!important;
  min-height:0!important;
  overflow-y:scroll!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  padding:0 8px 18px 0!important;
  border-radius:0!important;
  border:0!important;
  border-left:0!important;
  background:transparent!important;
  scrollbar-gutter:stable!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(212,175,85,.72) rgba(255,255,255,.07)!important;
}
.vip-tool-page .vip-controls::-webkit-scrollbar{width:10px!important}
.vip-tool-page .vip-controls::-webkit-scrollbar-track{background:rgba(255,255,255,.06)!important;border-radius:8px!important}
.vip-tool-page .vip-controls::-webkit-scrollbar-thumb{background:rgba(212,175,85,.72)!important;border-radius:8px!important;border:2px solid var(--panel)!important}
.vip-tool-page .vip-control-group{
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:var(--bg2)!important;
  padding:10px!important;
}

/* Keep status/empty messages inside the square editor frame. */
.vip-tool-page .vip-media-empty{position:absolute!important;inset:0!important;min-height:0!important;z-index:2!important}
.vip-tool-page .vip-preview-status{z-index:6!important}

/* Video editor: same square preview; timeline lives directly below it at the */
/* same width and remains an actual editing control rather than a page-wide rail. */
body[data-page="vip-video"] .video-timeline-panel{
  width:min(100%,var(--vip-sticker-frame-size))!important;
  max-width:var(--vip-sticker-frame-size)!important;
  flex:0 0 auto!important;
  margin:8px auto 0!important;
  padding:9px!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:var(--bg2)!important;
  overflow:hidden!important;
}
body[data-page="vip-video"] .video-timeline-head,
body[data-page="vip-video"] .video-timeline-foot{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;font-size:11px!important}
body[data-page="vip-video"] .video-timeline-head>div:first-child{display:grid!important;gap:2px!important;min-width:0!important}
body[data-page="vip-video"] #vSelectionReadout{color:var(--muted)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body[data-page="vip-video"] #vTimeline{display:block!important;width:100%!important;height:104px!important;max-width:100%!important;border-radius:8px!important;background:#090a0d!important;margin:7px 0!important;cursor:crosshair!important}
body[data-page="vip-video"] .video-nudge-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important}
body[data-page="vip-video"] .video-current-time{margin-left:auto!important;color:var(--gold)!important;font-variant-numeric:tabular-nums!important;font-weight:900!important;font-size:11px!important}

/* Audio waveform uses the same editor frame dimensions without changing audio export. */
body[data-page="vip-audio"] .audio-pro-stage{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important}

/* Desktop/narrow desktop: preserve the two-pane editor just like Sticker Creator. */
@media(max-width:1100px) and (min-width:821px){
  .vip-tool-page{--vip-sticker-frame-size:min(440px,calc(100dvh - 285px));}
  body[data-page="vip-video"]{--vip-sticker-frame-size:min(390px,calc(100dvh - 390px));}
  .vip-tool-page .vip-workspace{grid-template-columns:minmax(330px,1fr) minmax(300px,40vw)!important}
}

/* V5.3.38 — MOBILE EDITOR: preview is always visible; ONLY properties scroll. */
@media(max-width:820px){
  .vip-tool-page{--vip-sticker-frame-size:min(29dvh,78vw,300px);--vip-mobile-header-h:74px;height:100dvh!important;overflow:hidden!important;}
  body[data-page="vip-remover"]{--vip-sticker-frame-size:min(28dvh,76vw,290px);}
  body[data-page="vip-video"]{--vip-sticker-frame-size:min(20dvh,66vw,230px);}

  .vip-tool-page .platform-main{
    display:flex!important;
    flex-direction:column!important;
    height:calc(100dvh - var(--vip-mobile-header-h))!important;
    min-height:0!important;
    overflow:hidden!important;
    padding:7px 9px 9px!important;
  }
  .vip-tool-page .global-back-row{margin-bottom:2px!important}
  .vip-tool-page .page-heading{margin:0 0 4px!important;flex:0 0 auto!important}
  .vip-tool-page .page-heading h1{font-size:clamp(21px,6vw,30px)!important;margin:0!important}
  .vip-tool-page .page-heading p{display:none!important}
  .vip-tool-page .platform-main>.vip-note{margin:0 0 5px!important;padding:5px 8px!important;font-size:11px!important}

  .vip-tool-page .vip-workspace{
    flex:1 1 0!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:minmax(205px,43%) minmax(0,57%)!important;
    gap:7px!important;
    overflow:hidden!important;
  }
  body[data-page="vip-video"] .vip-workspace{grid-template-rows:minmax(300px,54%) minmax(0,46%)!important}

  .vip-tool-page .vip-stage-column{
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    padding:0 0 6px!important;
    border-right:0!important;
    border-bottom:1px solid var(--line)!important;
    justify-content:flex-start!important;
  }
  .vip-tool-page .vip-editor-toolbar{
    width:min(100%,var(--vip-sticker-frame-size))!important;
    max-width:var(--vip-sticker-frame-size)!important;
    margin:0 auto 5px!important;
    gap:4px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    flex-wrap:nowrap!important;
    scrollbar-width:none!important;
  }
  .vip-tool-page .vip-editor-toolbar::-webkit-scrollbar{display:none!important}
  .vip-tool-page .vip-editor-toolbar .btn{padding:6px 9px!important;font-size:11px!important;white-space:nowrap!important;flex:0 0 auto!important}
  .vip-tool-page .vip-preview{
    flex:0 0 auto!important;
    width:var(--vip-sticker-frame-size)!important;
    max-width:var(--vip-sticker-frame-size)!important;
    margin:0 auto!important;
  }

  .vip-tool-page .vip-controls{
    grid-row:2!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    padding:0 4px 18px 0!important;
    scrollbar-gutter:auto!important;
  }
  .vip-tool-page .vip-control-group{padding:9px!important;margin:0!important}
  .vip-tool-page .vip-controls input[type="range"]{touch-action:pan-x!important}

  body[data-page="vip-video"] .video-timeline-panel{
    width:min(100%,var(--vip-sticker-frame-size))!important;
    max-width:var(--vip-sticker-frame-size)!important;
    margin:5px auto 0!important;
    padding:6px!important;
  }
  body[data-page="vip-video"] #vTimeline{height:58px!important;margin:4px 0!important}
  body[data-page="vip-video"] .video-timeline-head,
  body[data-page="vip-video"] .video-timeline-foot{font-size:9px!important}

  /* The page itself never scrolls during editing. Preview and controls cannot separate. */
  .vip-tool-page{overscroll-behavior:none!important}
}

@media(max-width:760px){
  .vip-tool-page{--vip-mobile-header-h:64px;}
}

/* V5.3.40 — size the complete editor against the REAL header and tool space. */
body.vip-tool-page{
  display:flex!important;
  flex-direction:column!important;
  width:100%!important;
  height:100dvh!important;
  min-height:0!important;
  overflow:hidden!important;
}
body.vip-tool-page>#appHeader{flex:0 0 auto!important;min-height:0}
body.vip-tool-page>.platform-main{
  flex:1 1 0!important;
  height:auto!important;
  min-height:0!important;
  overflow:hidden!important;
}
body.vip-tool-page .vip-workspace{
  flex:1 1 0!important;
  height:auto!important;
  min-height:0!important;
  min-width:0!important;
  overflow:hidden!important;
}
body.vip-tool-page .vip-stage-column{
  flex:1 1 0!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  min-width:0!important;
  gap:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(212,175,85,.72) rgba(255,255,255,.07)!important;
}
body.vip-tool-page .vip-stage-column::-webkit-scrollbar{width:10px}
body.vip-tool-page .vip-stage-column::-webkit-scrollbar-thumb{background:rgba(212,175,85,.72);border-radius:8px}
/* This is the one remaining flex row after any toolbar and video timeline. */
body.vip-tool-page .vip-stage-viewport{
  flex:1 1 0;
  width:100%;
  min-width:0;
  min-height:0;
  padding:8px;
  display:grid;
  place-items:center;
  overflow:hidden;
  container-type:size;
}
body.vip-tool-page .vip-preview{
  flex:none!important;
  width:min(100cqw,100cqh)!important;
  height:min(100cqw,100cqh)!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  aspect-ratio:1/1!important;
  margin:0!important;
}
body.vip-tool-page .vip-editor-toolbar,
body[data-page="vip-video"] .video-timeline-panel{
  width:min(100%,100cqw)!important;
  max-width:100%!important;
  flex:0 0 auto!important;
}
body.vip-tool-page .vip-preview>canvas:not(.vip-hidden-media),
body.vip-tool-page .vip-preview>img:not(.vip-hidden-media),
body.vip-tool-page .vip-preview>video:not(.vip-hidden-media){
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
}
@media(max-width:820px){
  body.vip-tool-page>.platform-main{padding:6px 9px 9px!important}
  body.vip-tool-page .vip-workspace{grid-template-rows:minmax(0,48%) minmax(0,52%)!important}
  body[data-page="vip-video"] .vip-workspace{grid-template-rows:minmax(0,60%) minmax(0,40%)!important}
  body.vip-tool-page .vip-stage-column{padding:0 0 4px!important}
  body.vip-tool-page .vip-editor-toolbar{margin:0 auto 2px!important}
  body[data-page="vip-video"] .video-timeline-panel{margin:2px auto 0!important}
  body.vip-tool-page .vip-stage-viewport{padding:5px}
}

/* The composer timeline stays with the preview, while settings scroll alone. */
.pv-timeline-panel{width:100%;max-height:175px;flex:0 0 auto;display:grid;gap:4px;padding:7px;border:1px solid var(--line);border-radius:10px;background:var(--bg2)}
.pv-timeline-head{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px}
.pv-timeline-strip{position:relative;display:flex;gap:3px;overflow-x:auto;overflow-y:hidden;min-height:64px;scrollbar-color:var(--gold) var(--bg2)}
.pv-timeline-clip{position:relative;flex:0 0 auto;min-width:72px;height:56px;padding:3px 11px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--text);overflow:hidden;cursor:pointer;text-align:left}
.pv-timeline-clip.selected{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}
.pv-timeline-clip img{width:100%;height:28px;object-fit:contain;display:block}
.pv-timeline-clip small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px}
.pv-trim-handle{position:absolute;top:0;bottom:0;width:9px;background:var(--gold);touch-action:none;cursor:ew-resize}
.pv-trim-handle.start{left:0}.pv-trim-handle.end{right:0}
.pv-timeline-playhead{position:absolute;top:0;height:100%;width:2px;background:#fff;pointer-events:none;z-index:4;box-shadow:0 0 2px #000}
.pv-audio-track{height:25px;min-height:25px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;color:var(--muted);font-size:10px;background:rgba(0,0,0,.2);border-radius:6px;padding:2px}
.pv-audio-clip{height:20px;min-width:72px;padding:3px 6px;overflow:hidden;text-overflow:ellipsis;border-radius:5px;background:rgba(212,175,85,.25);border:1px solid var(--gold);color:var(--text)}
.pv-media-list{display:grid;gap:5px}.pv-media-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:6px;padding:5px;border:1px solid var(--line);border-radius:8px}
.pv-media-row.selected{border-color:var(--gold)}.pv-media-row img{width:36px;height:36px;object-fit:contain}.pv-media-row strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
.pv-media-row .btn{padding:4px 7px!important;font-size:11px!important}.pv-mini-actions{display:flex;gap:3px}.pv-control-buttons{display:flex;gap:5px;flex-wrap:wrap}.pv-control-buttons .btn{padding:6px 10px!important;font-size:11px!important}
.vip-tool-page .vip-preview-source{width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important}
@media(max-width:820px){.pv-timeline-panel{max-height:130px;padding:4px}.pv-timeline-strip{min-height:45px}.pv-timeline-clip{height:40px}.pv-timeline-clip img{height:16px}}

/* Each tool has two real scroll areas; media stays contained in the frame. */
body.vip-tool-page .vip-stage-viewport{min-height:clamp(180px,30dvh,340px)}
body.vip-tool-page .vip-preview>canvas.hidden,
body.vip-tool-page .vip-preview>img.hidden,
body.vip-tool-page .vip-preview>video.hidden,
body.vip-tool-page .vip-preview>.vip-media-empty.hidden,
body.vip-tool-page .vip-preview>.vip-preview-status.hidden{display:none!important}
.vip-section-head{scroll-margin-top:82px}
@media(max-width:820px){body.vip-tool-page .vip-stage-viewport{min-height:175px}}

/* V5.3.41: scale the entire Photo Studio bitmap up to the preview frame. */
body[data-page="vip-photo"] .vip-preview>#photoCanvas{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
}

/* The resizer preview is a fixed window. Scale the entire media into it;
   never let the element's intrinsic pixel dimensions overflow and get clipped. */
body[data-page="vip-resizer"] .vip-preview>#rCanvas,
body[data-page="vip-resizer"] .vip-preview>#rImage,
body[data-page="vip-resizer"] .vip-preview>#rVideo{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
}

/* Render-only previews in the other editors obey the same no-clipping rule.
   Interactive watermark, cover, and mask canvases keep their pointer geometry. */
body[data-page="vip-converter"] .vip-preview>#cCanvas,
body[data-page="vip-converter"] .vip-preview>#cImage,
body[data-page="vip-converter"] .vip-preview>#cVideo,
body[data-page="vip-background"] .vip-preview>#bgCanvas,
body[data-page="vip-video"] .vip-preview>#vCanvas,
body[data-page="vip-photo-video"] .vip-preview>#pvCanvas{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
}

/* Dimension labels stay outside the image so every pixel is visible. */
body[data-page="vip-photo"] .vip-stage-column>.vip-preview-status,
body[data-page="vip-resizer"] .vip-stage-column>.vip-preview-status{
  position:static!important;
  display:block!important;
  flex:0 0 auto!important;
  align-self:center!important;
  padding:3px 8px!important;
  margin:3px 0 0!important;
}
body[data-page="vip-photo"] .vip-stage-column>.vip-preview-status.hidden,
body[data-page="vip-resizer"] .vip-stage-column>.vip-preview-status.hidden{
  display:none!important;
}

/* ========================================================================== */
/* V5.3.44 — PHOTO STUDIO TRUE-ASPECT PREVIEW                                */
/* Photo Studio must NOT inherit the unified square Sticker Creator frame.    */
/* The preview frame follows the actual source/result aspect ratio exactly.   */
/* Export pixel dimensions are controlled by photo.js and remain unchanged.   */
/* ========================================================================== */
body[data-page="vip-photo"] .vip-stage-viewport{
  flex:1 1 auto!important;
  min-width:0!important;
  min-height:0!important;
  width:100%!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
}
body[data-page="vip-photo"] .vip-preview{
  flex:0 0 auto!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  max-height:100%!important;
  aspect-ratio:auto!important;
  margin:auto!important;
  overflow:hidden!important;
}
body[data-page="vip-photo"] .vip-preview>canvas{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  margin:0!important;
  box-shadow:none!important;
}

/* ========================================================================== */
/* V5.3.45 — MEDIA-ONLY PREVIEW: PHOTO + VIDEO                               */
/* No visible frame, border, checkerboard, panel or stage around the media.   */
/* The media itself always scales fully inside the available preview area.     */
/* Display-only: export dimensions/processing are unchanged.                   */
/* ========================================================================== */
body[data-page="vip-photo"] .vip-stage-viewport,
body[data-page="vip-video"] .vip-stage-viewport{
  padding:0!important;
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}

body[data-page="vip-photo"] .vip-preview,
body[data-page="vip-video"] .vip-preview{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}

body[data-page="vip-photo"] .vip-preview.checker,
body[data-page="vip-video"] .vip-preview.checker{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
}

body[data-page="vip-photo"] .vip-preview>#photoCanvas,
body[data-page="vip-video"] .vip-preview>#vCanvas{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  object-fit:contain!important;
  object-position:center center!important;
}

/* ========================================================================== */
/* V5.3.46 — TRUE MEDIA PREVIEW (NO FRAME, NO STRETCH)                        */
/* The viewport is layout only and invisible. The canvas itself is scaled      */
/* down to fit the available screen. Export dimensions are never derived from  */
/* these CSS sizes.                                                            */
/* ========================================================================== */
body[data-page="vip-photo"] .vip-stage-column,
body[data-page="vip-video"] .vip-stage-column{
  border-right:0!important;
}
body[data-page="vip-photo"] .vip-stage-viewport,
body[data-page="vip-video"] .vip-stage-viewport{
  padding:0!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-photo"] .vip-preview,
body[data-page="vip-video"] .vip-preview,
body[data-page="vip-photo"] .vip-preview.checker,
body[data-page="vip-video"] .vip-preview.checker{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  max-height:100%!important;
  aspect-ratio:auto!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-photo"] #photoCanvas,
body[data-page="vip-video"] #vCanvas{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  object-fit:contain!important;
  object-position:center center!important;
}

/* ========================================================================== */
/* V5.3.47 — MOBILE SIDE-BY-SIDE EDITOR                                       */
/* On phones the media stays permanently visible on the LEFT while the        */
/* settings/slider pane scrolls independently on the RIGHT. The page itself   */
/* does not scroll during editing. Preview CSS size never changes export px.   */
/* ========================================================================== */
@media (max-width:820px){
  body[data-page="vip-photo"].vip-tool-page .vip-workspace,
  body[data-page="vip-video"].vip-tool-page .vip-workspace{
    display:grid!important;
    grid-template-columns:minmax(132px,44vw) minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    gap:7px!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }

  body[data-page="vip-photo"].vip-tool-page .vip-stage-column,
  body[data-page="vip-video"].vip-tool-page .vip-stage-column{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
  }

  body[data-page="vip-photo"].vip-tool-page .vip-editor-toolbar,
  body[data-page="vip-video"].vip-tool-page .vip-editor-toolbar{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0 0 4px!important;
    padding:0!important;
    gap:3px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    flex-wrap:nowrap!important;
  }
  body[data-page="vip-photo"].vip-tool-page .vip-editor-toolbar .btn,
  body[data-page="vip-video"].vip-tool-page .vip-editor-toolbar .btn{
    flex:0 0 auto!important;
    min-width:0!important;
    padding:5px 7px!important;
    font-size:10px!important;
  }

  body[data-page="vip-photo"].vip-tool-page .vip-stage-viewport,
  body[data-page="vip-video"].vip-tool-page .vip-stage-viewport{
    flex:1 1 0!important;
    width:100%!important;
    height:auto!important;
    min-width:0!important;
    min-height:0!important;
    max-width:100%!important;
    max-height:100%!important;
    padding:2px!important;
    margin:0!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    border:0!important;
    outline:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  body[data-page="vip-photo"].vip-tool-page .vip-preview,
  body[data-page="vip-video"].vip-tool-page .vip-preview{
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:100%!important;
    max-height:100%!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
  }

  body[data-page="vip-photo"].vip-tool-page #photoCanvas,
  body[data-page="vip-video"].vip-tool-page #vCanvas{
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    margin:auto!important;
  }

  body[data-page="vip-photo"].vip-tool-page .vip-controls,
  body[data-page="vip-video"].vip-tool-page .vip-controls{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:100%!important;
    margin:0!important;
    padding:0 3px 16px 2px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    scrollbar-gutter:auto!important;
  }

  /* The right pane is intentionally narrow on phones, so two-column property
     rows collapse inside that pane instead of overflowing over the preview. */
  body[data-page="vip-photo"].vip-tool-page .vip-controls .grid-two,
  body[data-page="vip-video"].vip-tool-page .vip-controls .grid-two,
  body[data-page="vip-photo"].vip-tool-page .vip-output-row,
  body[data-page="vip-video"].vip-tool-page .vip-output-row{
    grid-template-columns:1fr!important;
  }
  body[data-page="vip-photo"].vip-tool-page .vip-control-group,
  body[data-page="vip-video"].vip-tool-page .vip-control-group{
    padding:7px!important;
    gap:6px!important;
  }
  body[data-page="vip-photo"].vip-tool-page .vip-control-group h3,
  body[data-page="vip-video"].vip-tool-page .vip-control-group h3{
    font-size:10px!important;
  }
  body[data-page="vip-photo"].vip-tool-page .vip-controls label,
  body[data-page="vip-video"].vip-tool-page .vip-controls label{
    font-size:11px!important;
  }

  /* Video timeline belongs to the LEFT editor column and must not push the
     controls underneath the media. It gets a compact fixed-height strip. */
  body[data-page="vip-video"].vip-tool-page .video-timeline-panel{
    width:100%!important;
    max-width:100%!important;
    flex:0 0 auto!important;
    margin:4px 0 0!important;
    padding:4px!important;
    border-radius:7px!important;
  }
  body[data-page="vip-video"].vip-tool-page #vTimeline{
    height:42px!important;
    margin:3px 0!important;
  }
  body[data-page="vip-video"].vip-tool-page .video-timeline-head,
  body[data-page="vip-video"].vip-tool-page .video-timeline-foot{
    font-size:8px!important;
    gap:3px!important;
  }

  body[data-page="vip-photo"].vip-tool-page .vip-stage-column>.vip-preview-status,
  body[data-page="vip-video"].vip-tool-page .vip-stage-column>.vip-preview-status{
    max-width:100%!important;
    margin:2px 0!important;
    padding:2px 4px!important;
    font-size:9px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

/* Extra-narrow phones: preserve the same LEFT preview / RIGHT controls model. */
@media (max-width:390px){
  body[data-page="vip-photo"].vip-tool-page .vip-workspace,
  body[data-page="vip-video"].vip-tool-page .vip-workspace{
    grid-template-columns:minmax(118px,42vw) minmax(0,1fr)!important;
    gap:5px!important;
  }
}

/* ========================================================================== */
/* V5.3.48 — REAL WATERMARK REMOVER / MEDIA-ONLY PREVIEW                    */
/* Full-resolution canvas stays untouched. The visible editor is only a      */
/* scaled display surface. No decorative frame or forced square aspect ratio. */
/* ========================================================================== */
body[data-page="vip-remover"].vip-tool-page .vip-stage-column{
  overflow:hidden!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-stage-viewport{
  flex:1 1 0!important;
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  padding:6px!important;
  margin:0!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-preview,
body[data-page="vip-remover"].vip-tool-page .vip-preview.checker{
  flex:0 0 auto!important;
  width:auto;
  height:auto;
  min-width:1px!important;
  min-height:1px!important;
  max-width:340px!important;
  max-height:340px!important;
  aspect-ratio:auto!important;
  margin:auto!important;
  padding:0!important;
  position:relative!important;
  display:block!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-remover-stage>canvas{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  object-fit:fill!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
}
body[data-page="vip-remover"].vip-tool-page #rmCanvas{z-index:1!important;pointer-events:none!important;}
body[data-page="vip-remover"].vip-tool-page #rmMaskCanvas{
  z-index:3!important;
  opacity:.72;
  pointer-events:auto;
  touch-action:none!important;
  cursor:crosshair!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-media-empty{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  display:grid!important;
  place-items:center!important;
  text-align:center!important;
  pointer-events:none!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-media-empty.hidden{display:none!important;}
body[data-page="vip-remover"].vip-tool-page .vip-preview-status{
  z-index:5!important;
  left:6px!important;
  bottom:6px!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-editor-toolbar{
  width:100%!important;
  max-width:none!important;
  margin:0 0 6px!important;
  padding:0!important;
  justify-content:center!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  flex-wrap:nowrap!important;
  scrollbar-width:thin!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-editor-toolbar .btn{
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-preview-tabs .btn.active{
  background:var(--gold)!important;
  color:#090909!important;
  border-color:var(--gold)!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-controls{
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
body[data-page="vip-remover"].vip-tool-page #rmEngineState{
  line-height:1.4;
}

/* Phone editor: media remains left, controls remain right and scroll alone. */
@media(max-width:820px){
  body[data-page="vip-remover"].vip-tool-page .vip-workspace{
    display:grid!important;
    grid-template-columns:minmax(126px,44vw) minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    gap:7px!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }
  body[data-page="vip-remover"].vip-tool-page .vip-stage-column{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
  }
  body[data-page="vip-remover"].vip-tool-page .vip-editor-toolbar{
    width:100%!important;
    max-width:none!important;
    justify-content:flex-start!important;
    margin:0 0 4px!important;
    gap:3px!important;
  }
  body[data-page="vip-remover"].vip-tool-page .vip-editor-toolbar .btn{
    padding:5px 7px!important;
    font-size:10px!important;
  }
  body[data-page="vip-remover"].vip-tool-page .vip-stage-viewport{
    flex:1 1 0!important;
    width:100%!important;
    height:auto!important;
    min-width:0!important;
    min-height:0!important;
    max-height:100%!important;
    padding:2px!important;
  }
  body[data-page="vip-remover"].vip-tool-page .vip-preview{
    max-width:100%!important;
    max-height:100%!important;
  }
  body[data-page="vip-remover"].vip-tool-page .vip-controls{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-height:100%!important;
    padding:0 3px 16px 2px!important;
    margin:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
  }
  body[data-page="vip-remover"].vip-tool-page .vip-control-group{
    padding:7px!important;
    gap:6px!important;
  }
  body[data-page="vip-remover"].vip-tool-page .vip-control-group h3{font-size:10px!important;}
  body[data-page="vip-remover"].vip-tool-page .vip-controls label{font-size:11px!important;}
}
body[data-page="vip-remover"].vip-tool-page #rmPreview:has(#rmEmpty:not(.hidden)){
  width:min(340px,100%)!important;
  height:min(340px,100%)!important;
}
@media(max-width:820px){
  body[data-page="vip-remover"].vip-tool-page #rmPreview:has(#rmEmpty:not(.hidden)){
    width:min(280px,100%)!important;
    height:min(280px,100%)!important;
  }
}


/* V5.3.49 — Video Composer playback/trim controls must remain visible. */
body[data-page="vip-photo-video"] .pv-timeline-panel{overflow:hidden!important;}
body[data-page="vip-photo-video"] .pv-playback-bar{
  display:flex!important;align-items:center!important;gap:7px!important;flex-wrap:wrap!important;
  width:100%!important;padding:0 0 6px!important;margin:0!important;
  position:sticky!important;top:0!important;z-index:10!important;
  background:var(--bg2)!important;
}
body[data-page="vip-photo-video"] .pv-playback-bar #pvPlay{min-width:92px!important;}
body[data-page="vip-photo-video"] .pv-playback-bar #pvClock{margin-left:auto!important;white-space:nowrap!important;}
@media(max-width:820px){
  body[data-page="vip-photo-video"] .pv-playback-bar{gap:4px!important;padding-bottom:4px!important;flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none!important;}
  body[data-page="vip-photo-video"] .pv-playback-bar::-webkit-scrollbar{display:none!important;}
  body[data-page="vip-photo-video"] .pv-playback-bar .btn{flex:0 0 auto!important;white-space:nowrap!important;padding:6px 8px!important;font-size:11px!important;}
  body[data-page="vip-photo-video"] .pv-playback-bar #pvClock{flex:0 0 auto!important;margin-left:2px!important;font-size:10px!important;}
}

/* ========================================================================== */
/* V5.3.50 — VIDEO COMPOSER CUT WORKFLOW                                      */
/* Playback belongs inside the timeline. No floating/sticky transport row.     */
/* ========================================================================== */
body[data-page="vip-photo-video"] .pv-timeline-panel{
  max-height:230px!important;
  min-height:190px!important;
  overflow:hidden!important;
}
body[data-page="vip-photo-video"] .pv-playback-bar{
  position:static!important;
  top:auto!important;
  z-index:auto!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  flex-wrap:wrap!important;
  width:100%!important;
  padding:2px 0 4px!important;
  margin:0!important;
  background:transparent!important;
}
body[data-page="vip-photo-video"] .pv-playback-bar #pvPlay,
body[data-page="vip-photo-video"] .pv-playback-bar #pvCutSave{
  min-width:90px!important;
}
body[data-page="vip-photo-video"] .pv-playback-bar #pvClock{
  margin-left:auto!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
}
body[data-page="vip-photo-video"] .pv-timeline-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:10px!important;
}
body[data-page="vip-photo-video"] .pv-space-hint{
  color:var(--muted)!important;
  font-size:10px!important;
  white-space:nowrap!important;
}
body[data-page="vip-photo-video"] #pvSeek{
  width:100%!important;
  margin:2px 0 4px!important;
}
body[data-page="vip-photo-video"] .pv-save-dialog{
  width:min(520px,calc(100vw - 24px));
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--panel);
  color:var(--text);
  padding:18px;
}
body[data-page="vip-photo-video"] .pv-save-dialog::backdrop{background:rgba(0,0,0,.72)}
body[data-page="vip-photo-video"] .pv-save-dialog h3{margin:0 0 8px;color:var(--gold)}
body[data-page="vip-photo-video"] .pv-save-dialog p{margin:0 0 14px;color:var(--muted);line-height:1.45}
body[data-page="vip-photo-video"] .pv-save-actions{display:grid;gap:8px}
@media(max-width:820px){
  body[data-page="vip-photo-video"] .pv-timeline-panel{
    max-height:185px!important;
    min-height:165px!important;
    padding:5px!important;
  }
  body[data-page="vip-photo-video"] .pv-playback-bar{
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }
  body[data-page="vip-photo-video"] .pv-playback-bar::-webkit-scrollbar{display:none!important}
  body[data-page="vip-photo-video"] .pv-playback-bar .btn{
    flex:0 0 auto!important;
    padding:6px 8px!important;
    font-size:10px!important;
  }
  body[data-page="vip-photo-video"] .pv-space-hint{display:none!important}
  body[data-page="vip-photo-video"] .pv-playback-bar #pvClock{
    flex:0 0 auto!important;
    margin-left:2px!important;
    font-size:9px!important;
  }
}

/* V5.3.51 — professional composer timeline / photo motion / soundtrack */
body[data-page="vip-photo-video"] .pv-timeline-clip{min-width:30px!important;}
body[data-page="vip-photo-video"] .pv-timeline-clip.image-clip .pv-trim-handle.start{display:none!important;}
body[data-page="vip-photo-video"] .pv-timeline-clip.image-clip{padding-left:4px!important;}
body[data-page="vip-photo-video"] .pv-subpanel{display:grid;gap:8px;padding:9px;border:1px solid rgba(212,175,85,.25);border-radius:10px;background:rgba(0,0,0,.16);}
body[data-page="vip-photo-video"] .pv-subpanel[hidden]{display:none!important;}
body[data-page="vip-photo-video"] .pv-subpanel h4{margin:0;color:var(--gold);font-size:11px;letter-spacing:1px;}
body[data-page="vip-photo-video"] .pv-check{display:flex!important;grid-template-columns:auto 1fr!important;align-items:flex-start!important;gap:8px!important;line-height:1.35;}
body[data-page="vip-photo-video"] .pv-check input{width:auto!important;margin-top:3px;}
body[data-page="vip-photo-video"] #pvSubtitle{resize:vertical;min-height:58px;}
body[data-page="vip-photo-video"] #pvAudioTrack{position:relative;}
body[data-page="vip-photo-video"] .pv-audio-clip{min-width:30px!important;}
@media(max-width:820px){
  body[data-page="vip-photo-video"] .pv-timeline-clip{min-width:26px!important;}
  body[data-page="vip-photo-video"] .pv-subpanel{padding:7px;gap:6px;}
}

/* ========================================================================== */
/* V5.3.52 — Resizer / Converter / Audio professional preview + exact output  */
/* ========================================================================== */
body[data-page="vip-resizer"] .vip-stage-viewport,
body[data-page="vip-converter"] .vip-stage-viewport{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:0!important;
  padding:8px!important;
  overflow:hidden!important;
}
body[data-page="vip-resizer"] .vip-preview,
body[data-page="vip-converter"] .vip-preview{
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:visible!important;
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-resizer"] .vip-preview>#rImage,
body[data-page="vip-resizer"] .vip-preview>#rVideo,
body[data-page="vip-resizer"] .vip-preview>#rCanvas,
body[data-page="vip-converter"] .vip-preview>#cImage,
body[data-page="vip-converter"] .vip-preview>#cVideo,
body[data-page="vip-converter"] .vip-preview>#cCanvas{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:min(340px,100%)!important;
  max-height:min(340px,46dvh)!important;
  object-fit:contain!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body[data-page="vip-resizer"] .vip-preview>.hidden,
body[data-page="vip-converter"] .vip-preview>.hidden{display:none!important}
body[data-page="vip-resizer"] .vip-preview-status,
body[data-page="vip-converter"] .vip-preview-status{
  position:static!important;
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  margin:2px auto 6px!important;
}
body[data-page="vip-resizer"] .vip-preview-status.hidden,
body[data-page="vip-converter"] .vip-preview-status.hidden{display:none!important}

body[data-page="vip-audio"] .vip-stage-viewport{padding:6px!important;min-height:0!important;overflow:hidden!important}
body[data-page="vip-audio"] .audio-editor-preview{
  width:100%!important;
  height:auto!important;
  max-width:none!important;
  max-height:100%!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden!important;
  display:block!important;
}
body[data-page="vip-audio"] .audio-pro-stage{width:100%!important;max-width:none!important;height:auto!important;display:grid!important;gap:7px!important}
body[data-page="vip-audio"] #aWave{display:block!important;width:100%!important;height:auto!important;max-height:260px!important;aspect-ratio:1400/440!important;touch-action:none!important;cursor:crosshair!important;border:1px solid rgba(212,175,85,.35)!important;border-radius:10px!important}
body[data-page="vip-audio"] .audio-seek{width:100%!important;margin:0!important}
body[data-page="vip-audio"] .audio-transport{display:flex!important;align-items:center!important;gap:6px!important;flex-wrap:wrap!important}
body[data-page="vip-audio"] .audio-transport #aClock{margin-left:auto!important;font-variant-numeric:tabular-nums!important;white-space:nowrap!important;color:var(--gold)!important;font-weight:800!important}
body[data-page="vip-audio"] .audio-pro-readout{display:flex!important;justify-content:space-between!important;align-items:center!important;gap:10px!important;font-variant-numeric:tabular-nums!important}
body[data-page="vip-audio"] #aSelectionReadout{color:var(--muted)!important;text-align:right!important}

@media(max-width:820px){
  body[data-page="vip-resizer"] .vip-preview>#rImage,
  body[data-page="vip-resizer"] .vip-preview>#rVideo,
  body[data-page="vip-resizer"] .vip-preview>#rCanvas,
  body[data-page="vip-converter"] .vip-preview>#cImage,
  body[data-page="vip-converter"] .vip-preview>#cVideo,
  body[data-page="vip-converter"] .vip-preview>#cCanvas{
    max-width:min(280px,100%)!important;
    max-height:min(280px,52dvh)!important;
  }
  body[data-page="vip-audio"] #aWave{max-height:190px!important}
  body[data-page="vip-audio"] .audio-transport{flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none!important}
  body[data-page="vip-audio"] .audio-transport::-webkit-scrollbar{display:none!important}
  body[data-page="vip-audio"] .audio-transport .btn{flex:0 0 auto!important;padding:6px 8px!important;font-size:10px!important}
  body[data-page="vip-audio"] .audio-transport #aClock{flex:0 0 auto!important;margin-left:0!important;font-size:9px!important}
  body[data-page="vip-audio"] .audio-pro-readout{font-size:10px!important;align-items:flex-start!important}
}

/* ========================================================================== */
/* V5.3.53 — BACKGROUND REMOVER: media-only preview, no forced square frame   */
/* ========================================================================== */
body[data-page="vip-background"] .vip-stage-viewport{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:0!important;
  padding:8px!important;
  overflow:hidden!important;
  background:transparent!important;
}
body[data-page="vip-background"] .vip-preview{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:visible!important;
  display:grid!important;
  place-items:center!important;
  position:relative!important;
}
body[data-page="vip-background"] .vip-preview>#bgCanvas{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body[data-page="vip-background"] .vip-preview>#bgCanvas.hidden{display:none!important}
body[data-page="vip-background"] #bgModelState[data-state="ready"]{color:#82d6a6!important}
body[data-page="vip-background"] #bgModelState[data-state="processing"]{color:var(--gold)!important}
body[data-page="vip-background"] #bgModelState[data-state="error"]{color:#ff8b8b!important}
/* Timeline zoom keeps short clips large enough for precise pointer trims. */
.pv-timeline-head{flex-wrap:wrap}
.pv-zoom-control{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:11px}
.pv-zoom-control input{width:clamp(80px,12vw,150px);padding:0!important}
.pv-zoom-control output{min-width:58px;text-align:right;font-variant-numeric:tabular-nums;color:var(--gold)}
@media(max-width:620px){.pv-zoom-control{width:100%;justify-content:space-between}.pv-zoom-control input{flex:1;width:auto}.pv-timeline-panel{max-height:165px}}

/* ========================================================================== */
/* V5.3.73 — BACKGROUND REMOVAL: guaranteed whole-source framing              */
/* The source/export pixels are untouched. Only the on-screen canvas is fit.  */
/* ========================================================================== */
body[data-page="vip-background"] .vip-stage-column{
  overflow:visible!important;
}
body[data-page="vip-background"] .vip-stage-viewport{
  width:100%!important;
  height:clamp(360px,calc(100dvh - 330px),760px)!important;
  min-height:360px!important;
  max-height:760px!important;
  overflow:visible!important;
}
body[data-page="vip-background"] .vip-preview{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:100%!important;
  overflow:visible!important;
}
body[data-page="vip-background"] .vip-preview>#bgCanvas{
  flex:none!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
}
@media(max-width:620px){
  body[data-page="vip-background"] .vip-stage-viewport{
    height:min(42dvh,360px)!important;
    min-height:220px!important;
    max-height:360px!important;
  }
}

/* ========================================================================== */
/* V5.3.89 — VIP STUDIO SURGICAL REPAIR                                       */
/* Media preview scroll is independent from the existing controls/sidebar.    */
/* Existing module controls are preserved; only media-workspace UX is refined. */
/* ========================================================================== */

/* Shared professional media scroller. */
body:is([data-page="vip-photo"],[data-page="vip-video"],[data-page="vip-watermark"],[data-page="vip-cover-art"],[data-page="vip-converter"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-resizer"],[data-page="vip-photo-video"],[data-page="photo-ai"]) .vip-stage-column{
  overflow:hidden!important;
  min-height:0!important;
}
body:is([data-page="vip-photo"],[data-page="vip-video"],[data-page="vip-watermark"],[data-page="vip-cover-art"],[data-page="vip-converter"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-resizer"],[data-page="vip-photo-video"],[data-page="photo-ai"]) .vip-stage-viewport{
  min-height:0!important;
  overflow-x:auto!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-gutter:stable both-edges!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(212,175,85,.82) rgba(255,255,255,.07)!important;
}
body:is([data-page="vip-photo"],[data-page="vip-video"],[data-page="vip-watermark"],[data-page="vip-cover-art"],[data-page="vip-converter"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-resizer"],[data-page="vip-photo-video"],[data-page="photo-ai"]) .vip-stage-viewport::-webkit-scrollbar{width:10px;height:10px}
body:is([data-page="vip-photo"],[data-page="vip-video"],[data-page="vip-watermark"],[data-page="vip-cover-art"],[data-page="vip-converter"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-resizer"],[data-page="vip-photo-video"],[data-page="photo-ai"]) .vip-stage-viewport::-webkit-scrollbar-track{background:rgba(255,255,255,.055);border-radius:999px}
body:is([data-page="vip-photo"],[data-page="vip-video"],[data-page="vip-watermark"],[data-page="vip-cover-art"],[data-page="vip-converter"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-resizer"],[data-page="vip-photo-video"],[data-page="photo-ai"]) .vip-stage-viewport::-webkit-scrollbar-thumb{background:rgba(212,175,85,.82);border-radius:999px;border:2px solid rgba(10,10,12,.72)}
body:is([data-page="vip-photo"],[data-page="vip-video"],[data-page="vip-watermark"],[data-page="vip-cover-art"],[data-page="vip-converter"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-resizer"],[data-page="vip-photo-video"],[data-page="photo-ai"]) .vip-stage-viewport::-webkit-scrollbar-thumb:hover{background:var(--gold)}

/* Photo + Video: the canvas keeps its true aspect. Portrait outputs may extend
   vertically and are scrolled in the media pane instead of moving the menu. */
body[data-page="vip-photo"] .vip-stage-viewport,
body[data-page="vip-video"] .vip-stage-viewport{
  place-items:start center!important;
  padding:8px!important;
}
body[data-page="vip-photo"] .vip-preview,
body[data-page="vip-video"] .vip-preview{
  width:100%!important;
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow:visible!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:center!important;
}
body[data-page="vip-photo"] #photoCanvas,
body[data-page="vip-video"] #vCanvas{
  flex:0 0 auto!important;
  max-width:100%!important;
  max-height:none!important;
  object-fit:contain!important;
}

/* Watermark: real image/video-derived canvas, independently scrollable. */
body[data-page="vip-watermark"] .vip-stage-viewport{
  place-items:start center!important;
  padding:8px!important;
}
body[data-page="vip-watermark"] .vip-preview{
  width:100%!important;
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow:visible!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:center!important;
}
body[data-page="vip-watermark"] #wmCanvas{
  display:block!important;
  width:min(100%,960px)!important;
  height:auto!important;
  max-width:100%!important;
  max-height:none!important;
  flex:0 0 auto!important;
}
body[data-page="vip-watermark"] .wm-video-transport{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
body[data-page="vip-watermark"] #wmVideoClock{margin-left:auto;font-variant-numeric:tabular-nums}
body[data-page="vip-watermark"] #wmVideoSeek{width:100%}

/* Cover Art: real canvas aspect + drag-friendly stage. */
body[data-page="vip-cover-art"] .vip-stage-viewport{
  place-items:start center!important;
  padding:8px!important;
}
body[data-page="vip-cover-art"] .vip-preview{
  width:100%!important;
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow:visible!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:center!important;
}
body[data-page="vip-cover-art"] #caCanvas{
  display:block!important;
  width:min(100%,980px)!important;
  height:auto!important;
  max-width:100%!important;
  max-height:none!important;
  flex:0 0 auto!important;
  cursor:grab!important;
}
body[data-page="vip-cover-art"] #caCanvas:active{cursor:grabbing!important}
body[data-page="vip-cover-art"] .cover-layer-list{display:grid;gap:5px}
body[data-page="vip-cover-art"] .cover-layer-btn{width:100%;text-align:left}

/* VIDEO STUDIO: preview first, transport directly below, timeline last. */
body[data-page="vip-video"] .video-editor-stage{
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  min-height:0!important;
}
body[data-page="vip-video"] .video-editor-stage>.vip-stage-viewport{order:1!important;flex:1 1 0!important;min-height:220px!important}
body[data-page="vip-video"] .video-editor-stage>.video-editor-toolbar{
  order:2!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  flex-wrap:wrap!important;
  width:100%!important;
  padding:7px 8px!important;
  margin:0!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:rgba(18,18,21,.88)!important;
}
body[data-page="vip-video"] .video-editor-stage>.video-timeline-panel{
  order:3!important;
  flex:0 0 auto!important;
  width:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:8px!important;
}
body[data-page="vip-video"] #vTimeline{
  display:block!important;
  width:100%!important;
  height:108px!important;
  min-height:88px!important;
  touch-action:none!important;
}
body[data-page="vip-video"] .video-current-time{margin-left:auto!important}
body[data-page="vip-video"] .video-timeline-head{align-items:end!important}
body[data-page="vip-video"] .video-timeline-head>div:first-child{display:grid!important;gap:3px!important}
body[data-page="vip-video"] #vSelectionReadout{display:block!important;color:var(--muted)!important;font-variant-numeric:tabular-nums!important}

/* Converter: one source type = one correct preview. Fix old !important image
   display rule so hidden media can never remain as a stale ghost. */
body[data-page="vip-converter"] #cImage.hidden,
body[data-page="vip-converter"] #cVideo.hidden,
body[data-page="vip-converter"] #cCanvas.hidden,
body[data-page="vip-converter"] #cAudioStage.hidden{display:none!important}
body[data-page="vip-converter"] .vip-stage-viewport{place-items:start center!important;padding:8px!important}
body[data-page="vip-converter"] .vip-preview{
  width:100%!important;
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow:visible!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
}
body[data-page="vip-converter"] #cImage:not(.hidden),
body[data-page="vip-converter"] #cVideo:not(.hidden),
body[data-page="vip-converter"] #cCanvas:not(.hidden){
  display:block!important;
  width:min(100%,980px)!important;
  height:auto!important;
  max-width:100%!important;
  max-height:none!important;
  object-fit:contain!important;
  flex:0 0 auto!important;
}
body[data-page="vip-converter"] .converter-audio-stage{
  width:min(100%,980px)!important;
  min-height:220px!important;
  display:grid!important;
  gap:12px!important;
  align-content:center!important;
  padding:14px!important;
  border:1px solid rgba(212,175,85,.28)!important;
  border-radius:12px!important;
  background:rgba(16,16,19,.82)!important;
}
body[data-page="vip-converter"] #cAudioWave{display:block!important;width:100%!important;height:auto!important;max-height:260px!important;border-radius:8px!important;background:#09090b!important}
body[data-page="vip-converter"] #cAudio{width:100%!important}
body[data-page="vip-converter"] #cAudioReadout{text-align:center!important;font-variant-numeric:tabular-nums!important}

/* Background Removal + Watermark Remover: functionality untouched; media pane
   alone receives independent scroll as requested. */
body[data-page="vip-background"] .vip-stage-column,
body[data-page="vip-remover"] .vip-stage-column{overflow:hidden!important}
body[data-page="vip-background"] .vip-stage-viewport,
body[data-page="vip-remover"] .vip-stage-viewport{
  overflow-x:auto!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-gutter:stable both-edges!important;
  place-items:start center!important;
}
body[data-page="vip-background"] .vip-preview,
body[data-page="vip-remover"] .vip-preview{
  max-height:none!important;
  overflow:visible!important;
}
body[data-page="vip-background"] #bgCanvas,
body[data-page="vip-remover"] #rmCanvas,
body[data-page="vip-remover"] #rmMaskCanvas{
  max-height:none!important;
}

/* Resizer / Photo-video also inherit the same media-scroll rule without
   altering their controls. */
body[data-page="vip-resizer"] .vip-stage-viewport,
body[data-page="vip-photo-video"] .vip-stage-viewport{
  overflow-x:auto!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-gutter:stable both-edges!important;
}

@media(max-width:820px){
  body[data-page="vip-photo"].vip-tool-page .vip-stage-viewport,
  body[data-page="vip-video"].vip-tool-page .vip-stage-viewport{
    overflow-x:auto!important;
    overflow-y:auto!important;
    place-items:start center!important;
  }
  body[data-page="vip-photo"].vip-tool-page .vip-preview,
  body[data-page="vip-video"].vip-tool-page .vip-preview{
    height:auto!important;
    min-height:100%!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body[data-page="vip-photo"].vip-tool-page #photoCanvas,
  body[data-page="vip-video"].vip-tool-page #vCanvas{
    max-height:none!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.vip-stage-viewport{min-height:150px!important}
  body[data-page="vip-video"] .video-editor-stage>.video-editor-toolbar{
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    padding:5px!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.video-editor-toolbar .btn{flex:0 0 auto!important}
  body[data-page="vip-video"] #vTimeline{height:72px!important;min-height:64px!important}
  body[data-page="vip-watermark"] .vip-stage-viewport,
  body[data-page="vip-cover-art"] .vip-stage-viewport,
  body[data-page="vip-converter"] .vip-stage-viewport,
  body[data-page="vip-background"] .vip-stage-viewport,
  body[data-page="vip-remover"] .vip-stage-viewport{
    overflow-x:auto!important;
    overflow-y:auto!important;
  }
}

/* V5.3.91 — PHOTO AI: real subject-aware reframe, no background filler UI. */
body[data-page="photo-ai"].vip-tool-page .vip-controls{
  overflow-y:scroll!important;
  scrollbar-gutter:stable!important;
  scrollbar-width:auto!important;
  scrollbar-color:var(--gold) rgba(255,255,255,.08)!important;
}
body[data-page="photo-ai"].vip-tool-page .vip-controls::-webkit-scrollbar{width:14px!important}
body[data-page="photo-ai"].vip-tool-page .vip-controls::-webkit-scrollbar-track{background:rgba(255,255,255,.08)!important;border-radius:8px!important}
body[data-page="photo-ai"].vip-tool-page .vip-controls::-webkit-scrollbar-thumb{background:var(--gold)!important;border-radius:8px!important;border:3px solid #111216!important}
body[data-page="photo-ai"] .vip-stage-viewport{display:grid!important;place-items:center!important;padding:10px!important}
body[data-page="photo-ai"] .pai-preview{background:#08090b!important;background-image:none!important;min-height:100%!important;width:100%!important;overflow:hidden!important}
body[data-page="photo-ai"] .pai-preview>img{width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important}
body[data-page="photo-ai"] .pai-preview>canvas{display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;background:#000!important}
body[data-page="photo-ai"] .pai-preview>canvas.hidden,
body[data-page="photo-ai"] .pai-preview>img.hidden{display:none!important}


/* ========================================================================== */
/* V5.3.92 — FINAL MEDIA VIEWPORT CORRECTION                                  */
/* No oversized empty preview shells. Media uses the available editor area.   */
/* Right properties pane and remover media panes keep an explicit scrollbar.  */
/* ========================================================================== */

/* VIDEO STUDIO — shrink the shell to the actual visible video frame. */
body[data-page="vip-video"].vip-tool-page .video-editor-stage>.vip-stage-viewport{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  place-items:unset!important;
  min-height:0!important;
  overflow:hidden!important;
  padding:4px!important;
  background:#07080a!important;
}
body[data-page="vip-video"].vip-tool-page .video-preview-shell{
  min-height:0!important;
  max-height:100%!important;
  max-width:100%!important;
}
body[data-page="vip-video"].vip-tool-page .video-preview-shell.has-media{
  flex:0 0 auto!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  display:block!important;
  background:#000!important;
  border:1px solid rgba(212,175,85,.42)!important;
  border-radius:10px!important;
}
body[data-page="vip-video"].vip-tool-page .video-preview-shell.has-media #vCanvas{
  display:block!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  object-fit:contain!important;
}
body[data-page="vip-video"].vip-tool-page .video-preview-shell.has-media #vPreviewStatus{
  position:absolute!important;
  left:8px!important;
  bottom:8px!important;
}

/* Photo AI — source/result fills its real target frame; no artificial black
   spacer shell around a landscape source when target is square/portrait. */
body[data-page="photo-ai"].vip-tool-page .vip-stage-viewport{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  place-items:unset!important;
  min-height:0!important;
  overflow:hidden!important;
  padding:4px!important;
}
body[data-page="photo-ai"].vip-tool-page .pai-preview{
  width:fit-content!important;
  height:fit-content!important;
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  max-height:100%!important;
  display:grid!important;
  place-items:center!important;
  background:#08090b!important;
  overflow:hidden!important;
}
body[data-page="photo-ai"].vip-tool-page .pai-preview>img:not(.hidden),
body[data-page="photo-ai"].vip-tool-page .pai-preview>canvas:not(.hidden){
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  margin:0!important;
  object-fit:contain!important;
}

/* Explicit independent scrollbars requested for Background Removal and
   Watermark Remover. This changes layout only; processing engines untouched. */
body[data-page="vip-background"].vip-tool-page .vip-controls,
body[data-page="vip-remover"].vip-tool-page .vip-controls{
  overflow-y:scroll!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable!important;
  scrollbar-width:auto!important;
  scrollbar-color:var(--gold) rgba(255,255,255,.08)!important;
}
body[data-page="vip-background"].vip-tool-page .vip-controls::-webkit-scrollbar,
body[data-page="vip-remover"].vip-tool-page .vip-controls::-webkit-scrollbar,
body[data-page="vip-background"].vip-tool-page .vip-stage-viewport::-webkit-scrollbar,
body[data-page="vip-remover"].vip-tool-page .vip-stage-viewport::-webkit-scrollbar{
  width:14px!important;
  height:14px!important;
}
body[data-page="vip-background"].vip-tool-page .vip-controls::-webkit-scrollbar-track,
body[data-page="vip-remover"].vip-tool-page .vip-controls::-webkit-scrollbar-track,
body[data-page="vip-background"].vip-tool-page .vip-stage-viewport::-webkit-scrollbar-track,
body[data-page="vip-remover"].vip-tool-page .vip-stage-viewport::-webkit-scrollbar-track{
  background:rgba(255,255,255,.08)!important;
  border-radius:8px!important;
}
body[data-page="vip-background"].vip-tool-page .vip-controls::-webkit-scrollbar-thumb,
body[data-page="vip-remover"].vip-tool-page .vip-controls::-webkit-scrollbar-thumb,
body[data-page="vip-background"].vip-tool-page .vip-stage-viewport::-webkit-scrollbar-thumb,
body[data-page="vip-remover"].vip-tool-page .vip-stage-viewport::-webkit-scrollbar-thumb{
  background:var(--gold)!important;
  border-radius:8px!important;
  border:3px solid #111216!important;
}

/* Keep Video Studio useful on phones too: media left, controls right, but the
   video shell itself never consumes empty height. */
@media(max-width:820px){
  body[data-page="vip-video"].vip-tool-page .video-editor-stage>.vip-stage-viewport{
    min-height:0!important;
    padding:2px!important;
  }
  body[data-page="vip-video"].vip-tool-page .video-preview-shell.has-media{
    max-width:100%!important;
    max-height:100%!important;
  }
}

/* V5.3.93 — Photo AI: 1:1 only, no oversized empty preview frame. */
body[data-page="photo-ai"].vip-tool-page .vip-stage-viewport{
  padding:6px!important;
  overflow:auto!important;
  align-items:center!important;
  justify-items:center!important;
}
body[data-page="photo-ai"].vip-tool-page .pai-preview{
  min-width:0!important;
  min-height:0!important;
  margin:auto!important;
  border:0!important;
  box-shadow:none!important;
}
body[data-page="photo-ai"].vip-tool-page .pai-preview.source-mode{
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  aspect-ratio:auto!important;
  background:transparent!important;
  overflow:visible!important;
}
body[data-page="photo-ai"].vip-tool-page .pai-preview.source-mode>img:not(.hidden){
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:min(68dvh,720px)!important;
  object-fit:contain!important;
  margin:auto!important;
}
body[data-page="photo-ai"].vip-tool-page .pai-preview.result-mode{
  width:min(100%,min(68dvh,720px))!important;
  height:auto!important;
  aspect-ratio:1/1!important;
  max-width:720px!important;
  max-height:720px!important;
  background:#08090b!important;
  overflow:hidden!important;
}
body[data-page="photo-ai"].vip-tool-page .pai-preview.result-mode>canvas:not(.hidden){
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  background:transparent!important;
}
body[data-page="photo-ai"].vip-tool-page .vip-preview-status{
  position:absolute!important;
  left:8px!important;
  bottom:8px!important;
}
@media(max-width:820px){
  body[data-page="photo-ai"].vip-tool-page .pai-preview.result-mode{
    width:min(100%,56dvh)!important;
  }
  body[data-page="photo-ai"].vip-tool-page .pai-preview.source-mode>img:not(.hidden){
    max-height:56dvh!important;
  }
}


/* ========================================================================== */
/* V5.3.94 — PHASE 1 LOCKED PREVIEW CORE                                     */
/* One fixed visual preview window. Media changes ratio INSIDE the window.     */
/* CSS preview size NEVER changes real canvas/export pixel dimensions.         */
/* ========================================================================== */

body.vip-tool-page{
  --elviano-preview-box:clamp(300px,52dvh,460px);
}

/* Visual Studio pages that use the common media preview contract. */
body:is(
  [data-page="vip-photo"],
  [data-page="photo-ai"],
  [data-page="vip-video"],
  [data-page="vip-watermark"],
  [data-page="vip-cover-art"],
  [data-page="vip-converter"],
  [data-page="vip-background"],
  [data-page="vip-remover"],
  [data-page="vip-resizer"],
  [data-page="vip-photo-video"]
).vip-tool-page .vip-stage-column{
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
}

body:is(
  [data-page="vip-photo"],
  [data-page="photo-ai"],
  [data-page="vip-video"],
  [data-page="vip-watermark"],
  [data-page="vip-cover-art"],
  [data-page="vip-converter"],
  [data-page="vip-background"],
  [data-page="vip-remover"],
  [data-page="vip-resizer"],
  [data-page="vip-photo-video"]
).vip-tool-page .vip-stage-viewport{
  flex:1 1 0!important;
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  max-height:100%!important;
  padding:8px!important;
  margin:0!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
  align-items:center!important;
  justify-items:center!important;
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}

/* This is the window the user approved. It stays square and never follows
   1080/1920/3000 export dimensions. Only the media inside changes ratio. */
body:is(
  [data-page="vip-photo"],
  [data-page="photo-ai"],
  [data-page="vip-video"],
  [data-page="vip-watermark"],
  [data-page="vip-cover-art"],
  [data-page="vip-converter"],
  [data-page="vip-background"],
  [data-page="vip-remover"],
  [data-page="vip-resizer"],
  [data-page="vip-photo-video"]
).vip-tool-page .vip-preview{
  position:relative!important;
  flex:0 0 auto!important;
  width:min(100%,var(--elviano-preview-box))!important;
  height:auto!important;
  aspect-ratio:1 / 1!important;
  min-width:0!important;
  min-height:0!important;
  max-width:var(--elviano-preview-box)!important;
  max-height:var(--elviano-preview-box)!important;
  margin:auto!important;
  padding:0!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
  border:2px solid rgba(212,175,85,.78)!important;
  border-radius:10px!important;
  outline:0!important;
  background-color:#0b0c0f!important;
  background-image:
    linear-gradient(45deg,#15161a 25%,transparent 25%),
    linear-gradient(-45deg,#15161a 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#15161a 75%),
    linear-gradient(-45deg,transparent 75%,#15161a 75%)!important;
  background-size:18px 18px!important;
  background-position:0 0,0 9px,9px -9px,-9px 0!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.75) inset!important;
}

/* Real media ratio is visible INSIDE the fixed square window.
   1:1 fills square, 16:9 is landscape, 9:16 is portrait. Never stretch. */
body:is(
  [data-page="vip-photo"],
  [data-page="photo-ai"],
  [data-page="vip-video"],
  [data-page="vip-watermark"],
  [data-page="vip-cover-art"],
  [data-page="vip-converter"],
  [data-page="vip-background"],
  [data-page="vip-resizer"],
  [data-page="vip-photo-video"]
).vip-tool-page .vip-preview > canvas:not(.hidden):not(.vip-hidden-media):not(.vip-mask-canvas),
body:is(
  [data-page="vip-photo"],
  [data-page="photo-ai"],
  [data-page="vip-video"],
  [data-page="vip-watermark"],
  [data-page="vip-cover-art"],
  [data-page="vip-converter"],
  [data-page="vip-background"],
  [data-page="vip-remover"],
  [data-page="vip-resizer"],
  [data-page="vip-photo-video"]
).vip-tool-page .vip-preview > img:not(.hidden):not(.vip-hidden-media),
body:is(
  [data-page="vip-photo"],
  [data-page="photo-ai"],
  [data-page="vip-video"],
  [data-page="vip-watermark"],
  [data-page="vip-cover-art"],
  [data-page="vip-converter"],
  [data-page="vip-background"],
  [data-page="vip-remover"],
  [data-page="vip-resizer"],
  [data-page="vip-photo-video"]
).vip-tool-page .vip-preview > video:not(.hidden):not(.vip-hidden-media){
  position:relative!important;
  inset:auto!important;
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:auto!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none;
}

/* Photo AI Source and Result use exactly the same approved outer window. */
body[data-page="photo-ai"].vip-tool-page .pai-preview,
body[data-page="photo-ai"].vip-tool-page .pai-preview.source-mode,
body[data-page="photo-ai"].vip-tool-page .pai-preview.result-mode{
  width:min(100%,var(--elviano-preview-box))!important;
  height:auto!important;
  aspect-ratio:1/1!important;
  max-width:var(--elviano-preview-box)!important;
  max-height:var(--elviano-preview-box)!important;
  min-width:0!important;
  min-height:0!important;
  margin:auto!important;
  overflow:hidden!important;
  border:2px solid rgba(212,175,85,.78)!important;
  border-radius:10px!important;
  background-color:#0b0c0f!important;
  background-image:
    linear-gradient(45deg,#15161a 25%,transparent 25%),
    linear-gradient(-45deg,#15161a 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#15161a 75%),
    linear-gradient(-45deg,transparent 75%,#15161a 75%)!important;
  background-size:18px 18px!important;
  background-position:0 0,0 9px,9px -9px,-9px 0!important;
}
body[data-page="photo-ai"].vip-tool-page .pai-preview>img:not(.hidden),
body[data-page="photo-ai"].vip-tool-page .pai-preview>canvas:not(.hidden){
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  margin:auto!important;
  background:transparent!important;
}

/* Watermark Remover uses two perfectly aligned canvases inside the same frame. */
body[data-page="vip-remover"].vip-tool-page .vip-remover-stage{
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-remover"].vip-tool-page .vip-remover-stage>canvas{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  margin:0!important;
  transform:translate(-50%,-50%)!important;
  object-fit:contain!important;
}

/* Keep toolbar/timeline aligned to the same fixed preview width. */
body:is(
  [data-page="vip-photo"],
  [data-page="photo-ai"],
  [data-page="vip-video"],
  [data-page="vip-watermark"],
  [data-page="vip-cover-art"],
  [data-page="vip-converter"],
  [data-page="vip-background"],
  [data-page="vip-remover"],
  [data-page="vip-resizer"],
  [data-page="vip-photo-video"]
).vip-tool-page .vip-editor-toolbar,
body[data-page="vip-video"].vip-tool-page .video-timeline-panel{
  width:min(100%,var(--elviano-preview-box))!important;
  max-width:var(--elviano-preview-box)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Output/status label remains inside the approved preview window. */
body:is(
  [data-page="vip-photo"],
  [data-page="photo-ai"],
  [data-page="vip-video"],
  [data-page="vip-watermark"],
  [data-page="vip-cover-art"],
  [data-page="vip-converter"],
  [data-page="vip-background"],
  [data-page="vip-remover"],
  [data-page="vip-resizer"],
  [data-page="vip-photo-video"]
).vip-tool-page .vip-preview-status{
  position:absolute!important;
  left:8px!important;
  bottom:8px!important;
  z-index:8!important;
  max-width:calc(100% - 16px)!important;
}

@media(max-width:820px){
  body.vip-tool-page{--elviano-preview-box:min(300px,40vw,34dvh);}
  body:is(
    [data-page="vip-photo"],
    [data-page="photo-ai"],
    [data-page="vip-video"],
    [data-page="vip-watermark"],
    [data-page="vip-cover-art"],
    [data-page="vip-converter"],
    [data-page="vip-background"],
    [data-page="vip-remover"],
    [data-page="vip-resizer"],
    [data-page="vip-photo-video"]
  ).vip-tool-page .vip-stage-viewport{padding:4px!important;}
}


/* ========================================================================== */
/* V5.3.96 — MASS STUDIO CORRECTION                                           */
/* LOCKED: the approved outer preview frame from V5.3.94 is NOT resized.       */
/* ========================================================================== */
body[data-page="vip-cover-art"] #caText{min-height:74px!important;resize:vertical!important;cursor:text!important;pointer-events:auto!important;user-select:text!important;-webkit-user-select:text!important;opacity:1!important;}
body[data-page="vip-cover-art"] .cover-layer-btn{cursor:pointer!important;}
body[data-page="vip-cover-art"] #caCanvas,
body[data-page="vip-photo"] #photoCanvas,
body[data-page="vip-video"] #vCanvas,
body[data-page="vip-converter"] #cCanvas{image-rendering:auto!important;}

/* ========================================================================== */
/* V5.3.97 — DEFINITIVE STUDIO VIEWPORT / TOOLBAR FIXES                       */
/* Keep the approved fixed preview concept, but never let container height     */
/* collapse the media into a thumbnail or hide editor controls.                */
/* ========================================================================== */

/* AI is no longer part of the normal ratio/resize workflow. The dedicated
   Photo AI tool remains available separately. Keep the DOM hooks present for
   compatibility, but remove these controls from conversion panels. */
body[data-page="vip-photo"] #photoAiExpand,
body[data-page="vip-photo"] #photoAiProgress,
body[data-page="vip-photo"] #photoAiStatus,
body[data-page="vip-cover-art"] #caAiExpand,
body[data-page="vip-cover-art"] #caAiProgress,
body[data-page="vip-cover-art"] #caAiStatus,
body[data-page="vip-converter"] #cAiExpand,
body[data-page="vip-converter"] #cAiProgress,
body[data-page="vip-converter"] #cAiStatus{display:none!important}

/* VIDEO STUDIO — the outer preview is a real fixed editor window. A portrait
   source fills its height, landscape fills its width, square fills both. */
body[data-page="vip-video"] .video-editor-stage{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  align-items:center!important;
}
body[data-page="vip-video"] .vip-stage-viewport{
  flex:0 0 auto!important;
  width:100%!important;
  min-height:0!important;
  height:auto!important;
  padding:6px!important;
  overflow:visible!important;
  container-type:normal!important;
}
body[data-page="vip-video"] .video-preview-shell,
body[data-page="vip-video"] .vip-preview,
body[data-page="vip-video"] .vip-preview.checker{
  width:min(380px,100%)!important;
  height:auto!important;
  max-width:380px!important;
  max-height:none!important;
  aspect-ratio:1/1!important;
  margin:0 auto!important;
  padding:0!important;
  border:2px solid rgba(212,175,85,.78)!important;
  border-radius:10px!important;
  background-color:#0b0c0f!important;
  background-image:
    linear-gradient(45deg,#15161a 25%,transparent 25%),
    linear-gradient(-45deg,#15161a 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#15161a 75%),
    linear-gradient(-45deg,transparent 75%,#15161a 75%)!important;
  background-size:18px 18px!important;
  background-position:0 0,0 9px,9px -9px,-9px 0!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.75) inset!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-video"] #vCanvas{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center!important;
}
body[data-page="vip-video"] .video-timeline-panel{
  width:min(620px,100%)!important;
  max-width:620px!important;
  margin:8px auto 8px!important;
}
body[data-page="vip-video"] .video-editor-toolbar{
  width:min(620px,100%)!important;
  max-width:620px!important;
  overflow:visible!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
}

/* VIDEO COMPOSER — compact approved preview window so the timeline and lower
   controls stay visible. The canvas keeps its own 16:9 / 9:16 / 1:1 shape. */
body[data-page="vip-photo-video"] .vip-stage-column{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  align-items:center!important;
}
body[data-page="vip-photo-video"] .vip-stage-viewport{
  flex:0 0 auto!important;
  width:100%!important;
  min-height:0!important;
  height:auto!important;
  padding:5px!important;
  overflow:visible!important;
  container-type:normal!important;
}
body[data-page="vip-photo-video"] .vip-preview,
body[data-page="vip-photo-video"] .vip-preview.checker{
  width:min(380px,100%)!important;
  height:auto!important;
  max-width:380px!important;
  max-height:none!important;
  aspect-ratio:1/1!important;
  margin:0 auto!important;
  padding:0!important;
  border:2px solid rgba(212,175,85,.78)!important;
  border-radius:10px!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-photo-video"] #pvCanvas{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center!important;
}
body[data-page="vip-photo-video"] .pv-timeline-panel{
  width:min(760px,100%)!important;
  max-width:760px!important;
  max-height:190px!important;
  margin:6px auto 8px!important;
}

/* BACKGROUND REMOVAL — never collapse to a postage-stamp preview. */
body[data-page="vip-background"] .vip-stage-column{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  align-items:center!important;
}
body[data-page="vip-background"] .vip-editor-toolbar{
  width:min(520px,100%)!important;
  max-width:520px!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  overflow:visible!important;
}
body[data-page="vip-background"] .vip-stage-viewport{
  flex:0 0 auto!important;
  width:100%!important;
  min-height:0!important;
  height:auto!important;
  padding:6px!important;
  overflow:visible!important;
  container-type:normal!important;
}
body[data-page="vip-background"] .vip-preview{
  width:min(480px,100%)!important;
  height:auto!important;
  max-width:480px!important;
  max-height:none!important;
  aspect-ratio:1/1!important;
  margin:0 auto!important;
  border:2px solid rgba(212,175,85,.78)!important;
  border-radius:10px!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-background"] #bgCanvas{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  margin:auto!important;
  object-fit:contain!important;
}

/* WATERMARK REMOVER — tools live OUTSIDE the preview, stay visible, and wrap.
   The preview itself is a normal fixed editor window. */
body[data-page="vip-remover"] .page-heading{margin-bottom:6px!important}
body[data-page="vip-remover"] .page-heading h1{margin-bottom:2px!important}
body[data-page="vip-remover"] .vip-stage-column{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  align-items:center!important;
  padding-right:10px!important;
}
body[data-page="vip-remover"] .vip-editor-toolbar,
body[data-page="vip-remover"] .vip-editor-toolbar.vip-preview-tabs{
  width:min(900px,100%)!important;
  max-width:900px!important;
  min-width:0!important;
  margin:0 auto 8px!important;
  padding:0!important;
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  align-items:center!important;
  gap:6px!important;
  overflow:visible!important;
  white-space:normal!important;
}
body[data-page="vip-remover"] .vip-editor-toolbar .btn{
  flex:0 0 auto!important;
  min-width:0!important;
  max-width:100%!important;
}
body[data-page="vip-remover"] .vip-stage-viewport{
  flex:0 0 auto!important;
  width:100%!important;
  min-height:0!important;
  height:auto!important;
  padding:5px!important;
  overflow:visible!important;
  container-type:normal!important;
}
body[data-page="vip-remover"] .vip-remover-stage,
body[data-page="vip-remover"] .vip-preview{
  width:min(480px,100%)!important;
  height:auto!important;
  max-width:480px!important;
  max-height:none!important;
  aspect-ratio:1/1!important;
  margin:0 auto!important;
  border:2px solid rgba(212,175,85,.78)!important;
  border-radius:10px!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-remover"] .vip-remover-stage>canvas{
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  margin:auto!important;
  object-fit:contain!important;
}

/* Audio level panel status */
.audio-level-state{display:grid;gap:2px;margin-top:4px;color:var(--muted);font-size:11px;line-height:1.35}
.audio-level-state strong{color:var(--gold)}

@media(max-width:820px){
  body[data-page="vip-video"] .video-preview-shell,
  body[data-page="vip-video"] .vip-preview,
  body[data-page="vip-photo-video"] .vip-preview,
  body[data-page="vip-background"] .vip-preview,
  body[data-page="vip-remover"] .vip-preview{
    width:min(300px,100%)!important;
    max-width:300px!important;
  }
  body[data-page="vip-photo-video"] .pv-timeline-panel,
  body[data-page="vip-video"] .video-timeline-panel{width:100%!important;max-width:100%!important}
  body[data-page="vip-remover"] .vip-editor-toolbar{justify-content:flex-start!important}
}


/* ========================================================================== */
/* V5.3.98 — SOCIAL RESIZER LOCKED OUTER FRAME + STICKER-EXACT RATIO ENGINE   */
/* The OUTER preview never changes. Only the inner media surface changes       */
/* 1:1 / 16:9 / 9:16, exactly like the Sticker exact W×H behavior.             */
/* ========================================================================== */
body[data-page="vip-resizer"].vip-tool-page{
  --resizer-fixed-frame:min(460px,52dvh,46vw);
}
body[data-page="vip-resizer"].vip-tool-page .vip-stage-viewport{
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
  padding:8px!important;
}
body[data-page="vip-resizer"].vip-tool-page .vip-preview.resizer-fixed-frame{
  position:relative!important;
  width:var(--resizer-fixed-frame)!important;
  height:var(--resizer-fixed-frame)!important;
  min-width:var(--resizer-fixed-frame)!important;
  min-height:var(--resizer-fixed-frame)!important;
  max-width:var(--resizer-fixed-frame)!important;
  max-height:var(--resizer-fixed-frame)!important;
  aspect-ratio:1/1!important;
  flex:0 0 var(--resizer-fixed-frame)!important;
  margin:auto!important;
  padding:0!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
  border:2px solid rgba(212,175,85,.78)!important;
  border-radius:10px!important;
  background-color:#0b0c0f!important;
  background-image:
    linear-gradient(45deg,#15161a 25%,transparent 25%),
    linear-gradient(-45deg,#15161a 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#15161a 75%),
    linear-gradient(-45deg,transparent 75%,#15161a 75%)!important;
  background-size:18px 18px!important;
  background-position:0 0,0 9px,9px -9px,-9px 0!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.75) inset!important;
}
body[data-page="vip-resizer"] .resizer-display-surface{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:auto!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
body[data-page="vip-resizer"] .resizer-display-surface>#rImage,
body[data-page="vip-resizer"] .resizer-display-surface>#rVideo,
body[data-page="vip-resizer"] .resizer-display-surface>#rCanvas{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  object-fit:fill!important;
  object-position:center!important;
  background:transparent!important;
}
body[data-page="vip-resizer"] .resizer-display-surface>#rImage.hidden,
body[data-page="vip-resizer"] .resizer-display-surface>#rVideo.hidden,
body[data-page="vip-resizer"] .resizer-display-surface>#rCanvas.hidden,
body[data-page="vip-resizer"] .resizer-display-surface>#rEmpty.hidden{display:none!important}
body[data-page="vip-resizer"] .resizer-display-surface>#rEmpty{
  position:absolute!important;
  inset:0!important;
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-resizer"] .vip-preview-status{
  position:static!important;
  width:max-content!important;
  max-width:100%!important;
  margin:4px auto 6px!important;
}
body[data-page="vip-resizer"] .vip-preview-status.hidden{display:none!important}
@media(max-width:820px){
  body[data-page="vip-resizer"].vip-tool-page{--resizer-fixed-frame:min(300px,78vw,38dvh);}
}

/* ========================================================================== */
/* V5.3.99 — FINAL STUDIO COMPLETE FIX                                         */
/* Compact headings, full Video Studio preview, sane Composer frame,           */
/* normal-size cleanup previews, wrapped Watermark tools, real Audio DSP UI.   */
/* ========================================================================== */

/* Keep tool headings compact so the actual media workspace gets the screen. */
body:is([data-page="vip-video"],[data-page="vip-photo-video"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-audio"]) .page-heading{
  margin:0 0 6px!important;
  min-height:0!important;
  align-items:flex-start!important;
}
body:is([data-page="vip-video"],[data-page="vip-photo-video"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-audio"]) .page-heading .vip-kicker{
  font-size:10px!important;
  letter-spacing:3px!important;
  line-height:1.15!important;
}
body:is([data-page="vip-video"],[data-page="vip-photo-video"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-audio"]) .page-heading h1{
  font-size:clamp(24px,2.25vw,34px)!important;
  line-height:1.02!important;
  margin:3px 0 2px!important;
}
body:is([data-page="vip-video"],[data-page="vip-photo-video"],[data-page="vip-background"],[data-page="vip-remover"],[data-page="vip-audio"]) .page-heading p{
  font-size:12px!important;
  line-height:1.25!important;
  margin:0!important;
  max-width:980px!important;
}

/* VIDEO STUDIO: the LEFT editor is the media workspace. The preview fills it. */
@media(min-width:821px){
  body[data-page="vip-video"].vip-tool-page .vip-workspace{
    grid-template-columns:minmax(0,1fr) minmax(350px,420px)!important;
    gap:12px!important;
  }
  body[data-page="vip-video"] .video-editor-stage{
    align-items:stretch!important;
    overflow:hidden!important;
    gap:6px!important;
    padding:0!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.vip-stage-viewport{
    order:1!important;
    flex:1 1 0!important;
    width:100%!important;
    min-width:0!important;
    min-height:300px!important;
    height:auto!important;
    max-height:none!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    container-type:normal!important;
  }
  body[data-page="vip-video"] .video-preview-shell,
  body[data-page="vip-video"] .vip-preview,
  body[data-page="vip-video"] .vip-preview.checker{
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    margin:0!important;
    padding:0!important;
    border:1px solid rgba(212,175,85,.72)!important;
    border-radius:10px!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    background-color:#08090b!important;
    background-image:none!important;
  }
  body[data-page="vip-video"] .video-preview-shell.has-media{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
  }
  body[data-page="vip-video"] #vCanvas,
  body[data-page="vip-video"] .video-preview-shell.has-media #vCanvas{
    display:block!important;
    max-width:100%!important;
    max-height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:auto!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.video-editor-toolbar,
  body[data-page="vip-video"] .video-editor-toolbar{
    order:2!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:6px 8px!important;
    justify-content:flex-start!important;
    overflow:visible!important;
    flex-wrap:wrap!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.video-timeline-panel,
  body[data-page="vip-video"] .video-timeline-panel{
    order:3!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:7px!important;
    flex:0 0 auto!important;
  }
  body[data-page="vip-video"] #vTimeline{
    height:96px!important;
    min-height:82px!important;
    margin:5px 0!important;
  }
}

/* Video on phones/tablets must fill the entire preview pane, never become a stamp. */
@media(max-width:820px){
  body[data-page="vip-video"] .video-preview-shell,
  body[data-page="vip-video"] .vip-preview,
  body[data-page="vip-video"] .vip-preview.checker{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
  }
}

/* VIDEO COMPOSER: useful preview, but never so tall that transport/timeline vanish. */
@media(min-width:821px){
  body[data-page="vip-photo-video"].vip-tool-page .vip-workspace{
    grid-template-columns:minmax(0,1fr) minmax(360px,440px)!important;
    gap:12px!important;
  }
  body[data-page="vip-photo-video"] .vip-stage-column{
    align-items:stretch!important;
    overflow:hidden!important;
    gap:6px!important;
  }
  body[data-page="vip-photo-video"] .vip-stage-viewport{
    flex:0 0 clamp(280px,38dvh,430px)!important;
    width:100%!important;
    min-width:0!important;
    min-height:280px!important;
    height:clamp(280px,38dvh,430px)!important;
    max-height:430px!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    container-type:normal!important;
  }
  body[data-page="vip-photo-video"] .vip-preview,
  body[data-page="vip-photo-video"] .vip-preview.checker{
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    margin:0!important;
    border:1px solid rgba(212,175,85,.72)!important;
    border-radius:10px!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    background:#08090b!important;
  }
  body[data-page="vip-photo-video"] #pvCanvas{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:auto!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  body[data-page="vip-photo-video"] .pv-timeline-panel{
    width:100%!important;
    max-width:none!important;
    min-height:180px!important;
    max-height:220px!important;
    margin:0!important;
    flex:0 0 auto!important;
  }
}

/* BACKGROUND REMOVAL + WATERMARK REMOVER: real, visible fixed editor window. */
body[data-page="vip-background"],
body[data-page="vip-remover"]{
  --cleanup-preview-frame:clamp(380px,min(46vw,54dvh),600px);
}
body[data-page="vip-background"] .vip-stage-column,
body[data-page="vip-remover"] .vip-stage-column{
  align-items:center!important;
  overflow:hidden!important;
}
body[data-page="vip-background"] .vip-stage-viewport,
body[data-page="vip-remover"] .vip-stage-viewport{
  flex:1 1 0!important;
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  padding:6px!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
  container-type:normal!important;
}
body[data-page="vip-background"] .vip-preview,
body[data-page="vip-remover"] .vip-remover-stage,
body[data-page="vip-remover"] .vip-preview{
  width:var(--cleanup-preview-frame)!important;
  height:var(--cleanup-preview-frame)!important;
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  max-height:100%!important;
  aspect-ratio:1/1!important;
  margin:auto!important;
  border:2px solid rgba(212,175,85,.78)!important;
  border-radius:10px!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
body[data-page="vip-background"] #bgCanvas,
body[data-page="vip-remover"] .vip-remover-stage>canvas{
  display:block!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:auto!important;
  object-fit:contain!important;
}

/* Watermark tools are a toolbar, not a horizontal scroll strip. */
body[data-page="vip-remover"] .vip-editor-toolbar,
body[data-page="vip-remover"] .vip-editor-toolbar.vip-preview-tabs{
  flex:0 0 auto!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0 0 6px!important;
  padding:0!important;
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  align-items:center!important;
  gap:6px!important;
  overflow:visible!important;
  white-space:normal!important;
  scrollbar-width:none!important;
}
body[data-page="vip-remover"] .vip-editor-toolbar::-webkit-scrollbar{display:none!important}
body[data-page="vip-remover"] .vip-editor-toolbar .btn{
  flex:0 0 auto!important;
  min-width:0!important;
  white-space:nowrap!important;
}

/* Audio professional cleanup controls. */
body[data-page="vip-audio"] .audio-clean-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
body[data-page="vip-audio"] .audio-clean-grid>label{
  min-width:0;
}
body[data-page="vip-audio"] .audio-preset-actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
body[data-page="vip-audio"] .audio-preset-actions .btn{
  flex:1 1 120px;
}
body[data-page="vip-audio"] .audio-dsp-note{
  font-size:11px;
  color:var(--muted);
  line-height:1.35;
}
@media(max-width:820px){
  body[data-page="vip-background"],body[data-page="vip-remover"]{--cleanup-preview-frame:min(300px,100%)}
  body[data-page="vip-remover"] .vip-editor-toolbar{justify-content:flex-start!important}
  body[data-page="vip-audio"] .audio-clean-grid{grid-template-columns:1fr}
}

/* ========================================================================== */
/* V5.3.99 FINAL VIDEO WORKSPACE LOCK                                         */
/* User requirement: compact page chrome, FULL left video preview.            */
/* The outer video preview does not follow export ratio; media ratio changes   */
/* inside it. Landscape fills the width, portrait/square fill the height.      */
/* ========================================================================== */
body[data-page="vip-video"] .page-heading{
  margin:0 0 4px!important;
}
body[data-page="vip-video"] .page-heading .vip-kicker{
  font-size:9px!important;
  letter-spacing:2.5px!important;
}
body[data-page="vip-video"] .page-heading h1{
  font-size:clamp(21px,1.65vw,27px)!important;
  line-height:1!important;
  margin:2px 0!important;
}
body[data-page="vip-video"] .page-heading p{
  font-size:11px!important;
  line-height:1.18!important;
  margin:0!important;
  max-width:1050px!important;
}
@media(min-width:821px){
  body[data-page="vip-video"] .video-editor-stage{
    align-items:stretch!important;
    justify-content:flex-start!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:0 4px 2px 0!important;
    gap:6px!important;
    scrollbar-gutter:stable!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.vip-stage-viewport{
    flex:0 0 auto!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
    display:block!important;
  }
  body[data-page="vip-video"] .video-preview-shell,
  body[data-page="vip-video"] .vip-preview,
  body[data-page="vip-video"] .vip-preview.checker,
  body[data-page="vip-video"] .video-preview-shell.has-media{
    box-sizing:border-box!important;
    width:100%!important;
    height:auto!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:16 / 9!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    border:1px solid rgba(212,175,85,.78)!important;
    border-radius:10px!important;
    background:#08090b!important;
    background-image:none!important;
  }
  body[data-page="vip-video"] #vCanvas,
  body[data-page="vip-video"] .video-preview-shell.has-media #vCanvas{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:auto!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  body[data-page="vip-video"] .video-editor-toolbar,
  body[data-page="vip-video"] .video-timeline-panel{
    flex:0 0 auto!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
  }
  body[data-page="vip-video"] .video-editor-toolbar{
    padding:5px 7px!important;
    gap:5px!important;
  }
  body[data-page="vip-video"] .video-editor-toolbar .btn{
    padding:7px 11px!important;
    font-size:12px!important;
  }
  body[data-page="vip-video"] .video-timeline-panel{
    padding:6px!important;
  }
  body[data-page="vip-video"] #vTimeline{
    height:82px!important;
    min-height:72px!important;
    margin:3px 0!important;
  }
}

/* ========================================================================== */
/* V5.3.100 — VIDEO STUDIO USABLE FULL PREVIEW                                */
/* Keep the outer preview fixed while maximizing the video inside it.          */
/* Prevent the preview from consuming the whole editor and hiding controls.    */
/* ========================================================================== */
@media (min-width:821px){
  body[data-page="vip-video"].vip-tool-page .platform-main{
    padding-top:8px!important;
  }
  body[data-page="vip-video"].vip-tool-page .global-back-row{
    margin:0 0 2px!important;
    line-height:1!important;
  }
  body[data-page="vip-video"] .page-heading{
    margin:0 0 5px!important;
  }
  body[data-page="vip-video"] .page-heading .vip-kicker{
    font-size:8px!important;
    line-height:1!important;
  }
  body[data-page="vip-video"] .page-heading h1{
    font-size:24px!important;
    line-height:1!important;
    margin:1px 0!important;
  }
  body[data-page="vip-video"] .page-heading p{
    font-size:10px!important;
    line-height:1.15!important;
    margin:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body[data-page="vip-video"] .video-editor-stage{
    align-items:stretch!important;
    justify-content:flex-start!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    gap:5px!important;
    padding:0 4px 3px 0!important;
    scrollbar-gutter:stable!important;
  }

  body[data-page="vip-video"] .video-editor-stage>.vip-stage-viewport{
    order:1!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-width:0!important;
    min-height:340px!important;
    height:clamp(340px,48dvh,500px)!important;
    max-height:500px!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
  }

  body[data-page="vip-video"] .video-preview-shell,
  body[data-page="vip-video"] .vip-preview,
  body[data-page="vip-video"] .vip-preview.checker,
  body[data-page="vip-video"] .video-preview-shell.has-media{
    box-sizing:border-box!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    border:1px solid rgba(212,175,85,.78)!important;
    border-radius:10px!important;
    background:#08090b!important;
    background-image:none!important;
  }

  body[data-page="vip-video"] #vCanvas,
  body[data-page="vip-video"] .video-preview-shell.has-media #vCanvas{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:auto!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:center!important;
  }

  body[data-page="vip-video"] .video-editor-stage>.video-editor-toolbar,
  body[data-page="vip-video"] .video-editor-toolbar{
    order:2!important;
    flex:0 0 auto!important;
    width:100%!important;
    max-width:none!important;
    min-height:42px!important;
    margin:0!important;
    padding:4px 6px!important;
    gap:4px!important;
    justify-content:flex-start!important;
    align-items:center!important;
    overflow:visible!important;
    flex-wrap:wrap!important;
  }
  body[data-page="vip-video"] .video-editor-toolbar .btn{
    padding:6px 10px!important;
    font-size:11px!important;
  }
  body[data-page="vip-video"] .video-current-time{
    margin-left:auto!important;
    font-size:11px!important;
  }

  body[data-page="vip-video"] .video-editor-stage>.video-timeline-panel,
  body[data-page="vip-video"] .video-timeline-panel{
    order:3!important;
    flex:0 0 auto!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:5px!important;
  }
  body[data-page="vip-video"] #vTimeline{
    height:76px!important;
    min-height:70px!important;
    margin:2px 0!important;
  }
  body[data-page="vip-video"] .video-timeline-head,
  body[data-page="vip-video"] .video-timeline-foot{
    font-size:10px!important;
  }
}

@media (max-width:820px){
  body[data-page="vip-video"] .video-editor-stage>.vip-stage-viewport{
    min-height:220px!important;
    height:clamp(220px,42dvh,360px)!important;
    max-height:360px!important;
  }
}


/* ========================================================================== */
/* V5.3.101 — VIDEO STUDIO LAYOUT + STICKER RATIO LOCK                       */
/* User-drawn layout: fixed upper preview zone, transport directly below,     */
/* editing/timeline zone always visible below. Ratio changes ONLY the media.   */
/* ========================================================================== */
@media (min-width:821px){
  body[data-page="vip-video"].vip-tool-page .platform-main{
    padding-top:6px!important;
  }
  body[data-page="vip-video"] .page-heading{
    margin:0 0 4px!important;
    min-height:0!important;
  }
  body[data-page="vip-video"] .page-heading .vip-kicker{
    font-size:8px!important;
    line-height:1!important;
    letter-spacing:2.4px!important;
  }
  body[data-page="vip-video"] .page-heading h1{
    font-size:24px!important;
    line-height:1!important;
    margin:2px 0!important;
  }
  body[data-page="vip-video"] .page-heading p{
    font-size:10px!important;
    line-height:1.15!important;
    margin:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body[data-page="vip-video"].vip-tool-page .vip-workspace{
    grid-template-columns:minmax(0,1fr) minmax(360px,430px)!important;
    gap:12px!important;
    height:calc(100dvh - 218px)!important;
    min-height:560px!important;
    max-height:760px!important;
    align-items:stretch!important;
    overflow:hidden!important;
  }
  body[data-page="vip-video"] .video-editor-stage{
    display:grid!important;
    grid-template-rows:minmax(300px,1fr) auto 138px!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    gap:6px!important;
    padding:0!important;
    overflow:hidden!important;
  }

  body[data-page="vip-video"] .video-editor-stage>.vip-stage-viewport{
    order:unset!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
  }
  body[data-page="vip-video"] .video-preview-shell,
  body[data-page="vip-video"] .vip-preview,
  body[data-page="vip-video"] .vip-preview.checker,
  body[data-page="vip-video"] .video-preview-shell.has-media{
    box-sizing:border-box!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    border:1px solid rgba(212,175,85,.78)!important;
    border-radius:10px!important;
    background:#08090b!important;
    background-image:none!important;
  }
  body[data-page="vip-video"] #vCanvas,
  body[data-page="vip-video"] .video-preview-shell.has-media #vCanvas{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:auto!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:center!important;
  }

  body[data-page="vip-video"] .video-editor-stage>.video-editor-toolbar,
  body[data-page="vip-video"] .video-editor-toolbar{
    order:unset!important;
    grid-row:2!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:44px!important;
    margin:0!important;
    padding:4px 6px!important;
    gap:5px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex-wrap:wrap!important;
    overflow:visible!important;
  }
  body[data-page="vip-video"] .video-editor-toolbar .btn{
    padding:6px 10px!important;
    font-size:11px!important;
    line-height:1.1!important;
  }
  body[data-page="vip-video"] .video-current-time{
    margin-left:auto!important;
    font-size:11px!important;
  }

  body[data-page="vip-video"] .video-editor-stage>.video-timeline-panel,
  body[data-page="vip-video"] .video-timeline-panel{
    order:unset!important;
    grid-row:3!important;
    width:100%!important;
    height:138px!important;
    max-width:none!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:5px 7px!important;
    overflow:hidden!important;
  }
  body[data-page="vip-video"] .video-timeline-head{
    min-height:29px!important;
    margin:0!important;
  }
  body[data-page="vip-video"] #vTimeline{
    width:100%!important;
    height:76px!important;
    min-height:76px!important;
    max-height:76px!important;
    margin:2px 0!important;
  }
  body[data-page="vip-video"] .video-timeline-foot{
    min-height:16px!important;
    font-size:10px!important;
  }

  body[data-page="vip-video"].vip-tool-page .vip-controls{
    height:100%!important;
    max-height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    scrollbar-gutter:stable!important;
  }
}

/* Ratio contract copied from Sticker behavior: outer workspace is fixed;       */
/* the canvas ratio itself changes to 1:1 / 16:9 / 9:16 and export uses it.    */
body[data-page="vip-video"] #vCanvas{
  image-rendering:auto!important;
}

@media (max-width:820px){
  body[data-page="vip-video"].vip-tool-page .vip-workspace{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body[data-page="vip-video"] .video-editor-stage{
    display:flex!important;
    height:auto!important;
    overflow:visible!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.vip-stage-viewport{
    width:100%!important;
    min-height:250px!important;
    height:clamp(250px,42dvh,360px)!important;
    max-height:360px!important;
  }
  body[data-page="vip-video"] .video-timeline-panel{
    width:100%!important;
    height:auto!important;
    min-height:138px!important;
  }
}


/* ========================================================================== */
/* V5.3.102 — VIDEO STUDIO + VIDEO COMPOSER VIEWPORT FINAL                    */
/* Composer = layout reference. Sticker = ratio reference.                    */
/* Desktop contract: every essential left-side control is visible at once.    */
/* ========================================================================== */
@media (min-width:821px){
  /* Give both editors the remaining visible screen instead of hard-coded page
     heights. Only the RIGHT controls pane scrolls vertically. */
  body:is([data-page="vip-video"],[data-page="vip-photo-video"]).vip-tool-page .platform-main{
    padding:5px 14px 8px!important;
    overflow:hidden!important;
  }
  body:is([data-page="vip-video"],[data-page="vip-photo-video"]) .global-back-row{
    margin:0 0 1px!important;
    line-height:1!important;
  }
  body:is([data-page="vip-video"],[data-page="vip-photo-video"]) .page-heading{
    flex:0 0 auto!important;
    margin:0 0 3px!important;
    min-height:0!important;
    padding:0!important;
  }
  body:is([data-page="vip-video"],[data-page="vip-photo-video"]) .page-heading .vip-kicker{
    font-size:8px!important;
    line-height:1!important;
    letter-spacing:2.2px!important;
  }
  body:is([data-page="vip-video"],[data-page="vip-photo-video"]) .page-heading h1{
    font-size:22px!important;
    line-height:1!important;
    margin:1px 0!important;
  }
  body:is([data-page="vip-video"],[data-page="vip-photo-video"]) .page-heading p{
    font-size:9.5px!important;
    line-height:1.05!important;
    margin:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    max-width:none!important;
  }
  body:is([data-page="vip-video"],[data-page="vip-photo-video"]).vip-tool-page .vip-workspace{
    flex:1 1 0!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    grid-template-columns:minmax(0,1fr) minmax(350px,430px)!important;
    gap:10px!important;
    align-items:stretch!important;
    overflow:hidden!important;
  }
  body:is([data-page="vip-video"],[data-page="vip-photo-video"]) .vip-controls{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    scrollbar-gutter:stable!important;
  }

  /* ----------------------------- VIDEO STUDIO ----------------------------- */
  body[data-page="vip-video"] .video-editor-stage{
    display:grid!important;
    grid-template-rows:minmax(0,1fr) 38px 148px!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    gap:5px!important;
    padding:0 6px 0 0!important;
    border-right:1px solid var(--line)!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.vip-stage-viewport{
    grid-row:1!important;
    order:unset!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    container-type:normal!important;
  }
  body[data-page="vip-video"] .video-preview-shell,
  body[data-page="vip-video"] .video-preview-shell.has-media,
  body[data-page="vip-video"] .vip-preview,
  body[data-page="vip-video"] .vip-preview.checker{
    box-sizing:border-box!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    margin:0!important;
    padding:0!important;
    border:1px solid rgba(212,175,85,.78)!important;
    border-radius:8px!important;
    overflow:hidden!important;
    display:grid!important;
    place-items:center!important;
    background:#08090b!important;
    background-image:none!important;
  }
  /* The output canvas is the Sticker contract: its own real ratio changes;
     the black editor frame never does. */
  body[data-page="vip-video"] #vCanvas,
  body[data-page="vip-video"] .video-preview-shell.has-media #vCanvas{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:auto!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:center!important;
    image-rendering:auto!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.video-editor-toolbar,
  body[data-page="vip-video"] .video-editor-toolbar{
    grid-row:2!important;
    order:unset!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    margin:0!important;
    padding:3px 5px!important;
    gap:4px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex-wrap:nowrap!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:8px!important;
    background:var(--bg2)!important;
  }
  body[data-page="vip-video"] .video-editor-toolbar .btn{
    min-width:0!important;
    height:30px!important;
    padding:4px 9px!important;
    font-size:10.5px!important;
    line-height:1!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }
  body[data-page="vip-video"] .video-current-time{
    margin-left:auto!important;
    padding-right:4px!important;
    font-size:10.5px!important;
    white-space:nowrap!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.video-timeline-panel,
  body[data-page="vip-video"] .video-timeline-panel{
    grid-row:3!important;
    order:unset!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:148px!important;
    min-height:148px!important;
    max-height:148px!important;
    margin:0!important;
    padding:5px 6px!important;
    overflow:hidden!important;
    border-radius:8px!important;
  }
  body[data-page="vip-video"] .video-timeline-head{
    min-height:26px!important;
    height:26px!important;
    margin:0!important;
    font-size:10px!important;
  }
  body[data-page="vip-video"] .video-timeline-head select{
    height:28px!important;
    padding:2px 24px 2px 7px!important;
    font-size:10px!important;
  }
  body[data-page="vip-video"] #vTimeline{
    width:100%!important;
    height:88px!important;
    min-height:88px!important;
    max-height:88px!important;
    margin:2px 0!important;
  }
  body[data-page="vip-video"] .video-timeline-foot{
    min-height:14px!important;
    height:14px!important;
    font-size:9.5px!important;
  }

  /* ---------------------------- VIDEO COMPOSER ---------------------------- */
  body[data-page="vip-photo-video"] .vip-stage-column{
    display:grid!important;
    grid-template-rows:minmax(0,1fr) 214px!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    gap:5px!important;
    padding:0 6px 0 0!important;
    border-right:1px solid var(--line)!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }
  body[data-page="vip-photo-video"] .vip-stage-viewport{
    grid-row:1!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    overflow:hidden!important;
    container-type:normal!important;
  }
  body[data-page="vip-photo-video"] .vip-preview,
  body[data-page="vip-photo-video"] .vip-preview.checker{
    box-sizing:border-box!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    overflow:hidden!important;
    border:1px solid rgba(212,175,85,.78)!important;
    border-radius:8px!important;
    background:#08090b!important;
    background-image:none!important;
  }
  body[data-page="vip-photo-video"] #pvCanvas{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:auto!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  body[data-page="vip-photo-video"] .pv-timeline-panel{
    grid-row:2!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:214px!important;
    min-height:214px!important;
    max-height:214px!important;
    margin:0!important;
    padding:5px 6px!important;
    gap:3px!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-rows:24px 36px 24px minmax(72px,1fr) 25px!important;
    border-radius:8px!important;
  }
  body[data-page="vip-photo-video"] .pv-timeline-head{
    min-height:24px!important;
    height:24px!important;
    gap:6px!important;
    font-size:10px!important;
    white-space:nowrap!important;
  }
  body[data-page="vip-photo-video"] .pv-space-hint{font-size:9.5px!important;}
  body[data-page="vip-photo-video"] .pv-zoom-control{
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
    font-size:9.5px!important;
    white-space:nowrap!important;
  }
  body[data-page="vip-photo-video"] .pv-zoom-control input{width:150px!important;}
  body[data-page="vip-photo-video"] .pv-playback-bar{
    min-height:36px!important;
    height:36px!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:4px!important;
    overflow:hidden!important;
  }
  body[data-page="vip-photo-video"] .pv-playback-bar .btn,
  body[data-page="vip-photo-video"] .pv-playback-bar .btn.primary,
  body[data-page="vip-photo-video"] .pv-playback-bar .btn.secondary{
    min-width:0!important;
    height:30px!important;
    padding:4px 9px!important;
    font-size:10.5px!important;
    line-height:1!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }
  body[data-page="vip-photo-video"] .pv-playback-bar #pvClock{
    margin-left:auto!important;
    padding-right:3px!important;
    font-size:10.5px!important;
    white-space:nowrap!important;
  }
  body[data-page="vip-photo-video"] #pvSeek{
    height:24px!important;
    margin:0!important;
  }
  body[data-page="vip-photo-video"] .pv-timeline-strip{
    min-height:72px!important;
    height:100%!important;
    margin:0!important;
  }
  body[data-page="vip-photo-video"] .pv-timeline-clip{
    height:62px!important;
  }
  body[data-page="vip-photo-video"] .pv-timeline-clip img{
    height:34px!important;
  }
  body[data-page="vip-photo-video"] .pv-audio-track{
    height:25px!important;
    min-height:25px!important;
    margin:0!important;
  }
}

/* Narrow desktop fallback: keep everything visible rather than letting the
   canvas consume the transport/timeline. */
@media (min-width:821px) and (max-height:760px){
  body[data-page="vip-video"] .video-editor-stage{
    grid-template-rows:minmax(0,1fr) 34px 130px!important;
  }
  body[data-page="vip-video"] .video-editor-stage>.video-editor-toolbar,
  body[data-page="vip-video"] .video-editor-toolbar{
    height:34px!important;min-height:34px!important;max-height:34px!important;
  }
  body[data-page="vip-video"] .video-editor-toolbar .btn{height:27px!important;padding:3px 7px!important;font-size:10px!important;}
  body[data-page="vip-video"] .video-timeline-panel{height:130px!important;min-height:130px!important;max-height:130px!important;}
  body[data-page="vip-video"] #vTimeline{height:72px!important;min-height:72px!important;max-height:72px!important;}

  body[data-page="vip-photo-video"] .vip-stage-column{
    grid-template-rows:minmax(0,1fr) 188px!important;
  }
  body[data-page="vip-photo-video"] .pv-timeline-panel{
    height:188px!important;min-height:188px!important;max-height:188px!important;
    grid-template-rows:22px 32px 20px minmax(62px,1fr) 23px!important;
  }
  body[data-page="vip-photo-video"] .pv-playback-bar{height:32px!important;min-height:32px!important;}
  body[data-page="vip-photo-video"] .pv-playback-bar .btn{height:27px!important;padding:3px 7px!important;font-size:10px!important;}
}

/* ========================================================================== */
/* V5.3.103 — VIDEO / COMPOSER SCREEN-FIT LOCK                               */
/* Hard override of the old common-preview flex rules.                        */
/* Layout reference: Video Composer. Ratio reference: Sticker exact W×H.      */
/* Desktop contract: title + preview + transport + timeline ALL visible.       */
/* ========================================================================== */
@media (min-width:821px){
  /* Compact chrome: media/canvas is the priority, not the page title. */
  body.vip-tool-page:is([data-page="vip-video"],[data-page="vip-photo-video"]) .global-back-row{
    margin:0 0 1px!important;
    line-height:1!important;
  }
  body.vip-tool-page:is([data-page="vip-video"],[data-page="vip-photo-video"]) .page-heading{
    margin:0 0 2px!important;
    padding:0!important;
    min-height:0!important;
    align-items:flex-start!important;
  }
  body.vip-tool-page:is([data-page="vip-video"],[data-page="vip-photo-video"]) .page-heading>div{
    display:grid!important;
    gap:0!important;
    min-height:0!important;
  }
  body.vip-tool-page:is([data-page="vip-video"],[data-page="vip-photo-video"]) .page-heading .vip-kicker{
    display:block!important;
    margin:0!important;
    padding:0!important;
    font-size:7px!important;
    line-height:7px!important;
    letter-spacing:2px!important;
  }
  body.vip-tool-page:is([data-page="vip-video"],[data-page="vip-photo-video"]) .page-heading h1{
    margin:0!important;
    padding:0!important;
    font-size:20px!important;
    line-height:20px!important;
  }
  body.vip-tool-page:is([data-page="vip-video"],[data-page="vip-photo-video"]) .page-heading p{
    margin:0!important;
    padding:0!important;
    max-width:none!important;
    font-size:9px!important;
    line-height:10px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  /* The workspace consumes exactly the remaining visible app viewport. */
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace,
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace{
    flex:1 1 0!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    grid-template-columns:minmax(0,1fr) minmax(350px,430px)!important;
    gap:10px!important;
    align-items:stretch!important;
    overflow:hidden!important;
  }

  /* ----------------------------- VIDEO STUDIO ----------------------------- */
  /* Important: these selectors intentionally outrank the old V5.3.94
     body:is(...).vip-tool-page .vip-stage-column flex rule. */
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .video-editor-stage{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr) 32px 112px!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    gap:5px!important;
    padding:0 6px 0 0!important;
    margin:0!important;
    overflow:hidden!important;
    align-items:stretch!important;
    justify-items:stretch!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .video-editor-stage > .vip-stage-viewport{
    display:grid!important;
    grid-row:1!important;
    grid-column:1!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    place-items:stretch!important;
    justify-self:stretch!important;
    align-self:stretch!important;
    flex:none!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    scrollbar-gutter:auto!important;
    background:transparent!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-preview-shell.vip-preview,
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-preview-shell.vip-preview.has-media{
    box-sizing:border-box!important;
    justify-self:stretch!important;
    align-self:stretch!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    place-items:center!important;
    border:1px solid rgba(212,175,85,.78)!important;
    border-radius:8px!important;
    background:#08090b!important;
    background-image:none!important;
  }
  /* Canvas keeps its REAL 16:9 / 9:16 / 1:1 ratio like Sticker.
     Only the canvas changes ratio; the black workspace frame never changes. */
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace #vCanvas,
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-preview-shell.has-media #vCanvas{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:auto!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:center!important;
    image-rendering:auto!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .video-editor-toolbar{
    display:flex!important;
    grid-row:2!important;
    grid-column:1!important;
    flex:none!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:32px!important;
    min-height:32px!important;
    max-height:32px!important;
    margin:0!important;
    padding:2px 4px!important;
    gap:4px!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex-wrap:nowrap!important;
    overflow:hidden!important;
    border:1px solid var(--line)!important;
    border-radius:8px!important;
    background:var(--bg2)!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-toolbar .btn{
    flex:0 0 auto!important;
    min-width:0!important;
    height:27px!important;
    padding:3px 7px!important;
    font-size:10px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-current-time{
    margin-left:auto!important;
    padding-right:3px!important;
    font-size:10px!important;
    white-space:nowrap!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .video-timeline-panel{
    display:block!important;
    grid-row:3!important;
    grid-column:1!important;
    flex:none!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:112px!important;
    min-height:112px!important;
    max-height:112px!important;
    margin:0!important;
    padding:4px 6px!important;
    overflow:hidden!important;
    border-radius:8px!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-timeline-head{
    height:23px!important;
    min-height:23px!important;
    margin:0!important;
    font-size:9.5px!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-timeline-head select{
    height:25px!important;
    padding:1px 22px 1px 6px!important;
    font-size:9.5px!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace #vTimeline{
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:1px 0!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-timeline-foot{
    height:13px!important;
    min-height:13px!important;
    font-size:9px!important;
  }

  /* ---------------------------- VIDEO COMPOSER ---------------------------- */
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace > .vip-stage-column{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr) 180px!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    gap:5px!important;
    padding:0 6px 0 0!important;
    margin:0!important;
    overflow:hidden!important;
    align-items:stretch!important;
    justify-items:stretch!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace > .vip-stage-column > .vip-stage-viewport{
    display:grid!important;
    grid-row:1!important;
    grid-column:1!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    place-items:stretch!important;
    justify-self:stretch!important;
    align-self:stretch!important;
    flex:none!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    scrollbar-gutter:auto!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .vip-stage-viewport > .vip-preview{
    box-sizing:border-box!important;
    justify-self:stretch!important;
    align-self:stretch!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    place-items:center!important;
    border:1px solid rgba(212,175,85,.78)!important;
    border-radius:8px!important;
    background:#08090b!important;
    background-image:none!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace #pvCanvas{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:auto!important;
    object-fit:contain!important;
    object-position:center!important;
    image-rendering:auto!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-panel{
    display:grid!important;
    grid-row:2!important;
    grid-column:1!important;
    grid-template-rows:21px 30px 18px minmax(58px,1fr) 22px!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:180px!important;
    min-height:180px!important;
    max-height:180px!important;
    margin:0!important;
    padding:4px 6px!important;
    gap:3px!important;
    overflow:hidden!important;
    border-radius:8px!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-head{
    min-height:21px!important;
    height:21px!important;
    gap:5px!important;
    font-size:9.5px!important;
    white-space:nowrap!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-space-hint,
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-zoom-control{
    font-size:9px!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-zoom-control input{
    width:130px!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar{
    display:flex!important;
    min-height:30px!important;
    height:30px!important;
    max-height:30px!important;
    align-items:center!important;
    gap:4px!important;
    flex-wrap:nowrap!important;
    overflow:hidden!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar .btn,
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar .btn.primary,
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar .btn.secondary{
    flex:0 0 auto!important;
    min-width:0!important;
    height:26px!important;
    padding:3px 7px!important;
    font-size:9.5px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar #pvClock{
    margin-left:auto!important;
    padding-right:3px!important;
    font-size:9.5px!important;
    white-space:nowrap!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace #pvSeek{
    height:18px!important;
    margin:0!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip{
    min-height:58px!important;
    height:100%!important;
    margin:0!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip{
    height:54px!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip img{
    height:30px!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-audio-track{
    height:22px!important;
    min-height:22px!important;
    margin:0!important;
  }

  /* The right-hand controls pane is the only vertical scroller. */
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace > .vip-controls,
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace > .vip-controls{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    scrollbar-gutter:stable!important;
  }
}

/* Short desktop screens: protect transport + timeline before shrinking them
   out of view. The preview takes whatever remains. */
@media (min-width:821px) and (max-height:720px){
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .video-editor-stage{
    grid-template-rows:minmax(0,1fr) 30px 98px!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .video-editor-toolbar{
    height:30px!important;min-height:30px!important;max-height:30px!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .video-timeline-panel{
    height:98px!important;min-height:98px!important;max-height:98px!important;
  }
  body.vip-tool-page[data-page="vip-video"] #videoWorkspace #vTimeline{
    height:48px!important;min-height:48px!important;max-height:48px!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace > .vip-stage-column{
    grid-template-rows:minmax(0,1fr) 158px!important;
  }
  body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-panel{
    height:158px!important;min-height:158px!important;max-height:158px!important;
    grid-template-rows:19px 28px 17px minmax(48px,1fr) 20px!important;
  }
}


/* V5.3.105 — PROFESSIONAL WORKSPACE · independently scrollable, resizable editing surfaces.
   Previous fixed 112/180px timelines and 9-10px buttons are intentionally superseded. */
@media (min-width:821px){
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .video-editor-stage,
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace > .vip-stage-column{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:var(--ev-preview-height,500px) minmax(40px,max-content) var(--ev-timeline-height,260px)!important;
  height:100%!important;min-height:0!important;max-height:none!important;
  overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;align-content:start!important;gap:8px!important;
  padding:0 9px 14px 0!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage>.vip-stage-viewport,
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .vip-stage-column>.vip-stage-viewport{
  grid-row:1!important;min-height:0!important;height:100%!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage>.video-editor-toolbar{
  grid-row:auto!important;height:auto!important;min-height:44px!important;max-height:none!important;
  padding:6px!important;gap:6px!important;flex-wrap:wrap!important;overflow:visible!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage>.video-timeline-panel{
  grid-row:3!important;height:100%!important;min-height:180px!important;max-height:none!important;
  padding:9px!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace #vTimeline{
  display:block!important;flex:1 1 auto!important;width:100%!important;height:auto!important;
  min-height:110px!important;max-height:none!important;margin:6px 0!important;touch-action:none;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-timeline-head{
  height:auto!important;min-height:32px!important;font-size:12px!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-timeline-head select{
  font-size:12px!important;height:30px!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-timeline-foot{
  height:auto!important;min-height:21px!important;font-size:11px!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-toolbar .btn,
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar .btn{
  height:34px!important;min-height:34px!important;max-height:none!important;
  padding:6px 10px!important;font-size:12px!important;line-height:1.2!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-current-time,
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar #pvClock{
  font-size:12px!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-panel{
  grid-row:3!important;height:100%!important;min-height:210px!important;max-height:none!important;
  grid-template-rows:minmax(31px,auto) minmax(38px,auto) 22px minmax(90px,1fr) minmax(32px,auto)!important;
  gap:7px!important;padding:9px!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-head{
  height:auto!important;min-height:31px!important;font-size:12px!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-space-hint,
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-zoom-control{font-size:11px!important;}
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar{
  height:auto!important;min-height:38px!important;max-height:none!important;
  flex-wrap:wrap!important;gap:6px!important;overflow:visible!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip{
  height:100%!important;min-height:90px!important;overflow-x:auto!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip{height:80px!important;}
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip img{height:53px!important;}
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-audio-track{
  height:30px!important;min-height:30px!important;
 }
}
.ev-layout-controls{grid-row:2;display:flex;flex-wrap:wrap;align-items:center;gap:12px;
  padding:7px 10px;border:1px solid rgba(213,177,79,.28);border-radius:8px;
  background:#131317;color:#eee;min-height:38px;box-sizing:border-box;}
.ev-layout-controls label{display:flex;align-items:center;gap:7px;font-size:12px;white-space:nowrap;font-weight:600;}
.ev-layout-controls input[type="range"]{width:110px;min-width:65px;accent-color:#dfb854;}
.ev-layout-controls output{color:#edc96c;min-width:42px;font-variant-numeric:tabular-nums;}
.ev-layout-controls .btn{min-height:30px;padding:5px 9px;font-size:11px;}
body.vip-tool-page .vip-controls .vip-control-group h3{scroll-margin-top:14px;}
body.vip-tool-page #pvAiMotionPanel{scroll-margin-top:16px;outline-offset:3px;}
body.vip-tool-page #pvAiMotionPanel:target{outline:2px solid #e0b84f;}
@media (max-width:820px){
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage,
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .vip-stage-column{
  overflow:visible!important;display:flex!important;flex-direction:column!important;height:auto!important;max-height:none!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .vip-stage-viewport,
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .vip-stage-viewport{
  height:clamp(280px,58vw,510px)!important;flex:none!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-toolbar,
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar{
  flex-wrap:wrap!important;height:auto!important;max-height:none!important;overflow:visible!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-timeline-panel,
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-panel{
  height:230px!important;min-height:230px!important;max-height:none!important;flex:none!important;
 }
 .ev-layout-controls input[type="range"]{width:82px;}
}
/* V5.3.105: Video Studio has FOUR surfaces; keep transport above layout sliders. */
@media (min-width:821px){
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .video-editor-stage{
  grid-template-rows:var(--ev-preview-height,500px) minmax(44px,max-content) minmax(40px,max-content) var(--ev-timeline-height,260px)!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .video-editor-toolbar{grid-row:2!important;}
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .ev-layout-controls{grid-row:3!important;}
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .video-timeline-panel{grid-row:4!important;}
}
/* V5.3.105 mobile: never force Video Studio into two unreadable 50/50 columns. */
@media (max-width:820px){
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace{
  display:flex!important;flex-direction:column!important;gap:14px!important;
  height:auto!important;min-height:0!important;max-height:none!important;
  overflow:visible!important;align-items:stretch!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .video-editor-stage,
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .vip-controls{
  flex:none!important;box-sizing:border-box!important;width:100%!important;max-width:100%!important;
  min-width:0!important;height:auto!important;min-height:0!important;max-height:none!important;
  overflow:visible!important;margin:0!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .ev-layout-controls{
  order:0!important;width:100%!important;max-width:100%!important;justify-content:flex-start!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .vip-stage-viewport{order:1!important;width:100%!important;}
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .video-editor-toolbar{order:2!important;width:100%!important;}
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-editor-stage > .video-timeline-panel{order:3!important;width:100%!important;}
}
@media (max-width:820px){
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .video-editor-stage > .video-editor-toolbar,
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .video-editor-stage > .video-timeline-panel{
  width:100%!important;min-width:0!important;max-width:none!important;
  margin:0!important;align-self:stretch!important;flex:0 0 auto!important;
 }
 body.vip-tool-page[data-page="vip-video"] #videoWorkspace.vip-workspace > .video-editor-stage > .video-timeline-panel #vTimeline{width:100%!important;}
}
/* V5.3.105 Composer mobile: prevent timeline and MEDIA controls overlapping. */
@media (max-width:820px){
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace{
  display:flex!important;flex-direction:column!important;align-items:stretch!important;
  gap:14px!important;height:auto!important;min-height:0!important;max-height:none!important;
  overflow:visible!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace > .vip-stage-column{
  display:flex!important;flex-direction:column!important;gap:9px!important;
  flex:0 0 auto!important;width:100%!important;max-width:100%!important;
  height:auto!important;min-height:0!important;max-height:none!important;
  overflow:visible!important;padding:0!important;margin:0!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace > .vip-stage-column > .vip-stage-viewport{
  order:0!important;width:100%!important;max-width:100%!important;
  flex:0 0 auto!important;height:clamp(280px,58vw,510px)!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace > .vip-stage-column > .ev-layout-controls{
  order:1!important;width:100%!important;max-width:100%!important;min-height:55px!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel{
  order:2!important;display:flex!important;flex-direction:column!important;
  flex:0 0 auto!important;align-self:stretch!important;width:100%!important;min-width:0!important;max-width:none!important;
  height:310px!important;min-height:310px!important;max-height:none!important;
  padding:9px!important;margin:0!important;overflow:hidden!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-head{
  flex:0 0 auto!important;height:auto!important;min-height:26px!important;max-height:none!important;flex-wrap:wrap!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar{
  flex:0 0 auto!important;min-height:42px!important;height:auto!important;max-height:none!important;
  flex-wrap:wrap!important;overflow:visible!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip{
  flex:1 1 auto!important;height:auto!important;min-height:90px!important;max-height:none!important;
  overflow-x:auto!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-audio-track{
  flex:0 0 auto!important;min-height:30px!important;height:30px!important;max-height:none!important;
 }
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace > .vip-controls{
  flex:0 0 auto!important;box-sizing:border-box!important;width:100%!important;max-width:100%!important;
  height:auto!important;max-height:none!important;min-height:0!important;
  overflow:visible!important;margin:0!important;
 }
}
/* Mobile scrolling: app shell is viewport-fixed, so main must own vertical scroll. */
@media (max-width:820px){
 body.vip-tool-page[data-page="vip-video"] main.platform-main,
 body.vip-tool-page[data-page="vip-photo-video"] main.platform-main{
  overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior-y:contain!important;
  -webkit-overflow-scrolling:touch!important;
 }
}

/* V5.3.106 — image-filled clip strips, no empty thumbnail frames */
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip{padding:0!important;display:block;isolation:isolate;background:#15171d!important;overflow:hidden;border-radius:6px;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-clip-film{position:absolute;inset:0;display:flex;overflow:hidden;pointer-events:none;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-film-cell{height:100%;flex:0 0 76px;max-width:76px;background-position:center;background-size:cover;background-repeat:no-repeat;border-right:1px solid rgba(255,255,255,.16);}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-clip-caption{position:absolute;bottom:2px;left:9px;right:9px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;background:rgba(3,5,9,.8);border-radius:3px;color:#fff;padding:2px 5px;font-size:11px;z-index:2;pointer-events:none;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-trim-handle{z-index:5!important;width:10px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip.selected{outline:2px solid #e4c16c;outline-offset:-2px;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-lyrics-track{min-height:25px;position:relative;margin:2px 0 4px;background:rgba(30,31,39,.9);border-radius:4px;overflow-x:auto;overflow-y:hidden;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-cue-block{position:absolute;top:2px;height:21px;border:1px solid #d5b45a;border-radius:3px;background:rgba(196,153,55,.28);color:#fff;padding:2px 4px;font-size:10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-cue-block.active{background:rgba(235,183,54,.55);outline:1px solid #fff;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-cue-editor{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:8px;border:1px solid rgba(213,180,90,.35);border-radius:6px;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-cue-editor label{font-size:12px;min-width:0;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-cue-editor input,body[data-page="vip-photo-video"] #pvWorkspace .pv-cue-editor select{width:100%;min-width:0;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-cue-editor .wide{grid-column:1/-1;}

/* Accessible local draft status */
.ev-draft-status{color:#e9d7a0;font-size:11px;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* Keep both workspaces usable in a short window */
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .vip-stage-viewport,
body.vip-tool-page[data-page="vip-video"] #videoWorkspace .video-preview-shell{min-height:0!important;}

body[data-page="vip-photo-video"] #pvWorkspace .pv-lyrics-track{width:100%;max-width:100%;overflow-x:auto!important;flex:0 0 auto;scrollbar-width:thin;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-lyrics-inner{min-height:25px;}

/* V5.3.106b · full project effects and synced timeline ruler */
body[data-page="vip-photo-video"] #pvWorkspace #pvApplyFilterScope,
body[data-page="vip-photo-video"] #pvWorkspace #pvApplyMotionScope{display:block;width:100%;margin:8px 0 10px;}
body[data-page="vip-photo-video"] #pvWorkspace #pvSeek{touch-action:pan-y;cursor:crosshair;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip{box-sizing:border-box;}
body[data-page="vip-video"] #videoWorkspace #vFilterAddFull{white-space:normal;}

body[data-page="vip-photo-video"] #pvWorkspace #pvSeek{width:var(--seek-track-width,100%)!important;max-width:100%!important;align-self:flex-start!important;}


/* Unified visible playhead: the blue handle uses exactly the same coordinate as the white film ruler. */
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-wrap{position:relative;width:100%;height:20px;flex:0 0 20px;min-height:20px;overflow:hidden;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-track{position:absolute;left:0;top:7px;height:6px;width:var(--seek-track-width,100%);max-width:100%;border-radius:6px;background:linear-gradient(to right,#2387ff 0,#2387ff var(--seek-indicator-px,0px),#ececec var(--seek-indicator-px,0px),#ececec 100%);pointer-events:none;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-indicator{position:absolute;left:0;top:2px;width:16px;height:16px;border-radius:50%;background:#2387ff;transform:translateX(-50%);pointer-events:none;z-index:3;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-wrap #pvSeek{position:absolute!important;left:0!important;top:0!important;width:var(--seek-track-width,100%)!important;max-width:100%!important;height:20px!important;margin:0!important;opacity:0!important;z-index:4;cursor:ew-resize;touch-action:pan-y;}

/* V5.3.106c · One intentional scrubber, no misleading yellow scroll handles */
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-nav{display:flex;align-items:center;gap:7px;width:100%;min-width:0;flex:0 0 auto;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-nav .pv-seek-wrap{min-width:0;flex:1 1 auto;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-track{background:linear-gradient(to right,#e1b74e 0,#e1b74e var(--seek-indicator-px,0px),#e7e7e7 var(--seek-indicator-px,0px),#e7e7e7 100%)!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-indicator{background:#e1b74e!important;box-shadow:0 0 0 2px #151515;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-nav-btn{flex:0 0 29px;border:1px solid rgba(212,175,85,.6);background:#17181d;color:#e1b74e;border-radius:6px;height:23px;cursor:pointer;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-nav-btn:focus-visible{outline:2px solid #e1b74e;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip,
body[data-page="vip-photo-video"] #pvWorkspace .pv-lyrics-track,
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-track{scrollbar-width:none!important;-ms-overflow-style:none!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip::-webkit-scrollbar,
body[data-page="vip-photo-video"] #pvWorkspace .pv-lyrics-track::-webkit-scrollbar,
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-track::-webkit-scrollbar{display:none!important;width:0!important;height:0!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip{touch-action:pan-y;cursor:crosshair!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-clip-grip{position:absolute;right:12px;top:0;padding:1px 5px;color:#fff;background:rgba(0,0,0,.78);border:1px solid rgba(212,175,85,.85);border-radius:4px;cursor:grab;z-index:8;touch-action:none;font-size:15px;line-height:17px;user-select:none;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-clip-grip:active{cursor:grabbing;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-playhead{width:2px;background:#fff;box-shadow:0 0 3px #000,0 0 0 1px rgba(0,0,0,.6);}
/* Explicit six-track layout: seek navigation must never overlap film frames. */
@media (min-width:821px){
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-panel{
   grid-template-rows:minmax(26px,auto) minmax(38px,auto) minmax(70px,1fr) 24px minmax(25px,auto) 30px!important;
   min-height:260px!important;
 }
}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip{z-index:1;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-nav{position:relative;z-index:3;}

/* V5.3.106c final: scrubber and playhead share exactly the same start/width */
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-nav{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-nav .pv-seek-wrap{width:100%!important;flex:0 0 20px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-view-buttons{display:flex;justify-content:space-between;gap:10px;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-nav-btn{flex:0 0 auto!important;height:19px!important;padding:0 8px!important;font-size:11px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-wrap #pvSeek{width:100%!important;}

/* Reserve sufficient real height for the custom timeline scrub and its navigation buttons. */
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-nav{min-height:43px!important;height:43px!important;flex:0 0 43px!important;box-sizing:border-box!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip{min-height:62px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-lyrics-track{flex:0 0 25px!important;height:25px!important;min-height:25px!important;max-height:25px!important;}

/* Navigation lives in the timeline heading; the filmstrip and scrubber need dedicated, non-overlapping rows. */
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-head .pv-view-buttons{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-head .pv-nav-btn{height:22px!important;padding:0 7px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-nav{height:24px!important;min-height:24px!important;flex:0 0 24px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-nav .pv-seek-wrap{height:20px!important;min-height:20px!important;}
/* Fit the filmstrip and time ruler on separate rows even in the compact workspace. */
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip{min-height:70px!important;height:70px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip{height:66px!important;}
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel > #pvTimelineStrip{min-height:70px!important;height:70px!important;max-height:70px!important;flex:0 0 70px!important;}
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel .pv-timeline-clip{min-height:0!important;height:66px!important;max-height:66px!important;}

/* Composer focused repair: always-visible, touch-sized IN/OUT for selected clips. */
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-trim-handle{width:24px!important;min-width:24px!important;z-index:12!important;display:flex!important;align-items:flex-start;justify-content:center;padding-top:5px;font-size:10px;line-height:12px;font-weight:800;color:#101014;background:#f2c950;box-shadow:0 0 0 1px #1b1b1b;touch-action:none;user-select:none;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-trim-handle.start{left:0!important;border-right:2px solid #fff;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-trim-handle.end{right:0!important;border-left:2px solid #fff;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip.image-clip .pv-trim-handle.start{display:flex!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-clip-caption{left:26px!important;right:26px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-clip-grip{right:27px!important;}
body[data-page="vip-photo-video"] #pvWorkspace #pvFitClip{white-space:nowrap;max-width:none;padding:3px 9px;}
body[data-page="vip-photo-video"] .pv-import-dialog{max-width:min(650px,95vw);width:650px;max-height:80dvh;overflow:auto;color:var(--text);background:var(--panel);border:1px solid var(--gold);border-radius:12px;padding:18px;}
body[data-page="vip-photo-video"] .pv-import-dialog::backdrop{background:rgba(0,0,0,.72);}
body[data-page="vip-photo-video"] .pv-import-list{max-height:50dvh;overflow:auto;display:grid;gap:5px;}
body[data-page="vip-photo-video"] .pv-import-row{display:flex;align-items:center;gap:8px;padding:5px;border:1px solid var(--line);border-radius:6px;}
body[data-page="vip-photo-video"] .pv-import-row span{flex:1;min-width:0;overflow-wrap:anywhere;font-size:12px;}
body[data-page="vip-photo-video"] .pv-import-row button{min-width:38px;min-height:38px;border:1px solid var(--gold);background:var(--bg2);color:var(--gold);border-radius:6px;font-weight:bold;}
body[data-page="vip-photo-video"] .pv-import-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-top:12px;}

/* ELVIANO V5.3.106k3 — precise trim panel, placed exactly above the filmstrip. */
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-trim-bar{display:flex;gap:7px;align-items:center;flex-wrap:wrap;min-height:40px;height:auto;padding:4px 6px;border:1px solid rgba(226,181,72,.55);background:var(--bg2);border-radius:8px;box-sizing:border-box;overflow:visible;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-caption{font-size:10px;font-weight:700;color:var(--gold);white-space:nowrap;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-side,body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-move{border:1px solid var(--gold);border-radius:5px;background:transparent;color:var(--gold);min-width:42px;min-height:28px;font-size:12px;font-weight:800;cursor:pointer;touch-action:manipulation;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-side.active{background:var(--gold);color:#111;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-side:disabled,body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-move:disabled{opacity:.45;cursor:not-allowed;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-step-label,body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-time{display:flex;gap:5px;align-items:center;font-size:10px;white-space:nowrap;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-step-label select,body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-time input{font-size:11px;height:28px;min-height:28px;box-sizing:border-box;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:5px;padding:2px 4px;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-step-label select{width:88px;}body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-time input{width:95px;font-variant-numeric:tabular-nums;}
body[data-page="vip-photo-video"] #pvWorkspace #pvFineSlider{flex:1 1 125px;min-width:90px;max-width:280px;accent-color:var(--gold);cursor:ew-resize;touch-action:pan-y;}
body[data-page="vip-photo-video"] .pv-import-row{cursor:grab;user-select:none;touch-action:pan-y;}
body[data-page="vip-photo-video"] .pv-import-row.pv-import-dragging{opacity:.5;}
body[data-page="vip-photo-video"] .pv-import-row.pv-import-over{border-color:var(--gold)!important;box-shadow:inset 0 0 0 2px var(--gold);background:rgba(226,181,72,.12);}
body[data-page="vip-photo-video"] .pv-import-row .pv-import-grip{flex:0 0 16px!important;font-size:17px!important;color:var(--gold);cursor:grab;}
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel{height:auto!important;min-height:225px!important;max-height:none!important;grid-template-rows:auto auto auto 70px 24px 25px 22px!important;align-content:start!important;}
@media(max-width:820px){body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel{min-height:265px!important;}body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-trim-bar{gap:5px;padding:4px;}body[data-page="vip-photo-video"] #pvWorkspace #pvFineSlider{max-width:none;flex-basis:100%;}}

/* V5.3.106k4 – ergonomic handles, controlled zoom and independent pan */
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip{padding-left:26px!important;box-sizing:border-box!important;scrollbar-width:none!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-inner{height:100%;min-width:100%;white-space:nowrap;box-sizing:border-box;display:flex;align-items:center;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan{display:flex;align-items:center;gap:9px;height:31px;min-height:31px;min-width:0;flex:0 0 31px;border:1px solid rgba(212,175,85,.42);border-radius:7px;background:rgba(18,19,22,.85);padding:2px 8px;box-sizing:border-box;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan label{font-size:11px;white-space:nowrap;color:var(--gold);font-weight:600;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan input{flex:1 1 auto;min-width:48px;accent-color:var(--gold);cursor:ew-resize;touch-action:pan-y;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan output{min-width:35px;font-size:11px;color:var(--gold);font-variant-numeric:tabular-nums;text-align:right;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan button{flex:0 0 29px;min-height:26px;border:1px solid rgba(212,175,85,.55);border-radius:5px;background:var(--bg2);color:var(--gold);cursor:pointer;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan input:disabled{opacity:.5;cursor:not-allowed;}
body[data-page="vip-photo-video"] #pvWorkspace #pvTimelineZoom{accent-color:#278ee9;cursor:ew-resize;touch-action:pan-y;}
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel{grid-template-rows:auto auto auto 70px 24px 25px 22px 31px!important;min-height:270px!important;}
@media(max-width:700px){body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan{gap:5px;padding:2px 4px;}body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan label{font-size:9px;max-width:100px;white-space:normal;line-height:1.1;}body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan button{flex-basis:26px;}body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel{min-height:305px!important;}}

/* V5.3.106k5 — scoped behavior-only repair; preserve all existing workspace panel geometries. */
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip{padding-left:0!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-lead{height:1px;pointer-events:none;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-trim-handle.pv-handle-active{background:#fff3ad!important;border-color:#fff!important;box-shadow:0 0 0 2px #26a5ff inset,0 0 9px #fff!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-step-label #pvFineMultiplier{width:45px;height:28px;min-height:28px;box-sizing:border-box;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:5px;padding:2px 3px;font-variant-numeric:tabular-nums;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-step-arrow{width:28px;height:28px;min-height:28px;border:1px solid var(--gold);border-radius:5px;background:var(--panel);color:var(--gold);cursor:pointer;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-step-arrow:disabled{opacity:.4;cursor:not-allowed;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-track{overflow-x:auto!important;overflow-y:auto!important;position:relative;box-sizing:border-box;scrollbar-width:thin!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-track .pv-audio-inner{display:block!important;align-items:initial!important;height:auto;box-sizing:border-box;position:relative;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-clip{box-sizing:border-box;min-width:48px!important;height:22px!important;max-height:22px!important;padding:2px 27px!important;white-space:nowrap;overflow:hidden;cursor:grab;user-select:none;background:rgba(41,119,220,.27)!important;border:1px solid #328de6!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-clip.selected{outline:1px solid #92d5ff;outline-offset:-1px;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-handle{position:absolute;top:0;bottom:0;width:24px;background:#298ff6;color:#fff;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:800;cursor:ew-resize;touch-action:none;z-index:6;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-handle.start{left:0;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-handle.end{right:0;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-handle.pv-handle-active{background:#a7dcff!important;color:#002542;box-shadow:0 0 0 2px #fff inset,0 0 8px #8fddff;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-snap-guide{pointer-events:none;position:absolute;top:0;bottom:0;z-index:30;width:1px;background:#66e6ff;box-shadow:0 0 5px #66e6ff;}

/* Keep exactly the same outer timeline panel dimensions; enable vertical access to inner stacked audio lanes. */
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-panel{overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;scrollbar-width:thin;}
/* Compensate the pre-existing 3px filmstrip gap and 2px audio-track inset: same visible time zero. */
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-inner{margin-left:1px;}

/* Snap is a temporary guide across the whole timeline, not a persistent ruler. */
body[data-page="vip-photo-video"] .pv-snap-guide-composer{position:fixed;z-index:999;pointer-events:none;width:2px;background:#67e7ff;box-shadow:0 0 8px #66e6ff;}


/* ELVIANO 106p — Composer-only UI consolidation; no shared media dimensions changed. */
body.vip-tool-page[data-page="vip-photo-video"] .page-heading{margin:0 0 3px!important;padding:0!important;min-height:0!important;}
body.vip-tool-page[data-page="vip-photo-video"] .page-heading h1{font-size:16px!important;line-height:19px!important;margin:0!important;}
body.vip-tool-page[data-page="vip-photo-video"] .page-heading .vip-kicker{font-size:8px!important;line-height:9px!important;letter-spacing:1px!important;}
body.vip-tool-page[data-page="vip-photo-video"] .page-heading p{display:none!important;}
body[data-page="vip-photo-video"] #pvWorkspace .ev-layout-controls{gap:5px!important;padding:3px 6px!important;min-height:34px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .ev-layout-controls label{font-size:11px!important;gap:4px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .ev-layout-controls .btn{min-height:26px!important;height:26px!important;padding:3px 7px!important;font-size:10px!important;}
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-panel{
  display:flex!important;flex-direction:column!important;align-content:flex-start!important;
  gap:4px!important;padding:5px 7px!important;overflow-y:auto!important;overflow-x:hidden!important;
  min-height:0!important;box-sizing:border-box!important;
}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-head{min-height:24px!important;height:auto!important;gap:7px!important;flex-wrap:wrap!important;justify-content:space-between!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-space-hint{display:none!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-head .pv-nav-btn{font-size:10px!important;min-height:23px!important;height:23px!important;padding:2px 5px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar{min-height:30px!important;max-height:none!important;height:auto!important;gap:4px!important;padding:1px 0!important;flex-wrap:wrap!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar .btn,
body[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar .btn.primary,
body[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar .btn.secondary{height:27px!important;min-height:27px!important;padding:3px 7px!important;font-size:10px!important;line-height:15px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-trim-bar{min-height:33px!important;gap:4px!important;padding:2px 4px!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin;flex:0 0 auto!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-caption{font-size:9px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-side,
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-move{min-width:32px!important;min-height:25px!important;padding:2px 4px!important;font-size:10px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-step-arrow{width:23px!important;height:25px!important;min-height:25px!important;padding:2px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-step-label select,
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-time input{height:25px!important;min-height:25px!important;font-size:10px!important;}
body[data-page="vip-photo-video"] #pvWorkspace #pvFineSlider{min-width:80px!important;max-width:none!important;flex:1 0 80px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-strip{gap:0!important;padding:0!important;min-height:61px!important;height:61px!important;max-height:61px!important;flex:0 0 61px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip{height:57px!important;min-height:57px!important;max-height:57px!important;border:1px solid rgba(255,255,255,.16)!important;border-radius:2px!important;cursor:crosshair!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-trim-handle{
  width:18px!important;min-width:18px!important;font-size:8px!important;line-height:11px!important;
  padding:3px 0 0!important;cursor:ew-resize!important;
}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip .pv-clip-caption{left:19px!important;right:19px!important;font-size:9px!important;padding:1px 2px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-clip-grip{left:calc(50% - 7px)!important;right:auto!important;top:2px!important;padding:0!important;width:14px!important;height:15px!important;font-size:12px!important;line-height:14px!important;text-align:center!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip.pv-drop-before{box-shadow:inset 3px 0 #64d9ff!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip.pv-drop-after{box-shadow:inset -3px 0 #64d9ff!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-clip.pv-clip-dragging{opacity:.58;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-seek-nav{min-height:20px!important;height:20px!important;flex:0 0 20px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-lyrics-track{margin:0!important;padding:0!important;flex:0 0 23px!important;height:23px!important;min-height:23px!important;max-height:23px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-lyrics-track.pv-lyrics-empty{display:none!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-track{margin:0!important;padding:0!important;height:27px!important;min-height:27px!important;max-height:27px!important;flex:0 0 27px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-inner{margin-left:0!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan{height:25px!important;min-height:25px!important;flex:0 0 25px!important;padding:1px 5px!important;gap:6px!important;}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-pan button{flex-basis:23px!important;min-height:21px!important;font-size:11px!important;}
@media(max-width:820px){
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-panel{height:auto!important;min-height:245px!important;max-height:none!important;overflow-y:visible!important;}
 body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-trim-bar{flex-wrap:wrap!important;overflow-x:visible!important;overflow-y:visible!important;}
 body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-trim-bar #pvFineSlider{flex-basis:90px!important;}
}
/* Specificity-safe overrides for the final Composer compact work surface. */
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel > #pvTimelineStrip{
  min-height:61px!important;height:61px!important;max-height:61px!important;flex:0 0 61px!important;
}
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel .pv-timeline-clip{
  min-height:0!important;height:57px!important;max-height:57px!important;
}
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-playback-bar .btn{
  height:27px!important;min-height:27px!important;padding:3px 7px!important;font-size:10px!important;
}
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel{
  min-height:0!important;grid-template-rows:none!important;
}
@media(max-width:820px){
 body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-panel{height:auto!important;min-height:245px!important;max-height:none!important;}
}


/* 106p-R1 · Audit 14 Oct 2026. Component-specific repairs; wall styles unchanged. */
body.vip-tool-page [hidden]{display:none!important}
/* Three empty media stages previously collapsed to 4x4px because both children were hidden. */
body[data-page="vip-converter"] .vip-stage-viewport,
body[data-page="vip-background"] .vip-stage-viewport,
body[data-page="photo-ai"] .vip-stage-viewport{min-height:min(56dvh,480px)!important}
body[data-page="vip-converter"] .vip-stage-viewport>.vip-preview,
body[data-page="vip-background"] .vip-stage-viewport>.vip-preview,
body[data-page="photo-ai"] .vip-stage-viewport>.vip-preview{
  width:min(100%,460px)!important;height:auto!important;min-height:240px!important;
  aspect-ratio:1/1!important;max-height:min(56dvh,480px)!important;box-sizing:border-box!important}
body[data-page="vip-converter"] .vip-media-empty,
body[data-page="vip-background"] .vip-media-empty,
body[data-page="photo-ai"] .vip-media-empty{max-width:95%;text-align:center}
/* Controls must size by content; do not overlap neighboring rows. */
body[data-page="vip-video"] .ev-layout-controls,
body[data-page="vip-video"] .vip-editor-toolbar{height:auto!important;min-height:unset!important;max-height:none!important;align-content:start!important;overflow:visible!important}
body[data-page="vip-video"] .vip-editor-toolbar{flex-wrap:wrap!important;row-gap:7px!important}
body[data-page="vip-video"] .video-timeline-panel{clear:both!important;position:relative!important}
/* Real, legible color swatches and checkboxes, without changing ordinary input dimensions. */
body.vip-tool-page .vip-controls input[type="color"]{box-sizing:border-box!important;width:70px!important;min-width:70px!important;height:38px!important;min-height:38px!important;padding:3px!important;border-radius:8px!important;display:block!important}
body.vip-tool-page .vip-controls input[type="checkbox"],
body.vip-tool-page .vip-controls input[type="radio"]{width:auto!important;min-width:16px!important;height:18px!important;padding:0!important;margin:0!important;justify-self:start!important}
body.vip-tool-page .vip-controls label:has(>input[type="checkbox"]),
body.vip-tool-page .vip-controls label:has(>input[type="radio"]){display:flex!important;flex-direction:row!important;align-items:center!important;gap:9px!important;flex-wrap:wrap!important}
/* Responsive, readable Composer action areas; retain user-defined preview height. */
body[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar .btn,
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-head .pv-nav-btn{font-size:12px!important;min-height:34px!important;height:auto!important;padding:7px 10px!important;line-height:1.2!important}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-side,
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-move,
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-step-arrow{min-height:34px!important;height:34px!important;min-width:34px!important;font-size:12px!important}
body[data-page="vip-photo-video"] #pvWorkspace .pv-fine-trim-bar{min-height:40px!important;height:auto!important;overflow-x:auto!important}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-extend-option{display:flex;align-items:center;gap:8px;font-size:12px;white-space:normal;padding:4px 6px}
body[data-page="vip-photo-video"] #pvWorkspace .pv-audio-extend-option input{flex:0 0 auto}
body[data-page="vip-photo-video"] #pvWorkspace .pv-timeline-audio-spacer{height:52px;background:repeating-linear-gradient(45deg,rgba(212,175,85,.05) 0 6px,transparent 6px 12px);flex-shrink:0}
body[data-page="vip-photo-video"] #pvCancelExport:not([hidden]){background:#442b26!important;border-color:#b86857!important;color:#fff!important}
/* Do not force tiny AI download buttons to stretch to their grid row. */
body[data-page="photo-ai"] #paiDownload{align-self:start!important;justify-self:start!important;height:auto!important;min-height:40px!important;max-height:52px!important}
@media(max-width:820px){
  body[data-page="vip-converter"] .vip-stage-viewport,
  body[data-page="vip-background"] .vip-stage-viewport,
  body[data-page="photo-ai"] .vip-stage-viewport{min-height:260px!important}
  body[data-page="vip-photo-video"] #pvWorkspace .pv-playback-bar .btn{min-height:38px!important}
}
/* Stronger than historical .pai-preview.source-mode rules; keep the empty state visible. */
body.vip-tool-page[data-page="photo-ai"] #paiWorkspace.vip-workspace .vip-stage-viewport>.pai-preview,
body.vip-tool-page[data-page="photo-ai"] #paiWorkspace.vip-workspace .vip-stage-viewport>.pai-preview.source-mode,
body.vip-tool-page[data-page="photo-ai"] #paiWorkspace.vip-workspace .vip-stage-viewport>.pai-preview.result-mode{
  display:grid!important;width:min(100%,460px)!important;height:auto!important;min-height:240px!important;
  max-width:460px!important;max-height:min(60dvh,460px)!important;aspect-ratio:1/1!important;
  box-sizing:border-box!important;overflow:hidden!important}
body.vip-tool-page[data-page="photo-ai"] #paiWorkspace.vip-workspace .vip-stage-viewport{min-height: min(55dvh, 480px)!important}
/* Force meaningful empty previews in converter and background tools without depending on a hidden canvas. */
body.vip-tool-page[data-page="vip-converter"] .vip-workspace .vip-stage-viewport>.vip-preview,
body.vip-tool-page[data-page="vip-background"] .vip-workspace .vip-stage-viewport>.vip-preview{
  width:min(100%,460px)!important;height:auto!important;min-height:240px!important;max-width:460px!important;aspect-ratio:1/1!important}

body.vip-tool-page[data-page="vip-converter"] .vip-workspace .vip-stage-viewport>.vip-preview,
body.vip-tool-page[data-page="vip-background"] .vip-workspace .vip-stage-viewport>.vip-preview,
body.vip-tool-page[data-page="photo-ai"] #paiWorkspace.vip-workspace .vip-stage-viewport>.pai-preview{
  min-width:min(100%,420px)!important;
}

body.vip-tool-page[data-page="vip-watermark"] .wm-live-readout{justify-self:end;color:var(--gold);font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
/* Timeline geometry must remain mathematically linear even for sub-second clips. */
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-strip>.pv-timeline-clip,
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-timeline-strip>.pv-timeline-audio-spacer{min-width:0!important;padding-left:0!important;padding-right:0!important}
body.vip-tool-page[data-page="vip-photo-video"] #pvWorkspace.vip-workspace .pv-audio-track .pv-audio-clip{min-width:0!important;box-sizing:border-box!important}

/* ELVIANO R2: completed export remains accessible after cancelled chooser. */
.vip-tool-page .ev-export-delivery{margin-top:12px;padding:14px;border:1px solid rgba(207,169,77,.55);border-radius:12px;background:rgba(20,24,29,.95);color:#f5f0e5;}
.vip-tool-page .ev-export-delivery[hidden]{display:none!important;}
.vip-tool-page .ev-export-delivery strong{display:block;font-size:15px;}
.vip-tool-page .ev-export-delivery p{overflow-wrap:anywhere;margin:8px 0;font-size:13px;}
.vip-tool-page .ev-export-actions{display:flex;gap:8px;flex-wrap:wrap;}
.vip-tool-page .ev-export-actions button{min-height:40px;font-size:13px;}
.vip-tool-page .ev-export-note{opacity:.86;}