:root{color-scheme:dark;--ink:#f5f4e9;--night:0;--warm:1;--mist:0;--ease:cubic-bezier(.22,1,.36,1)}*{box-sizing:border-box}body{margin:0;background:#203629;color:var(--ink);font-family:"Avenir Next",Avenir,"Helvetica Neue",sans-serif;font-size:14px}button,a,input{-webkit-tap-highlight-color:transparent}button,a{color:inherit}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #fff4b9;outline-offset:6px}button:active{transform:translateY(1px)}button{transition:background .3s,opacity .3s,transform .3s}a{text-decoration:none}#world{position:relative;min-height:780px;height:100svh;overflow:hidden;isolation:isolate}.landscape,.daylight,.nightwash,.shade,#scene{position:absolute;inset:0;pointer-events:none}.landscape{background:#6b8056 url('assets/meadow.jpg') center 56%/cover no-repeat;transform:scale(1.025);transition:filter 2s,transform 8s var(--ease);filter:brightness(calc(1 - var(--night)*.69)) saturate(calc(1 - var(--night)*.35))}.daylight{background:linear-gradient(120deg,transparent 40%,#ffb74d30);opacity:var(--warm);mix-blend-mode:soft-light}.nightwash{background:linear-gradient(#132744,#172e4500 75%);opacity:var(--night);mix-blend-mode:multiply}.shade{background:linear-gradient(90deg,#142c366b,transparent 72%),linear-gradient(0deg,#0a2018db,transparent 45%,#152c3220);z-index:1}#scene{z-index:2;width:100%;height:100%;pointer-events:auto}header{position:relative;z-index:5;margin:0 4.5%;height:110px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #f8f7de25}.wordmark{font-family:Georgia,serif;font-size:36px;letter-spacing:-2px;display:flex;gap:9px;align-items:center}.brand-flower{font-family:serif;font-size:34px;line-height:1;font-weight:normal}.brand-period{margin-left:-9px;color:#e6dc9c}.header-note{font-size:10px;letter-spacing:2.3px;opacity:.8}.quiet-button{display:flex;align-items:center;justify-content:center;gap:11px;border:1px solid #fff5;border-radius:30px;padding:12px 19px;background:#142e2518;backdrop-filter:blur(12px);font-size:12px}.quiet-button:hover{background:#ffffff20}.sound-bars{display:flex;gap:3px;align-items:center;height:15px}.sound-bars i{width:2px;height:5px;background:currentColor;display:block}.sound-bars i:nth-child(2){height:12px}.sound-bars i:nth-child(3){height:8px}.sound-bars i:nth-child(4){height:14px}#sound[aria-pressed=true] i{animation:sound 1s ease-in-out infinite alternate}#sound i:nth-child(2){animation-delay:.2s}#sound i:nth-child(3){animation-delay:.4s}.intro{position:absolute;left:8%;top:25%;z-index:3;transition:opacity 1s,transform 1s;pointer-events:none}.intro button{pointer-events:auto}.eyebrow{font-size:10px;letter-spacing:2.7px;display:flex;gap:10px;align-items:center}.eyebrow>span{height:5px;width:5px;background:#e9e6c2;border-radius:50%}h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(72px,7.9vw,132px);font-weight:400;letter-spacing:-.065em;line-height:.99;margin:26px 0 25px;text-shadow:0 3px 32px #16302120}h1 em{font-weight:400}p{font-size:14px;line-height:1.85;color:#eeeee0df;letter-spacing:.1px}.primary{margin-top:19px;border:0;border-radius:40px;background:#f0efdb;color:#283b2c;padding:17px 23px;display:flex;align-items:center;gap:35px;font-size:13px}.primary span{font-size:20px}.primary:hover{background:#fffdea;transform:translateY(-3px)}.intro-foot{font-size:10px;margin-top:17px;color:#eeeee0a3;letter-spacing:.2px}.field-caption{position:absolute;right:5%;top:61%;font-size:9px;letter-spacing:2px;z-index:3;display:flex;align-items:center;gap:9px}.live-dot{width:5px;height:5px;border-radius:50%;background:#eff7c1;box-shadow:0 0 14px #eff7c1}.controls{position:absolute;z-index:5;bottom:95px;left:50%;transform:translateX(-50%);width:min(720px,88%);padding:24px 27px 20px;display:flex;align-items:center;gap:25px;background:#132c2780;border:1px solid #e9e9d333;box-shadow:inset 0 1px 0 #ffffff12,0 15px 60px #081b171a;backdrop-filter:blur(24px);border-radius:18px}.time-control{flex:1;min-width:180px}.control-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.control-heading label,.control-title{font-size:8px;letter-spacing:1.8px;color:#e6e8d6aa}.control-heading output{font-size:11px}.time-labels{display:flex;justify-content:space-between;font-size:8px;color:#e6e8d68f;margin-top:9px}input[type=range]{display:block;width:100%;height:2px;margin:0;appearance:none;background:linear-gradient(90deg,#dddcc0,#edc992 55%,#698293);border-radius:3px;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:#fff9d9;box-shadow:0 0 0 5px #f8f0b620,0 0 15px #f6da9f55}input[type=range]::-moz-range-thumb{width:11px;height:11px;border:0;border-radius:50%;background:#fff9d9}.control-divider{height:43px;width:1px;background:#ffffff24}.weather-control{display:flex;flex-direction:column;gap:12px}.weather-options{display:flex;gap:3px}.weather-options button{border:0;border-radius:20px;padding:7px 11px;font-size:10px;background:none;color:#eaeddfa6;white-space:nowrap}.weather-options button.selected{background:#eff0dc22;color:#fffde9}.weather-options button:hover{background:#eff0dc18}.breeze{border:1px solid #e6e9d933;border-radius:30px;background:none;white-space:nowrap;font-size:10px;padding:12px 15px;display:flex;gap:9px;align-items:center}.breeze span{font-size:21px;line-height:.5}.breeze:hover{background:#ffffff15}footer{position:absolute;bottom:0;left:4.5%;right:4.5%;height:64px;z-index:5;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #e8f0db25;font-size:10px;color:#e8ead3af}footer button{border:0;background:none;padding:8px 0;font-size:10px}footer button span{padding-left:10px}.touch-note{font-size:8px;letter-spacing:1.7px}.footer-right{font-family:Georgia,serif;font-style:italic;font-size:13px}.rest-overlay{position:absolute;inset:0;z-index:8;background:#102c3826;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;backdrop-filter:blur(2px);animation:appear 1.5s}.rest-overlay[hidden]{display:none}.rest-top{position:absolute;top:70px;font-size:10px;letter-spacing:3px}.breath-orb{width:145px;height:145px;border-radius:50%;background:radial-gradient(circle,#fff6c81a,#fff6c803);border:1px solid #fff6c84d;box-shadow:0 0 75px #fff6c815,inset 0 0 50px #fff6c80a;animation:breathe 9s ease-in-out infinite}.rest-copy h2,dialog h2{font-family:Georgia,serif;font-weight:normal;font-size:42px;letter-spacing:-1.5px;margin:40px 0 10px}.rest-copy p{font-size:12px}.rest-copy output{display:block;font-size:12px;letter-spacing:3px;margin:30px}.rest-copy button{margin:auto}.resting .intro,.resting .controls,.resting .field-caption,.resting footer,.resting header{opacity:0;pointer-events:none}.resting .landscape{transform:scale(1.10)}.weather-mist .landscape{filter:brightness(calc(1 - var(--night)*.65)) saturate(.7) contrast(.8)}.weather-mist .daylight{background:linear-gradient(0deg,#e2e6d36b,transparent);opacity:1;mix-blend-mode:normal}.weather-rain .landscape{filter:brightness(calc(.73 - var(--night)*.4)) saturate(.65)}dialog{width:min(470px,90vw);background:#263d33;color:var(--ink);border:1px solid #dde2c733;border-radius:18px;padding:48px 38px;box-shadow:0 30px 100px #0005}dialog::backdrop{background:#0b241b90;backdrop-filter:blur(8px)}dialog h2{font-size:38px;margin-top:28px}dialog p{font-size:13px}dialog small{display:block;font-size:10px;line-height:1.8;color:#e9ead09c;margin-top:25px}#close-about{position:absolute;right:18px;top:12px;background:none;border:0;font-size:28px;font-weight:200}.skip{position:absolute;left:20px;top:-100px;z-index:20;background:#263d33;padding:14px}.skip:focus{top:15px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@keyframes sound{to{transform:scaleY(.35)}}@keyframes breathe{50%{transform:scale(1.45);opacity:.6}}@keyframes appear{from{opacity:0}to{opacity:1}}
@media(min-width:1500px){.intro{top:24%}.controls{bottom:110px}header{height:120px}}@media(max-height:800px) and (min-width:769px){#world{min-height:660px}.intro{top:23%}h1{font-size:88px;margin:20px 0}.intro p{font-size:12px}.primary{margin-top:14px}.controls{bottom:80px;padding:18px 24px}.intro-foot{display:none}}
@media(max-width:768px){#world{min-height:760px}header{height:86px;margin:0 6%}.wordmark{font-size:30px}.brand-flower{font-size:28px}.header-note{display:none}.quiet-button{padding:10px 14px;font-size:11px}.landscape{background-position:62% center}.shade{background:linear-gradient(90deg,#102c3955,transparent),linear-gradient(0deg,#0b241bea,transparent 70%)}.intro{top:23%;left:8%;right:6%}h1{font-size:clamp(70px,13vw,100px);margin:23px 0}.eyebrow{font-size:8px;letter-spacing:2px}.intro p{font-size:12px}.primary{font-size:12px;padding:14px 20px;gap:28px}.intro-foot{font-size:9px}.field-caption{display:none}.controls{bottom:90px;width:88%;padding:20px;gap:18px;display:grid;grid-template-columns:1fr auto;border-radius:16px}.time-control{grid-column:1/-1}.control-divider{display:none}.control-title{display:none}.weather-control{gap:0}.weather-options button{padding:8px 10px;font-size:10px}.breeze{padding:10px;font-size:9px;gap:7px}.time-labels{margin-top:11px}.control-heading{margin-bottom:15px}footer{height:64px;left:6%;right:6%}.touch-note{display:none}.footer-right{font-size:11px}footer button{font-size:9px}.rest-copy h2{font-size:36px}.rest-top{top:50px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.breath-orb{opacity:.7}}@media(prefers-reduced-transparency:reduce){.controls{background:#243e34}.quiet-button{background:#243e34}}

/* Same composition at two light levels; opacity crossfades preserve landscape depth. */
.landscape{filter:brightness(calc(1 - var(--night)*.07)) saturate(calc(1 - var(--night)*.08))}.landscape::after{content:"";position:absolute;inset:0;background:url("assets/meadow-night.jpg") center 56%/cover no-repeat;opacity:var(--night);transition:opacity 1.2s}.nightwash{opacity:calc(var(--night)*.25)}.weather-mist .landscape{filter:saturate(.7) contrast(.8)}.weather-rain .landscape{filter:brightness(.75) saturate(.65)}@media(max-width:768px){.landscape::after{background-position:62% center}}
@media(max-width:380px){.controls{width:92%;padding:18px 16px;gap:12px}.weather-options button{padding:7px 8px;font-size:9px}.breeze{font-size:8px;padding:10px 8px}h1{font-size:60px}.intro{top:22%}.intro-foot{font-size:8px}.footer-right{font-size:10px}}

/* WebGL owns all scenery and lighting. Photos remain only as a compatibility fallback. */
.scene-3d .landscape,.scene-3d .daylight,.scene-3d .nightwash{display:none}.scene-3d #scene{z-index:0}.scene-3d .shade{background:linear-gradient(90deg,#10252140,transparent 65%),linear-gradient(0deg,#0a2018a0,transparent 42%,#152c3208)}.scene-3d.resting #scene{transition:transform 8s cubic-bezier(.22,1,.36,1);transform:scale(1.035)}