/* A living, wider village. All coordinates are relative to the same illustration. */
.header{height:69px}.welcome{height:241px;padding-top:24px;pointer-events:none;z-index:5}.welcome a{pointer-events:auto}.welcome .eyebrow{margin-bottom:15px}h1{font-size:clamp(64px,7vw,100px)}.tagline{margin-top:9px}.wander-link{margin-top:17px}.village{margin-top:-182px;padding-top:0;scroll-margin-top:0}.world-viewport{max-width:1500px;overflow:hidden;margin:auto;position:relative;isolation:isolate;touch-action:pan-y}.world-viewport.zoomed{touch-action:none;cursor:grab}.world-viewport.dragging{cursor:grabbing}.village-scene{max-width:none;margin:0;transform:translate3d(var(--pan-x,0px),var(--pan-y,0px),0) scale(var(--world-zoom,1));transform-origin:50% 58%;transition:transform .65s cubic-bezier(.22,1,.36,1);will-change:transform}.dragging .village-scene{transition:none}.village-art{width:100%;margin:0;user-select:none;pointer-events:none;transition:filter 2s}.world-details{position:absolute;width:100%;height:100%;inset:0;pointer-events:none;overflow:visible;z-index:2}.evening-wash{position:absolute;inset:12% 0 4%;background:linear-gradient(180deg,#73607822,#8985a322 55%,#b6a5b325);opacity:0;transition:opacity 2s;pointer-events:none;mix-blend-mode:multiply;z-index:1;mask-image:linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent)}.evening .evening-wash{opacity:1}.evening .village-art{filter:saturate(.65)}
.lit-windows{opacity:.1;animation:lamplight 13s ease-in-out infinite;transition:opacity 1.2s,filter 1.2s;mix-blend-mode:multiply}.lights-on .lit-windows,.evening .lit-windows{opacity:.9;animation:none;mix-blend-mode:normal;filter:drop-shadow(0 0 8px #ffcb74)}.shutter-left,.shutter-right{transform-box:fill-box;transform-origin:right center;animation:shutters 9s ease-in-out infinite}.shutter-right{transform-origin:left center;animation-delay:-2s}.fountain-drop{animation:droplet 1.1s ease-in infinite}.drop-two{animation-delay:-.5s}.drop-three{animation-delay:-.7s}.fountain-rings ellipse{transform-box:fill-box;transform-origin:center;animation:fountainring 3s linear infinite}.fountain-rings ellipse+ellipse{animation-delay:-1.5s}.string-lights circle{animation:fairylight 5s ease-in-out infinite}.string-lights circle:nth-child(3n){animation-delay:-2.5s}.evening .string-lights circle{fill:#ffe5a4;filter:drop-shadow(0 0 5px #ffb53d)}.sky-stars{opacity:0;transition:opacity 2s}.evening .sky-stars{opacity:1;animation:twinkle 5s ease-in-out infinite}.water-ripple{animation:waterdrift 7s ease-in-out infinite alternate}
.walker{position:absolute;z-index:4;width:2.7%;top:61%;pointer-events:none}.walker svg{display:block;width:100%;overflow:visible;animation:walkbob .7s ease-in-out infinite}.walker-pink{animation:promenade 39s linear infinite;left:20%}.walker-green{animation:promenade 52s linear infinite reverse;animation-delay:-26s;top:60.8%;width:2.8%}.walker-small{left:25%;top:57.7%;width:1.75%;animation:lanewalk 20s ease-in-out infinite}.leg{transform-box:fill-box;transform-origin:center top;animation:legstep .7s ease-in-out infinite alternate}.leg-b{animation-delay:-.7s}.arm{transform-box:fill-box;transform-origin:top center;animation:armstep .7s ease-in-out infinite alternate}.arm-b{animation-delay:-.7s}.scene-action{border:0;background:none;position:absolute;padding:0;z-index:5;min-height:30px}.scene-action svg{width:100%;height:100%;display:block;overflow:visible}.scene-action:hover{filter:drop-shadow(0 0 5px #e7217b40)}.cyclist{width:6.1%;height:6.1%;top:60.3%;left:17%;animation:cyclethrough 24s linear infinite}.wheel{transform-box:fill-box;transform-origin:center;animation:wheelturn 1.4s linear infinite}.pedal-leg{transform-box:fill-box;transform-origin:center;animation:pedal .7s linear infinite alternate}.bell-rings{position:absolute;font:25px var(--serif);color:var(--pink);left:70%;top:-25%;opacity:0;pointer-events:none}.ringing .bell-rings{animation:bellring 1.2s ease-out forwards}.canal-boat{position:absolute;z-index:5}.motor-route{width:10.5%;height:8.1%;top:75.9%;left:6%;animation:motortrip 31s ease-in-out infinite}.sail-route{width:5%;height:10%;top:73.8%;left:76%;animation:sailtrip 47s ease-in-out infinite;pointer-events:none}.boat-bob{width:100%;height:100%;animation:boatfloat 3s ease-in-out infinite}.canal-boat.departing .boat-bob{animation:bonvoyage 2.3s ease-in-out}.wake{animation:wakefade 2s ease-in-out infinite}.boat-flag{transform-box:fill-box;transform-origin:left;animation:flagflutter 1.8s ease-in-out infinite}.bird-flight{position:absolute;width:6%;height:4%;left:15%;top:21%;z-index:3;animation:flythrough 25s linear infinite;pointer-events:none}.bird-flight svg{width:100%;height:100%;overflow:visible}.bird-wing{transform-box:fill-box;transform-origin:center;animation:wingflap 1.1s ease-in-out infinite alternate}.cafe-steam{position:absolute;left:16.7%;top:57.7%;width:2%;height:5%;z-index:4;pointer-events:none}.cafe-steam i{position:absolute;bottom:0;width:18%;height:65%;border-left:1px solid #89998b;border-radius:50%;animation:steamrise 3.3s ease-out infinite;opacity:0}.cafe-steam i:nth-child(2){left:35%;animation-delay:-1.1s}.cafe-steam i:nth-child(3){left:70%;animation-delay:-2.2s}.music-notes{position:absolute;left:49%;top:52%;width:5%;height:9%;pointer-events:none;z-index:5}.music-notes span{position:absolute;color:#db9ab5;font-size:clamp(10px,1.6vw,22px);opacity:0;animation:musicfloat 5s ease-out infinite}.music-notes span:nth-child(2){left:40%;animation-delay:-1.8s}.music-notes span:nth-child(3){left:-25%;animation-delay:-3.4s}.evening .music-notes span{color:#dc5794}
.destination{top:49%;height:15.7%;width:11.2%;padding:0;align-items:flex-end}.destination-bloomy{left:30.2%}.destination-shishis{left:43.3%}.destination-sets{left:58.3%}.door-marker{width:25px;height:25px;font-size:15px;background:#fffdf8e8;border:1px solid #e6cbd5;color:#bd7190;opacity:.9;box-shadow:0 2px 10px #e6a9bf22;animation:doorbreath 4s ease-in-out infinite}.destination-shishis .door-marker{animation-delay:-1.3s}.destination-sets .door-marker{animation-delay:-2.6s}.destination:hover .door-marker{display:flex;transform:translateY(-3px) scale(1.08)}.door-tooltip{bottom:35px;z-index:5;font-size:10px}.destination:hover{background:linear-gradient(180deg,transparent 50%,#fff5cf39);border-radius:45% 45% 0 0}.landmark{position:absolute;background:transparent;border:0;padding:0;z-index:5}.landmark-label{opacity:0;position:absolute;bottom:90%;left:50%;transform:translateX(-50%);white-space:nowrap;padding:8px 12px;background:#fffefbf2;box-shadow:0 2px 18px #48574416;font:16px var(--hand);color:#8f616e;pointer-events:none;transition:opacity .2s}.landmark:hover .landmark-label,.landmark:focus-visible .landmark-label{opacity:1}.landmark:hover{background:radial-gradient(ellipse,#ffe9f33b,transparent 70%)}.cafe-hit{left:3%;top:55%;width:17%;height:12%}.fountain-hit{left:75%;top:53%;width:10%;height:12%}.postbox-hit{left:85%;top:58%;width:4%;height:9%}.window-hit{left:42%;top:33.5%;width:14%;height:8%}.window-hit .landmark-label{bottom:100%}.petal-layer,.wish-layer{position:absolute;inset:0;z-index:8;pointer-events:none;overflow:hidden}.petal{position:absolute;left:35%;top:57%;width:7px;height:10px;background:#e999b7;border-radius:80% 5% 80% 10%;animation:petalfall 2.6s ease-out both;animation-delay:var(--delay,0s)}.wish-particle{position:absolute;left:80.3%;top:57%;font:18px var(--serif);color:#dfa867;animation:wishrise 2.2s ease-out both;animation-delay:var(--delay,0s)}.wish-circle{position:absolute;left:80.3%;top:62%;width:5%;height:1.5%;border:1px solid #b8b79c;border-radius:50%;transform:translate(-50%,-50%);animation:wishring 1.8s ease-out both}.world-controls{position:relative;z-index:6;display:flex;justify-content:center;align-items:center;gap:7px;margin:-1% auto 0;padding:0 20px;max-width:600px}.world-controls button{font-size:10px;letter-spacing:.02em;border:0;background:white;min-height:42px;color:#6b776c;padding:8px 14px;border-radius:50px;transition:background .2s,color .2s}.world-controls button:hover{background:#fff2f7;color:var(--pink)}#time-toggle{display:flex;gap:7px;align-items:center}#time-toggle>span:first-child{font-size:20px;color:#b68c70}#zoom-out,#zoom-in{font:20px var(--serif);min-width:42px}#zoom-reset{min-width:88px;font-size:10px}#zoom-out:disabled,#zoom-in:disabled{opacity:.35;cursor:default}.control-divider{width:1px;height:16px;background:#e3e8df;margin:0 8px}.world-invitation{text-align:center;font:20px var(--hand);color:#737c70;margin:15px 20px 0}.world-status{text-align:center;font-size:10px;color:#9b9b8d;letter-spacing:.025em;margin:11px 20px 0;min-height:15px;transition:color .3s}.world-status.surprise{color:var(--pink)}.village-directory{margin-top:40px}.place-dialog[data-current="cafe"] .dialog-illustration,.place-dialog[data-current="postbox"] .dialog-illustration{background-image:url('/assets/village-wide.png');background-size:auto 570px}.place-dialog[data-current="cafe"] h2,.place-dialog[data-current="postbox"] h2{font-size:37px}.scrapbook{padding-top:105px}
@keyframes promenade{0%{left:19%;transform:scaleX(1)}48%{left:83%;transform:scaleX(1)}50%{left:83%;transform:scaleX(-1)}98%{left:19%;transform:scaleX(-1)}100%{left:19%;transform:scaleX(1)}}@keyframes lanewalk{0%,100%{transform:translateY(-15px) scale(.8);opacity:.2}40%,60%{transform:translateY(22px) scale(1);opacity:1}}@keyframes walkbob{0%,100%{transform:translateY(0)}50%{transform:translateY(1.2px)}}@keyframes legstep{from{transform:rotate(-20deg)}to{transform:rotate(20deg)}}@keyframes armstep{from{transform:rotate(15deg)}to{transform:rotate(-15deg)}}@keyframes cyclethrough{0%{left:-10%;opacity:0}7%{opacity:1}92%{opacity:1}100%{left:99%;opacity:0}}@keyframes wheelturn{to{transform:rotate(360deg)}}@keyframes pedal{to{transform:rotate(12deg)}}@keyframes bellring{0%{opacity:0;transform:translateY(0) scale(.7)}30%{opacity:1}100%{opacity:0;transform:translateY(-30px) scale(1.3)}}@keyframes motortrip{0%{left:3%;transform:scaleX(1)}48%{left:84%;transform:scaleX(1)}50%{left:84%;transform:scaleX(-1)}98%{left:3%;transform:scaleX(-1)}100%{left:3%;transform:scaleX(1)}}@keyframes sailtrip{0%,100%{left:77%;transform:rotate(-2deg)}50%{left:19%;transform:rotate(2deg)}}@keyframes boatfloat{0%,100%{transform:translateY(-2px) rotate(-1.5deg)}50%{transform:translateY(2px) rotate(1.5deg)}}@keyframes bonvoyage{0%{transform:translateX(0) rotate(0)}20%{transform:translateX(8px) rotate(-6deg)}60%{transform:translateX(55px) rotate(2deg)}100%{transform:translateX(0) rotate(0)}}@keyframes wakefade{0%,100%{opacity:.3;stroke-dashoffset:0}50%{opacity:1;stroke-dashoffset:5}}@keyframes flagflutter{0%,100%{transform:scaleX(.7)}50%{transform:scaleX(1)}}@keyframes flythrough{0%{left:-10%;top:20%;opacity:0}10%{opacity:.8}50%{top:17%}90%{opacity:.8}100%{left:103%;top:24%;opacity:0}}@keyframes wingflap{from{transform:scaleY(.4)}to{transform:scaleY(1)}}@keyframes steamrise{0%{transform:translateY(8px) scale(.6);opacity:0}30%{opacity:.45}100%{transform:translateY(-20px) scale(1.3);opacity:0}}@keyframes musicfloat{0%{transform:translate(0,12px) rotate(0);opacity:0}20%{opacity:.65}100%{transform:translate(22px,-40px) rotate(20deg);opacity:0}}@keyframes droplet{0%{transform:translateY(-3px);opacity:0}25%{opacity:.8}100%{transform:translateY(14px);opacity:0}}@keyframes fountainring{0%{transform:scale(.5);opacity:.7}100%{transform:scale(1.4);opacity:0}}@keyframes fairylight{0%,100%{opacity:.5}50%{opacity:1}}@keyframes shutters{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.6)}}@keyframes lamplight{0%,100%{opacity:.05}40%,65%{opacity:.45}}@keyframes twinkle{0%,100%{opacity:.5}50%{opacity:1}}@keyframes waterdrift{from{transform:translateX(-7px);opacity:.3}to{transform:translateX(7px);opacity:.8}}@keyframes doorbreath{0%,100%{box-shadow:0 0 0 0 #e7217b00}55%{box-shadow:0 0 0 5px #e7217b0b}}@keyframes petalfall{0%{opacity:0;transform:translate(0,0) rotate(0)}15%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot))}}@keyframes wishrise{0%{opacity:0;transform:translate(0,0) scale(.4)}20%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.2) rotate(var(--rot))}}@keyframes wishring{0%{opacity:1;transform:translate(-50%,-50%) scale(.2)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.5)}}
@media(min-width:1500px){.world-viewport{max-width:1500px}.welcome{height:235px;padding-top:30px}.village{margin-top:-180px}}
@media(max-width:1000px){.welcome{height:225px;padding-top:30px}.village{margin-top:-130px}.world-invitation{font-size:18px}.village-scene{max-width:none}.door-marker{width:23px;height:23px;font-size:13px}}
@media(max-width:640px){.header{height:63px}.welcome{height:218px;padding-top:25px}h1{font-size:clamp(49px,11.3vw,71px)}.welcome .eyebrow{margin-bottom:19px}.tagline{margin-top:15px}.wander-link{margin-top:16px;font-size:8px}.village{margin-top:-36px;padding:0}.world-viewport{width:100%;max-width:none;overflow:hidden}.village-scene{width:100%;overflow:visible;max-width:none}.village-art{width:100%;margin:0}.destination{top:49%;height:17%;width:12%;min-height:44px;align-items:flex-end}.destination-bloomy{left:29.8%}.destination-shishis{left:43.3%}.destination-sets{left:58.3%}.door-marker{height:19px;width:19px;font-size:10px;box-shadow:0 0 6px #ffffffc9}.destination .door-tooltip{display:none}.world-controls{margin:5px auto 0;gap:1px;padding:0 12px}.world-controls button{padding:8px 8px;font-size:9px;min-height:44px}#zoom-reset{min-width:68px;font-size:9px}#time-toggle>span:first-child{font-size:18px}.control-divider{margin:0 5px}.world-invitation{font-size:16px;line-height:1.7;max-width:300px;margin:14px auto 0;padding:0 8px}.world-status{font-size:9px;line-height:1.6;margin:8px 25px 0;min-height:28px}.landmark-label{font-size:11px;padding:5px 8px}.cafe-hit{left:1%;width:21%;height:15%}.fountain-hit{left:75%;width:10%;height:15%;min-height:34px}.postbox-hit{left:85%;width:6%;min-height:34px}.window-hit{min-height:29px}.scene-action{min-height:20px}.cyclist{width:8%;height:8%;top:59%}.motor-route{width:13%;height:10%;top:74%}.sail-route{width:6%;height:12%;top:72.3%}.walker{width:3.1%;top:60.6%}.walker-small{width:2%;top:57%}.walker-green{width:3.1%}.bird-flight{width:8%}.petal{width:4px;height:6px}.wish-particle{font-size:12px}.village-directory{margin-top:20px}.scrapbook{padding-top:70px}.music-notes span{font-size:10px}.place-dialog[data-current="cafe"] .dialog-illustration,.place-dialog[data-current="postbox"] .dialog-illustration{background-size:auto 350px}.place-dialog[data-current="cafe"] h2,.place-dialog[data-current="postbox"] h2{font-size:31px}}
@media(prefers-reduced-motion:reduce){body:not(.motion-opt-in) .village-scene{transition:none}body:not(.motion-opt-in) .walker-pink{left:41%}body:not(.motion-opt-in) .walker-green{left:76%}body:not(.motion-opt-in) .cyclist{left:21%}}
.motion-paused .village-scene{transition:none}.motion-paused .world-details *,.motion-paused .world-viewport *{animation-play-state:paused!important}
.lights-off .lit-windows{opacity:.03!important;filter:none!important;animation:none}.offscreen *{animation-play-state:paused!important}.world-viewport:focus-visible{outline:1px solid #e2a6bd;outline-offset:-4px}

/* Store signs share the illustration coordinate system, so they stay fixed to the facades at every viewport and zoom level. */
.shop-signs{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;overflow:visible;transition:filter 2s}
.evening .shop-signs{filter:saturate(.78) brightness(.95)}