/* Only content moves between views. Fixed app chrome shares one geometry in every state. */
:root{--motion-enter:cubic-bezier(.22,1,.36,1);--motion-slide:cubic-bezier(.25,1,.5,1);--motion-spring:cubic-bezier(.22,1,.36,1)}
body .page-scroll.is-leaving,body .page-scroll.is-leaving>.independent-page,body .overview-shell.is-leaving,body #poster-carousel.is-leaving,body #map-stage.is-leaving{display:block!important;pointer-events:none}
.page-scroll.is-leaving{z-index:29}
.motion-ready .handmade-poster-card .poster-fan[data-ready] .fan-poster{transition:transform 560ms var(--motion-spring),opacity 260ms ease-out}
/* Background paper crossfades while the map retains its outgoing painted layer. */
.motion-ready body.hanbi-mobile{background:#fffdf3}
#motion-backdrops{position:fixed;inset:0;max-width:480px;margin:auto;z-index:0;pointer-events:none;overflow:hidden}
.motion-ready .desktop-scene{z-index:1}.motion-ready #map-postcard{background:transparent}
.motion-backdrop{position:absolute;inset:0;opacity:0;transition:opacity 360ms var(--motion-spring)}
.calendar-paper{background:#fff5f7 url('assets/handmade/calendar-background.png') center top/100% auto repeat-y}
.other-paper{background:#e8efb6 url('assets/handmade/other-background.png') center top/100% auto repeat-y}
body[data-view=calendar] .calendar-paper,body[data-view=other] .other-paper{opacity:1}
.mobile-veil{pointer-events:none}.has-ticket .mobile-veil{pointer-events:auto}
.motion-ready .floating-nav nav button{transition:background-color 160ms,color 160ms,box-shadow 160ms,scale 120ms var(--motion-enter)}
.motion-ready button:active{transition-duration:0s}
.motion-ready button{touch-action:manipulation}
@media(hover:hover) and (pointer:fine){
 .art-card{transition:box-shadow 180ms,translate 180ms var(--motion-enter)}
 .art-card:hover{translate:0 -2px;box-shadow:3px 5px 0 #f3ccd9,0 3px 9px #9d8c5a18}
 .compact-project .row-actions button:hover{box-shadow:0 2px 4px #9d8c5a18}
}
@media(prefers-reduced-motion:reduce){
 .motion-backdrop{transition-duration:110ms}
 .motion-ready .handmade-poster-card .poster-fan[data-ready] .fan-poster{transition:opacity 120ms}
 .art-card:hover{translate:0 0}
}
/* A single clipped selection lives inside the navigation, clear of the stitched frame. */
.floating-nav #nav{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));height:100%;min-width:0;padding:0;gap:0;overflow:hidden;border-radius:11px;isolation:isolate}
.floating-nav #nav:before{content:'';position:absolute;z-index:-1;inset:0 auto 0 0;width:calc(100%/3);border:2px solid transparent;box-sizing:border-box;border-radius:11px;background:#e7edcb;background-clip:padding-box;transform:translateX(0);transition:transform 320ms var(--motion-slide),background-color 200ms ease-out;pointer-events:none}
body[data-view=calendar] .floating-nav #nav:before{transform:translateX(100%);background:#faebbc}
body[data-view=other] .floating-nav #nav:before{transform:translateX(200%);background:#f3d3e1}
.floating-nav #nav>button{min-width:0;min-height:0;width:100%;height:100%;padding:0 4px;border-radius:9px}
.floating-nav #nav>button.active{background:transparent;box-shadow:none}
.floating-nav #nav>button:active{transform:none;scale:1}
@media(prefers-reduced-motion:reduce){.floating-nav #nav:before{transition:none}}

.motion-ready .handmade-brand{overflow:visible}
.motion-ready button:focus-visible,.motion-ready [role=button]:focus-visible{outline:2px solid #a0b47a;outline-offset:3px}