/* Weather surrounds the app; opaque reading surfaces remain unchanged. */
:root{--ambient-paper:#f3f6ee;--ambient-sky:#e1e9da;--ambient-ink:#819579;--ambient-sun:0;--ambient-cloud:0;--ambient-mist:0}
html[data-mood=bright]{--ambient-paper:#f8efd9;--ambient-sky:#e6dfbd;--ambient-ink:#b59048;--ambient-sun:1;--ambient-cloud:.2}
html[data-mood=calm]{--ambient-paper:#e7f0ed;--ambient-sky:#c0dadf;--ambient-ink:#719c9a;--ambient-sun:.3;--ambient-cloud:.35;--ambient-mist:.2}
html[data-mood=tender]{--ambient-paper:#f3e8e7;--ambient-sky:#e4c8d0;--ambient-ink:#ad7f8b;--ambient-sun:.25;--ambient-mist:.3}
html[data-mood=restless]{--ambient-paper:#e9eeda;--ambient-sky:#c4d7c0;--ambient-ink:#69866a;--ambient-cloud:.65}
html[data-mood=stretched]{--ambient-paper:#e5e5ee;--ambient-sky:#b4bfd0;--ambient-ink:#77849d;--ambient-cloud:.8;--ambient-mist:.25}
html[data-mood=heavy]{--ambient-paper:#dfe7ef;--ambient-sky:#a5bacd;--ambient-ink:#738da8;--ambient-cloud:.95;--ambient-mist:.35}
html[data-mood=tired]{--ambient-paper:#c6d0df;--ambient-sky:#9bacc3;--ambient-ink:#f8f4e5;--ambient-mist:.2}
html[data-mood=anxious]{--ambient-paper:#e3e7ee;--ambient-sky:#bcc9d4;--ambient-ink:#8396a7;--ambient-cloud:.6;--ambient-mist:.65}
html[data-mood=frustrated]{--ambient-paper:#f1e4d9;--ambient-sky:#d9bda7;--ambient-ink:#a77d5b;--ambient-sun:.2;--ambient-cloud:.55}
html[data-mood=lonely]{--ambient-paper:#cbd7e3;--ambient-sky:#9fb3ca;--ambient-ink:#fff7e8;--ambient-mist:.4}
html[data-mood=hopeful]{--ambient-paper:#efefd9;--ambient-sky:#c8dac7;--ambient-ink:#96a274;--ambient-sun:.8;--ambient-cloud:.6}
html[data-mood=content]{--ambient-paper:#efeddd;--ambient-sky:#d9dbb9;--ambient-ink:#9d9d73;--ambient-sun:.6;--ambient-cloud:.3}
body{isolation:isolate;background-color:var(--ambient-paper);background-image:url('../assets/wildspace/field-trails.svg');background-size:1200px 1000px;background-repeat:repeat;background-position:center top;transition:background-color 1.5s ease}
/* Darker ink keeps exposed labels readable against the dusk sky. */
html[data-mood]:not([data-mood=none]) body{--ink-2:#294333;--ink-3:#294333;--fern:#214631}
.mood-atmosphere{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:strict}
.mood-atmosphere[hidden],html[data-mood=none] .mood-atmosphere{display:none}
.mood-atmosphere>div{position:absolute;inset:0;pointer-events:none}
.ambient-sky{background:linear-gradient(180deg,var(--ambient-sky),transparent 78%);opacity:.64}
.ambient-sun{opacity:var(--ambient-sun);background:radial-gradient(circle at 86% 5%,#fffef3 0 32px,#fff6cfba 48px,#ffe3a23b 180px,transparent 470px);transition:opacity 1.5s ease}
.ambient-rays{opacity:var(--ambient-sun);transform-origin:86% 5%;background:conic-gradient(from 130deg at 86% 5%,transparent 0deg 13deg,#fffbe6a8 15deg 22deg,transparent 25deg 39deg,#fff6cf99 42deg 49deg,transparent 52deg 70deg,#fffbe68c 74deg 83deg,transparent 87deg 100deg,#fff5c969 104deg 116deg,transparent 121deg 145deg,#fff4ca70 149deg 156deg,transparent 160deg);animation:environment-sun-rays 18s ease-in-out infinite alternate;transition:opacity 1.5s ease}
.ambient-clouds{opacity:var(--ambient-cloud);background:radial-gradient(ellipse 32% 11% at 7% 14%,#ffffffa3 20%,transparent 72%),radial-gradient(ellipse 25% 9% at 45% 5%,#ffffffa6 12%,transparent 72%),radial-gradient(ellipse 29% 12% at 92% 19%,#f4f6f9a8 18%,transparent 72%);animation:environment-clouds 48s ease-in-out infinite alternate;transition:opacity 1.5s ease}
html:is([data-mood=heavy],[data-mood=stretched]) .ambient-clouds{background:radial-gradient(ellipse 38% 17% at 15% 0%,#647e964f,transparent 74%),radial-gradient(ellipse 40% 18% at 90% 8%,#6f849b5e,transparent 75%),radial-gradient(ellipse 33% 12% at 60% 12%,#ffffff85,transparent 76%)}
.ambient-mist{opacity:var(--ambient-mist);background:linear-gradient(165deg,transparent 20%,#f0f5f29c 33%,transparent 48%,#f8faf78c 65%,transparent 82%);animation:environment-mist 32s ease-in-out infinite alternate;transition:opacity 1.5s ease}
.ambient-group{display:none}
.ambient-sun,.ambient-rays,.ambient-clouds,.ambient-mist{display:none}
html:is([data-mood=bright],[data-mood=calm],[data-mood=tender],[data-mood=frustrated],[data-mood=hopeful],[data-mood=content]) :is(.ambient-sun,.ambient-rays){display:block}
html:is([data-mood=bright],[data-mood=calm],[data-mood=restless],[data-mood=stretched],[data-mood=heavy],[data-mood=anxious],[data-mood=frustrated],[data-mood=hopeful],[data-mood=content]) .ambient-clouds{display:block}
html:is([data-mood=calm],[data-mood=tender],[data-mood=stretched],[data-mood=heavy],[data-mood=tired],[data-mood=anxious],[data-mood=lonely]) .ambient-mist{display:block}
.ambient-mark{position:absolute;pointer-events:none;color:var(--ambient-ink);left:var(--x);top:var(--y)}
.ambient-mark svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-linejoin:round;stroke-linecap:round}
html:is([data-mood=bright],[data-mood=calm],[data-mood=hopeful],[data-mood=content]) .ambient-glint-field{display:block}
.ambient-glint{width:4px;height:4px;border-radius:50%;background:#fffbe6;box-shadow:0 0 8px #f3deaa;opacity:.65;animation:environment-pollen 18s ease-in-out infinite alternate;animation-delay:calc(var(--i)*-2.9s)}
html:is([data-mood=restless],[data-mood=stretched],[data-mood=frustrated]) .ambient-wind-field,html:is([data-mood=restless],[data-mood=frustrated],[data-mood=tender],[data-mood=hopeful]) .ambient-leaf-field{display:block}
.ambient-wind{width:300px;height:60px;left:-320px;top:calc(6% + var(--i)*19%);opacity:0;animation:environment-wind 18s linear infinite;animation-delay:calc(var(--i)*-3.6s)}
.ambient-wind svg{stroke-width:1.4}
.ambient-leaf{width:26px;height:32px;left:-40px;top:calc(10% + var(--i)*18%);opacity:0;animation:environment-leaves 25s linear infinite;animation-delay:calc(var(--i)*-5.3s)}
.ambient-leaf svg{fill:color-mix(in srgb,currentColor 9%,transparent);stroke-width:1.25}
html[data-mood=tender] .ambient-leaf{animation-duration:36s}
html[data-mood=heavy] .ambient-rain-field{display:block}
.ambient-rain{width:1px;height:38px;background:linear-gradient(transparent,#6b8aa6aa);top:-55px;opacity:0;animation:environment-rain 4.8s linear infinite;animation-delay:calc(var(--i)*-.31s)}
html:is([data-mood=tired],[data-mood=lonely]) .ambient-star-field{display:block}
.ambient-star{width:var(--size);height:var(--size);border-radius:50%;background:#fffdf1;box-shadow:0 0 7px 2px #ffffff4d;opacity:.75;animation:environment-twinkle 6s ease-in-out infinite;animation-delay:calc(var(--i)*-.67s)}
.ambient-star:nth-child(3n){animation-duration:9s}.ambient-star:nth-child(5n){animation-duration:12s}
.ambient-star:nth-child(4n)::before,.ambient-star:nth-child(4n)::after{content:'';position:absolute;inset:-4px 1px;background:linear-gradient(transparent,#fffdf4,transparent);border-radius:50%}
.ambient-star:nth-child(4n)::after{transform:rotate(90deg)}
.mood-atmosphere[data-paused=true] *{animation-play-state:paused!important}
@keyframes environment-sun-rays{from{transform:rotate(-3deg);opacity:calc(var(--ambient-sun)*.62)}to{transform:rotate(3deg);opacity:var(--ambient-sun)}}
@keyframes environment-clouds{from{transform:translate3d(-4vw,0,0)}to{transform:translate3d(5vw,2vh,0)}}
@keyframes environment-mist{from{transform:translate3d(-4vw,2vh,0)}to{transform:translate3d(4vw,-2vh,0)}}
@keyframes environment-pollen{from{transform:translate3d(-10px,20px,0);opacity:.2}to{transform:translate3d(30px,-30px,0);opacity:.7}}
@keyframes environment-wind{0%{transform:translate3d(0,0,0);opacity:0}12%,82%{opacity:.5}100%{transform:translate3d(calc(100vw + 640px),-40px,0);opacity:0}}
@keyframes environment-leaves{0%{transform:translate3d(0,0,0) rotate(-25deg);opacity:0}10%,80%{opacity:.6}50%{transform:translate3d(52vw,44px,0) rotate(40deg)}100%{transform:translate3d(calc(100vw + 90px),-12px,0) rotate(120deg);opacity:0}}
@keyframes environment-rain{0%{transform:translate3d(0,0,0) rotate(12deg);opacity:0}12%,85%{opacity:.55}100%{transform:translate3d(-14vw,calc(100vh + 100px),0) rotate(12deg);opacity:0}}
@keyframes environment-twinkle{0%,100%{opacity:.25;transform:scale(.75)}50%{opacity:1;transform:scale(1.15)}}
@media(max-width:680px){body{background-size:780px 650px;background-position:20% top}.ambient-wind{width:180px;height:42px}.ambient-rays{background:conic-gradient(from 130deg at 86% 5%,transparent 0deg 15deg,#fffbe6a8 17deg 27deg,transparent 30deg 60deg,#fff6cf99 64deg 78deg,transparent 82deg 110deg,#fffbe68c 114deg 126deg,transparent 130deg)}.ambient-star:nth-child(n+21),.ambient-rain:nth-child(n+15){display:none}}
html.reduce-motion .mood-atmosphere *{animation:none!important;transition:none!important}
html.reduce-motion .ambient-wind-field,html.reduce-motion .ambient-leaf-field,html.reduce-motion .ambient-rain-field,html.reduce-motion .ambient-glint-field{display:none!important}
html.reduce-motion body{transition:none}
@media(prefers-reduced-motion:reduce){body{transition:none}.mood-atmosphere *{animation:none!important;transition:none!important}.ambient-wind-field,.ambient-leaf-field,.ambient-rain-field,.ambient-glint-field{display:none!important}}
@media(prefers-contrast:more),(forced-colors:active){body{background:var(--paper);transition:none}.mood-atmosphere{display:none}}
@media print{body{background:white;transition:none}.mood-atmosphere{display:none}}
