/* Match the interactive surface to the visible tunnel silhouette. */
.home-field .home-tile{width:min(calc((100% - 96px)/7),calc((100svh - 113px)/6 - 12px));clip-path:url(#project-tunnel)}
.home-field .home-tile .thumb{width:100%;height:100%}
.empty-tunnel{pointer-events:none}
.empty-tunnel .thumb{transition:none}
.home-field .home-tile.awaiting-entrance{visibility:hidden;pointer-events:none}
.home-field.home-entering .home-tile{transition:none!important;pointer-events:none}
.hover-study .thumb,.hover-study img{background:transparent}
.hover-study img{object-fit:contain!important;object-position:center!important}
.project-link .thumb{isolation:isolate}
.project-link .thumb:after{content:'';position:absolute;inset:0;pointer-events:none;background:var(--project-color,#101010);mix-blend-mode:multiply;opacity:0;transition:opacity .4s}
.project-link:focus-visible .thumb img{filter:grayscale(1);transform:none}
.project-link:focus-visible .thumb:after{opacity:.75}
@media(hover:hover) and (pointer:fine){
 .project-link:hover .thumb img{filter:grayscale(1);transform:none}
 .project-link:hover .thumb:after{opacity:.75}
}
header nav a:before,header nav a+a:before{content:none!important}
@media(max-width:800px){
 .home-field .home-tile{width:min(calc((100% - 48px)/4),calc((100svh - 113px)/7 - 10px))}
 header.menu-open nav{gap:18px}
}
@media(prefers-reduced-motion:reduce){.empty-tunnel .thumb,.project-link .thumb:after{transition:none}}

/* Keep the entrance hint and action together above the bottom edge. */
.entry-title{inset:auto 0 0;flex-direction:row;align-items:center;justify-content:center;padding:0 16px max(76px,calc(env(safe-area-inset-bottom) + 60px));gap:24px;z-index:2;color:#fff;mix-blend-mode:normal}
.entry-scroll-hint{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:10px;letter-spacing:.025em;line-height:1.4;text-shadow:0 1px 4px #0008}
.entry-mouse-icon{display:block;overflow:visible}.entry-wheel{animation:entry-wheel-guide 1.6s ease-in-out 3}
.entry-swipe-icon,.entry-touch-label{display:none}
.entry-title #enter{pointer-events:auto;display:flex;align-items:center;justify-content:center;gap:22px;min-width:154px;min-height:44px;padding:0 19px;margin:0;border:1px solid #ffffff65;border-radius:30px;background:#1d1d1d45;color:#fff;font-size:11px;font-weight:400;line-height:1.3;backdrop-filter:blur(4px);transition:background .25s,border-color .25s}
.entry-title #enter span{font-size:14px}.entry-title #enter:hover{background:#1d1d1d88;border-color:#ffffffb0;text-decoration:none}.entry-title #enter:focus-visible{outline:2px solid #fff;outline-offset:5px}.entry-title #enter:disabled{cursor:default}
@keyframes entry-wheel-guide{0%,100%{opacity:.45;transform:translateY(0)}45%{opacity:1}75%{opacity:0;transform:translateY(6px)}}
@media(pointer:coarse){.entry-mouse-icon,.entry-desktop-label{display:none}.entry-swipe-icon,.entry-touch-label{display:block}}
@media(max-height:600px){.entry-title{padding-bottom:max(62px,calc(env(safe-area-inset-bottom) + 46px))}.entry-scroll-hint{gap:4px;font-size:9px}.entry-mouse-icon,.entry-swipe-icon{height:25px}}
@media(prefers-reduced-motion:reduce){.entry-wheel{animation:none}.entry-title #enter{transition:none}}
/* Progress stays secondary and clear of the entrance controls. */
.entry-foot #depth{position:absolute;right:0;bottom:28px;font-size:8px;opacity:.65}
.entry-scroll-hint{flex-direction:row;gap:9px;font-size:9px;white-space:nowrap}.entry-mouse-icon,.entry-swipe-icon{width:20px;height:28px;flex-shrink:0}
@media(max-width:400px){.entry-title{gap:16px}}

/* Bring the EAI emblem closer within its album tunnel, including hover/focus. */
.project-link .thumb img[src="assets/eai/cover-v1.webp"],
.project-link:hover .thumb img[src="assets/eai/cover-v1.webp"],
.project-link:focus-visible .thumb img[src="assets/eai/cover-v1.webp"]{transform:scale(1.25);transform-origin:center}

/* Home entrance uses an upward masked reveal at full opacity. */
.home-title{overflow:hidden;line-height:1.2;padding:.04em 0}
.home-title-track{display:block}
.home-field.home-entering .home-tile .thumb{transition:none!important}

/* Route changes use a solid moving cover, never a dissolve. */
#page-wipe{opacity:1;transform:translateY(100%)}

/* Reserve the complete name while the visible letters type in place. */
.hover-name-measure{display:block;visibility:hidden}
.hover-name-display{position:absolute;inset:0;text-align:center}
.hover-name-display .type-caret{font-size:.8em;vertical-align:.05em}
@media(prefers-reduced-motion:reduce){.hover-name-display .type-caret{display:none}}

/* Touch gestures on the intro always scroll; desktop mouse dragging remains available. */
@media(max-width:800px),(pointer:coarse){#entry .shape-hit{pointer-events:none;touch-action:pan-y;cursor:default}}

.hover-project-name{white-space:nowrap;max-width:none}
.hover-name-measure{padding-inline:.5em}
