/* Source-sized media windows. Wallpaper remains visible outside the window. */
html[data-theme] #world #cinema{--player-edge:16px}
html[data-theme] #world #cinema #cinema-view{display:grid;grid-template-columns:minmax(0,var(--player-width,900px));justify-content:center;align-content:start;align-items:start;grid-auto-rows:max-content;gap:0 14px;padding:12px 16px;background:transparent;min-width:0}
html[data-theme] #world #cinema #cinema-view.player-wide.player-with-location{grid-template-columns:minmax(0,var(--player-width,900px)) 232px}
html[data-theme] #world #cinema .cinema-chrome{grid-column:1;grid-row:1;width:100%;min-width:0;flex:none;margin:0;padding:3px;border-radius:6px;overflow:hidden;box-sizing:border-box}
html[data-theme] #world #cinema .player-stage{display:flex;align-items:stretch;justify-content:center;min-width:0;gap:0;background:transparent}
html[data-theme] #world #cinema .player-photo-editing{flex:0 0 var(--tools-width,196px);width:var(--tools-width,196px);min-width:0;max-height:var(--media-height,560px);overflow:auto;overscroll-behavior:contain;border-right:1px solid #535a62;background:#2c3035}
html[data-theme] #world #cinema .player-photo-editing[hidden]{display:none}
html[data-theme] #world #cinema #big-screen{position:relative;isolation:isolate;flex:none;width:var(--media-width,800px);height:var(--media-height,450px);min-height:0;max-width:none;aspect-ratio:auto;background:transparent;margin:0;border:0;border-radius:0;overflow:hidden}
html[data-theme] #world #cinema #big-screen::before,html[data-theme] #world #cinema #big-screen .screen-shade{display:none;content:none}
html[data-theme] #world #cinema #big-screen :is(#journey-video,#memory-photo,.photo-inline-canvas){position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;padding:0;z-index:1;object-fit:contain;background:transparent;animation:none}
html[data-theme] #world #cinema #big-screen :is(.screen-corner,.screen-title,.screen-date,.screen-disclaimer,#play-preview){z-index:3}
html[data-theme] #world #cinema .memory-margin{position:static;display:block;margin:0 0 10px;padding:13px;border:1px solid #717981;border-radius:4px;background:#252b30;color:#eef0f3;font:11px/1.5 var(--desktop-font,"Lucida Grande",sans-serif);box-shadow:0 2px 8px #0003}
html[data-theme] #world #cinema .memory-margin .margin-location{font-size:10px;margin:0 0 7px;color:#bac7d0}
html[data-theme] #world #cinema .memory-margin h2{font:600 17px/1.25 var(--desktop-font,"Lucida Grande",sans-serif);letter-spacing:0;margin:0 0 10px;color:#f4f5f7}
html[data-theme] #world #cinema #margin-description{font-size:11px;color:#cdd2d7;margin:0 0 13px}
html[data-theme] #world #cinema .memory-margin dl{margin:0;display:grid;gap:5px;border-top:1px solid #515b65;padding-top:10px;font-size:10px}
html[data-theme] #world #cinema .memory-margin dl div{display:grid;grid-template-columns:48px 1fr;gap:6px}
html[data-theme] #world #cinema .memory-margin dt{color:#aebcc6}
html[data-theme] #world #cinema .memory-margin dd{margin:0}
html[data-theme] #world #cinema .cinema-below{display:none}
html[data-theme] #world #cinema .player-modebar{min-height:34px;padding:5px 10px;gap:8px;flex-wrap:wrap}
html[data-theme] #world #cinema .cinema-titlebar{min-height:34px;padding:4px 8px;gap:8px;min-width:0}
/* The title must yield to the window controls even on a 240px portrait player. */
html[data-theme] #world #cinema .player-app{display:block;flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-theme] #world #cinema .player-app svg{display:inline-block;vertical-align:middle;margin-right:5px}
html[data-theme] #world #cinema .player-window-buttons,html[data-theme] #world #cinema .player-window-buttons button{flex:none}
html[data-theme] #world #cinema .transport{display:flex;flex-wrap:nowrap;gap:8px;padding:8px;min-width:0;flex:none}
html[data-theme] #world #cinema .transport :is(#previous-memory,#skip-memory,#play-small){width:34px;min-width:34px;height:32px;min-height:32px;padding:0;font-size:22px}
html[data-theme] #world #cinema .transport :is(#time-readout,#duration-readout){font-size:10px;font-variant-numeric:tabular-nums;flex:none}
html[data-theme] #world #cinema .transport #note-toggle{font-size:11px;min-height:30px;padding:4px 8px}
html[data-theme] #world #cinema .transport .scrub-label{min-width:25px}
html[data-theme] #world #cinema #player-location-dock{grid-column:1;grid-row:3;min-width:0;padding-top:10px}
html[data-theme] #world #cinema #cinema-view.player-wide #player-location-dock{grid-column:2;grid-row:1 / span 2;padding-top:0;position:sticky;top:12px}
html[data-theme] #world #cinema #player-location-dock[hidden]{display:none}
html[data-theme] #world #cinema #player-location-dock .route-window{position:relative!important;inset:auto!important;width:100%!important;max-width:none;transform:none!important;margin:0!important;border-radius:4px;box-shadow:0 3px 10px #0003}
html[data-theme] #world #cinema #player-location-dock #journey-map{height:140px!important}
html[data-theme] #world #cinema #player-location-dock .route-title{padding:5px 7px;font-size:11px;min-height:30px}
html[data-theme] #world #cinema #player-location-dock .route-caption{display:flex;padding:7px;font-size:10px;line-height:1.3}
html[data-theme] #world #cinema #player-location-dock .route-caption b{font-size:11px;white-space:normal}
html[data-theme] #world #cinema #player-location-dock .route-window small{display:block;font-size:9px;padding:5px 7px}
html[data-theme] #world #cinema .player-extras{grid-column:1;grid-row:2;display:flex;flex-wrap:wrap;align-items:center;gap:7px;width:100%;margin:0;padding:7px 8px;min-width:0;border:0;background:transparent;box-sizing:border-box}
html[data-theme] #world #cinema .player-extras>button{font-size:11px;min-height:30px;padding:5px 7px}
html[data-theme] #world #cinema .player-extras .journey-volume{margin-left:auto;font-size:10px;gap:6px}
html[data-theme] #world #cinema .player-extras .journey-volume input{width:72px}
html[data-theme] #world #cinema #player-error{grid-column:1;grid-row:4}
html[data-theme] #world #cinema :is(.cinema-below,.chapters,.next-stop){margin-inline:auto;max-width:1000px;width:calc(100% - 32px);min-width:0;box-sizing:border-box}
html[data-theme] #world #cinema.player-compact .transport{display:grid;grid-template-columns:34px 34px 34px 1fr auto;gap:5px}
html[data-theme] #world #cinema.player-compact #previous-memory{grid-column:1;grid-row:1}
html[data-theme] #world #cinema.player-compact #play-small{grid-column:2;grid-row:1}
html[data-theme] #world #cinema.player-compact #skip-memory{grid-column:3;grid-row:1}
html[data-theme] #world #cinema.player-compact #note-toggle{grid-column:5;grid-row:1}
html[data-theme] #world #cinema.player-compact #time-readout{grid-column:1;grid-row:2}
html[data-theme] #world #cinema.player-compact .scrub-label{grid-column:2 / 5;grid-row:2}
html[data-theme] #world #cinema.player-compact #duration-readout{grid-column:5;grid-row:2}
html[data-theme] body.cinema-expanded #world{background:transparent!important}
html[data-theme] body.cinema-expanded #world #cinema #cinema-view{position:fixed;inset:0;height:100dvh;width:100%;display:grid;padding:12px 16px;overflow:auto;background:transparent;box-sizing:border-box;align-content:safe center}
html[data-theme] body.cinema-expanded #world #cinema .cinema-chrome{flex:none;height:auto;min-height:0}
@media(max-width:620px){
 html[data-theme] #world #cinema #cinema-view,html[data-theme] body.cinema-expanded #world #cinema #cinema-view{padding:8px;align-content:start}
 html[data-theme] #world #cinema #playback-mode-note{display:none}
 html[data-theme] #world #cinema .player-app{font-size:11px;gap:5px}
 html[data-theme] #world #cinema #memory-kind{display:none}
 html[data-theme] #world #cinema .player-extras .journey-volume{margin-left:0}
}

