/* Soft white surroundings keep the photographic habitat separate from the album. */
.site-header{position:fixed;inset:0 0 auto;margin:0;padding:0 5.5vw;height:64px;z-index:70;background:#fffffff5;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid #ecece780;box-shadow:0 5px 22px #33382103}
body{overflow-x:hidden}
.site-header nav{width:100%;justify-content:space-between;align-items:center}
.nav-home{font-size:11px;letter-spacing:.15em;color:#676b60}
.nav-actions{display:flex;align-items:center;gap:26px}
.site-header nav button{padding:12px 0;font-size:11px;letter-spacing:.06em;transition:color .2s}
.site-header nav button:hover{color:#858975}
#shuffle span{font-size:21px;margin:0;display:inline-block;transition:transform .5s var(--ease)}
#shuffle:hover span{transform:rotate(110deg)}
.archive{padding-top:90px}
.archive-end{justify-content:flex-end;border:0}
.archive-end button{font:10px Arial,"Microsoft YaHei",sans-serif;letter-spacing:.06em;color:var(--muted);padding:0}
.archive-end button span{margin-left:15px}
.loader-meta{justify-content:center}
.little-world{padding:0;margin:0;width:100%;max-width:none;height:0;pointer-events:none}
.habitat{position:fixed;inset:auto 0 0;width:100%;max-width:none;height:min(470px,52vw);aspect-ratio:auto;margin:0;z-index:40;pointer-events:none;cursor:auto;opacity:1;transform:none;transition:opacity .8s var(--ease),transform 1s var(--ease)}
body.is-loading .habitat{opacity:0;transform:translateY(20px)}
.habitat::before{display:none}
.habitat::after{content:"";position:absolute;inset:auto 0 0;height:65px;background:linear-gradient(to bottom,#ffffff00,#ffffffc9 78%,#fff);z-index:-1;pointer-events:none}
.furniture-cluster{position:absolute;left:50%;right:auto;transform:translateX(-50%);bottom:-26px;width:min(800px,88vw);height:auto;aspect-ratio:1680/936;pointer-events:none}
.furniture-cluster::before{content:"";position:absolute;inset:-24px -32px -4px;background:radial-gradient(ellipse at 50% 68%,#ffffffe0 18%,#ffffffa3 42%,#ffffff26 66%,#ffffff00 83%);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);mask-image:radial-gradient(ellipse at 50% 68%,#000 24%,#0008 53%,#0000 83%);-webkit-mask-image:radial-gradient(ellipse at 50% 68%,#000 24%,#0008 53%,#0000 83%);z-index:-1;pointer-events:none}
.furniture{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 5px #fff) drop-shadow(0 0 8px #ffffffed) drop-shadow(0 2px 2px #35332208)}
.place-hotspot{position:absolute;padding:0;pointer-events:auto;cursor:pointer;z-index:2;outline:0!important}
.place-hotspot:focus-visible{filter:drop-shadow(0 0 5px #a7ab8e)}
.house-spot{left:8%;bottom:13%;width:34%;height:49%}
.wheel-spot{left:44%;bottom:36%;width:39%;height:42%}
.water-spot{left:81%;bottom:25%;width:16%;height:65%}
.wheel-motion{position:absolute;left:62.8%;top:39%;width:38%;aspect-ratio:1;transform:translate(-50%,-50%) rotate(24deg) scaleY(.49);transform-origin:center;opacity:0;transition:opacity .6s;pointer-events:none;z-index:1}
.wheel-motion svg{width:100%;height:100%;fill:none;stroke:#79572e;stroke-width:.22;opacity:.24}
.wheel-grain{transform-origin:50% 50%;animation:disc-spin 2s linear infinite;animation-play-state:paused}
.furniture-cluster.is-running .wheel-motion{opacity:1}
.furniture-cluster.is-running .wheel-grain{animation-play-state:running}
.hamster{left:55%;bottom:14px;width:154px;height:134px;padding:0;pointer-events:auto;transform:translateX(-50%);z-index:4;filter:drop-shadow(1px 3px 1px #2c302020);transition:width .18s var(--ease),height .18s var(--ease);will-change:left,bottom;cursor:grab;touch-action:none;user-select:none;outline:0!important}
.hamster:focus,.hamster:focus-visible{outline:none!important}
.hamster:focus-visible{filter:drop-shadow(0 0 4px #a1a78988)}
.hamster-paper{inset:0;transition:scale .38s var(--ease);filter:drop-shadow(0 1px 0 #7e806e55)}
.hamster img{object-position:center bottom;filter:drop-shadow(1px 0 0 white) drop-shadow(-1px 0 0 white) drop-shadow(0 1px 0 white) drop-shadow(0 -1px 0 white)}
.hamster.carried{cursor:grabbing;filter:drop-shadow(8px 18px 9px #2c302027);transition:none}
.hamster.carried .hamster-paper{animation:none!important;transform:rotate(var(--tilt,7deg));transform-origin:50% 20%;scale:1 1}
.hamster.falling{transition:none;filter:drop-shadow(5px 10px 4px #2c302022)}
.hamster.falling .hamster-paper{animation:none!important;transform:rotate(var(--tilt,0deg));scale:1 1}
body.is-carrying,body.is-carrying *{cursor:grabbing!important;user-select:none!important}
.hamster.walking .hamster-paper{animation:paper-stroll .65s ease-in-out infinite}
.hamster[data-state="nibble"] .hamster-paper{animation:paper-nibble 1.5s ease-in-out infinite}
.hamster[data-state="back"] .hamster-paper{animation:paper-breathe 4s ease-in-out infinite}
.hamster.running{filter:drop-shadow(0 3px 2px #38302435)}
.hamster[data-state="run"] .hamster-paper{background-image:url("assets/hamster-run-atlas.png");background-size:200% 200%;background-repeat:no-repeat;background-position:0 0;transform-origin:50% 85%;animation:run-frames .4s steps(1) infinite}
.hamster[data-state="run"] img{opacity:0}
.site-footer{margin-top:42px;border:0;padding:0 0 440px}
@keyframes paper-stroll{0%,100%{transform:rotate(-1.4deg) translateY(0)}50%{transform:rotate(1.4deg) translateY(-1.8px)}}
@keyframes paper-nibble{0%,50%,100%{transform:rotate(0)}18%,32%{transform:rotate(1deg) translateY(-.8px)}25%,40%{transform:rotate(-1deg)}}
@keyframes paper-breathe{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.025)}}
@keyframes run-frames{0%,100%{background-position:0 0;transform:rotate(-3deg) translateY(0)}25%{background-position:100% 0;transform:rotate(-2deg) translateY(calc(-.96% - 2px))}50%{background-position:0 100%;transform:rotate(-3deg) translateY(calc(5.58% - 4px))}75%{background-position:100% 100%;transform:rotate(-2deg) translateY(calc(4.63% - 2px))}}
@keyframes disc-spin{to{transform:rotate(360deg)}}
@media(max-width:720px){.site-header{height:55px;margin:0;padding:0 6vw}.site-header nav button{font-size:10px}.nav-home{font-size:10px}.nav-actions{gap:23px}.archive{padding-top:77px}.habitat{height:65vw;min-height:240px}.furniture-cluster{bottom:-10px;width:96vw;max-width:600px}.hamster{bottom:12px}.habitat::before{height:calc(100% + 80px);width:130vw}.habitat::after{height:75px}.site-footer{padding-bottom:62vw}.moment{min-width:0;margin-bottom:64px!important}.moment-meta span:last-child{font-size:6px}}
@media(prefers-reduced-motion:reduce){.hamster-paper,.wheel-grain{animation:none!important}.habitat{transition:none}}
