/* 497: define the expanded artwork stage. */
@media(min-width:761px){
  body.single-player-ui .player-video-panel.aperture-square .player-video-dragzone,
  body.single-player-ui .player-video-panel.aperture-wide .player-video-dragzone,
  body.single-player-ui .player-video-panel.aperture-square>.player-video-controls,
  body.single-player-ui .player-video-panel.aperture-wide>.player-video-controls{
    width:var(--player-w)!important;
    max-width:calc(100vw - 48px)!important;
    justify-self:center!important;
  }
  body.single-player-ui .player-video-panel.aperture-vertical .player-video-dragzone,
  body.single-player-ui .player-video-panel.aperture-vertical>.player-video-controls{
    width:min(max(var(--player-w),400px),calc(100vw - 48px))!important;
    justify-self:center!important;
  }
  body.single-player-ui .player-video-dragzone{
    box-sizing:border-box!important;
  }
}
/* Header content must stay inside the stage. */
@media(min-width:761px){
  body.single-player-ui .player-video-dragzone{
    grid-template-columns:minmax(0,1fr) auto auto auto auto!important;
  }
  body.single-player-ui .player-heading{
    min-width:0!important;
    overflow:hidden!important;
  }
  body.single-player-ui #video-title{
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    text-overflow:ellipsis!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    white-space:normal!important;
    line-height:1.2!important;
    max-height:2.4em!important;
  }
}
/* Skip Story is its own action between transport and volume. */
body.single-player-ui .panel-actions>.panel-skip-story{
  order:2!important;
  flex:0 0 auto!important;
  margin:0 2px!important;
}
body.single-player-ui .panel-actions>.panel-transport{
  order:1!important;
}
body.single-player-ui .panel-actions>.panel-utilities{
  order:3!important;
}
body.single-player-ui .panel-actions{
  align-items:center!important;
}
body.single-player-ui .panel-skip-story{
  min-width:max-content!important;
  padding:0 10px!important;
}
/* Compact dock keeps the same semantic order. */
body.single-player-ui #player-controls-dock .panel-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
}
body.single-player-ui #player-controls-dock .panel-transport{
  order:1!important;
}
body.single-player-ui #player-controls-dock .panel-skip-story{
  order:2!important;
}
body.single-player-ui #player-controls-dock .panel-utilities{
  order:3!important;
  margin-left:auto!important;
}
body.single-player-ui #player-controls-dock .player-video-controls{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  grid-template-areas:"actions timeline"!important;
  align-items:center!important;
  gap:12px!important;
}
body.single-player-ui #player-controls-dock .panel-actions{
  grid-area:actions!important;
}
body.single-player-ui #player-controls-dock .panel-timeline{
  grid-area:timeline!important;
}
@media(max-width:760px){
  body.single-player-ui #player-controls-dock .player-video-controls{
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
  }
  body.single-player-ui #player-controls-dock .panel-timeline{
    order:1!important;
    width:100%!important;
  }
  body.single-player-ui #player-controls-dock .panel-actions{
    order:2!important;
    width:100%!important;
    justify-content:center!important;
    gap:6px!important;
  }
  body.single-player-ui #player-controls-dock .panel-utilities{
    margin-left:0!important;
  }
  body.single-player-ui .panel-skip-story{
    padding:0 6px!important;
  }
}
/* Override legacy expanded-player grid: preserve visible control order. */
body.single-player-ui .player-video-panel:not(.player-side-layout)>.player-video-controls .panel-actions{
  display:flex!important;
  flex-flow:row nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
}
body.single-player-ui .player-video-panel:not(.player-side-layout)>.player-video-controls .panel-utilities{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
}
body.single-player-ui .player-video-panel:not(.player-side-layout)>.player-video-controls .panel-volume-group{
  display:flex!important;
  align-items:center!important;
  justify-self:auto!important;
}