.source-player{height:240px;min-width:200px;background:#080a10;margin:20px 0;border-radius:14px;overflow:hidden}.source-player iframe,.source-player video{width:100%;height:100%;border:0}.hero h2{font-size:26px;line-height:1.14;max-height:120px;overflow:hidden}.poster-title,.detail-body h1{overflow-wrap:anywhere}.poster .tag{max-width:calc(100% - 18px)}.art img{width:100%;height:100%;object-fit:cover}.hero>.art img{object-position:center 25%}.field select{width:100%;padding:12px;background:#171b2b;color:#fff;border:1px solid #3c3a52;border-radius:12px}.field{margin:16px 0}.source-player video{object-fit:contain}

.playback-controls{display:flex;gap:8px;margin:12px 0}.playback-controls button{flex:1;padding:12px 8px;font-size:13px}.source-player{position:relative}
.playback-stage{position:relative;height:240px;margin:20px 0;background:#000;border-radius:14px;overflow:hidden}.playback-stage .source-player{margin:0;height:100%;min-width:0;border-radius:0}.player-collapse{display:none;position:absolute;z-index:2;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));min-height:44px;padding:10px 14px;background:#121622e8;color:#fff;border:1px solid #ffffff50;border-radius:12px;font-size:13px}.player-toolbar{display:flex;gap:8px;flex-wrap:wrap}.player-toolbar .secondary{min-height:44px;flex:1;font-size:12px;padding:12px}.quality-hint{color:var(--muted);font-size:11px;line-height:1.6;margin:15px 0}.playback-stage:is(:fullscreen,:-webkit-full-screen){width:100%;height:100%;margin:0;border-radius:0;background:#000}.playback-stage:is(:fullscreen,:-webkit-full-screen) .player-collapse,.player-is-expanded .player-collapse{display:block}
.player-landscape-surface{position:relative;height:100%;width:100%;box-sizing:border-box}
dialog.player-expanded{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;border:0;border-radius:0;padding:0;overflow:hidden;background:#000}dialog.player-expanded #modal-content{height:100%;width:100%}dialog.player-expanded #modal-content>:not(.playback-stage){display:none!important}dialog.player-expanded .playback-stage{height:100%;width:100%;margin:0;border-radius:0}dialog.player-expanded .source-player{height:100%;width:100%}
.player-is-expanded .player-landscape-surface{position:absolute;inset:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
/* Keep the fullscreen root untransformed: Safari clips a rotated fullscreen root.
   Swap the inner surface dimensions instead, including the safe-area edges. */
@media (orientation:portrait){
 .player-is-expanded .player-landscape-surface{inset:auto;left:50%;top:50%;width:100dvh;height:100dvw;transform:translate(-50%,-50%) rotate(90deg);padding:env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left) env(safe-area-inset-top)}
 .player-is-expanded .player-collapse{top:max(12px,env(safe-area-inset-right));right:max(12px,env(safe-area-inset-bottom))}
}
