/* Stable exits, deliberate tap targets and one consistent media interaction. */
.video-dialog.is-expanded:not(.controls-visible) .watch-top,.gallery-dialog.is-art-expanded.art-controls-hidden .gallery-top{opacity:1;pointer-events:auto}
.video-dialog:not(.controls-visible) #watch-title{opacity:.5}
.watch-top,.gallery-dialog.is-detail .gallery-top{padding-top:max(8px,env(safe-area-inset-top))}
.screen-action{opacity:.82;background:#080808a8;border:1px solid #ffffff26;border-radius:20px;padding:8px 14px;font:11px monospace;letter-spacing:.02em;bottom:16px}
.screen-action::before{content:'▶ ';font-size:9px}
.screen-trigger:hover .screen-action{opacity:1}
.auto-browse{position:fixed;right:24px;bottom:max(19px,env(safe-area-inset-bottom));z-index:40;display:flex;align-items:center;gap:8px;min-height:44px;border:1px solid #ffffff22;border-radius:24px;background:#080808dc;padding:0 14px;font:11px monospace;color:#ccc}
.modal-open .auto-browse{bottom:auto;top:max(12px,env(safe-area-inset-top));right:80px}
.modal-open .watch-top #watch-title{max-width:35vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scroll-cue{bottom:76px}
.gesture-hint{position:fixed;z-index:35;left:50%;bottom:160px;transform:translateX(-50%);margin:0;padding:8px 12px;font:9px monospace;white-space:nowrap;color:#aaa;background:#080808b8;border-radius:18px;opacity:0;pointer-events:none;transition:opacity .2s}
.gesture-hint.is-visible{opacity:1}
.scene-beat{position:absolute;bottom:128px;left:0;right:0;text-align:center;font:10px monospace;color:#b4b4b0;letter-spacing:.05em}
.loop-selection{justify-content:flex-start!important;align-items:center;gap:12px!important;bottom:74px!important;pointer-events:auto!important;opacity:var(--stack-surround,1)}
.loop-selection button{background:none;border:0;min-width:44px;min-height:44px;font-size:20px;color:#ccc}
.loop-selection #loop-selection{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60vw;font:12px monospace}
.project-tile img{height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:8px}
.project-meta{display:block;font:10px/1.5 monospace;color:#999;margin-top:4px}
.project-tile>span{padding:10px 0 0;line-height:1.4}
.cover-detail,.zoom-box{touch-action:pinch-zoom}
.cover-detail.is-dragging,.zoom-box.is-dragging{transition:none}
.vertical-feedback{translate:0 var(--dismiss-offset,0px);scale:var(--dismiss-scale,1);transition:translate .2s,scale .2s}
.vertical-feedback.is-dragging{transition:none}
@media(max-width:650px){
 .rail{padding-top:max(10px,env(safe-area-inset-top));height:108px}
 .scene-nav{top:56px}.portfolio-intro{top:116px;font-size:11px;line-height:17px}
 .cover-scene .scene-stage{padding:156px 0 122px}.cover-object{--cover-height:max(1px,calc(100svh - 278px))}
 .cover-go-to{position:absolute;top:auto;bottom:99px;left:0;right:0;transform:none;justify-content:center;opacity:1!important;pointer-events:auto!important;min-height:44px;font-size:12px}
 .cover-index{bottom:61px;left:16px;right:16px;justify-content:center;gap:12px;font-size:9px}.cover-index>span{display:none}
 .cover-scene .object-caption{bottom:146px;left:16px;right:16px;justify-content:center;font-size:10px}
 .auto-browse{right:12px;bottom:max(10px,env(safe-area-inset-bottom));font-size:9px;padding:0 11px;min-height:44px}
 .modal-open .auto-browse{right:62px;top:max(12px,env(safe-area-inset-top));padding:0 8px;min-height:44px;font-size:8px}
 .modal-open .watch-top #watch-title{display:none}
 .modal-open .watch-top{grid-template-columns:1fr auto}
 .gallery-dialog.is-detail .project-brand{visibility:hidden}
 .scroll-cue{left:16px;right:auto;bottom:24px;opacity:.5;font-size:9px}
 .visualizer-panel-object{width:94vw;height:60svh;display:flex;align-items:center;justify-content:center}
 .visualizer-panel{width:100%;height:auto;aspect-ratio:16/9!important;max-height:100%;border-radius:22px;transition:none}
 .visualizer-panel.is-portrait{width:min(94vw,calc(60svh * var(--native-aspect)));height:60svh;aspect-ratio:var(--native-aspect)!important}
 .scene-beat{bottom:116px;font-size:9px}.is-gallery-ready>.object-caption{display:none}
 .loop-selection{left:12px!important;right:12px!important;bottom:64px!important;justify-content:center!important;gap:3px!important}
 .loop-selection #loop-selection{max-width:70vw;font-size:10px}
 .gesture-hint{bottom:160px;font-size:8px;max-width:95vw;text-align:center;white-space:normal}
 .project-grid{gap:24px 12px}.project-tile img{height:auto}.project-meta{font-size:9px}
 .contact-section .contact-intro h2{font-size:clamp(32px,9vw,40px)}
}
@media(max-width:650px) and (max-height:520px){.cover-scene .scene-stage{padding:116px 0 100px}.cover-object{--cover-height:max(1px,calc(100svh - 216px))}.cover-go-to{bottom:65px}.cover-index{bottom:34px}.cover-scene .object-caption{display:none}.visualizer-panel-object{height:calc(100svh - 150px)}.visualizer-panel.is-portrait{height:100%}.scene-beat{bottom:72px}}
@media(prefers-reduced-motion:reduce){.vertical-feedback,.gesture-hint{transition:none}}
@media(max-width:650px){
 .rail{height:calc(108px + env(safe-area-inset-top,0px))}
 .mobile-contact,.motion-toggle{top:max(10px,env(safe-area-inset-top))}
 .scene-nav{top:calc(56px + env(safe-area-inset-top,0px))}
 .portfolio-intro{top:calc(116px + env(safe-area-inset-top,0px))}
 .cover-scene .scene-stage{padding-top:calc(156px + env(safe-area-inset-top,0px))}
 .cover-object{--cover-height:max(1px,calc(100svh - 278px - env(safe-area-inset-top,0px)))}
}

.visualizer-scene .object-caption{bottom:155px;left:250px;right:165px;justify-content:center;font-size:10px}.visualizer-scene .object-caption #visualizer-title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:100%}
@media(max-width:650px){.visualizer-scene .object-caption,.visualizer-scene .is-gallery-ready>.object-caption{display:flex;left:16px;right:16px;bottom:143px;font-size:9px}}
@media(max-height:520px){.visualizer-scene .object-caption{display:none!important}}