/* The same media, overlays, timeline and editable panels remain mounted. */
#player-shell{min-width:0}
.deepcut #player-shell{display:flex;flex-direction:column;flex:1;min-height:0}
/* The stage keeps its media/overlay geometry; transport has its own row. */
#editor #player-shell:fullscreen{display:flex;flex-direction:column;width:100%;height:100%;min-height:0;max-width:none;margin:0;padding:0;background:#000;overflow:hidden;scroll-padding:0}
#player-shell:fullscreen::backdrop{background:#000}
#editor #player-shell:fullscreen #video-slot{flex:1 1 0;height:auto!important;min-height:0;margin:0;width:100%}
#editor #player-shell:fullscreen .video-stage{position:relative!important;inset:auto!important;width:100%!important;height:100%!important;min-height:0;max-width:none!important;max-height:none!important;aspect-ratio:auto!important;border:0;border-radius:0;box-shadow:none!important;background:#000}
#editor #player-shell:fullscreen #deepcut-transport{flex:0 0 auto;background:var(--panel);padding:8px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));flex-wrap:wrap}
#editor #player-shell:fullscreen #deepcut-volume{display:block}
#player-shell:fullscreen .video-layout-tools{flex:none;margin:0;padding:6px;background:var(--panel);order:1}
#player-shell:fullscreen :is(#video-focus-toggle,.video-shortcuts,#floating-player-tools){display:none!important}
#player-shell:fullscreen #video-layout-status{flex:none;max-height:20vh;overflow:auto;padding:4px 12px;margin:0;background:var(--panel);order:2}
@media(max-width:600px){
  #editor #player-shell:fullscreen #deepcut-transport{gap:6px}
  #player-shell:fullscreen #deepcut-seek{order:1;flex-basis:100%}
  #player-shell:fullscreen #deepcut-clock{min-width:0;flex:1}
  #editor #player-shell:fullscreen #deepcut-volume{width:48px}
}
.video-layout-tools{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:6px 0 8px}
.video-layout-tools .button{min-height:36px;padding:7px 10px;white-space:normal}
.video-layout-tools [aria-pressed=true]{background:var(--accent);color:var(--color-background)}
.video-shortcuts{font-size:11px;color:var(--muted);flex:1 1 100%}
.video-shortcuts summary{cursor:pointer;width:max-content;padding:5px 0}
.video-shortcuts label{display:flex;align-items:center;gap:6px;margin:4px 0}
.video-shortcuts p{line-height:1.6;max-width:75ch}
.video-focus-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:8px 0}
.video-focus-actions>div{min-width:0}
.video-focus-actions button{width:100%;min-height:36px;white-space:normal;padding:6px}
.video-focus-actions small{display:block;color:var(--muted);font-size:10px;line-height:1.4;margin-top:4px;overflow-wrap:anywhere}
#editor.is-video-focus .video-actions-ready :is(#moment-zoom,#moment-cut){display:none}
#video-layout-status{margin:4px 0}
#video-layout-status:empty{display:none}
#editor.is-video-focus>.workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
#editor.is-video-focus #preview-panel{grid-column:1/-1;grid-row:1;min-width:0;width:100%}
#editor.is-video-focus :is(.settings-panel,.review-panel){position:static;grid-column:auto;max-height:none;width:100%;min-width:0}
#editor.is-video-focus .review-items{max-height:65dvh;overflow:auto}
#editor.is-video-focus #video-slot{height:clamp(240px,45dvh,760px)}
#editor.is-video-focus .timeline-card{padding:8px}
#editor.is-video-focus .timeline-track{margin:3px 0}
#editor.is-video-focus .timeline-card canvas{height:28px}
#editor.is-video-focus .timeline-lane{height:28px}
#editor.is-video-focus .timeline-event{top:1px;height:24px}
#editor.is-video-focus .timeline-event.is-pending{top:8px;height:18px}
#editor.is-video-focus .timeline-navigation{margin-top:6px}
#editor.is-video-focus .timeline-picker{margin-top:6px}
#editor.is-video-focus .timeline-detail{min-height:0;margin-top:6px}
@media(max-width:700px){
  #editor.deepcut.is-video-focus #deepcut-transport{flex-wrap:wrap;gap:6px}
  #editor.deepcut.is-video-focus #deepcut-seek{order:1;flex-basis:100%}
  #editor.deepcut.is-video-focus #deepcut-clock{min-width:0;flex:1}
  #editor.deepcut.is-video-focus #deepcut-volume{width:48px}
  #editor.is-video-focus>.workspace{grid-template-columns:minmax(0,1fr)}
  #editor.is-video-focus #video-slot{height:clamp(210px,42dvh,500px)}
  .video-focus-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-height:550px) and (min-width:701px){#editor.is-video-focus #video-slot{height:55dvh;min-height:160px}}
