@font-face{font-family:GardenSerif;src:url("assets/fonts/lora-regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:GardenSerif;src:url("assets/fonts/lora-italic.ttf") format("truetype");font-style:italic;font-weight:400;font-display:swap}
:root{color-scheme:light;--ink:#254839;--soft-ink:#425b48;--cream:#fffaf0;--gold:#f1d79a;--motion:running}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#eddfbf}
body{font-family:"Segoe UI",Arial,sans-serif;color:var(--ink);overflow-x:hidden;-webkit-tap-highlight-color:transparent}
button{font:inherit;touch-action:manipulation}
button:focus-visible{outline:3px solid #fff;outline-offset:6px;box-shadow:0 0 0 8px #365840}
[hidden]{display:none!important}
.garden{position:relative;isolation:isolate;width:100%;height:100svh;min-height:560px;overflow:hidden;cursor:pointer;background:#d5dabd}
.landscape,.morning-light,.reading-light,.sun-haze,.bottom-shade,#pollen,#wind-garden{position:absolute;inset:0;pointer-events:none}
.landscape{z-index:-7;background-image:url("assets/dawn-garden.png");background-size:cover;background-position:50% 50%;transform:scale(1.018)}
#wind-garden{z-index:-6;width:100%;height:100%;opacity:0}
#wind-garden.is-ready{opacity:1}
.morning-light{z-index:-5;background:linear-gradient(115deg,rgba(255,235,183,.07),transparent 45%,rgba(255,233,191,.12))}
.sun-haze{z-index:-4;inset:10% 6% 20% 33%;background:radial-gradient(ellipse at 58% 32%,rgba(255,239,185,.18),transparent 55%);mix-blend-mode:screen}
.reading-light{z-index:-3;background:radial-gradient(ellipse 48% 46% at 50% 31%,rgba(255,249,229,.84) 0,rgba(255,248,229,.6) 35%,rgba(255,248,229,.1) 75%,transparent 100%)}
.bottom-shade{z-index:0;inset:auto 0 0;height:38%;background:linear-gradient(transparent,rgba(22,46,33,.38));opacity:.85}
.masthead{position:absolute;z-index:3;top:max(28px,env(safe-area-inset-top));left:42px;right:42px;display:flex;justify-content:space-between;align-items:center;cursor:default}
.recipient{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:2px;font-weight:600;text-transform:uppercase;padding:6px 10px;border-radius:30px;background:#fff8e2b5;backdrop-filter:blur(5px)}
.recipient img{filter:drop-shadow(0 1px 3px #fff9)}
.occasion{display:flex;align-items:center;gap:12px;font-size:17px;font-family:Georgia,"Times New Roman",serif;letter-spacing:2px}
.year{font-family:"Segoe UI",Arial,sans-serif;font-size:10px;letter-spacing:2px;border-left:1px solid #45634760;padding-left:12px}
.words{position:absolute;z-index:3;top:17%;left:50%;transform:translateX(-50%);width:min(800px,88%);text-align:center;cursor:pointer;text-shadow:0 1px 16px #fff9}
.eyebrow{font-size:10px;line-height:1.8;letter-spacing:3px;font-weight:600;margin:0 0 24px;color:var(--soft-ink)}
h1{font-family:GardenSerif,Georgia,"Times New Roman",serif;font-size:clamp(45px,5.6vw,83px);font-weight:400;line-height:1.16;letter-spacing:-2.7px;margin:0}
h1 em{font-weight:400}
.tiny-line{display:block;width:34px;height:1px;margin:25px auto 20px;background:#63775875}
.intro-note,.wish-signature{font-size:14px;line-height:1.8;color:#40573c;margin:0;font-weight:400}
.wish-view{padding-top:1.5vh}
.wish-view .eyebrow{margin-bottom:8px}
.wish-flower{font-family:Georgia,serif;font-size:32px;line-height:1.3;color:#7b864d;margin:0 0 13px}
.wish{font-family:GardenSerif,Georgia,"Times New Roman",serif;font-size:clamp(28px,3.2vw,45px);line-height:1.46;letter-spacing:-.65px;white-space:pre-line;font-weight:400;margin:0 auto;max-width:770px;min-height:2.92em;text-wrap:balance}
.wish-signature{font-size:12px;letter-spacing:.35px}
.wish-view .tiny-line{margin-top:22px;margin-bottom:16px}
.flowers{position:absolute;z-index:1;bottom:-19%;pointer-events:none;width:34%;max-width:490px;transform-origin:50% 100%;will-change:transform}
.flowers img{display:block;width:100%;height:auto;user-select:none;pointer-events:none;filter:drop-shadow(1px 4px 5px #6a421b10)}
.flowers-left{left:-10%}
.flowers-right{right:-10%;bottom:-22%;width:32%}
.flowers-right img{transform:scaleX(-1)}
#pollen{z-index:2;width:100%;height:100%}
.garden-footer{position:absolute;z-index:4;bottom:max(65px,calc(env(safe-area-inset-bottom) + 40px));left:50%;transform:translateX(-50%);text-align:center;width:max-content;max-width:calc(100% - 40px)}
.garden-touch{position:absolute;inset:0;z-index:4;width:100%;height:100%;border:0;background:transparent;border-radius:0;cursor:pointer}
.garden-touch:focus-visible{outline:2px solid #fff8dc;outline-offset:-10px;box-shadow:inset 0 0 0 12px #36584050}
.masthead,.words,.garden-footer{pointer-events:none}
.tap-hint{font-size:11px;line-height:1.6;letter-spacing:.15px;color:#fffdf5;margin:12px 0 0;text-shadow:0 1px 8px #10291d;opacity:.95}
.progress{height:20px;display:flex;gap:8px;align-items:center;justify-content:center;margin:0 0 15px}
.progress span{height:4px;width:4px;background:#fff9;border-radius:10px;box-shadow:0 1px 4px #26413450;transition:width .3s,background .3s}
.progress span.active{width:22px;background:#fff8d9}
.motion-toggle{position:absolute;z-index:5;right:30px;bottom:max(24px,env(safe-area-inset-bottom));width:38px;height:38px;display:grid;place-items:center;background:#ffffef20;color:#fffef2;border:1px solid #ffffef60;border-radius:50%;cursor:pointer;backdrop-filter:blur(6px)}
.sound-toggle{position:absolute;z-index:5;right:80px;bottom:max(24px,env(safe-area-inset-bottom));min-height:38px;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 13px;background:#ffffef20;color:#fffef2;border:1px solid #ffffef60;border-radius:30px;cursor:pointer;backdrop-filter:blur(6px);font-size:11px;transition:background .3s}
.sound-toggle[aria-pressed="true"]{background:#fff8e83b}
.sound-waves{display:none}
.sound-toggle[aria-pressed="true"] .sound-waves{display:block}
.sound-toggle[aria-pressed="true"] .sound-muted{display:none}
.sound-toggle[data-state="loading"]{opacity:.7}
.sound-status{position:absolute;z-index:5;bottom:76px;right:30px;max-width:calc(100% - 44px);padding:8px 12px;border-radius:14px;background:#fff9eaed;color:var(--ink);font-size:11px;line-height:1.5;pointer-events:none}
.sound-status:empty{display:none}
.play-icon{display:none}
.is-paused .pause-icon{display:none}
.is-paused .play-icon{display:block}
.is-paused .landscape,.is-paused .morning-light,.is-paused .sun-haze,.is-paused .flowers{animation-play-state:paused}
.little-note{position:absolute;z-index:3;bottom:max(25px,env(safe-area-inset-bottom));left:36px;margin:0;color:#fff5df;font-family:Georgia,serif;font-size:12px;font-style:italic;text-shadow:0 1px 5px #243b2b;opacity:.85;pointer-events:none}
.no-script{position:absolute;inset:20% 10% auto;z-index:20;padding:25px;background:#fff9ed;border-radius:12px;line-height:1.7}
@media(min-width:1600px){.flowers{max-width:620px;bottom:-25%}.flowers-right{bottom:-28%}.words{top:18%}}
@media(max-width:700px){
  .garden{min-height:570px}
  .masthead{top:max(23px,env(safe-area-inset-top));left:22px;right:22px}
  .recipient{font-size:10px;letter-spacing:1.5px;gap:7px}.recipient img{width:19px;height:19px}
  .occasion{font-size:16px;gap:8px}.year{font-size:9px;padding-left:8px}
  .landscape{background-position:60% 50%}
  .reading-light{background:radial-gradient(ellipse 90% 50% at 50% 31%,rgba(255,249,229,.91),rgba(255,248,229,.75) 35%,rgba(255,248,229,.15) 80%,transparent)}
  .words{top:18%;width:calc(100% - 38px)}
  .eyebrow{font-size:9px;letter-spacing:2.4px;margin-bottom:22px}
  h1{font-size:clamp(42px,11.8vw,62px);letter-spacing:-1.8px;line-height:1.2}
  .tiny-line{margin:23px auto 18px}.intro-note{font-size:13px;line-height:1.85}
  .wish-view{padding-top:0}.wish{font-size:clamp(24px,6.6vw,32px);line-height:1.5;letter-spacing:-.3px;white-space:normal;min-height:4.5em}
  .wish-flower{margin-bottom:13px}.wish-signature{font-size:11px}
  .flowers{width:70%;left:-33%;bottom:-5%;max-width:none}.flowers-right{left:auto;right:-32%;bottom:-9%;width:67%}
  .garden-footer{bottom:max(77px,calc(env(safe-area-inset-bottom) + 55px));width:calc(100% - 40px)}
  .tap-hint{font-size:10px}.motion-toggle{bottom:23px;right:22px;width:34px;height:34px}.little-note{left:22px;bottom:32px;font-size:10px}
  .sound-toggle{bottom:23px;right:66px;min-height:34px;width:34px;height:34px;padding:7px}.sound-label{display:none}.sound-status{right:22px;bottom:69px}
  .progress{gap:7px;margin-bottom:13px}.bottom-shade{height:33%;opacity:1}
}
@media(max-width:360px){.words{top:17%;width:calc(100% - 32px)}h1{font-size:39px}.wish{font-size:23px}.eyebrow{letter-spacing:1.8px}.wish-view .tiny-line{margin-top:15px;margin-bottom:12px}}
@media(max-height:650px){.garden{min-height:540px}.words{top:15%}.eyebrow{margin-bottom:16px}h1{font-size:clamp(38px,6vw,58px)}.wish{font-size:clamp(24px,3vw,34px)}.tiny-line{margin-top:18px;margin-bottom:14px}.garden-footer{bottom:61px}.wish-view{padding-top:0}.wish-flower{font-size:23px;margin-bottom:8px}.wish-signature{font-size:10px}}
@media(max-height:500px) and (min-width:701px){.garden{min-height:460px}.words{top:15%;width:70%}h1{font-size:45px}.intro-note{font-size:12px}.wish{font-size:25px}.wish-flower{display:none}.garden-footer{bottom:43px}.tap-hint{display:none}.tiny-line{margin:12px auto}.progress{margin-bottom:8px}}
@media(prefers-reduced-motion:reduce){.progress span{transition:none}}