:root{--paper-color: #f5f3ed;--paper-texture: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='.075'/%3E%3C/svg%3E");font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif;color:#080808;background-color:var(--paper-color);background-image:var(--paper-texture);font-synthesis:none;text-rendering:geometricPrecision}*{box-sizing:border-box}html{min-width:320px;background-color:var(--paper-color);background-image:var(--paper-texture);scrollbar-gutter:stable}body{margin:0;min-width:320px;min-height:100vh;overflow-x:clip;background-color:var(--paper-color);background-image:var(--paper-texture)}body.viewer-open{overflow:hidden}button{color:inherit;font:inherit}button:focus-visible{outline:2px solid #111;outline-offset:5px}.home{position:relative;min-height:100vh;isolation:isolate}.home[aria-hidden=true]{visibility:hidden}.title-anchor{position:sticky;top:50vh;z-index:0;height:0;display:grid;place-items:center;pointer-events:none}.title-anchor h1{position:relative;width:max-content;max-width:94vw;margin:0;color:#050505;font-size:clamp(7.5rem,15.2vw,14.5rem);font-weight:950;line-height:.78;letter-spacing:.08em;text-indent:.08em;opacity:0;transform:translateY(-45%) scale(.985);white-space:nowrap}.home--started .title-anchor h1{animation:title-in .65s 1.05s cubic-bezier(.2,.72,.25,1) forwards}.photo-canvas{position:relative;z-index:1;height:var(--desktop-height);overflow:clip}.memory-photo{position:absolute;left:var(--desktop-x);top:var(--desktop-y);z-index:var(--layer);width:var(--desktop-width);aspect-ratio:var(--ratio);display:block;margin:0;padding:0;overflow:visible;border:0;border-radius:0;background:transparent;opacity:0;transform:translateY(22px);transition:opacity .62s ease,transform .62s cubic-bezier(.2,.72,.2,1);appearance:none}.memory-photo img{display:block;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none}.memory-photo--visible{opacity:1;transform:translateY(0)}.memory-photo--intro{opacity:0;transform:translate(calc(50vw - var(--desktop-x) - var(--desktop-width) / 2),calc(50vh - var(--desktop-y) - 50%)) scale(.62);transition:none}.home--started .memory-photo--intro{animation:scatter-photo 1.45s var(--intro-delay) cubic-bezier(.18,.68,.22,1) forwards}.scroll-hint{position:fixed;right:26px;bottom:22px;z-index:8;margin:0;color:#111;font-size:11px;font-weight:500;letter-spacing:.16em;opacity:0;writing-mode:vertical-rl}.home--started .scroll-hint{animation:hint-in .5s 1.9s ease forwards}.viewer{position:fixed;inset:0;z-index:100;overflow:hidden;background-color:var(--paper-color);background-image:var(--paper-texture)}.music-toggle{position:fixed;left:22px;bottom:20px;z-index:180;width:34px;height:34px;display:grid;place-items:center;padding:0;border:1px solid rgba(8,8,8,.38);border-radius:50%;background:color-mix(in srgb,var(--paper-color) 82%,transparent);opacity:.62;transition:opacity .18s ease,transform .18s ease}.music-toggle span{display:block;font-family:Georgia,serif;font-size:19px;line-height:1;transform:translateY(-1px)}.music-toggle:hover,.music-toggle:focus-visible,.music-toggle--playing{opacity:1}.music-toggle--playing span{animation:music-beat 1.25s ease-in-out infinite}.thumbnail-rail{position:absolute;inset:0 auto 0 0;z-index:4;width:82px;padding:18px 12px 70px 14px;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;overscroll-behavior:contain}.thumbnail-rail::-webkit-scrollbar{display:none}.thumbnail{position:relative;width:54px;min-height:42px;display:grid;place-items:center;margin:0 0 11px;padding:3px;border:0;background:transparent;opacity:.38;transition:opacity .18s ease}.thumbnail:after{content:"";position:absolute;inset:0;border:1px solid transparent;pointer-events:none}.thumbnail img{display:block;max-width:48px;max-height:66px;width:auto;height:auto;object-fit:contain}.thumbnail:hover,.thumbnail--active{opacity:1}.thumbnail--active:after{border-color:#111}.viewer-stage{position:absolute;inset:22px 34px 66px 96px;display:grid;place-items:center;overflow:hidden;touch-action:pan-y}.viewer-photo{display:block;max-width:min(78vw,calc(100vw - 220px));max-height:calc(100vh - 118px);width:auto;height:auto;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;animation:viewer-photo-next .36s cubic-bezier(.2,.72,.2,1) both}.viewer-photo--previous{animation-name:viewer-photo-previous}.viewer-zone{position:absolute;top:0;bottom:0;width:50%;padding:0;border:0;background:transparent}.viewer-zone--previous{left:0}.viewer-zone--next{right:0}.back-button{position:absolute;left:50%;bottom:23px;z-index:6;padding:7px 15px;border:0;background:transparent;font-size:13px;font-weight:600;letter-spacing:.22em;transform:translate(-50%)}.back-button:after{content:"";position:absolute;right:16px;bottom:3px;left:15px;height:1px;background:#111;transform:scaleX(0);transform-origin:right;transition:transform .22s ease}.back-button:hover:after{transform:scaleX(1);transform-origin:left}.custom-cursor{position:fixed;top:0;left:0;z-index:999;width:30px;height:30px;margin:-15px 0 0 -15px;opacity:0;pointer-events:none;transition:opacity .12s ease;will-change:transform}.custom-cursor--visible{opacity:1}.custom-cursor i{position:absolute;top:50%;left:50%;display:block;width:22px;height:1.5px;background:#050505;transform:translate(-50%,-50%);transition:width .17s ease,transform .17s ease}.custom-cursor i:last-child{transform:translate(-50%,-50%) rotate(90deg)}.custom-cursor--active i:first-child{width:27px;transform:translate(-50%,-50%) rotate(45deg)}.custom-cursor--active i:last-child{width:27px;transform:translate(-50%,-50%) rotate(135deg)}::view-transition-old(memory-photo),::view-transition-new(memory-photo){animation-duration:.43s;animation-timing-function:cubic-bezier(.2,.72,.2,1);object-fit:contain}@keyframes scatter-photo{0%{opacity:0;transform:translate(calc(50vw - var(--desktop-x) - var(--desktop-width) / 2),calc(50vh - var(--desktop-y) - 50%)) scale(.62)}10%{opacity:1}22%{opacity:1;transform:translate(calc(50vw - var(--desktop-x) - var(--desktop-width) / 2),calc(50vh - var(--desktop-y) - 50%)) scale(.66)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes title-in{to{opacity:1;transform:translateY(-50%) scale(1)}}@keyframes hint-in{to{opacity:.52}}@keyframes music-beat{0%,to{transform:translateY(-1px) scale(1)}50%{transform:translateY(-1px) scale(1.16)}}@keyframes viewer-photo-next{0%{opacity:0;transform:translate(12px) scale(.988)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes viewer-photo-previous{0%{opacity:0;transform:translate(-12px) scale(.988)}to{opacity:1;transform:translate(0) scale(1)}}@media(hover:hover)and (pointer:fine){html,body,button,a{cursor:none!important}.memory-photo:hover{z-index:9;transform:scale(1.025)}}@media(max-width:700px){.music-toggle{left:12px;bottom:12px;width:32px;height:32px}.title-anchor h1{max-width:88vw;font-size:25vw;line-height:.82}.photo-canvas{height:var(--mobile-height)}.memory-photo{left:var(--mobile-x);top:var(--mobile-y);width:var(--mobile-width)}.memory-photo--intro{transform:translate(calc(50vw - var(--mobile-x) - var(--mobile-width) / 2),calc(50vh - var(--mobile-y) - 50%)) scale(.68)}.home--started .memory-photo--intro{animation-name:scatter-photo-mobile;animation-duration:1.25s}.scroll-hint{right:12px;bottom:15px;font-size:9px}.thumbnail-rail{width:46px;padding:10px 7px 66px}.thumbnail{width:32px;min-height:30px;margin-bottom:8px;padding:2px}.thumbnail img{max-width:27px;max-height:44px}.viewer-stage{inset:12px 10px 62px 53px}.viewer-photo{max-width:calc(100vw - 76px);max-height:calc(100vh - 98px)}.back-button{bottom:18px}}@keyframes scatter-photo-mobile{0%{opacity:0;transform:translate(calc(50vw - var(--mobile-x) - var(--mobile-width) / 2),calc(50vh - var(--mobile-y) - 50%)) scale(.68)}12%{opacity:1}22%{opacity:1;transform:translate(calc(50vw - var(--mobile-x) - var(--mobile-width) / 2),calc(50vh - var(--mobile-y) - 50%)) scale(.72)}to{opacity:1;transform:translate(0) scale(1)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}.title-anchor h1,.memory-photo,.memory-photo--intro,.scroll-hint{opacity:1;transform:none}.music-toggle--playing span{animation:none}}