/* Interactive trees use the original grove pixels and one fixed coordinate plane. */
body .garden-outlook{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;align-self:stretch;min-width:0;width:100%;padding:0 0 1rem;gap:1rem}
body .garden-outlook>.garden-journal{position:relative;inset:auto;display:block;grid-row:auto;width:min(100%,25rem);max-width:100%;margin:0;padding:1rem 1.25rem;transform:none!important;background:linear-gradient(125deg,#082d27ed,#103c30dc);color:#eff5e8;border:1px solid #c7e0bb50;border-radius:1rem;backdrop-filter:blur(12px);box-shadow:0 14px 40px #001b1633;text-shadow:none}
body .garden-outlook>.garden-journal:hover{background:linear-gradient(125deg,#103c30f2,#164837e8);box-shadow:0 16px 42px #001b1644}
body .garden-outlook .world-card-label,body .garden-outlook .world-card-bottom{color:#d0e0ce}
body .garden-outlook .world-card-title em{color:#c5e3ad}
body .garden-outlook .world-card-arrow{color:#deedcc;background:#c4dfb91a;border:1px solid #aac99466}
body .garden-outlook>.garden-scene-caption{position:relative;inset:auto;grid-row:auto;width:min(100%,25rem);max-width:100%;margin:0;text-align:left;color:#ccddc8;text-shadow:0 1px 8px #03221f}
@container page (max-width:66rem){body .garden-outlook{padding:0}}
@container page (max-width:34rem){body .garden-outlook{padding:0;gap:.75rem}body .garden-outlook>.garden-journal{width:100%;padding:1.125rem}body .garden-outlook>.garden-scene-caption{width:100%}}

/* The distant grove no longer follows scrolling or pointer movement. */
body .garden-environment{inset:0 0 auto;height:100vh;height:100lvh;min-height:100%;background:#071e1b}
body .garden-distance{inset:0;transform:none!important;overflow:hidden;will-change:auto}
body .garden-world{position:absolute;left:63%;top:50%;width:max(100%,150vh);width:max(100%,150lvh);aspect-ratio:1536/1024;transform:translate(-63%,-50%);isolation:isolate;overflow:hidden}
body .garden-distance .garden-landscape{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;filter:saturate(.94) brightness(var(--land-light,1.025));z-index:0}
body .garden-cloud-window{position:absolute;inset:0;z-index:1;overflow:hidden;mask-image:radial-gradient(ellipse 29% 15% at 55% 25%,#000 35%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 29% 15% at 55% 25%,#000 35%,transparent 100%);opacity:0}
body.garden-clouds-ready .garden-cloud-window,body.garden-clouds-ready .garden-valley-haze{opacity:1}
body .garden-distance .garden-cloud-bank{position:absolute;inset:auto;width:91%;height:auto;max-width:none;object-fit:contain;filter:none;left:8%;top:-23%;pointer-events:none}
body .garden-distance .garden-cloud-far{opacity:.43;transform:translate3d(var(--cloud-drift,0%),0,0)}
body .garden-distance .garden-cloud-close{left:19%;top:-17%;width:77%;opacity:.17;transform:translate3d(var(--cloud-drift-near,4.66%),1%,0) scaleX(-1)}
body .garden-valley-haze{position:absolute;inset:0;z-index:2;mask-image:radial-gradient(ellipse 31% 13% at 63% 43%,#000 20%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 31% 13% at 63% 43%,#000 20%,transparent 100%);opacity:0}
body .garden-distance .garden-valley-haze>img{position:absolute;left:24%;top:18%;width:65%;height:auto;object-fit:contain;filter:none;opacity:.095;transform:translate3d(var(--haze-drift,0%),0,0)}
body .garden-sun-wash{position:absolute;inset:0;z-index:3;background:radial-gradient(ellipse 35% 47% at 85% 28%,#ffd594a6 0%,#e9c67740 28%,transparent 72%);mix-blend-mode:screen;opacity:var(--sun-strength,.215)}
body .garden-cloud-shadow{position:absolute;inset:0;z-index:4;background:linear-gradient(124deg,transparent 20%,#092f2670 43%,transparent 64%);opacity:var(--cloud-shade,.09);transform:translate3d(var(--cloud-drift,0%),0,0)}
body .garden-atmosphere{background:linear-gradient(90deg,#031c1ddb 0%,#082b2670 41%,#0a302012 78%),linear-gradient(0deg,#031a1b85,transparent 65%)}
body .garden-light{animation:none;opacity:.7}
body .garden-vignette{box-shadow:inset 0 0 120px 20px #0217185c}
@media(max-width:620px){
  body .garden-distance .garden-cloud-far{opacity:.35}
  body .garden-distance .garden-cloud-close{display:none}
  body .garden-valley-haze{display:none}
}
@media(prefers-reduced-motion:reduce){
  body .garden-distance .garden-cloud-bank,body .garden-distance .garden-valley-haze>img,body .garden-cloud-shadow{transform:none!important;animation:none!important;transition:none!important}
}

/* A clear view of the trees above compact, readable controls and journal access. */
body .garden-tree-space{display:flex;align-items:flex-end;justify-content:flex-end;flex:1;min-height:clamp(19rem,42vh,31rem);width:100%;padding:0 0 .25rem;position:relative}
body .garden-tree-prompt{max-width:25rem;width:100%;padding:1rem 1.125rem;border-left:1px solid #b9d9a983;background:linear-gradient(90deg,#062a25de,#062a2529);color:#e5eee1}
body .garden-tree-prompt p{margin:0;font-size:.875rem;line-height:1.65;max-width:35ch}
body .garden-tree-prompt .garden-tree-label{font-size:.75rem;letter-spacing:.1em;color:#d0e2bc;margin-bottom:.375rem}
body #garden-tree-action{display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;max-width:100%;margin-top:.75rem;padding:.5rem .875rem;font-size:.875rem;line-height:1.5;color:#eaf5dd;background:#173e32e6;border:1px solid #c2ddb168;border-radius:.5rem;cursor:pointer}
body #garden-tree-action:hover{background:#285540}
body #garden-tree-action[aria-disabled=true]{cursor:default;opacity:.7}
body #garden-tree-action:focus-visible{outline:2px solid #e0f1bc;outline-offset:4px}
body .garden-outlook .world-card-title{font-size:clamp(1.375rem,1.1rem + .65vw,1.75rem);margin:.375rem 0 .5rem}
body .garden-outlook .world-card-bottom{margin-top:.5rem}
body #garden-tree-image,body #garden-tree-olives{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;filter:saturate(.94) brightness(var(--land-light,1.025))}
body #garden-tree-image{z-index:0}
body #garden-tree-olives{z-index:5}
body.garden-tree-active #garden-tree-image,body.garden-tree-active #garden-tree-olives{opacity:1}
body.garden-tree-hover .garden-tree-space{cursor:pointer}
@container page (max-width:66rem){
  body .garden-tree-space{min-height:20rem}
  body .garden-outlook{width:100%;padding:0;gap:.875rem}
}
@container page (max-width:34rem){
  body .garden-tree-space{min-height:19rem}
  body .garden-tree-prompt{max-width:100%;padding:.875rem 1rem}
  body .garden-outlook>.garden-journal{padding:1rem}
}
@media(prefers-reduced-motion:reduce){body #garden-tree-image,body #garden-tree-olives{display:none}}
