/* Readable navigation and explicit entrances alongside the existing full-screen scenes. */
.mobile-nav-label,.mobile-contact,.mobile-break{display:none}
.rail-link{opacity:var(--link-opacity,.5)}
.rail-link:focus-visible,.mobile-contact:focus-visible,.scene-index button:focus-visible,.copy-email:focus-visible,.project-tile:focus-visible{outline:1px solid #eee;outline-offset:4px}
.portfolio-intro{position:absolute;top:100px;left:250px;right:165px;margin:0;text-align:center;color:#c1c1bd;font-size:13px;line-height:1.5;letter-spacing:.01em;pointer-events:none}
.scene-index{position:absolute;top:95px;right:36px;z-index:5;display:flex;align-items:center;gap:18px;font-family:monospace;font-size:10px;letter-spacing:.04em;color:#b4b4b0}
.scene-index button{border:0;background:none;color:#dededa;padding:0 8px;min-height:44px;cursor:pointer;font:inherit;white-space:nowrap}
.cover-index{top:auto;bottom:77px;right:36px}
.scene-stage:has(.scene-index)>.object-caption span:last-child{display:none}
.cover-go-to{white-space:nowrap;font-size:clamp(12px,1.1vw,17px)}
.back-button,.event-arrows button,.cover-controls button,.media-gallery>button,.scene-video-gallery>button,.player-button,.motion-toggle{min-width:44px;min-height:44px}
.media-gallery>button,.scene-video-gallery>button{width:44px;height:44px}
.event-arrows button{width:44px;height:44px}
.watch-seek{height:44px;margin:0}
.playback-toolbar{height:44px}
.selection-caption{position:fixed;z-index:8;left:72px;right:72px;bottom:103px;text-align:center;font-family:monospace;font-size:11px;line-height:1.4;color:#c1c1bd;pointer-events:none;text-shadow:0 1px 6px #000}
.selection-caption[hidden]{display:none}
.video-dialog.is-expanded .watch-controls{bottom:133px}
.video-thumbnail span{display:none}
.gallery-dialog.is-art-expanded .cover-image-frame{inset:70px 0 142px;height:calc(100dvh - 212px);cursor:pointer}
.gallery-dialog.is-detail:not(.is-art-expanded) .cover-detail{bottom:126px}
.gallery-dialog.is-art-expanded .gallery-top,.gallery-dialog.is-art-expanded .cover-controls{transition:opacity .2s}
.gallery-dialog.is-art-expanded.art-controls-hidden .gallery-top,.gallery-dialog.is-art-expanded.art-controls-hidden .cover-controls{opacity:0;pointer-events:none}
.project-dialog{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;border:0;background:#080808;color:#f1f1ed;padding:0 clamp(20px,5vw,76px) 60px;overflow:auto;overscroll-behavior:contain}
.project-dialog::backdrop{background:#030303}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 20px}
.project-tile{border:0;padding:0;background:none;text-align:left;min-width:0}
.project-tile img{display:block;width:100%;height:240px;object-fit:contain;background:#101010;border-radius:5px;transition:opacity .18s}
.project-tile:hover img{opacity:.8}
.project-tile>span{display:block;padding:12px 0;color:#c1c1bd;font-size:13px}
.copy-email{border:0;background:none;padding:0;min-height:44px;color:#b4b4b0;font-family:monospace;font-size:11px;letter-spacing:.04em}
.ux-toast{position:fixed;left:50%;bottom:max(32px,env(safe-area-inset-bottom));transform:translate(-50%,10px);z-index:50;background:#202020;border:1px solid #373737;border-radius:6px;color:#eee;padding:12px 18px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;white-space:nowrap}
.ux-toast.is-visible{opacity:1;transform:translate(-50%,0)}
.clipboard-fallback{position:fixed;left:-9999px}
.media-status{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:12;display:flex;flex-direction:column;gap:6px;align-items:center;max-width:90%;padding:14px 18px;border-radius:6px;background:#080808dd;color:#ddd;font:12px/1.4 monospace;text-align:center;pointer-events:auto}
.media-status[hidden]{display:none}.media-status button{min-height:44px;border:0;background:none;color:white;font:11px monospace;text-decoration:underline;text-underline-offset:4px}
.swipe-feedback{translate:var(--swipe-offset,0px) 0;transition:translate .18s cubic-bezier(.2,.7,.25,1)}
.swipe-feedback.is-dragging{transition:none}
@media(max-width:650px){
 .desktop-nav-label,.scene-nav .contact-link{display:none}.mobile-nav-label,.mobile-contact{display:inline-flex}.mobile-break{display:block}
 .rail{height:118px;padding:14px 16px;background:linear-gradient(#080808eb 0%,#080808b8 70%,transparent)}
 .wordmark{font-size:31px;min-height:44px;display:inline-flex;align-items:center}
 .mobile-contact{position:absolute;right:16px;top:14px;align-items:center;min-height:44px;font:11px monospace;color:#ddd}
 .motion-toggle{left:auto;right:111px;top:14px;padding:0 8px;font-size:0;gap:0}
 .motion-mark{width:9px;height:10px}.motion-toggle:focus-visible{outline:1px solid #ddd}
 .scene-nav{top:62px;left:16px;right:16px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;overflow:visible;padding:0;align-items:center}
 .scene-nav .rail-link{min-height:44px;display:flex;align-items:center;justify-content:center;font-size:12px}
 .scene-nav .rail-link.contact-link{display:none}
 .portfolio-intro{top:126px;left:16px;right:16px;font-size:12px;line-height:1.5}
 .scene-index{top:116px;right:16px;gap:12px;font-size:10px}
 .cover-index{top:auto;bottom:77px;right:16px}
 .scene-stage>.object-caption{right:140px}
 .cover-go-to{font-size:12px;min-height:44px}
 .visualizer-panel{aspect-ratio:var(--native-aspect,1.777778);width:min(94vw,calc(60svh * var(--native-aspect,1.777778)));max-height:60svh;margin:auto;border-radius:22px;transition:width .22s,aspect-ratio .22s}
 .visualizer-panel.is-portrait{border-radius:24px}
 .media-gallery,.scene-video-gallery{gap:4px;left:8px;right:8px}
 .media-gallery>button,.scene-video-gallery>button{flex:none;width:44px;height:44px}
 .video-thumbnail{height:58px;width:64px}
 .video-dialog.is-expanded .watch-controls{left:12px;right:12px;bottom:124px;padding:0 4px}
 .watch-filmstrip{display:none}
 .watch-seek{height:44px}
 .player-button{min-width:44px;min-height:44px;padding:4px;font-size:18px}
 .sound-button{font-size:10px;letter-spacing:0}
 .playback-toolbar{gap:4px}.playback-right{gap:0}.watch-time{font-size:10px}
 .watch-top #watch-title{max-width:48vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}
 .selection-caption{bottom:93px;left:55px;right:55px;font-size:10px}
 .cover-presentation{grid-template-rows:minmax(0,.28fr) minmax(0,1fr);gap:10px}
 .detail-package-area{justify-content:center;max-height:15svh;padding:0 9vw 0 0}
 .detail-package{width:min(29vw,15svh)}
 .gallery-dialog.is-detail:not(.is-art-expanded) .cover-detail{bottom:104px;top:72px}
 .gallery-dialog.is-detail .cover-detail-caption{gap:12px;align-items:center}
 .gallery-dialog.is-detail .cover-detail-caption h3{font-size:15px}
 .gallery-dialog.is-detail .cover-controls{bottom:24px;left:8px;right:8px}
 .gallery-dialog.is-detail .cover-controls button{width:44px;height:44px}
 .gallery-dialog.is-detail .cover-thumbnails{left:56px;right:56px;bottom:max(12px,env(safe-area-inset-bottom))}
 .gallery-dialog.is-art-expanded .cover-image-frame{inset:68px 0 130px;height:calc(100dvh - 198px)}
 .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}
 .project-tile img{height:190px}.project-tile>span{font-size:12px;line-height:1.5}
 .project-dialog .gallery-top{min-height:68px}
 .is-gallery-ready>.object-caption{bottom:115px}
}
@media(max-height:520px){.portfolio-intro{display:none}.scene-index{top:72px}.cover-index{top:auto;bottom:66px}.detail-package-area{display:none}.cover-presentation{grid-template-rows:1fr}.selection-caption{bottom:85px}.watch-filmstrip{display:none}.project-tile img{height:160px}}
@media(prefers-reduced-motion:reduce){.swipe-feedback,.visualizer-panel,.ux-toast{transition:none}}
.video-dialog.is-expanded:not(.controls-visible) .watch-top{opacity:0;pointer-events:none}
@media(min-width:651px){.portfolio-intro{left:36px;right:auto;top:146px;width:162px;text-align:left;font-size:11px;line-height:1.6}}
.project-tile.is-selected>span::after{content:' ·';color:#fff}

/* Inline contact icons share the existing direct links, with generous tap targets. */
.contact-icon{width:18px;height:18px;flex:none;display:block}
.top-contact a,.contact-details .email-address,.contact-details .instagram-address{display:inline-flex;align-items:center;gap:9px;min-height:44px;max-width:100%}
.contact-details .email-address .contact-icon{width:24px;height:24px}
.contact-details .email-address>span{min-width:0;overflow-wrap:anywhere}
.portfolio-intro{z-index:4}
@media(max-width:650px){
 .cover-scene .scene-stage{padding:174px 0 140px}
 .cover-object{--cover-height:max(1px,calc(100svh - 314px));width:var(--cover-size,min(96vw,var(--cover-height)))}
 .portfolio-intro{top:126px;line-height:18px}
 .cover-scene .scroll-hint{bottom:122px}
 .contact-details .contact-icon{width:18px;height:18px}
}
@media(max-width:650px) and (max-height:520px){
 .cover-scene .scene-stage{padding:128px 0}
 .cover-object{--cover-height:max(1px,calc(100svh - 256px))}
}
