@font-face{font-family:BlackHan;src:url('/Black_Han_Sans/BlackHanSans-Regular.ttf') format('truetype');font-display:swap}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;min-height:100%;background:#080907}body{cursor:url('/assets/cursor-45-hq.webp') 28 8,auto}.viewport{height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden}.scene-wrap{position:relative;flex-shrink:0}.scene{width:1440px;height:1000px;transform-origin:top left;position:relative;background:url('/1st%20page/background1.webp') center/100% 100% no-repeat}.draggable{position:absolute;touch-action:none;user-select:none;transition:translate .65s cubic-bezier(.18,.8,.25,1)}.dragging{transition:none;z-index:5}.eye{left:1008px;top:58px;width:220px;height:191px}.eye img{width:100%;height:100%;object-fit:contain;animation:levitate 4s ease-in-out infinite;transition:transform .25s}.eye:hover img{transform:scale(1.08)}.title{left:1020px;top:225px}.title h1{margin:0;font-family:BlackHan,sans-serif;font-size:84px;font-weight:400;line-height:1.15;background:linear-gradient(#e0e0ca 15%,#610808 95%);color:transparent;background-clip:text;transition:transform .25s}.title:hover h1{transform:scale(1.06)}.enter{position:absolute;left:470px;top:380px;width:500px;height:300px;display:block;transition:transform .2s;cursor:inherit}.enter:hover,.enter:focus-visible{transform:scale(1.05)}.frame{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.caption{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:BlackHan,sans-serif;font-size:43px;color:#e0e0ca;white-space:nowrap;pointer-events:none}.shadow{color:#000;transform:translateY(7px)}@keyframes levitate{0%,100%{translate:0 0}50%{translate:0 -9px}}.eye.dragging img{animation-play-state:paused}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}



