/* VELVET CLIPS TRUE ONE-VIEWPORT AUTHORITY R26 */
html,
body{
  width:100%!important;
  height:var(--vr-clips-viewport-px,100dvh)!important;
  min-height:var(--vr-clips-viewport-px,100dvh)!important;
  max-height:var(--vr-clips-viewport-px,100dvh)!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
}

#clipsApp{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:var(--vr-clips-viewport-px,100dvh)!important;
  min-height:var(--vr-clips-viewport-px,100dvh)!important;
  max-height:var(--vr-clips-viewport-px,100dvh)!important;
  overflow:hidden!important;
  contain:layout paint size!important;
}

#clipsScroller{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:var(--vr-clips-viewport-px,100dvh)!important;
  min-height:var(--vr-clips-viewport-px,100dvh)!important;
  max-height:var(--vr-clips-viewport-px,100dvh)!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior-y:none!important;
  overflow-anchor:none!important;
  scroll-snap-type:y mandatory!important;
  scroll-padding:0!important;
  scroll-behavior:auto!important;
  -webkit-overflow-scrolling:touch!important;
}

#clipsScroller>.clipPage{
  position:relative!important;
  flex:0 0 var(--vr-clips-viewport-px,100dvh)!important;
  width:100%!important;
  height:var(--vr-clips-viewport-px,100dvh)!important;
  min-height:var(--vr-clips-viewport-px,100dvh)!important;
  max-height:var(--vr-clips-viewport-px,100dvh)!important;
  margin:0!important;
  padding:0!important;
  scroll-snap-align:start!important;
  scroll-snap-stop:always!important;
  overflow:hidden!important;
  contain:layout paint size!important;
}

#clipsScroller>.clipPage+.clipPage{
  margin-top:0!important;
}

/* The current clip owns its whole viewport; all interaction chrome stays inside it. */
.clipPage .speakBarWrap{
  bottom:calc(10px + var(--safe-bottom))!important;
}
