/* The visible cabinet is motion media only. The approved portrait image is a
   hidden texture source for the animated mobile canvas, never a DOM fallback. */
#workspace #idle-art{display:none!important}
#workspace .art-stage video{opacity:1!important}
#workspace.video-unavailable .art-stage video{opacity:0!important}
#workspace #aq-mobile-frame{display:none}
/* The embedded SVG mask can rasterize as fully transparent after a desktop
   viewport change. Four native CSS mask bands keep the moving cabinet visible
   while leaving the controls in the center unobscured. */
@media(min-width:1200px){
  #workspace .art-stage video{
    -webkit-mask-image:linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(#000,#000);
    mask-image:linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(#000,#000);
    -webkit-mask-size:100% 28%,17.5% 100%,17.5% 100%,100% 25.8%;
    mask-size:100% 28%,17.5% 100%,17.5% 100%,100% 25.8%;
    -webkit-mask-position:top,left,right,bottom;
    mask-position:top,left,right,bottom;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  }
}
@media(max-width:1199px){
  #workspace #approved-mobile-frame{display:none!important}
  #workspace #aq-mobile-frame:not([hidden]){
    display:block;position:absolute;inset:0;width:100%;height:100%;z-index:2;
    pointer-events:none;
    -webkit-mask-image:linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(#000,#000);
    mask-image:linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(#000,#000),linear-gradient(#000,#000);
    -webkit-mask-size:100% 13%,8.2% 100%,8.2% 100%,100% calc(302 / 1572 * 100%);
    mask-size:100% 13%,8.2% 100%,8.2% 100%,100% calc(302 / 1572 * 100%);
    -webkit-mask-position:top,left,right,bottom;
    mask-position:top,left,right,bottom;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  }
}
