/* Cinematic fullscreen presentation; scene ratio and media/controller state are preserved. */
.dub-demo-stage { min-width:0; }
.dub-demo-fullscreen { position:absolute; z-index:1; top:10px; left:10px; display:flex; align-items:center; gap:7px; min-width:44px; min-height:44px; padding:6px 11px; background:#100e0de8; color:#fff5df; border:1px solid #fff0c355; border-radius:9px; font-size:12px !important; }
.dub-demo-fullscreen span[aria-hidden] { font-size:25px; line-height:1; }
.dub-control-demo[data-screen-expanded="true"] { position:fixed; inset:0; z-index:100; width:100%; height:100dvh; max-width:none; margin:0; padding:0; border:0; border-radius:0; background:#050505; display:flex; flex-direction:column; box-shadow:none; }
.dub-control-demo::backdrop { background:#050505; }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-head { display:none; }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-stage { flex:1; min-height:0; display:grid; place-items:center; overflow:hidden; padding: max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) 0 max(8px,env(safe-area-inset-left)); }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-scene { width:var(--dub-scene-width,100%); max-width:100%; flex-shrink:0; border:0; border-radius:0; aspect-ratio:1.91; }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-fullscreen { position:fixed; top:max(10px,env(safe-area-inset-top)); left:max(10px,env(safe-area-inset-left)); }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-script { flex-shrink:0; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:7px 18px; width:100%; max-width:1100px; margin:0 auto; padding:12px max(18px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left)); }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-role-row { grid-column:1; gap:10px; }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-line { grid-column:1; margin:0; min-height:0; font-size:clamp(18px,2.2vw,24px); line-height:1.4; }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-primary { grid-column:2; grid-row:1 / 3; width:175px; min-height:48px; margin:0; padding:10px 14px; border-radius:100px; }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-progress { grid-column:1 / -1; }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-hint { display:none; }
.dub-control-demo[data-screen-expanded="true"] .dub-demo-overlay { z-index:3; padding-bottom:max(12px,env(safe-area-inset-bottom)); }
@media(max-width:520px) {
  .dub-demo-fullscreen [data-screen-label] { display:none; }
  .dub-control-demo[data-screen-expanded="true"] .dub-demo-script { grid-template-columns:1fr; gap:8px; padding:10px 14px max(12px,env(safe-area-inset-bottom)); }
  .dub-control-demo[data-screen-expanded="true"] .dub-demo-primary { grid-column:1; grid-row:auto; width:100%; min-height:48px; }
  .dub-control-demo[data-screen-expanded="true"] .dub-demo-line { font-size:20px; }
}
@media(max-height:450px) and (min-width:521px) {
  .dub-control-demo[data-screen-expanded="true"] .dub-demo-script { padding-top:6px; padding-bottom:max(6px,env(safe-area-inset-bottom)); gap:3px 12px; }
  .dub-control-demo[data-screen-expanded="true"] .dub-demo-role { min-height:44px; }
  .dub-control-demo[data-screen-expanded="true"] .dub-demo-line { font-size:18px; }
}