/* The player fills the dialog; its accessible title takes no visual space. */
 .work-media-dialog{--media-safe-top:96px;--media-safe-bottom:72px;--media-controls-height:64px;box-sizing:border-box;inset:var(--media-safe-top) 0 var(--media-safe-bottom);width:min(1120px,calc(100vw - 32px),calc((100svh - var(--media-safe-top) - var(--media-safe-bottom) - var(--media-controls-height) - 2px)*16/9));max-width:none;max-height:calc(100svh - var(--media-safe-top) - var(--media-safe-bottom));margin:auto;padding:0;border:1px solid #ffffff2b;background:#11131b;color:#f2f0e9;box-shadow:0 24px 100px #0009;overflow:hidden}
.work-media-dialog::backdrop{background:#030509c9}
.work-media-dialog-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.work-media-dialog-close{position:absolute;z-index:2;top:8px;right:8px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #ffffff30;border-radius:50%;background:#030509a6;color:inherit;cursor:pointer}
.work-media-dialog-close svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.25}
.work-media-dialog-close:hover{color:#bff55c;background:#030509d9}
.work-media-dialog-close:focus-visible{outline:1px solid currentColor;outline-offset:-4px}
.work-media-dialog-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.work-media-dialog-frame .inline-video{position:static;inset:auto;display:block;width:100%;height:100%;border:0;aspect-ratio:16/9}
@media(max-width:700px){.work-media-dialog{width:min(calc(100vw - 20px),calc((100svh - var(--media-safe-top) - var(--media-safe-bottom) - var(--media-controls-height) - 2px)*16/9))}.work-media-dialog-close{top:6px;right:6px}}

/* The small footer owns episode changes and playback recovery, never the cards. */
.work-media-dialog-controls{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px 20px;min-height:44px;padding:8px 14px;font:400 12px/1.6 'Descent Sans',sans-serif;color:#f2f0e9;background:#11131b}
.work-media-dialog-controls[hidden],.work-media-dialog-controls [hidden]{display:none}
.work-media-dialog-controls :is(button,a){padding:4px 0;border:0;border-bottom:1px solid #bb2649;background:none;color:inherit;font:inherit;text-decoration:none;cursor:pointer}
.work-media-dialog-controls :is(button,a):hover{color:#1abccb}
.work-media-dialog-controls :is(button,a,select):focus-visible{outline:1px solid #bb2649;outline-offset:3px}
.work-media-episodes{display:flex;align-items:center;gap:10px;min-width:0;max-width:100%;margin-right:auto;white-space:nowrap}
.work-media-episodes select{max-width:min(460px,calc(100vw - 120px));min-width:0;padding:5px 8px;border:1px solid #ffffff30;background:#11131b;color:inherit;font:inherit}
.work-media-dialog-frame video.work-media-file{display:block;width:100%;height:100%;max-height:calc(100svh - 40px);object-fit:contain;background:#000}
.work-media-error{margin:0;color:#f2f0e9}
/* Local making clips keep their authored poster/caption until explicitly played. */
.case-video-poster{position:relative;display:block;width:100%;aspect-ratio:16/9;margin:0;padding:0;border:0;background:#080b10;color:#f2f0e9;cursor:pointer;overflow:hidden}
.case-video-poster img{display:block;width:100%;height:100%;object-fit:contain}
.case-video-poster .case-video-play{position:absolute;inset:0;display:grid;place-items:center}
.case-video-poster .case-video-play svg{width:44px;height:44px;padding:11px;border:1px solid #ffffff99;border-radius:50%;background:#03050990;fill:currentColor;stroke:none}
.case-video-poster:hover .case-video-play{color:#bff55c}
.case-video-poster:focus-visible{outline:2px solid #bb2649;outline-offset:4px}
@media(max-width:700px){.work-media-dialog-controls{gap:8px 14px;font-size:11px;padding:8px 12px}.work-media-episodes{flex:1 1 100%}.work-media-episodes select{width:100%;max-width:100%}.case-video-poster .case-video-play svg{width:36px;height:36px;padding:9px}}

.work-media-dialog-controls .work-media-fallback{display:inline-flex;align-items:center;gap:14px;min-height:44px;padding:6px 0;font-size:12px;line-height:1.6}
.work-media-dialog-controls .work-media-fallback[hidden]{display:none}
.work-media-fallback svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.2;flex:none}



/* Short landscape keeps episode and recovery controls on one line. */
@media(max-height:500px) and (min-aspect-ratio:1/1){
 .work-media-dialog-controls{flex-wrap:nowrap;gap:10px;padding:8px 12px}
 .work-media-episodes{flex:1 1 0;margin-right:0;gap:7px;min-width:0}
 .work-media-episodes select{width:100%;max-width:100%;min-width:0}
 .work-media-dialog-controls :is(.work-media-problem,.work-media-fallback){flex:none;white-space:nowrap}
}