/* Native fullscreen includes the chosen wallpaper and its treatment. */
html[data-theme] body.cinema-expanded #world::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:var(--scene) center/cover}
html[data-wallpaper-effect="infrared"][data-wallpaper-renderer="css"] body.cinema-expanded #world::before{filter:url(#hyd-infrared-photo)}
html[data-wallpaper-renderer="canvas"] body.cinema-expanded #world::before{background-image:var(--wallpaper-infrared,var(--scene))}

html[data-theme] body.cinema-expanded #world>#hyd-wallpaper-effect{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
html[data-theme] #world #cinema .player-extras>:is(button,.deck-launch,[data-random],.collection-link){width:auto;flex:0 0 auto;grid-column:auto;grid-row:auto;margin:0;order:0;white-space:nowrap}
html[data-theme] #world #cinema .player-extras{background:#252b30;border:1px solid #64717b;border-top:0;border-radius:0 0 4px 4px;box-shadow:0 3px 8px #0003;padding:8px}
html[data-theme] #world #cinema #player-location-dock{display:flex;flex-direction:column;align-items:stretch}
html[data-theme] #world #cinema #player-location-dock[hidden]{display:none}
html[data-theme] #world #cinema #player-location-dock .memory-margin{order:0}
html[data-theme] #world #cinema #player-location-dock .route-window{order:1}
html[data-theme] #world #cinema .screen-corner{font-size:9px;padding:4px 7px;top:10px;left:10px}