:root{--wind:0.45;--density:0.25;--field:0.25;--motion:1;--sway-a:-1deg;--sway-b:3deg;--sway-c:-1.4deg;--sway-x:8px;--sway-x-neg:-4px;--wind-duration:6.6s;--wind-duration-slow:7.4s;--wind-duration-fast:6.2s;--aurora-opacity:.18;--aurora-opacity-b:.10;--ink:#f8fbf5;--glass:rgba(20,45,52,.27);--line:rgba(255,255,255,.28)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#b7d7d5;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,a{font:inherit}.garden{position:relative;min-height:100svh;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,#6ea9d1 0%,#9dcbd5 46%,#f1d6a0 72%,#48634c 100%)}.sky{position:absolute;inset:0;z-index:0;background:radial-gradient(circle at 16% 67%,rgba(255,241,177,.95) 0 3%,rgba(255,206,113,.35) 8%,transparent 22%),linear-gradient(180deg,#4486ba 0%,#8fc2d1 53%,#f2c98d 78%,#6a7f62 100%)}.sun-glow{position:absolute;left:7%;top:47%;width:22rem;height:22rem;border-radius:50%;background:radial-gradient(circle,rgba(255,255,218,.7),rgba(255,222,143,.2) 35%,transparent 70%);filter:blur(8px)}.horizon{position:absolute;z-index:1;left:-5%;right:-5%;bottom:24%;height:17%;background:linear-gradient(180deg,rgba(74,102,103,.22),rgba(23,64,58,.6));clip-path:polygon(0 65%,12% 34%,22% 57%,36% 20%,49% 61%,62% 38%,73% 55%,87% 18%,100% 48%,100% 100%,0 100%)}.aurora{position:absolute;top:2%;left:30%;width:56%;height:32%;border-radius:50%;filter:blur(24px);opacity:var(--aurora-opacity);transform:rotate(-8deg);background:linear-gradient(110deg,transparent 8%,rgba(100,255,202,.7) 28%,rgba(115,195,255,.2) 42%,rgba(199,132,255,.46) 58%,transparent 82%);animation:aurora 11s ease-in-out infinite alternate}.aurora-b{left:50%;top:8%;width:44%;opacity:var(--aurora-opacity-b);animation-duration:15s}.plant-layer{position:absolute;z-index:2;bottom:4%;aspect-ratio:1/1;background-image:url("./assets/plants-mini.webp");background-size:400% 138%;background-repeat:no-repeat;background-position-y:100%;transform-origin:50% 100%;will-change:transform;pointer-events:none;filter:saturate(.9) contrast(1.03) drop-shadow(0 15px 24px rgba(9,38,24,.2))}.plant-left{left:-8%;width:min(48vw,650px);background-position-x:0%;animation:swayLeft var(--wind-duration) ease-in-out infinite alternate}.plant-center{left:22%;width:min(54vw,760px);z-index:2;opacity:.86;background-position-x:33.333%;animation:swayCenter var(--wind-duration-slow) ease-in-out infinite alternate}.plant-right{right:-7%;width:min(46vw,640px);background-position-x:66.666%;animation:swayRight var(--wind-duration-fast) ease-in-out infinite alternate}.meadow-front{left:20%;bottom:-5%;width:min(64vw,900px);z-index:3;opacity:.95;background-position-x:100%;animation:swayCenter var(--wind-duration-slow) ease-in-out infinite alternate}.particle-field{position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none}.particle{position:absolute;width:5px;height:5px;border-radius:50%;background:rgba(255,247,189,.9);box-shadow:0 0 11px rgba(215,255,226,.9);animation:drift linear infinite}.masthead{position:absolute;top:max(22px,env(safe-area-inset-top));left:max(24px,env(safe-area-inset-left));right:max(24px,env(safe-area-inset-right));display:flex;justify-content:space-between;align-items:flex-start;gap:24px;z-index:6}.lab-link{color:rgba(255,255,255,.82);font-size:11px;letter-spacing:.18em;text-decoration:none}.masthead h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(32px,4vw,64px);line-height:1;margin:10px 0 4px;text-shadow:0 2px 18px rgba(15,45,52,.25)}.subtitle{margin:0;font-family:Georgia,serif;letter-spacing:.1em}.header-actions{display:flex;gap:8px}.header-actions button,.retry,#about-close{border:1px solid var(--line);background:rgba(20,45,52,.24);color:#fff;border-radius:999px;padding:9px 13px;backdrop-filter:blur(14px);cursor:pointer}.glass{background:var(--glass);border:1px solid var(--line);box-shadow:0 18px 55px rgba(11,42,47,.14);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.intro-panel{position:absolute;left:max(24px,env(safe-area-inset-left));top:31%;width:min(410px,calc(100vw - 48px));padding:20px 22px;border-radius:18px;z-index:5}.eyebrow{font-size:10px;letter-spacing:.16em;opacity:.78}.intro-panel h2{font-family:Georgia,serif;font-weight:400;font-size:clamp(22px,2.4vw,34px);margin:.4em 0}.intro-panel p:last-child{line-height:1.75;font-size:13px;margin-bottom:0}.weather-card{position:absolute;right:max(24px,env(safe-area-inset-right));top:100px;width:min(340px,calc(100vw - 48px));padding:18px;border-radius:18px;z-index:6}.weather-head{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.12em;margin-bottom:12px}.live-state{color:#b9ffdc}.metric{display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding:10px 0}.metric>span{font-size:12px;opacity:.86}.metric strong{font-size:22px;font-weight:500}.metric small{font-size:10px;font-weight:400}.meter{grid-column:1/-1;height:4px;background:rgba(255,255,255,.13);border-radius:99px;overflow:hidden}.meter i{display:block;height:100%;width:0;background:rgba(187,255,222,.85);border-radius:inherit;transition:width .8s ease}.updated{font-size:10px;opacity:.72;border-top:1px solid rgba(255,255,255,.16);padding-top:10px;margin:8px 0 0}.retry{margin-top:10px}.control-panel{position:absolute;right:max(24px,env(safe-area-inset-right));bottom:max(52px,calc(env(safe-area-inset-bottom) + 42px));width:min(430px,calc(100vw - 48px));padding:14px 16px;border-radius:18px;z-index:6}.control-group{display:flex;align-items:center;gap:14px;font-size:11px}.segmented{display:flex;flex:1;gap:6px}.segmented button{flex:1;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:8px 10px;cursor:pointer}.segmented button.active{background:rgba(212,255,223,.3);border-color:rgba(224,255,234,.7)}.legend-line{display:flex;flex-wrap:wrap;gap:8px 12px;margin-top:12px;font-size:10px;opacity:.78}.legend-dot{width:7px;height:7px;border-radius:50%;align-self:center}.legend-dot.wind{background:#d9ffe7}.legend-dot.density{background:#ffe8a2}.legend-dot.field{background:#cfb6ff}.about-panel{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);z-index:10;width:min(560px,calc(100vw - 40px));padding:28px;border-radius:22px;line-height:1.8}.about-panel h2{font-family:Georgia,serif;font-size:30px;font-weight:400}.about-panel a{color:#fff}.about-panel #about-close{position:absolute;right:14px;top:14px;font-size:18px;padding:5px 10px}.status{position:absolute;left:50%;top:22px;transform:translateX(-50%);z-index:7;padding:7px 11px;border-radius:999px;background:rgba(13,43,50,.38);font-size:10px;letter-spacing:.04em;backdrop-filter:blur(12px)}.site-legal--008{position:absolute!important;left:max(24px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));z-index:7;color:rgba(255,255,255,.82)!important}.site-legal--008 a{color:inherit!important}
@keyframes swayLeft{from{transform:rotate(var(--sway-a)) translateX(var(--sway-x-neg))}to{transform:rotate(var(--sway-b)) translateX(var(--sway-x))}}@keyframes swayCenter{from{transform:rotate(var(--sway-a))}to{transform:rotate(var(--sway-b))}}@keyframes swayRight{from{transform:rotate(var(--sway-c))}to{transform:rotate(var(--sway-b))}}@keyframes aurora{from{transform:translateX(-2%) rotate(-9deg) scaleY(.9)}to{transform:translateX(5%) rotate(-4deg) scaleY(1.12)}}@keyframes drift{from{transform:translate3d(0,12vh,0);opacity:0}15%{opacity:.9}to{transform:translate3d(calc(22vw + 90px),-35vh,0);opacity:0}}
@media(max-width:760px){.garden{min-height:100dvh}.masthead{top:max(14px,env(safe-area-inset-top));left:16px;right:16px}.masthead h1{font-size:34px}.lab-link{font-size:9px}.intro-panel{display:none}.weather-card{right:16px;top:112px;width:230px;padding:12px}.weather-head{font-size:9px}.metric{padding:6px 0}.metric strong{font-size:17px}.metric>span{font-size:10px}.updated{font-size:9px}.control-panel{left:auto;right:16px;bottom:max(50px,calc(env(safe-area-inset-bottom) + 38px));width:224px;padding:10px 11px;border-radius:16px;background:rgba(20,45,52,.2)}.control-group{align-items:flex-start;flex-direction:column;gap:7px}.control-group>span{font-size:9px}.segmented{width:100%;gap:4px}.segmented button{padding:7px 5px;font-size:10px}.legend-line{display:none}.plant-left{width:82vw;left:-22%}.plant-center{width:100vw;left:5%}.plant-right{width:78vw;right:-28%}.meadow-front{width:92vw;left:4%;bottom:-3%}.site-legal--008{font-size:10px!important;left:16px;bottom:max(13px,env(safe-area-inset-bottom));max-width:calc(100vw - 270px);flex-wrap:wrap}.status{top:72px}.header-actions button{padding:7px 10px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.plant-layer,.aurora,.particle{animation:none!important}.plant-layer{transform:none!important}}