/* A photo-gallery shelf; playback controls reveal on interaction. */
.media-gallery{position:fixed;bottom:max(14px,env(safe-area-inset-bottom));left:24px;right:24px;z-index:9;display:flex;align-items:center;justify-content:center;gap:18px;opacity:0;pointer-events:none;transition:opacity .2s ease}
.video-dialog.is-expanded .media-gallery{opacity:1;pointer-events:auto}
.media-gallery>button{border:0;background:#101010d9;border-radius:50%;width:38px;height:38px;flex:none;font-size:20px;color:#bfbfb9}
.media-thumbnails{display:flex;align-items:center;gap:7px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;padding:9px 4px;scroll-padding-inline:18px;max-width:100%;touch-action:pan-x}
.media-thumbnails::-webkit-scrollbar{display:none}
.gallery-thumbnail{position:relative;flex:none;padding:0;background:#101010;border:1px solid transparent;opacity:.42;border-radius:5px;transition:opacity .18s,border-color .18s,transform .18s;overflow:hidden}
.gallery-thumbnail:hover{opacity:.85}
.gallery-thumbnail.is-selected{opacity:1;border-color:#d8d8d2;transform:scale(1.035)}
.gallery-thumbnail:focus-visible{outline:1px solid #eee;outline-offset:3px}
.gallery-thumbnail img{display:block;object-fit:contain;width:100%;height:100%}
.video-thumbnail{width:92px;height:70px}
.video-thumbnail span{position:absolute;bottom:3px;left:3px;right:3px;font-family:monospace;font-size:8px;line-height:1.2;text-align:center;text-shadow:0 1px 4px #000;background:#0008;color:#ddd}
.video-dialog.is-expanded .watch-controls{opacity:0;pointer-events:none;bottom:108px;transition:opacity .2s ease;max-width:1000px;margin:auto;left:24px;right:24px}
.video-dialog.is-expanded.controls-visible .watch-controls{opacity:1;pointer-events:auto}
.gallery-dialog.is-art-expanded .cover-image-frame{inset:64px 0 114px;height:calc(100dvh - 178px)}
.cover-thumbnails{display:none}
.gallery-dialog.is-detail .cover-thumbnails{display:flex;position:fixed;bottom:max(18px,env(safe-area-inset-bottom));left:150px;right:150px;z-index:7;background:#030303e6}
.gallery-dialog.is-detail:not(.is-art-expanded) .cover-detail{bottom:128px}
.cover-thumbnail{width:66px;height:66px}
.cover-presentation{touch-action:pan-y pinch-zoom}
.cover-presentation img{user-select:none;-webkit-user-drag:none}
.gallery-dialog.is-detail .cover-controls{position:fixed;bottom:28px;left:18px;right:18px;width:auto;z-index:6}
.gallery-dialog.is-detail .cover-controls button{padding:12px 10px;font-family:monospace;font-size:11px;background:none}
.visualizer-scene{height:240svh}
.music-scene{height:145svh}
.visualizer-scene .scene-stage,.music-scene .scene-stage{background:#000}
.visualizer-scene .scene-stage::before,.music-scene .scene-stage::before{display:none}
.visualizer-panel-object{width:min(92vw,140svh);max-width:none;flex:none;transform:scale(var(--panel-scale,1));transform-origin:center;will-change:transform}
.visualizer-panel{width:100%;aspect-ratio:16/9;border-radius:clamp(22px,3vw,48px);background:#0a0a0a;border:0;box-shadow:none;display:flex;align-items:center;justify-content:center}
.visualizer-panel>.scene-video{width:100%;height:100%;object-fit:contain;background:transparent;border-radius:inherit}
.viewer-frame-hold{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:4;pointer-events:none;background:#000}
.stack-object{width:min(106vw,150svh);max-width:none;flex:none;transform-origin:0 0;will-change:transform;isolation:isolate}
.stack-photo{position:relative;width:100%;aspect-ratio:3/2}
.stack-photograph{display:block;width:100%;height:auto;position:relative;z-index:1;opacity:var(--stack-surround,1)}
.stack-screens{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;opacity:var(--stack-surround,1);filter:drop-shadow(0 0 3px #bcbcd822)}
.stack-main-screen{position:absolute;left:39%;top:44%;width:29%;height:33%;z-index:3;background:transparent;border-radius:7%/8%;overflow:hidden;border:0;box-shadow:none}
.stack-main-screen>.scene-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;background:#000;opacity:var(--stack-native,0)}
.stack-main-screen .screen-trigger{opacity:var(--stack-surround,1)}
.stack-glass{display:none}
.music-scene .scene-stage>.object-caption{opacity:var(--stack-surround,1)}
@media(max-width:650px){
 .stack-object{width:126vw}
 .visualizer-panel-object{width:94vw}
 .visualizer-panel{aspect-ratio:16/9;border-radius:22px}
 .media-gallery{left:12px;right:12px;gap:8px;bottom:max(12px,env(safe-area-inset-bottom))}
 .media-gallery>button{width:30px;height:34px;background:transparent}
 .video-thumbnail{width:72px;height:64px}
 .video-thumbnail span{font-size:7px}
 .gallery-dialog.is-detail .cover-thumbnails{left:58px;right:58px;bottom:max(16px,env(safe-area-inset-bottom))}
 .gallery-dialog.is-detail:not(.is-art-expanded) .cover-detail{bottom:104px}
 .cover-thumbnail{width:58px;height:58px}
 .gallery-dialog.is-detail .cover-controls{left:10px;right:10px;bottom:31px}
 .gallery-dialog.is-detail .cover-controls button{font-size:0;width:34px;padding:6px;background:none}
 .gallery-dialog.is-detail #previous-cover::before{content:'←';font-size:21px}.gallery-dialog.is-detail #next-cover::before{content:'→';font-size:21px}
 .video-dialog.is-expanded .watch-controls{bottom:102px;left:12px;right:12px}
 .gallery-dialog.is-art-expanded .cover-image-frame{inset:64px 0 100px;height:calc(100dvh - 164px)}
}
@media(prefers-reduced-motion:reduce){.gallery-thumbnail,.media-gallery{transition:none}}

/* The scene shelf belongs to the sticky chapter, never to a scroll trap. */
.scene-video-gallery{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:250px;right:165px;display:flex;align-items:center;justify-content:center;gap:16px;z-index:5;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(14px);transition:opacity .22s ease,transform .22s ease,visibility .22s}
.scene-video-gallery.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.scene-video-gallery>button{border:0;background:#101010d9;border-radius:50%;width:38px;height:38px;flex:none;color:#ddd;font-size:20px}
.is-gallery-ready>.object-caption{bottom:130px}
.visualizer-panel,.stack-object,.cover-object,.cover-detail{touch-action:pan-y pinch-zoom}
.zoom-box{touch-action:pan-y pinch-zoom}
.video-dialog.is-scroll-viewer .zoom-box{touch-action:pinch-zoom}
.event-card.is-previewing .event-card-caption{color:#c2c2bd}
.event-viewport{scroll-snap-type:x proximity}
.event-card{scroll-snap-align:center}
@media(max-width:850px){.scene-video-gallery{left:200px;right:80px;gap:10px}}
@media(max-width:650px){.scene-video-gallery{left:12px;right:12px;bottom:max(28px,env(safe-area-inset-bottom));gap:8px}.scene-video-gallery>button{background:transparent;width:30px;height:36px}.is-gallery-ready>.object-caption{bottom:120px}}
@media(max-height:520px){.visualizer-panel-object{width:min(90vw,calc((100svh - 180px)*1.77778))}.scene-video-gallery{bottom:8px}.scene-video-gallery .video-thumbnail{height:48px;width:64px}.is-gallery-ready>.object-caption{display:none}}
@media(prefers-reduced-motion:reduce){.scene-video-gallery{transition:none}}
