/* A garden seen from a passing train. The UI underneath keeps its own geometry. */
#garden-journey{position:fixed;inset:0;zoom:calc(1 / var(--desktop-scale,1));width:100vw;height:100dvh;max-width:none;max-height:none;padding:0;margin:0;border:0;border-radius:0;box-shadow:none;background:#f9f8ed;color:#647344;overflow:hidden;z-index:999;isolation:isolate;opacity:0}
#garden-journey:not([open]){display:none}
#garden-journey::backdrop{background:transparent;backdrop-filter:none}
.journey-window{position:absolute;inset:clamp(12px,2.1vw,32px);overflow:hidden;border:1px solid #b6bd99;border-radius:clamp(22px,2.4vw,42px);background:#e9edda;box-shadow:0 0 0 7px #fffdf5,0 0 0 8px #d9ddc2,inset 0 0 0 7px #f4f1e0}
.journey-sky{position:absolute;inset:0;background:radial-gradient(ellipse at 74% 18%,#fffdf3 0,transparent 56%),linear-gradient(#dfe9e1,#f9f7e7 58%,#c6d3b0)}
.journey-scenery{position:absolute;inset:-6% -24%;background:url('assets/journey/garden-panorama.png') center center/cover no-repeat;will-change:transform;transform:translate3d(0,0,0)}
.journey-haze{position:absolute;inset:-10%;background:radial-gradient(ellipse at 32% 35%,#fffdf8ed 0,#fffdf599 30%,#fffdf000 69%),radial-gradient(ellipse at 84% 60%,#e4ecdfb8,transparent 65%);pointer-events:none;will-change:transform,opacity}
.journey-glass{position:absolute;z-index:2;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 36%,#fff9 36.25%,#fff0 36.8%,transparent 72%,#fff3 72.2%,transparent 74%);box-shadow:inset 0 0 42px 6px #e0e5c87a;pointer-events:none}
.journey-sill{position:absolute;inset:auto 0 0;height:10px;background:linear-gradient(#f8f5e7,#d8d6ba);border-top:1px solid #fffaf3;box-shadow:0 -2px 9px #78845d18}
.journey-mullion{position:absolute;z-index:4;left:0;top:-8%;height:116%;width:clamp(100px,13vw,240px);transform:translateX(-150%);background:linear-gradient(90deg,#b5bea0 0,#eef0dc 5%,#a1ae88 8%,#68785b 11%,#5c6d52 24%,#c7cfb5 25%,#eef1df 31%,#9aa986 34%,#657553 58%,#879878 64%,#d6dcc7 68%,#eef1df 88%,#b4bf9e 94%,#f7f7e9 100%);box-shadow:7px 0 18px #63725725,-5px 0 12px #5a65431a;will-change:transform;pointer-events:none}
.journey-mullion:after{content:'';position:absolute;inset:7% 21% 9% 22%;border:1px solid #eff2e830;border-radius:6px;background:linear-gradient(#617457,#718461);box-shadow:inset 2px 0 5px #3d513335}
.journey-particles{position:absolute;z-index:1;inset:0;width:100%;height:100%;pointer-events:none}
.journey-heading{position:absolute;z-index:3;left:8%;top:13%;max-width:78%;text-shadow:0 1px 8px #fffdf4d9;will-change:transform,opacity;pointer-events:none}
.journey-heading b{display:block;font:clamp(45px,6.3vw,112px)/1.2 HanbiScript,cursive;font-weight:400;letter-spacing:-1px;color:#60704d}
.journey-heading p{margin:13px 0 0;color:#7e8c65;font-size:clamp(12px,1.25vw,19px);letter-spacing:.1em}
.journey-arrival{position:absolute;z-index:5;right:7%;bottom:12%;padding:12px 20px;border:1px solid #fff9;border-radius:21px;background:#fffdf3cf;box-shadow:0 5px 22px #6f835316;opacity:0;display:flex;align-items:center;gap:12px;will-change:transform,opacity}
.journey-arrival svg{width:27px;height:27px;fill:none;stroke:#95a76a;stroke-width:1.5}.journey-arrival span{font-size:clamp(13px,1.3vw,20px);letter-spacing:.08em;color:#78855d}
#journey-skip{position:absolute;z-index:8;right:clamp(26px,4vw,60px);top:clamp(25px,3.8vw,55px);display:flex;align-items:center;gap:7px;min-height:34px;padding:7px 13px;border:1px solid #d5ddc2;border-radius:20px;background:#fffdf3ed;color:#819061;font-size:12px;line-height:20px;box-shadow:0 2px 8px #7d8b5520;transition:background-color .15s}
#journey-skip:active{scale:.97}#journey-skip:hover{background:#f0f4dc}
#journey-skip:focus-visible{outline:2px solid #92a663;outline-offset:4px}
.journey-corner{position:absolute;left:clamp(27px,4vw,60px);bottom:clamp(26px,3.8vw,52px);z-index:5;width:75px;height:4px;background:linear-gradient(90deg,#a5b97a,#cad7b4 72%,transparent);border-radius:5px;opacity:.7;pointer-events:none}
.tool-buttons .shared-map-link{display:grid;place-items:center;width:22px;height:29px;border-radius:10px;color:#8a9e59;pointer-events:auto}
.tool-buttons .shared-map-link svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.55}
.non-map .shared-map-link{display:none}
@media(min-width:769px){.tool-buttons .shared-map-link{width:30px;height:30px;border-radius:50%}}
@media(orientation:portrait){
 .journey-window{inset:13px;border-radius:29px}.journey-scenery{inset:-4% -75%;background-position:52% center}
 .journey-heading{left:10%;top:16%;max-width:82%}.journey-heading b{font-size:clamp(48px,12vw,88px)}.journey-heading p{font-size:12px;line-height:1.8;max-width:210px;letter-spacing:.06em}
 .journey-mullion{width:27vw;max-width:190px}.journey-arrival{right:10%;bottom:15%;padding:11px 15px}.journey-arrival span{font-size:14px}.journey-arrival svg{width:24px;height:24px}
 #journey-skip{top:30px;right:29px}.journey-corner{left:30px;bottom:30px}
}
@media(prefers-reduced-motion:reduce){.journey-scenery,.journey-haze,.journey-heading,.journey-arrival{will-change:auto}.journey-particles,.journey-mullion{display:none}}

#garden-journey[data-canvas-ready] .journey-scenery,#garden-journey[data-canvas-ready] .journey-haze{visibility:hidden}
