/* Art lives below the map until the person invites the route to come alive. */
.hero-route-viewport{position:relative;display:block;width:100%;padding:0;border:0;border-radius:15px;background:#e7e8dc;overflow:hidden;isolation:isolate;cursor:pointer}
.hero-route-viewport>.street-map{width:100%;height:auto;aspect-ratio:900/640;opacity:var(--life-map,1)}
.hero-life-art,.hero-life-outline{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hero-life-art{opacity:var(--life-art,0);mask-image:linear-gradient(to top,#000 0%,#000 calc(var(--life-edge,-15%) - 8%),transparent calc(var(--life-edge,-15%) + 8%),transparent 100%);filter:drop-shadow(0 4px 8px #ffffffa6) drop-shadow(0 0 18px #fff6d9)}
.hero-life-art>img,.hero-life-art>canvas{width:var(--hero-art-width,100%);height:var(--hero-art-height,100%);object-fit:contain;position:absolute;inset:auto;left:var(--hero-art-left,0);top:var(--hero-art-top,0);transform:rotate(var(--hero-art-angle,0deg));transform-origin:50% 50%}
.hero-life-outline{opacity:var(--life-outline,0);filter:drop-shadow(0 0 5px #fff8d8) drop-shadow(0 0 14px #ffe8ad)}
.hero-route-thread,.hero-life-confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:var(--life-glow,0)}
.hero-route-thread path{fill:none;stroke:#fff8e6;stroke-width:6;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 8px #ffe8ad)}
.hero-life-confetti{opacity:var(--life-bloom,0);transform:scale(calc(.95 + var(--life-bloom,0)*.06));filter:drop-shadow(0 0 4px #ffe8ad)}
.hero-route-viewport.is-alive .you-marker{opacity:0}
.hero-reveal-note{margin:7px 0 0;text-align:center;font:500 13px/1.4 Fredoka,ui-rounded,sans-serif;color:#664052}
.hero-route-viewport:focus-visible{outline:3px solid #b32c50;outline-offset:5px}
.hero-friend{position:static;display:grid;grid-template-columns:100px 1fr;align-items:center;gap:5px;width:100%;padding:0;margin:3px 0 0;pointer-events:none;transform:none}
.hero-companion-art{position:relative;width:100px;height:100px;opacity:var(--life-companion,1);transform:translateY(calc((1 - var(--life-companion,1))*-6px))}
.hero-companion-art>img,.hero-companion-art>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.hero-friend .handnote{font-size:24px;max-width:22ch;line-height:1.1;margin:0;padding:7px 9px;background:transparent;border:0;border-radius:0;box-shadow:none;transform:translateX(calc(var(--hero-dock-size,100px)*-.5*(1 - var(--life-companion,1)))) rotate(-2deg);color:#664052}
.hero-friend .handnote::before{display:none}
.hero-route-sheet .map-attribution{position:static;text-align:right;display:block;margin-top:5px;font-size:10px}
.hero-world{min-height:650px}
.hero-route-sheet{padding-bottom:9px}
.has-live-canvas>img{opacity:0!important}
.wordmark img{transform-origin:50% 75%}
body[data-motion=on][data-hidden=false]:not(.menu-open) .wordmark img{animation:mascot-listen 13s ease-in-out infinite}
@keyframes mascot-listen{0%,74%,92%,100%{transform:rotate(0)}80%{transform:rotate(-5deg)}86%{transform:rotate(3deg)}}
/* The title shares the sticky carousel frame, rather than scrolling away alone. */
.route-orbit-active .route-orbit-view{top:88px;min-height:calc(100svh - 88px);display:flex;flex-direction:column;padding-top:25px;padding-bottom:16px}
.route-orbit-view>.section-heading{margin-bottom:24px;gap:50px;align-items:center}
.route-orbit-view>.section-heading h2{font-size:clamp(38px,4.3vw,63px)}
.route-orbit-view>.section-heading p{font-size:16px;line-height:1.6}
.route-orbit-active .route-choices{flex:1;min-height:360px;height:auto}
.route-orbit-active{height:245svh}
@media(min-width:768px) and (max-height:760px){.route-orbit-view>.section-heading h2{font-size:44px}.route-orbit-view>.section-heading p{font-size:14px}.route-orbit-view>.section-heading{margin-bottom:14px}.route-orbit-active .route-choices{min-height:340px}}
@media(max-width:1100px) and (min-width:768px){.hero-world{min-height:590px}.hero-friend .handnote{font-size:22px}.hero-friend{--hero-dock-size:84px;grid-template-columns:84px 1fr}.hero-companion-art{width:84px;height:84px}.hero-route-sheet{width:83%}}
@media(max-width:767px){
 .hero-world{min-height:540px}.hero-route-sheet{width:88%;left:0;top:35px}.hero-friend{--hero-dock-size:78px;grid-template-columns:78px 1fr;gap:2px}.hero-companion-art{width:78px;height:78px}.hero-friend .handnote{font-size:22px;padding:4px;max-width:22ch}
 .route-orbit-view>.section-heading{margin-bottom:28px}.route-orbit-view>.section-heading h2{font-size:clamp(37px,9vw,50px)}.route-orbit-view>.section-heading p{font-size:15px}
 .route-choices{display:flex;flex-direction:row;gap:16px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding:8px 8px 22px;margin:0 -8px;border:0;scrollbar-width:thin;scrollbar-color:#bd718b #eee2e9}
 .route-choices button{position:relative;flex:0 0 240px;width:240px;height:313px;min-height:313px;border:1px solid #cbaab8;border-radius:26px;background:#fbf4ea;padding:210px 18px 18px;scroll-snap-align:center;text-align:left}
 .route-choices button>span{display:block;font:600 24px/1.1 Fredoka,sans-serif}.route-choices button>span small{display:block;font:400 14px/1.3 ui-sans-serif,system-ui,sans-serif;margin-top:6px}.route-choices button .route-card-location{margin-top:9px}
 .route-choices button>strong{position:absolute;right:18px;bottom:20px;font-size:15px}.route-choices button[aria-pressed=true]{background:#f7e6ef;border-color:#be6082}
 .route-choices .mini-route{position:absolute;left:20px;top:22px;right:20px;width:calc(100% - 40px);height:174px;border-radius:18px}.route-choices .mini-route path{stroke-width:2.6}
}
@media(max-width:360px){.hero-world{min-height:510px}.hero-friend .handnote{font-size:20px}.hero-friend{--hero-dock-size:67px;grid-template-columns:67px 1fr}.hero-companion-art{width:67px;height:67px}}
@media(prefers-reduced-motion:reduce){.wordmark img{animation:none!important}}

.hero-route-thread image{filter:drop-shadow(0 0 3px #fff7eb) drop-shadow(0 0 9px #ffe9c4)}

.selected-map-attribution{font-size:9px;margin:3px 2px;text-align:right;color:#66565d}.selected-map-attribution a{color:inherit}