/* Detail playback preview: only the enlarged player is styled. */
#detail-player-dialog { padding:0; border:0; border-radius:12px; background:#101412; color:#f4f6f4; width:min(calc((92dvh - 56px) * var(--video-ratio, .5625)), calc(100vw - 32px), 1280px); max-width:calc(100vw - 32px); max-height:92dvh; overflow:hidden; box-shadow:0 20px 70px #0006; }
#detail-player-dialog::backdrop { background:#06110bba; }
#detail-player-dialog .detail-player-head { display:flex; align-items:center; justify-content:space-between; gap:12px; height:56px; padding:8px 10px 8px 16px; box-sizing:border-box; }
#detail-player-title { margin:0; font-size:15px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#detail-player-dialog .detail-player-close { display:flex; align-items:center; gap:6px; flex-shrink:0; min-height:40px; padding:0 10px; border:0; border-radius:6px; background:#27372e; color:#f4f6f4; cursor:pointer; font:inherit; font-size:13px; }
#detail-player-dialog .detail-player-close:hover { background:#394e41; }
#detail-player-dialog .detail-player-close:focus-visible { outline:2px solid #a5cfb6; outline-offset:2px; }
#detail-player-dialog .detail-player-stage { width:100%; aspect-ratio:var(--video-ratio, .5625); max-height:calc(92dvh - 56px); background:#000; }
#detail-player-dialog .material-detail-video-frame { width:100%; height:100%; max-height:none; aspect-ratio:auto; border:0; border-radius:0; background:#000; }
#detail-player-dialog #material-detail-video { display:block; width:100%; height:100%; max-height:none; object-fit:contain; background:#000; }
#detail-player-dialog .video-start-button { max-width:calc(100% - 24px); }
#detail-player-dialog ::selection { background:#a5cfb6; color:#101412; }
@media (max-width:480px) { #detail-player-dialog { width:min(calc((94dvh - 56px) * var(--video-ratio, .5625)), calc(100vw - 16px)); max-width:calc(100vw - 16px); max-height:94dvh; } #detail-player-dialog .detail-player-stage { max-height:calc(94dvh - 56px); } }