.title h1{position:relative}.fracture{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .55s ease}.title:hover .fracture,.enter:hover .fracture,.enter:focus-visible .fracture{opacity:1}.crack-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.crack-lines path{fill:none;stroke:#100704;stroke-width:1.15;filter:drop-shadow(.35px .35px 0 rgba(241,219,175,.6));stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .35s ease}.title:hover path,.enter:hover path,.enter:focus-visible path{stroke-dashoffset:0;transition:stroke-dashoffset .65s ease var(--delay)}.enter .crack-lines{inset:25% 9%;width:82%;height:50%;mask:url('/assets/button.webp') center/122% 200% no-repeat}.crumb{position:absolute;width:2px;height:3px;background:#baa98b;clip-path:polygon(0 0,100% 25%,65% 100%,10% 70%);opacity:0}.title:hover .crumb,.enter:hover .crumb,.enter:focus-visible .crumb{animation:crumble 2.8s ease-in infinite var(--delay)}@keyframes crumble{0%,12%{opacity:0;transform:translate(0,0) rotate(0)}22%{opacity:.65}80%,100%{opacity:0;transform:translate(var(--drift),var(--fall)) rotate(110deg)}}@media(prefers-reduced-motion:reduce){.crumb{display:none}.crack-lines path{transition:none!important}.fracture{transition:none}}







.crack-lines path{filter:none;stroke-linejoin:bevel}.crack-lines .edge{stroke:#d8b58a;stroke-width:2.2;opacity:.6;transform:translate(.45px,.55px)}.crack-lines .depth{stroke:#30150e;stroke-width:1.8;opacity:.95}.crack-lines .core{stroke:#090504;stroke-width:.7;opacity:1}.crack-lines .depth:nth-child(3n){stroke-width:2.5}.crack-lines .core:nth-child(2n){stroke-width:.4}
.title h1::after{content:'riprit';position:absolute;inset:0;color:transparent;background:linear-gradient(110deg,transparent 30%,rgba(255,255,232,.85) 48%,transparent 65%);background-size:300% 100%;background-position:150% 0;background-clip:text;opacity:0;pointer-events:none}.title:hover h1::after{opacity:1;animation:title-shimmer 1.8s ease-in-out infinite}@keyframes title-shimmer{from{background-position:150% 0}to{background-position:-50% 0}}@media(prefers-reduced-motion:reduce){.title:hover h1::after{animation:none;opacity:0}}
/* A sudden central fracture replaces the drawn-line reveal. */
.enter .crack-lines{transform-origin:50% 50%;opacity:0;clip-path:circle(0% at 50% 50%)}.enter .crack-lines path{stroke-dasharray:none;stroke-dashoffset:0;transition:none!important}.enter:hover .crack-lines,.enter:focus-visible .crack-lines{animation:impact-fracture .58s linear both}.enter .fracture{transition:opacity .2s ease}.enter:hover .fracture,.enter:focus-visible .fracture{opacity:1}@keyframes impact-fracture{0%{opacity:1;clip-path:circle(0% at 50% 50%)}67%{opacity:1;clip-path:circle(31% at 50% 50%);animation-timing-function:cubic-bezier(.35,0,.7,.4)}100%{opacity:1;clip-path:circle(75% at 50% 50%)}}@media(prefers-reduced-motion:reduce){.enter:hover .crack-lines,.enter:focus-visible .crack-lines{animation:none;opacity:1;clip-path:none}}



/* Each fracture grows independently from its own local origin. */
.enter .crack-lines{opacity:1;clip-path:none}.enter:hover .crack-lines,.enter:focus-visible .crack-lines{animation:none}.enter .crack-lines path{clip-path:circle(0% at var(--origin));animation:none}.crack-zone-0{--origin:21% 48%;--onset:0s}.crack-zone-1{--origin:49% 50%;--onset:.035s}.crack-zone-2{--origin:78% 45%;--onset:.065s}.enter:hover .crack-lines path,.enter:focus-visible .crack-lines path{animation:local-fracture .58s linear var(--onset) both}@keyframes local-fracture{0%{clip-path:circle(0% at var(--origin))}67%{clip-path:circle(7.5% at var(--origin));animation-timing-function:cubic-bezier(.35,0,.7,.4)}100%{clip-path:circle(75% at var(--origin))}}@media(prefers-reduced-motion:reduce){.enter:hover .crack-lines path,.enter:focus-visible .crack-lines path{animation:none;clip-path:none}}
/* Instant cracks; only the falling debris remains animated. */
.enter .fracture{transition:none}.enter .crack-lines,.enter .crack-lines path{animation:none!important;clip-path:none!important}.enter .crack-lines path{stroke-dasharray:none;stroke-dashoffset:0;transition:none!important}
/* Diagonal gleam across the lettering and the original logo silhouette. */
.title h1::after{background:linear-gradient(135deg,transparent 38%,rgba(255,248,216,.35) 44%,rgba(255,255,239,.95) 50%,rgba(255,248,216,.35) 56%,transparent 62%);background-size:280% 280%;background-position:100% 100%;background-clip:text;filter:drop-shadow(0 0 2px rgba(244,225,179,.5))}.title:hover h1::after{animation:diagonal-gleam 1.8s ease-in-out infinite}.eye::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,transparent 38%,rgba(255,245,208,.25) 44%,rgba(255,255,235,.85) 50%,rgba(255,245,208,.25) 56%,transparent 62%);background-size:280% 280%;background-position:100% 100%;mask:url('/1st%20page/logo.webp') center/contain no-repeat;-webkit-mask:url('/1st%20page/logo.webp') center/contain no-repeat;opacity:0;translate:0 0;transition:opacity .2s,transform .25s;animation:levitate 4s ease-in-out infinite}.eye:hover::after{opacity:1;transform:scale(1.08);animation:levitate 4s ease-in-out infinite,diagonal-gleam 1.8s ease-in-out infinite}.eye.dragging::after{animation-play-state:paused,running}@keyframes diagonal-gleam{0%{background-position:100% 100%}100%{background-position:0% 0%}}@media(prefers-reduced-motion:reduce){.eye::after,.eye:hover::after,.title:hover h1::after{animation:none;opacity:0}}
/* Matching diagonal direction and timing for both branding elements. */
.title h1::after{background-image:linear-gradient(45deg,transparent 38%,rgba(255,245,208,.25) 44%,rgba(255,255,235,.85) 50%,rgba(255,245,208,.25) 56%,transparent 62%);background-size:280% 280%;background-position:100% 0%;filter:none}.eye::after{background-image:linear-gradient(45deg,transparent 38%,rgba(255,245,208,.25) 44%,rgba(255,255,235,.85) 50%,rgba(255,245,208,.25) 56%,transparent 62%);background-size:280% 280%;background-position:100% 0%}.title:hover h1::after{animation:diagonal-gleam 1.8s ease-in-out infinite}.eye:hover::after{animation:levitate 4s ease-in-out infinite,diagonal-gleam 1.8s ease-in-out infinite}@keyframes diagonal-gleam{0%{background-position:100% 0%}100%{background-position:0% 100%}}@media(prefers-reduced-motion:reduce){.eye:hover::after,.title:hover h1::after{animation:none;opacity:0}}
.map-scene{background-image:url('/2nd%20page/background2.webp')}.enter{border:0;padding:0;background:transparent;text-decoration:none}.map-scene .enter{width:412px;height:247px}.map-scene .caption{font-size:32px}.door-button{left:530px;top:68px}.chest-button{left:830px;top:331px}.under-development{position:absolute;left:210px;top:465px;font:24px Arial,sans-serif;color:#e0e0ca}.back{position:absolute;left:24px;bottom:100px;color:#e0e0ca;font:30px BlackHan,sans-serif;text-decoration:none;cursor:inherit}.back:hover{color:white;transform:scale(1.05)}.drag-hint{position:absolute;right:28px;top:45px;color:#e0e0ca;font:24px Arial,sans-serif;text-align:right}.flying-eye{left:1150px;top:85px;width:210px;height:182px;position:absolute;touch-action:none}.flying-area{position:absolute;inset:0;pointer-events:none}.flying-eye{pointer-events:auto}.magic-star{position:absolute;color:#fff7d8;font-size:24px;pointer-events:none;animation:magic-fade .8s ease-out forwards;text-shadow:0 0 8px #fff,0 0 14px #efdb9b}@keyframes magic-fade{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.1) translateY(16px)}}.gallery-backdrop,.full-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.58);display:flex;align-items:center;justify-content:center;z-index:20}.gallery-row{display:flex;align-items:center;justify-content:center;width:min(900px,96vw);gap:12px}.arrow{background:none;border:0;padding:0;width:72px;flex-shrink:0;cursor:inherit}.arrow img{width:100%}.card-window{display:flex;width:min(560px,70vw);height:min(720px,86svh);align-items:center;gap:12px;overflow:hidden;justify-content:center;touch-action:pan-y;cursor:inherit}.chest-card{height:100%;width:auto;max-width:90%;object-fit:cover;flex-shrink:0;user-select:none}.full-backdrop{z-index:30;background:rgba(0,0,0,.85);overflow:hidden}.full-backdrop img{max-width:92vw;max-height:92svh;object-fit:contain;touch-action:none;user-select:none}.arrow:hover{filter:brightness(1.2)}@media(max-width:600px){.arrow{width:38px}.gallery-row{gap:4px}.card-window{width:74vw;height:min(75svh,540px)}}
/* Browser zoom enlarges the scene instead of being cancelled by fit-to-window. */
.viewport{overflow:visible;min-width:min-content;min-height:100svh;height:auto;padding:0}.scene-wrap{margin:auto}body{overflow:auto}#root{min-height:100svh}.viewport{display:grid;place-items:center}
/* Home composition matched to the supplied 1440 × 1000 Framer reference. */
.scene:not(.map-scene){background:none;isolation:isolate}.scene:not(.map-scene)::before{content:'';position:absolute;inset:0;z-index:-1;background:url('/1st%20page/background1.webp') center/100% 100% no-repeat;filter:brightness(.84) saturate(.86) contrast(1.04);pointer-events:none}.scene:not(.map-scene)>.eye{left:1010px;top:44px;width:210px;height:182px}.scene:not(.map-scene)>.title{left:972px;top:196px}.scene:not(.map-scene)>.title h1{font-size:100px}.scene:not(.map-scene)>.enter{left:514px;top:376px;width:412px;height:247px}.scene:not(.map-scene)>.enter .caption{font-size:38px}



/* Map layout measured against the supplied desktop reference. */
.map-scene .enter{width:250px;height:150px}.map-scene .door-button{left:680px;top:130px}.map-scene .chest-button{left:980px;top:393px}.map-scene .caption{font-size:28px}.map-scene .shadow{transform:translateY(5px)}.map-scene .under-development{left:297px;top:469px;margin:0;font-size:23px}.map-scene .back{left:90px;top:855px;bottom:auto;font-size:32px}.map-scene .drag-hint{right:100px;top:63px;margin:0;font-size:23px}.map-scene .flying-eye{left:1080px;top:85px;width:210px;height:182px}.gallery-row{width:min(730px,98vw);gap:0;transform:translateY(-40px)}.card-window{width:min(510px,72vw);height:min(660px,78svh);flex-shrink:0;gap:0;border-radius:6px;touch-action:pan-y}.chest-card{display:none;border-radius:6px}.chest-card.active{display:block;width:100%;height:100%;max-width:100%;object-fit:cover}.arrow{width:110px;position:relative;z-index:1;flex-shrink:1}.arrow img{display:block;width:100%}.full-backdrop img{border-radius:6px}@media(max-width:600px){.gallery-row{width:98vw;transform:none}.card-window{width:72vw;height:min(93vw,74svh)}.arrow{width:13vw}}
/* A clear laminate finish, without modifying the original artwork. */
.gallery-row{perspective:1200px}.laminated{position:relative;overflow:hidden;background:#d2c7b4;border:1px solid rgba(255,250,229,.55);box-shadow:0 18px 38px rgba(0,0,0,.45),1px 1px 0 rgba(255,255,255,.4),3px 3px 0 rgba(90,75,57,.65);transform-style:preserve-3d;will-change:transform,opacity}.laminated::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(122deg,rgba(255,255,255,.19) 0%,rgba(255,255,255,.03) 32%,rgba(255,255,255,.18) 36%,transparent 43%,transparent 70%,rgba(255,255,255,.07) 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.24),inset 0 2px 5px rgba(255,255,255,.24);z-index:2}.laminated.turn-out{animation:card-slide-out .19s ease-in both}.laminated.turn-in{animation:card-slide-in .28s cubic-bezier(.18,.7,.25,1) both}.laminated.turn-in::after{animation:laminate-flash .45s ease-out}@keyframes card-slide-out{from{transform:translateX(0) rotateY(0);opacity:1}to{transform:translateX(calc(var(--direction)*-65px)) rotateY(calc(var(--direction)*18deg)) rotateZ(calc(var(--direction)*-3deg));opacity:0}}@keyframes card-slide-in{from{transform:translateX(calc(var(--direction)*65px)) rotateY(calc(var(--direction)*-18deg)) rotateZ(calc(var(--direction)*3deg));opacity:0}to{transform:translateX(0) rotateY(0) rotateZ(0);opacity:1}}@keyframes laminate-flash{from{opacity:.3}45%{opacity:1}to{opacity:1}}@media(prefers-reduced-motion:reduce){.laminated.turn-in,.laminated.turn-out,.laminated.turn-in::after{animation:none}}
/* Hand-held card response: off-axis motion, moving reflections and stacked edges. */
.gallery-row{perspective:1500px;position:relative}.gallery-row::before,.gallery-row::after{content:'';position:absolute;width:min(510px,72vw);height:min(660px,78svh);border-radius:6px;background:#b6aa94;border:1px solid #dbd0bb;box-shadow:0 16px 32px #0007;pointer-events:none;z-index:-1}.gallery-row::before{transform:translate(9px,8px) rotate(2.2deg)}.gallery-row::after{transform:translate(-5px,4px) rotate(-1.3deg);background:#d3c6ad}.laminated{overflow:visible;transform:translateX(var(--pull,0px)) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotateZ(var(--roll,0deg));transition:transform .12s ease-out;cursor:grab;border-color:rgba(255,255,255,.65);box-shadow:0 25px 45px #0008,0 2px 2px #17120c,2px 2px 0 #bcb09b;touch-action:none}.laminated:active{cursor:grabbing;transition:none}.laminated .active{border-radius:5px}.laminated::after{background:radial-gradient(ellipse at var(--mx,8%) var(--my,8%),rgba(255,255,255,.42),rgba(255,255,255,.09) 24%,transparent 60%),linear-gradient(115deg,transparent 32%,rgba(255,255,255,.025) 39%,rgba(255,255,255,.35) 42%,rgba(255,255,255,.06) 45%,transparent 54%);background-size:100% 100%,180% 180%;background-position:center,var(--mx,8%) var(--my,8%);mix-blend-mode:screen;box-shadow:inset 0 0 0 1px #fff6,inset 1px 1px 3px #fffa,inset -1px -1px 2px #0005}.laminated.turn-out{animation:hand-card-out .3s cubic-bezier(.4,0,.8,.5) both}.laminated.turn-in{animation:hand-card-in .42s cubic-bezier(.16,.8,.22,1) both}@keyframes hand-card-out{0%{transform:translateX(0) rotateY(0);opacity:1}65%{opacity:1}100%{transform:translate3d(calc(var(--direction)*-300px),65px,160px) rotateY(calc(var(--direction)*-32deg)) rotateZ(calc(var(--direction)*-20deg));opacity:0}}@keyframes hand-card-in{0%{transform:translate3d(8px,10px,-60px) rotateY(calc(var(--direction)*10deg)) rotateZ(3deg);filter:brightness(.85)}100%{transform:translate3d(0,0,0) rotateY(0) rotateZ(0);filter:brightness(1)}}@media(max-width:600px){.gallery-row::before,.gallery-row::after{width:72vw;height:min(93vw,74svh)}}@media(prefers-reduced-motion:reduce){.laminated{transform:none;transition:none}.laminated.turn-in,.laminated.turn-out{animation:none}}

/* The real next artwork is visible beneath the moving top card. */
.gallery-row{isolation:isolate}.gallery-row::before,.gallery-row::after{z-index:0}.next-card-under{position:absolute;width:min(510px,72vw);height:min(660px,78svh);border-radius:6px;overflow:hidden;transform:translate(4px,5px) rotate(1deg) scale(.985);box-shadow:0 18px 35px #0008;pointer-events:none;z-index:1}.next-card-under img{width:100%;height:100%;object-fit:cover;display:block}.next-card-under::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#ffffff25,transparent 35%);border:1px solid #ffffff55;border-radius:6px}.laminated{z-index:2}.arrow{z-index:3}.laminated.turn-out{animation:stack-card-out .48s cubic-bezier(.22,.5,.4,1) both}.laminated.turn-in{animation:stack-card-settle .46s cubic-bezier(.16,.7,.25,1) both}@keyframes stack-card-out{0%{transform:translate3d(var(--pull,0px),0,0) rotateY(0) rotateZ(0);opacity:1}100%{transform:translate3d(calc(var(--direction)*-760px),80px,120px) rotateY(calc(var(--direction)*-24deg)) rotateZ(calc(var(--direction)*-18deg));opacity:1}}@keyframes stack-card-settle{from{transform:translate(4px,5px) rotate(1deg) scale(.985);opacity:1}to{transform:translate(0,0) rotate(0) scale(1);opacity:1}}@media(max-width:600px){.next-card-under{width:72vw;height:min(93vw,74svh)}}@media(prefers-reduced-motion:reduce){.laminated.turn-in,.laminated.turn-out{animation:none}}
/* Slide the top card underneath the deck instead of throwing it away. */
.laminated.turn-out{animation:tuck-under-deck .48s cubic-bezier(.35,0,.25,1) both}@keyframes tuck-under-deck{0%{transform:translate3d(0,0,0) rotateZ(0) scale(1);z-index:2;opacity:1}46%{transform:translate3d(calc(var(--exit,-1)*175px),12px,25px) rotateZ(calc(var(--exit,-1)*8deg)) scale(.98);z-index:2;opacity:1}47%{transform:translate3d(calc(var(--exit,-1)*175px),12px,-50px) rotateZ(calc(var(--exit,-1)*8deg)) scale(.98);z-index:0;opacity:1}100%{transform:translate3d(5px,8px,-50px) rotateZ(2deg) scale(.97);z-index:0;opacity:1}}@media(prefers-reduced-motion:reduce){.laminated.turn-out{animation:none}}


.laminated,.laminated:active{cursor:inherit;touch-action:pan-y}
/* Previous: bring the previous card back onto the top of the stack. */
.gallery-row.returning.out .laminated{animation:none;transform:none;z-index:2}.gallery-row.returning.out .next-card-under{z-index:4;animation:return-previous-card .48s cubic-bezier(.2,.7,.25,1) both}.gallery-row.returning.in .laminated{animation:none;transform:none}.gallery-row.returning.in .next-card-under{visibility:hidden}@keyframes return-previous-card{0%{transform:translate3d(-175px,12px,-50px) rotateZ(-8deg) scale(.97)}20%{transform:translate3d(-175px,12px,25px) rotateZ(-8deg) scale(.98)}100%{transform:translate3d(0,0,0) rotateZ(0) scale(1)}}@media(prefers-reduced-motion:reduce){.gallery-row.returning.out .next-card-under{animation:none}}

.map-scene .caption{font-size:23px}.map-scene .door-button{top:155px}.map-scene .chest-button{top:425px}.magic-star{font-size:29px;color:#fff5bd;text-shadow:0 0 4px #fff,0 0 10px #fff3b0,0 0 20px #e5c96c,0 0 32px #dab8f2;animation:enchanted-trail 1.25s ease-out forwards}.magic-star:nth-of-type(3n){font-size:17px;color:#e4d2ff}.magic-star:nth-of-type(4n){font-size:35px;color:#fffbe5}@keyframes enchanted-trail{0%{opacity:1;transform:scale(.6) rotate(0)}18%{opacity:1;transform:scale(1.15) rotate(20deg)}50%{opacity:.75;transform:scale(.7) rotate(55deg)}100%{opacity:0;transform:translateY(20px) scale(.05) rotate(100deg)}}
.map-scene .door-button{top:180px}.map-scene .chest-button{top:450px}.magic-star{font-size:22px;text-shadow:0 0 5px #fff3c4,0 0 10px #ddc788;animation:magic-fade .75s ease-out forwards}.magic-star:nth-of-type(3n){font-size:14px;color:#ede0c5}.magic-star:nth-of-type(4n){font-size:25px;color:#fff6d8}






/* Restore the original, simple magic trail. */
.magic-star,.magic-star:nth-of-type(3n),.magic-star:nth-of-type(4n){font-size:24px;color:#fff7d8;animation:magic-fade .8s ease-out forwards;text-shadow:0 0 8px #fff,0 0 14px #efdb9b}

.scene.works-scene{background:url('/3rd%20page/background3.webp') center/100% 100% no-repeat}.scene.works-scene::before{display:none}.works-scene .enter{width:250px;height:150px}.works-scene .caption{font-size:23px;white-space:pre-line;text-align:center;line-height:1.15}.works-scene .shadow{transform:translateY(5px)}.unknown-button{left:595px;top:62px}.dusty-button{left:1000px;top:70px}.shelves-button{left:178px;top:248px}.window-button{left:523px;top:530px}.inactive-work .enter{pointer-events:none}.works-scene .back{left:90px;top:855px;bottom:auto;font-size:32px}.works-carousel{width:min(1400px,98vw);position:relative;display:flex;align-items:center;justify-content:center}.works-strip{display:flex;gap:8px;width:min(1255px,88vw);height:min(580px,70svh);overflow:hidden;touch-action:pan-y}.works-strip img{width:calc((100% - 16px)/3);height:100%;object-fit:cover;border-radius:24px;flex-shrink:0;user-select:none;cursor:inherit}.works-arrow{position:absolute;width:110px;background:none;border:0;padding:0;z-index:2;cursor:inherit}.works-arrow img{width:100%;display:block}.works-arrow.previous{left:0}.works-arrow.next{right:0}.works-arrow:hover{filter:brightness(1.2)}@media(max-width:600px){.works-strip{width:88vw;height:60svh}.works-strip img{width:82%;border-radius:12px}.works-arrow{width:55px}}
.scene.works-scene>.enter,.scene.works-scene .inactive-work .enter{width:250px;height:150px}.scene.works-scene>.enter .caption{font-size:23px}.scene.works-scene>.unknown-button{left:595px;top:62px}
.works-strip{position:relative;display:block}.works-track{display:flex;gap:8px;width:100%;height:100%;will-change:transform}.works-track.sliding{transition:transform .42s cubic-bezier(.25,.65,.25,1)}.works-track img{width:calc((100% - 16px)/3);height:100%;flex-shrink:0}.works-full{padding:4svh 4vw}.works-full img{width:100%;height:100%;max-width:92vw;max-height:92svh;object-fit:contain;border-radius:0;cursor:grab}.works-full img:active{cursor:grabbing}@media(prefers-reduced-motion:reduce){.works-track.sliding{transition:none}}
.works-track .work-laminate{position:relative;width:calc((100% - 16px)/3);height:100%;flex-shrink:0;border-radius:24px;overflow:hidden;box-shadow:0 12px 26px #0007;--mx:8%;--my:8%}.works-track .work-laminate img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}.work-laminate::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse at var(--mx) var(--my),#ffffff55,#ffffff0d 25%,transparent 60%),linear-gradient(115deg,transparent 32%,#ffffff08 39%,#ffffff45 42%,#ffffff0a 45%,transparent 54%);background-size:100% 100%,180% 180%;background-position:center,var(--mx) var(--my);box-shadow:inset 0 0 0 1px #fff5,inset 1px 1px 3px #fff8;mix-blend-mode:screen}.works-full img{width:auto;height:auto;max-width:none;max-height:none;object-fit:contain;box-shadow:none;filter:none;cursor:inherit}
/* Individual card movement without laminate or reflections. */
.work-laminate::after{display:none}.works-track{perspective:1400px;transform-style:preserve-3d}.works-track .work-laminate{transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-origin:center;transition:transform .18s ease-out;will-change:transform}.works-track .work-laminate:hover{z-index:2}@media(prefers-reduced-motion:reduce){.works-track .work-laminate{transform:none;transition:none}}
/* Keep pointer measurement stationary; tilt only the image inside it. */
.works-track{transform-style:flat}.works-track .work-laminate{transform:none!important;will-change:auto;transition:none;overflow:visible;perspective:1400px;box-shadow:none}.works-track .work-laminate img{transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-origin:center;transition:transform .24s cubic-bezier(.2,.65,.3,1);will-change:transform;pointer-events:none;box-shadow:0 12px 26px #0005}.works-track .work-laminate{cursor:inherit}@media(prefers-reduced-motion:reduce){.works-track .work-laminate img{transform:none;transition:none}}
.works-strip.has-held{overflow:visible}.works-strip.has-held .works-track{overflow:visible}.works-track .work-laminate{translate:var(--dx,0px) var(--dy,0px);transition:translate .42s cubic-bezier(.18,.8,.25,1);touch-action:none}.works-track .work-laminate.card-held{transition:none;z-index:20;cursor:grabbing}.work-laminate.card-held img{box-shadow:0 24px 48px #0008}

.works-strip.has-held .work-laminate:first-child,.works-strip.has-held .work-laminate:last-child{visibility:hidden}

/* Soft full-size artwork entrance; zoom and pan transforms remain independent. */
.works-full{animation:full-backdrop-in .14s ease-out both}.works-full img{animation:full-artwork-in .14s ease-out both}@keyframes full-backdrop-in{from{background-color:rgba(0,0,0,0)}to{background-color:rgba(0,0,0,.85)}}@keyframes full-artwork-in{from{opacity:.65}to{opacity:1}}@media(prefers-reduced-motion:reduce){.works-full,.works-full img{animation:none}}

.works-full img{animation:none}
/* Chest cards can be lifted freely and spring back without changing the deck. */
.laminated{transform:translate(var(--pull,0px),var(--pull-y,0px)) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .42s cubic-bezier(.18,.8,.25,1);touch-action:none}.laminated.chest-held{transition:none;z-index:5;cursor:grabbing}.laminated:not(.chest-held){cursor:inherit}
/* Clip only during a carousel slide, never while lifting or returning a card. */
.works-overlay .works-strip,.works-overlay .works-track{overflow:visible}.works-overlay .works-track:not(.sliding)>.work-laminate:first-child,.works-overlay .works-track:not(.sliding)>.work-laminate:last-child{visibility:hidden}.works-overlay .works-strip:has(.works-track.sliding){overflow:hidden}.works-overlay .works-track.sliding>.work-laminate{visibility:visible}

.works-overlay .works-arrow{z-index:30;pointer-events:auto}


/* Lift only the grabbed card above the arrows, not the entire strip. */
.works-carousel:has(.card-held) .works-arrow{z-index:10}.works-carousel:has(.card-held) .works-strip{z-index:auto}.works-strip.has-held .works-track{transform:none!important;position:relative;left:calc(-1 * (100% + 8px) / 3);perspective:none;will-change:auto;z-index:auto}.works-strip.has-held .work-laminate{z-index:0}.works-strip.has-held .work-laminate.card-held{z-index:20}
/* Dragged artwork lives in a separate fixed overlay; the carousel never changes layers. */
.works-strip.has-held .works-track{transform:translateX(calc(-1 * (100% + 8px) / 3))!important;left:auto;position:static;perspective:none}.works-carousel:has(.card-held) .works-arrow{z-index:30}.dragged-work-ghost{user-select:none;box-shadow:0 20px 40px #0006;will-change:translate}
.map-scene .flying-eye::after{display:none}
@media(hover:none) and (pointer:coarse){.works-track .work-laminate{touch-action:pan-y}.works-track .work-laminate img{transform:none!important}.works-arrow{min-height:44px}}
@media(pointer:fine){html,body,body *,body *::before,body *::after{cursor:url('/assets/cursor-45-hq.webp') 28 8,auto!important}}
.works-overlay .works-track:not(.sliding)>.work-laminate{visibility:hidden}.works-overlay .works-track:not(.sliding)>.work-laminate:nth-child(n+4):nth-child(-n+6){visibility:visible}.works-overlay .works-track.sliding>.work-laminate{visibility:visible}.works-strip.has-held .works-track{transform:translateX(calc(-3 * (100% + 8px) / 3))!important}
.works-track.sliding{transition:transform .62s cubic-bezier(.22,.61,.25,1)}@media(prefers-reduced-motion:reduce){.works-track.sliding{transition:none}}
.works-full{animation:none}.works-full img{animation:none;will-change:transform}
.inactive-work .dusty-button{pointer-events:auto}.scene.works-scene .inactive-work .dusty-button .caption{font-size:23px}
.scene.works-scene .work-buttons .enter{width:250px;height:150px;pointer-events:auto}.scene.works-scene .work-buttons .caption{font-size:23px}
.map-scene .under-development{top:484px}.arrow,.works-arrow{transition:transform .13s ease-out,filter .15s ease}.arrow:active,.works-arrow:active{transform:scale(.9)}@media(prefers-reduced-motion:reduce){.arrow,.works-arrow{transition:none}}