/* @RJS° Shared Garden — pathway-integrated local visual review v2.
   The approved Patio, album assets and audio sources remain unchanged. */
[hidden]{display:none!important}
.pathway-section,.shared-garden{max-width:1448px;margin:18px auto 0;scroll-margin-top:20px}
.pathway-photo{position:relative;overflow:hidden;border:1px solid #857753;border-radius:8px;background:#101b12}
.pathway-photo>img{display:block;width:100%;height:auto}
.pathway-entry{position:absolute;left:34%;bottom:8%;width:32%;min-height:46px;border:2px solid #e4cd8c;background:rgba(13,31,18,.92);color:#f3dfaf;border-radius:999px;cursor:pointer;padding:10px 13px;font:700 clamp(12px,1.2vw,17px) Georgia,serif;box-shadow:0 3px 13px #0009}
.pathway-entry:hover,.pathway-entry:focus-visible{outline:3px solid #e4cd8c;outline-offset:2px;background:#243f29}
.shared-garden{position:relative;isolation:isolate;padding:0 0 48px;background:#152015;border:1px solid #7e8259;border-radius:8px;overflow:hidden}
.shared-garden:before{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(90deg,rgba(11,27,14,.82) 0%,rgba(16,35,18,.65) 24%,rgba(20,26,18,.02) 48%,rgba(13,26,16,.03) 54%,rgba(24,19,31,.70) 78%,rgba(19,14,28,.86)),url('assets/patio/shared-garden-continuation-candidate.png');background-size:100% 100%,cover;background-position:center,center top;background-repeat:no-repeat;filter:saturate(.87)}
.garden-head{text-align:center;padding:35px 18px 16px;background:linear-gradient(#102318dc,#102318aa,transparent);text-shadow:0 2px 12px #020802}
.garden-head>p:first-child{color:#e8cf93;font:600 12px system-ui,sans-serif;letter-spacing:.1em}.garden-head h2{color:#f0d6a2;font:clamp(24px,3vw,42px) Georgia,serif;margin:4px}.garden-head>p:last-child{color:#e4e6d6}
.album-fronts{display:grid;grid-template-columns:minmax(0,1fr) 15% minmax(0,1fr);gap:10px;align-items:start;max-width:1120px;margin:16px auto 14px;padding:0 clamp(10px,4vw,54px)}
.album-front{margin:0;text-align:center;grid-column:1;filter:drop-shadow(0 9px 12px #0009)}.album-front.purple{grid-column:3}.album-front img{display:block;width:min(100%,235px);margin:auto;aspect-ratio:1;object-fit:contain;border:1px solid #c9a227;border-radius:3px}.album-front.purple img{border-color:#8a55bb}.album-front figcaption{font:600 clamp(11px,1.5vw,16px) Georgia,serif;margin:7px auto;color:#ffe09a;text-shadow:0 2px 5px #000}.album-front.purple figcaption{color:#dbc3ff}
.garden-controls{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;margin:10px auto 26px;padding:10px 12px;background:rgba(9,24,14,.67);max-width:610px;border-radius:28px}.garden-controls button{border:1px solid #c9a227;border-radius:40px;background:#20301f;color:#ffdf9b;cursor:pointer;padding:9px 15px}.garden-controls button:focus-visible{outline:3px solid #f6da90}.garden-controls p{flex-basis:100%;text-align:center;margin:0;color:#e2e5d9;font:13px/1.6 system-ui,sans-serif}
/* Each stop belongs to the same real garden path: two planting beds frame visible stone in the middle. */
.blooms{position:relative;display:flex;flex-direction:column;gap:0;padding:14px 0 28px;background:linear-gradient(90deg,rgba(4,19,9,.57),transparent 32%,transparent 68%,rgba(11,8,20,.63))}
.bloom-pair{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(80px,19%) minmax(0,1fr);gap:0;min-height:330px;padding:18px clamp(8px,2vw,30px);scroll-margin-top:10px}
.bloom-pair::after{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;transform:translateX(-50%);pointer-events:none;background:linear-gradient(transparent,#eedcb34b,transparent);opacity:.3}
.garden-bed{min-width:0;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:15px}.garden-bed.gold{grid-column:1}.garden-bed.purple{grid-column:3}
.bloom-track{position:relative;box-sizing:border-box;width:min(100%,355px);min-width:0;padding:13px 12px 16px;text-align:center;color:#f4efde;background:linear-gradient(130deg,rgba(18,30,15,.88),rgba(22,35,19,.67));border-radius:36px 36px 18px 18px;border-bottom:2px solid #a99045;box-shadow:0 9px 26px #020a07a8, inset 0 1px #f3d89747;backdrop-filter:blur(3px)}
.bloom-track.purple{background:linear-gradient(225deg,rgba(29,17,40,.91),rgba(24,20,35,.70));border-bottom-color:#8157ad}
.bloom-track small{display:block;color:#e8d8b1;letter-spacing:.04em;font:11px/1.4 system-ui,sans-serif}.bloom-track.purple small{color:#d3b7ef}
.bloom-track h3{font:600 clamp(13px,1.65vw,18px)/1.2 Georgia,serif;margin:5px 0 3px;min-height:2.4em;color:#ffe5a3}.bloom-track.purple h3{color:#dec8ff}
.flower-stage{position:relative;width:min(62%,160px);height:145px;margin:6px auto 3px;display:flex;align-items:end;justify-content:center;filter:drop-shadow(0 8px 6px #0009)}
.flower-stage::before{content:'';position:absolute;bottom:9px;left:49%;width:7px;height:76px;border-radius:100%;background:linear-gradient(90deg,#2b4824,#5c8e43,#2d572a);transform:translateX(-50%) scaleY(var(--stem-progress,0));transform-origin:bottom;transition:transform .25s linear}
.flower-stage::after{content:'';position:absolute;bottom:4px;left:16%;width:68%;height:17px;border-radius:50%;background:radial-gradient(ellipse,#20361a 18%,#0f1b12 75%,transparent);opacity:.92}
.flower-photo{position:absolute;z-index:1;bottom:48px;width:100%;height:105px;object-fit:contain;transform:scale(var(--flower-progress,0));transform-origin:50% 95%;transition:transform .25s linear;mix-blend-mode:screen}
.flower-stage.complete .flower-photo{transform:scale(1)}.flower-stage.wilting{filter:grayscale(.8);opacity:.45}
.water-fall{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity .3s;overflow:hidden}.bloom-track.is-playing .water-fall{opacity:calc(.14 + var(--water-intensity,.25)*.60)}
.water-fall i{position:absolute;top:0;width:2px;height:12px;border-radius:100%;background:#d5f0f0a8;box-shadow:0 0 6px #c8eefab0;animation:water-fall 1.75s linear infinite}.water-fall i:nth-child(1){left:27%;animation-delay:-.6s}.water-fall i:nth-child(2){left:40%;animation-delay:-1.25s}.water-fall i:nth-child(3){left:57%;animation-delay:-.3s}.water-fall i:nth-child(4){left:73%;animation-delay:-1.6s}
@keyframes water-fall{from{transform:translateY(-15px);opacity:0}20%{opacity:.5}80%{opacity:.8}to{transform:translateY(140px);opacity:0}}
.player-strip{display:flex;align-items:center;gap:9px;margin:8px 0 5px;padding:8px 10px;border-radius:40px;background:#07140bbd;border:1px solid #d3ac5357}.purple .player-strip{background:#150f24cc;border-color:#9e78c96b}
.player-button{flex:0 0 38px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;border:1px solid #eccb78;background:#a67e27;color:#10130a;cursor:pointer;font:700 17px system-ui,sans-serif}.purple .player-button{border-color:#bba0e7;background:#6d3ca5;color:#fff}
.player-button:focus-visible{outline:3px solid white;outline-offset:2px}
.waterline{position:relative;flex:1;height:6px;background:#8d845754;border-radius:20px;overflow:hidden}.waterline-fill{display:block;height:100%;width:var(--water-progress,0%);border-radius:20px;background:linear-gradient(90deg,#567b82,#bee8e0,#e2ca80);transition:width .15s linear}.purple .waterline-fill{background:linear-gradient(90deg,#5c6293,#a4cad8,#b08de4)}
.timecode{font:11px/1.1 ui-monospace,monospace;color:#e3dfc9;white-space:nowrap}.flower-progress-text{text-align:center;font:12px/1.4 system-ui,sans-serif;color:#d9dfce;margin:6px 0 0}
.bonus-heading{margin:18px auto;text-align:center;color:#f4dca2;font:clamp(20px,2.2vw,30px) Georgia,serif;text-shadow:0 2px 9px #000}
.missing-audio{background:#1f2818;border:1px solid #a38b5a;padding:12px;border-radius:9px;color:#ead49d;text-align:center;margin:14px}
@media(max-width:680px){.pathway-entry{left:15%;width:70%;bottom:5%;font-size:12px;min-height:40px;padding:6px}.shared-garden:before{background-size:100% 100%,auto 100%;background-position:center,center}.album-fronts{grid-template-columns:minmax(0,1fr) 10% minmax(0,1fr)}.bloom-pair{grid-template-columns:minmax(0,1fr) 6% minmax(0,1fr);min-height:278px;padding:12px 5px}.bloom-track{padding:8px 5px;border-radius:20px 20px 12px 12px}.flower-stage{height:110px;width:95px}.flower-photo{height:75px;bottom:35px}.flower-stage::before{height:55px}.bloom-track h3{font-size:12px}.bloom-track small{font-size:9px}.player-strip{gap:3px;padding:4px}.player-button{width:29px;height:29px;flex-basis:29px;font-size:13px}.timecode{font-size:9px}.garden-head{padding:22px 10px 12px}}
@media(prefers-reduced-motion:reduce){.flower-photo,.flower-stage::before,.waterline-fill{transition:none}.water-fall i{animation:none}.water-fall{display:none}}

/* v3: Grow the garden around the authentic photographed path, not between UI cards. */
.shared-garden{background:#0d1b11;box-shadow:0 15px 45px #0008}
.shared-garden:before{background-image:
  radial-gradient(ellipse at center, rgba(182,160,102,.08) 0%, rgba(182,160,102,.02) 32%, transparent 58%),
  linear-gradient(90deg,#0a1a12ea 0%,#112016cc 22%,rgba(25,20,11,.88) 34%,rgba(34,28,16,.22) 45%,rgba(34,28,16,.22) 55%,rgba(31,20,40,.88) 66%,#180f25cc 78%,#120b1ce8 100%),
  linear-gradient(180deg,#102116 0%,#132316 28%,#142016 100%);
  background-size:100% 100%,100% 100%,100% 100%;background-repeat:no-repeat;filter:none}
.garden-head{background:linear-gradient(#08190fdf,#0d1b12bf 60%,transparent);padding-bottom:26px}
.blooms{padding:0 0 42px;background:linear-gradient(90deg,#0e2014d8 0%,#132416b5 20%,rgba(45,34,18,.75) 31%,rgba(44,35,20,.15) 44%,rgba(44,35,20,.15) 56%,rgba(41,25,54,.74) 69%,#1c132ad1 82%,#140d20dd 100%)}
.bloom-pair{grid-template-columns:minmax(0,1fr) minmax(120px,24%) minmax(0,1fr);min-height:435px;align-items:center;gap:0;padding:24px clamp(6px,1.6vw,23px);border:0}
.bloom-pair::after{display:none}
/* Actual cobbled-path photo, not a drawn stripe or divider. */
.path-spine{grid-column:2;grid-row:1;align-self:stretch;pointer-events:none;background-image:url('assets/patio/shared-garden-interior-path.png');background-size:cover;background-position:center top;border-radius:24px;mask-image:linear-gradient(to bottom,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 6%,#000 94%,transparent);filter:drop-shadow(0 6px 10px #0008)}
.garden-bed{position:relative;z-index:1;align-self:center;gap:0}
.bloom-track,.bloom-track.purple{width:min(100%,375px);padding:9px 10px 15px;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;text-shadow:0 2px 6px #061007,0 2px 13px #000}
.bloom-track::before{content:'';position:absolute;z-index:-1;inset:9% 5% 10%;border-radius:45%;background:radial-gradient(ellipse at center,#132316d8 0%,#1a2a19a8 30%,transparent 72%);pointer-events:none}
.bloom-track.purple::before{background:radial-gradient(ellipse at center,#24143ad8 0%,#231730a8 30%,transparent 72%)}
.bloom-track small{font-size:12px;color:#ffda7d}.bloom-track.purple small{color:#d7baff}
.bloom-track h3{font-size:clamp(14px,1.7vw,21px);line-height:1.25;margin:8px auto 5px;max-width:340px;min-height:0}
.flower-stage{height:226px;width:min(94%,280px);margin:0 auto;filter:drop-shadow(0 14px 10px #010b05b0)}
.flower-stage::before{height:119px;width:11px;bottom:20px;border-radius:80% 20% 30% 80%;background:linear-gradient(90deg,#1d3619,#56803c 50%,#284f2d);box-shadow:3px 0 2px #0005;}
.flower-stage::after{bottom:6px;left:2%;width:96%;height:35px;background:radial-gradient(ellipse,#271f11ee 4%,#2b2418c4 45%,transparent 76%)}
.flower-photo{bottom:53px;height:158px;object-fit:contain;mix-blend-mode:normal;filter:drop-shadow(0 9px 6px #0008) saturate(1.07);transition:transform .15s linear,opacity .15s linear,clip-path .15s linear;clip-path:ellipse(var(--opening,0%) 70% at 50% 60%)}
.flower-stage.complete .flower-photo{clip-path:ellipse(75% 78% at 50% 55%)}
.bloom-track .flower-progress-text{color:#f5e9c3;font:12px/1.5 system-ui,sans-serif;margin:0 auto 8px;text-shadow:0 2px 6px #000}
.player-strip,.purple .player-strip{margin:7px auto 0;max-width:305px;padding:6px 9px;background:#0a1d12dd;border:1px solid #b99c5b88;border-radius:35px;box-shadow:0 4px 19px #0009;backdrop-filter:blur(7px);text-shadow:none}
.purple .player-strip{background:#21152fdf;border-color:#9e74c999}
.player-button{border:1px solid #eacb74;background:#9b782c}.purple .player-button{background:#633695}
.water-fall i{height:9px;width:1.5px;box-shadow:0 0 3px #d5f1eb90;opacity:.55}
.bloom-pair[data-pair='0']{padding-top:15px}
@media(max-width:680px){.shared-garden:before{background-size:100% 100%,100% 100%,100% 100%}.bloom-pair{grid-template-columns:minmax(0,1fr) minmax(24px,10%) minmax(0,1fr);min-height:270px;padding:12px 3px}.path-spine{opacity:.92;border-radius:12px}.flower-stage{height:120px;width:100%}.flower-photo{height:82px;bottom:32px}.flower-stage::before{height:66px;bottom:12px;width:6px}.flower-stage::after{height:15px;bottom:5px}.bloom-track,.bloom-track.purple{padding:5px 2px}.bloom-track small{font-size:10px}.bloom-track h3{font-size:12px;min-height:2.4em}.player-strip{padding:4px 3px;gap:3px}.player-button{flex-basis:28px;width:28px;height:28px}.timecode{font-size:9px}.flower-progress-text{font-size:10px!important}}
@media(prefers-reduced-motion:reduce){.flower-photo{transition:none}}

/* v5: final album covers appear above the path only after all 60 recordings complete. */
.album-back-reveal{position:relative;z-index:2;text-align:center;padding:40px 10px 54px;isolation:isolate;scroll-margin-top:30px}
.album-back-reveal::before{content:'';position:absolute;z-index:-1;inset:9px 29%;background:linear-gradient(180deg,#101b13da,#101b13ae);border-radius:18px;box-shadow:0 12px 26px #000a}
.album-back-reveal h3{font:clamp(20px,3vw,34px) Georgia,serif;color:#f7dca5;text-shadow:0 2px 8px #000;margin:0 0 18px}
.album-back-covers{display:flex;justify-content:center;gap:clamp(8px,1.4vw,18px);max-width:505px;margin:0 auto}
.album-back-cover{width:48%;min-width:0;margin:0;filter:drop-shadow(0 10px 13px #000b)}
.album-back-cover img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border:2px solid #c9a227;border-radius:4px}
.album-back-cover.purple img{border-color:#8157ad}
.album-back-cover figcaption{margin:9px 0;color:#ffdfa8;font:12px Georgia,serif}
.album-back-cover.purple figcaption{color:#e0c3ff}
@media(max-width:680px){.album-back-reveal::before{inset:9px 16%}.album-back-covers{max-width:300px}}
/* v6: the listening garden is earth and one uninterrupted stone pathway.
   Preserve all existing audio and Liflower state logic. */
.shared-garden:before{background-image:linear-gradient(90deg,#122215dd 0%,#272117b9 31%,#241e14c2 43%,#241e14c2 57%,#241b28b9 69%,#191025dd 100%);background-size:100% 100%;background-repeat:no-repeat}
.blooms{isolation:isolate;background:linear-gradient(90deg,#211d13de 0%,#2b2418aa 31%,transparent 40%,transparent 60%,#271f26aa 69%,#211626de 100%)}
.blooms::before{content:'';position:absolute;z-index:-1;top:0;bottom:0;left:38%;width:24%;pointer-events:none;background:url('assets/patio/interior-stone-run.jpg') center/100% 100% no-repeat;mask-image:linear-gradient(90deg,transparent,black 6%,black 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,black 6%,black 94%,transparent)}
.path-spine{background:none;filter:none;mask-image:none;-webkit-mask-image:none}
@media(max-width:680px){.blooms::before{left:44%;width:12%}}

/* v7: cultivate actual soil beds; make physical retaining-stone edge between earth and path. */
.shared-garden:before{background-image:
 linear-gradient(90deg,#141d12aa 0%,#1b2113aa 32%,#281d16c0 43%,#281d16c0 57%,#231727a8 68%,#16131fba 100%),
 url('assets/patio/garden-soil-texture.jpg');
 background-size:100% 100%,700px 800px;background-repeat:no-repeat,repeat}
.blooms{background:linear-gradient(90deg,rgba(31,24,16,.42) 0%,rgba(31,24,16,.18) 34%,transparent 40%,transparent 60%,rgba(39,26,38,.18) 66%,rgba(39,26,38,.42) 100%)}
.blooms::after{content:'';position:absolute;z-index:0;top:0;bottom:0;left:34.9%;width:30.2%;pointer-events:none;
 background-image:url('assets/patio/stone-edging.jpg'),url('assets/patio/stone-edging.jpg');
 background-repeat:repeat-y,repeat-y;background-position:left top,right top;background-size:10.5% 520px,10.5% 520px;filter:brightness(.9)}
.bloom-pair,.bonus-heading,.album-back-reveal{z-index:1}
.flower-photo{filter:drop-shadow(0 8px 5px #000c)}
/* The completed album jackets belong in the respective planted beds, NEVER over the stone walkway. */
.album-back-reveal{text-align:center;padding:35px 0 55px}
.album-back-reveal::before{display:none}
.album-back-reveal h3{display:inline-block;background:#0b1b12d9;border:1px solid #a18a57b8;padding:8px 27px;border-radius:9px;margin:0 auto 22px}
.album-back-covers{display:grid;grid-template-columns:37% 26% 37%;width:100%;max-width:none;gap:0}
.album-back-cover{width:min(78%,250px);max-width:100%;justify-self:center}
.album-back-cover:first-child{grid-column:1}.album-back-cover.purple{grid-column:3}
@media(max-width:680px){.blooms::after{left:33.5%;width:33%;background-size:9% 300px,9% 300px}
 .album-back-covers{grid-template-columns:36% 28% 36%;max-width:none}.album-back-cover{width:95%}}

/* v8 original ground: one continuous rendered path, retaining stones and soil
   all authored together. No source-photo cutouts, repeated edging, or strips. */
.shared-garden::before{background-image:linear-gradient(90deg,#112016 0%,#162719 50%,#20162d 100%);background-size:100% 100%;background-repeat:no-repeat}
.blooms{background: url('assets/patio/garden-original-path-soil.jpg') center top/100% 100% no-repeat;isolation:isolate}
.blooms::before,.blooms::after{display:none!important}
.path-spine{background:none!important;box-shadow:none!important;filter:none!important;mask-image:none!important;-webkit-mask-image:none!important}
.bloom-track::before{background:radial-gradient(ellipse,rgba(16,19,11,.66),transparent 72%)}
.bloom-track.purple::before{background:radial-gradient(ellipse,rgba(23,11,30,.70),transparent 72%)}
.flower-photo{mix-blend-mode:normal!important;clip-path:none!important;filter:drop-shadow(0 7px 5px #000a) saturate(1.03)}
.flower-stage.complete .flower-photo{clip-path:none!important}
.flower-stage::before{display:none!important}
.flower-stage::after{bottom:10px;background:radial-gradient(ellipse,#211a0edd 10%,transparent 71%)}
.bloom-track h3,.bloom-track small,.flower-progress-text{text-shadow:0 2px 4px #000,0 0 10px #000}
@media(max-width:680px){.blooms{background-size:100% 100%}.bloom-track h3{font-size:12px}}

/* v9: standalone photographic full-growth reveal, shown only after all recordings end. */
.complete-garden-reveal{position:relative;text-align:center;margin:32px auto 0;padding:15px 1%;max-width:1024px;background:#0c180f}.complete-garden-reveal h3{font:clamp(22px,3vw,38px) Georgia,serif;color:#efd49e;margin:0 0 6px}.complete-garden-reveal>p{font:13px/1.5 system-ui,sans-serif;color:#e4dfd0;margin:0 auto 15px;max-width:720px}.complete-garden-reveal .completed-scene{position:relative;width:100%;margin:auto}.complete-garden-reveal .completed-photo{display:block;width:100%;height:auto}.complete-garden-reveal .cover-hotspot{position:absolute;border:1px solid transparent;background:transparent;cursor:zoom-in}.complete-garden-reveal .cover-hotspot:hover,.complete-garden-reveal .cover-hotspot:focus-visible{border:3px solid #f6d991;outline:2px solid #132319;outline-offset:1px}.complete-garden-reveal .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* v11: the completed listening journey and test preview use the same cover viewer. */
.cover-dialog{background:#09130e;color:#f5e2b6;border:1px solid #b99a5b;border-radius:10px;padding:10px;max-width:96vw;max-height:96vh;width:min(94vw,1200px);box-shadow:0 20px 70px #000}
.cover-dialog::backdrop{background:#000e}
.viewer-bar{display:flex;gap:12px;justify-content:space-between;align-items:center;font:14px system-ui,sans-serif;padding:3px 4px 12px}
.viewer-bar>div{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.viewer-bar a{color:#ffe09e}
.viewer-bar button{background:#263e2c;color:#f5e2b6;border:1px solid #a78c57;padding:7px 12px;cursor:pointer;border-radius:6px}
.cover-dialog img{display:block;max-width:100%;max-height:calc(96vh - 75px);object-fit:contain;margin:auto}
.viewer-bar button:focus-visible,.viewer-bar a:focus-visible{outline:3px solid #ffe4a5;outline-offset:3px}
@media(max-width:650px){.viewer-bar{align-items:start;flex-direction:column}}

/* v12: audio-dependent water movement. Growth remains tied only to playback position. */
.bloom-track.is-playing .water-fall{opacity:1}
.water-fall i{animation-duration:var(--water-rate,2.4s);opacity:var(--water-drop-opacity,0);transform-origin:center;filter:brightness(var(--water-flow-scale,0.55));transition:opacity .13s ease,filter .13s ease}
.water-fall i:nth-child(2){animation-duration:calc(var(--water-rate,2.4s) * .87)}
.water-fall i:nth-child(3){animation-duration:calc(var(--water-rate,2.4s) * 1.13)}
.water-fall i:nth-child(4){animation-duration:calc(var(--water-rate,2.4s) * .96)}
@media(prefers-reduced-motion:reduce){.water-fall{display:none!important}}

/* v13: staged Liflower growth, preserving v12's approved audio-responsive watering.
   The stem emerges first; the original flower image opens later. Completed blooms persist. */
.flower-stage .flower-stem-photo,
.flower-stage .flower-photo{
 position:absolute;z-index:1;bottom:53px;width:100%;height:158px;object-fit:contain;
 transform-origin:50% 90%;mix-blend-mode:normal;
 transition:clip-path .24s linear,transform .24s linear,opacity .24s linear;
}
.flower-stage .flower-stem-photo{
 clip-path:inset(var(--stem-cut,100%) 0 0 0)!important;
 transform:none!important;opacity:1;
}
.flower-stage .flower-photo{
 clip-path:inset(0 0 25% 0)!important;
 transform:translateY(calc((1 - var(--bloom-open,0))*19px)) scaleX(calc(.14 + .86*var(--bloom-open,0))) scaleY(calc(.25 + .75*var(--bloom-open,0)))!important;
 opacity:var(--bloom-open,0);
}
.flower-stage.complete .flower-stem-photo{clip-path:inset(73% 0 0 0)!important}
.flower-stage.complete .flower-photo{opacity:1;transform:none!important;clip-path:inset(0 0 25% 0)!important}
.flower-stage.restarting .flower-stem-photo,
.flower-stage.restarting .flower-photo{animation:liflower-reset .5s ease-in both}
@keyframes liflower-reset{0%{filter:grayscale(0);opacity:1}55%{filter:grayscale(.7);opacity:.28}100%{filter:grayscale(.8);opacity:0}}
@media(max-width:680px){.flower-stage .flower-stem-photo,.flower-stage .flower-photo{bottom:32px;height:82px}}
@media(prefers-reduced-motion:reduce){.flower-stage .flower-stem-photo,.flower-stage .flower-photo{transition:none!important}.flower-stage.restarting .flower-stem-photo,.flower-stage.restarting .flower-photo{animation:none!important}}


/* v14: real seek control, separate restart action, continuous scale growth.
   This overrides the v13 masking transition without changing approved watering. */
.player-strip{max-width:365px;gap:7px}
.track-seek{appearance:none;-webkit-appearance:none;flex:1;min-width:45px;height:18px;margin:0;cursor:pointer;background:transparent;accent-color:#eacb78}
.track-seek::-webkit-slider-runnable-track{height:6px;border-radius:10px;background:linear-gradient(90deg,#bfdfd9 var(--seek-progress,0%),#736b5b var(--seek-progress,0%))}
.track-seek::-moz-range-track{height:6px;border-radius:10px;background:#736b5b}
.track-seek::-moz-range-progress{height:6px;border-radius:10px;background:#bfdfd9}
.track-seek::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-4px;border-radius:50%;border:2px solid #faf0d8;background:#c9a227;box-shadow:0 0 0 2px #14251b}
.track-seek::-moz-range-thumb{width:12px;height:12px;border-radius:50%;border:2px solid #faf0d8;background:#c9a227}
.track-seek:focus-visible,.track-restart:focus-visible{outline:2px solid #faf0d8;outline-offset:3px}
.track-seek:disabled{cursor:not-allowed;opacity:.5}
.purple .track-seek::-webkit-slider-thumb,.purple .track-seek::-moz-range-thumb{background:#8652c4}
.purple .track-seek::-webkit-slider-runnable-track{background:linear-gradient(90deg,#b6a1e2 var(--seek-progress,0%),#736b84 var(--seek-progress,0%))}
.track-restart{flex:0 0 30px;width:30px;height:30px;padding:0;border-radius:50%;border:1px solid #c7ad68;background:#273024;color:#ffe3a3;font-size:19px;cursor:pointer}
.purple .track-restart{color:#ddc5ff;border-color:#a783c7;background:#292036}
.flower-stage .flower-stem-photo{display:none!important}
.flower-stage::before{display:block!important;position:absolute;z-index:0;left:50%;bottom:25px;width:10px;height:107px;content:'';background:linear-gradient(90deg,#254f2a,#6d984c 52%,#285532);border-radius:55% 55% 4px 4px;transform-origin:bottom;transform:translateX(-50%) scaleY(var(--v14-stem,0));transition:transform .28s linear}
.flower-stage .flower-photo{display:block!important;opacity:1!important;clip-path:none!important;-webkit-clip-path:none!important;transform-origin:50% 86%!important;transform:translateY(calc((1 - var(--v14-bloom,0))*46px)) rotate(var(--v14-turn,0deg)) scale(var(--v14-bloom,0))!important;transition:transform .28s linear!important}
.flower-stage.complete .flower-photo{transform:translateY(0) rotate(0deg) scale(1)!important}
.flower-stage.restarting .flower-photo{animation:liflower-reset .5s ease-in both}
@media(max-width:680px){.flower-stage::before{height:68px;bottom:14px;width:7px}.track-restart{width:25px;height:25px;flex-basis:25px;font-size:16px}.player-strip{gap:4px}}
@media(prefers-reduced-motion:reduce){.flower-stage .flower-photo,.flower-stage::before{transition:none!important}}

/* v15: independent botanical anatomy. The old v14 bitmap scaling is superseded. */
.flower-stage::before{display:none!important}
.flower-stage .flower-photo,.flower-stage .flower-stem-photo{display:none!important}
.botanical-plant{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 7px 6px #0009)}
.botanical-shoot{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(var(--plant-shoot,0));opacity:clamp(0,calc(var(--plant-shoot,0)*3),1)}
.botanical-leaf{transform-box:fill-box;transform-origin:90% 80%;opacity:var(--plant-leaves,0);transition:opacity .15s linear}
.botanical-leaf-left{transform:rotate(calc((1 - var(--plant-leaves,0))*38deg)) scale(var(--plant-leaves,0))}
.botanical-leaf-right{transform-origin:10% 80%;transform:rotate(calc((1 - var(--plant-leaves,0))*-38deg)) scale(var(--plant-leaves,0))}
.botanical-bud{transform-box:fill-box;transform-origin:50% 100%;transform:scale(var(--plant-bud,0));opacity:clamp(0,calc(var(--plant-bud,0)*4),1)}
.botanical-bloom{transform-box:fill-box;transform-origin:50% 65%;opacity:clamp(0,calc(var(--plant-petals,0)*6),1)}
.botanical-petal{transform-box:fill-box;transform-origin:50% 96%;transform:rotate(calc((1 - var(--plant-petals,0))*-14deg)) scaleX(calc(.22 + var(--plant-petals,0)*.78)) scaleY(calc(.18 + var(--plant-petals,0)*.82));opacity:clamp(0,calc(var(--plant-petals,0)*4),1)}
.botanical-bloom circle,.botanical-bloom > g[fill]{opacity:var(--plant-heart,0)}
.flower-stage.restarting .botanical-plant{animation:plant-wilt .48s ease-in both}
@keyframes plant-wilt{0%{filter:brightness(1);transform:rotate(0)}50%{filter:brightness(.45) saturate(.6);transform:rotate(5deg)}100%{opacity:.35;transform:translateY(18px) scale(.75)}}
.flower-stage.complete .botanical-shoot,.flower-stage.complete .botanical-leaf,.flower-stage.complete .botanical-bloom,.flower-stage.complete .botanical-petal,.flower-stage.complete .botanical-bloom circle{opacity:1}
.flower-stage.complete .botanical-bud{opacity:0}
@media(prefers-reduced-motion:reduce){.botanical-plant,.botanical-petal,.botanical-bud,.botanical-leaf,.botanical-shoot{transition:none!important;animation:none!important}}

/* v16: finer living texture and staggered petal motion; v15 growth timing unchanged. */
.botanical-petal{filter:drop-shadow(1px 1.5px 1px rgba(24,16,8,.35));}
.botanical-petals>g:nth-child(even) .botanical-petal{opacity:clamp(0,calc(var(--plant-petals,0)*3.8),.98);}
.botanical-bloom circle{filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.45))}
.botanical-leaf{filter:drop-shadow(1px 2px 1px rgba(0,0,0,.28))}
@media(prefers-reduced-motion:reduce){.botanical-petal,.botanical-leaf{filter:none}}

/* v17: botanical surface realism, not a growth or player rewrite. */
.botanical-plant{filter:drop-shadow(0 5px 3px rgba(0,0,0,.36)) drop-shadow(0 11px 7px rgba(4,12,5,.38))}
.botanical-root{pointer-events:none}
.botanical-petal{filter:drop-shadow(.8px 1.4px 1.2px rgba(32,19,8,.36))}
.botanical-bud{filter:drop-shadow(1px 2px 2px rgba(15,25,8,.36))}
.botanical-leaf{filter:drop-shadow(1px 1.5px 1.3px rgba(0,0,0,.32))}
@media(prefers-reduced-motion:reduce){.botanical-petal,.botanical-bud,.botanical-leaf{filter:none}}

/* v18: real photographic material mapped into animated plant anatomy; no backgrounds. */
.botanical-petal{filter:drop-shadow(.45px 1.3px 1px rgba(21,14,7,.32))}
.botanical-leaf{filter:drop-shadow(.5px 1.4px 1.2px rgba(6,21,5,.37))}
.botanical-bud{filter:drop-shadow(.7px 1.8px 1.5px rgba(13,26,8,.33))}

/* v20 botanical surfaces: irregular petal specularity and soft photographic relief.
   Does not modify the existing growth, water or playback state machine. */
.botanical-petal{filter:brightness(var(--petal-light,1)) drop-shadow(.65px 1.5px 1.15px rgba(27,16,9,.30));}
.botanical-leaf{filter:drop-shadow(.75px 1.45px 1.25px rgba(8,20,7,.32));}
.botanical-bud{filter:drop-shadow(.8px 1.6px 1.4px rgba(18,24,11,.3));}
@media(prefers-reduced-motion:reduce){.botanical-petal,.botanical-leaf,.botanical-bud{filter:none;}}

/* v21 | The.Rooting: existing botanical SVG and approved growth system retained. */
.botanical-root-system{pointer-events:none;}
.botanical-root-system .seed-primary-root{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--plant-root,0));}
.botanical-root-system .seed-secondary-root{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--plant-root-branches,0));}
.botanical-root-system .seed-fine-root{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--plant-root-branches,0));}
.botanical-root-system path{transition:stroke-dashoffset .28s linear;}
.botanical-root-system > ellipse{filter:drop-shadow(0 1px 1px #160d07a6)}
/* v23 | Daylight enters from the upper left, without a beam edge or halo
   centered on the flower. Broad feathered light moves across petals and soil. */
.flower-stage .sun-kiss{position:absolute;z-index:3;inset:-28% -30% -12%;pointer-events:none;
 opacity:var(--sun-mix,0);transition:opacity .8s ease;
 background:
  radial-gradient(ellipse 30% 38% at 39% 25%,rgba(255,251,232,.28) 0%,rgba(255,240,198,.14) 47%,transparent 100%),
  radial-gradient(ellipse 45% 57% at 52% 49%,rgba(255,233,180,.18) 0%,rgba(255,218,157,.07) 60%,transparent 100%),
  linear-gradient(119deg,rgba(255,245,213,.065) 8%,transparent 74%);
 filter:blur(22px);mix-blend-mode:screen;
 transform:rotate(-7deg);}
.flower-stage.complete .sun-kiss{filter:blur(24px);}
.bloom-track.is-playing .flower-stage .water-fall{opacity:var(--water-dim,1);}
/* Roots belong to the existing plant and don't change playback mapping. */
.botanical-root-system .seed-growing-roots path{transition:stroke-dashoffset .28s linear;}
.botanical-root-system > ellipse:first-child{filter:drop-shadow(0 1px 3px rgba(15,10,6,.38));}
/* No motion effects when reduced-motion accessibility is requested. */
@media(prefers-reduced-motion:reduce){.flower-stage .sun-kiss{transition:none}.botanical-root-system path{transition:none}}

/* v24: recessed photo-textured underground roots, embedded planted seed, and
   sunlight that catches the botanical surfaces. Timing and playback unchanged. */
.botanical-root-system{isolation:isolate;}
.botanical-root-system .seed-growing-roots{filter:drop-shadow(0 .4px .4px rgba(13,9,5,.38));}
.botanical-soil-contact{pointer-events:none;}
/* Sunlight is a soft wash from overhead-left, not a distinct geometric beam. */
.flower-stage .sun-kiss{
 inset:-42% -30% -5%;
 background:
  radial-gradient(ellipse 43% 46% at 33% 17%,rgba(255,249,216,.38) 0%,rgba(255,239,183,.16) 48%,transparent 100%),
  radial-gradient(ellipse 54% 70% at 49% 42%,rgba(255,244,199,.18) 0%,rgba(255,222,163,.065) 58%,transparent 100%);
 filter:blur(18px);transform:rotate(-9deg);mix-blend-mode:screen;
}
.flower-stage.complete .sun-kiss{filter:blur(20px)}
/* Only the flower surfaces catch highlights; their existing shapes and transforms stay. */
.flower-stage .botanical-bloom{filter:brightness(calc(1 + var(--sun-mix,0)*.11));}
.flower-stage .botanical-leaf{--leaf-sun:var(--sun-mix,0);}
.flower-stage .botanical-soil-contact{filter:brightness(calc(1 + var(--sun-mix,0)*.06));}
@media(prefers-reduced-motion:reduce){.flower-stage .sun-kiss{transition:none}}

/* v25 | Visible roots in a recessed soil cross-section. Existing growth mapping untouched. */
.flower-stage .botanical-plant{position:relative;z-index:2;}
.flower-stage::after{z-index:0;pointer-events:none;opacity:.68;}
.botanical-root-system .seed-growing-roots{filter:drop-shadow(0 .3px .5px rgba(18,12,7,.45));}
.botanical-soil-contact{opacity:.82;}
/* A soft overhead-left wash that lights the actual botanical surfaces.
   It fades in with --sun-mix, not by moving the scrubber. */
.flower-stage .sun-kiss{
 z-index:3; inset:-55% -24% 3% -40%;
 background:
  radial-gradient(ellipse 36% 43% at 33% 17%,rgba(255,251,219,.43) 0%,rgba(255,246,205,.22) 47%,transparent 100%),
  radial-gradient(ellipse 48% 66% at 43% 39%,rgba(255,227,167,.18) 0%,rgba(255,236,189,.06) 66%,transparent 100%);
 transform:rotate(-12deg);filter:blur(22px);mix-blend-mode:screen;
}
.flower-stage.complete .sun-kiss{filter:blur(24px)}
.flower-stage .botanical-bloom{filter:brightness(calc(1 + var(--sun-mix,0)*.17)) saturate(calc(1 + var(--sun-mix,0)*.05));}
.flower-stage .botanical-leaf{filter:brightness(calc(1 + var(--sun-mix,0)*.10)) drop-shadow(.75px 1.45px 1.25px rgba(8,20,7,.32));}
@media(prefers-reduced-motion:reduce){.flower-stage .sun-kiss{transition:none}}

/* v26 | Open earth-section integration. No semicircular root container.
   Retain all v25 music-progress variables, stage transitions and controls. */
.botanical-root-system .botanical-earth-inset { pointer-events:none; }
.botanical-root-system .seed-growing-roots { filter:drop-shadow(0 .4px .65px rgba(13,9,6,.38)); }
.botanical-soil-contact { opacity:.65; }
/* Soft angled daylight on the upper petals; never a triangular beam. */
.flower-stage .sun-kiss {
  background:
   radial-gradient(ellipse 32% 40% at 31% 15%, rgba(255,251,222,.44) 0%, rgba(255,243,196,.22) 48%,transparent 100%),
   radial-gradient(ellipse 52% 64% at 49% 43%, rgba(255,234,184,.20) 0%,rgba(255,225,163,.045) 70%,transparent 100%);
  filter:blur(25px);
}
.flower-stage.complete .sun-kiss { filter:blur(27px); }

/* v27: sub-surface root transparency, without another illustrated soil container.
   This does not alter the audio clock, player handlers or growth-stage boundaries. */
.botanical-root-system .botanical-earth-inset{isolation:isolate}
.botanical-root-system .seed-growing-roots{filter:none}
.botanical-root-system .botanical-earth-inset > rect{pointer-events:none}

/* v29 | The roots finish growing, then settle beneath the EXISTING earth.
   No covering rectangles or detachable soil surfaces exist: the underlying
   photographic earth becomes more opaque while branches sink from view.
   The whole temporary root cutaway dissolves before above-ground growth. */
.botanical-root-system .botanical-earth-inset{
  opacity:var(--root-scene-opacity,1);
  transition:opacity .28s linear;
}
.botanical-root-system .seed-growing-roots{
  opacity:calc(1 - var(--root-soil-cover,0));
  transition:opacity .28s linear;
}
.botanical-root-system .botanical-foreground-earth{
  opacity:calc(.45 + .43 * var(--root-soil-cover,0));
  transition:opacity .28s linear;
}
@media(prefers-reduced-motion:reduce){
  .botanical-root-system .botanical-earth-inset,
  .botanical-root-system .seed-growing-roots,
  .botanical-root-system .botanical-foreground-earth{transition:none;}
}

/* v30 | Final-master candidate, visual refinement only.
   Individually positioned macro textures replace repeated petal sampling.
   Preserve the v15 anatomy and the v21–v29 listening-driven state machine. */
.botanical-petal{filter:brightness(var(--petal-light,1)) contrast(1.09) saturate(.94) drop-shadow(.8px 1.5px 1.2px rgba(25,17,12,.4));}
.botanical-leaf{filter:contrast(1.12) saturate(.9) drop-shadow(1px 1.7px 1.3px rgba(6,20,7,.43));}
.botanical-bud{filter:contrast(1.07) saturate(.95) drop-shadow(.9px 1.6px 1.7px rgba(16,21,8,.35));}
@media(prefers-reduced-motion:reduce){.botanical-petal,.botanical-leaf,.botanical-bud{filter:none;}}

/* v31: photographic botany, material-only. The SVG stages and all track/player
   variables retain their v30 timing. No newly animated state or control logic. */
.botanical-petal{filter:brightness(var(--petal-light,1)) contrast(1.06) saturate(1.04) drop-shadow(.8px 1.4px 1.1px rgba(29,17,8,.32));}
.botanical-leaf{filter:contrast(1.03) saturate(.96) drop-shadow(.6px 1.5px 1.2px rgba(11,23,8,.31));}

/* v32 — botanical silhouette and photographic material pass.
   No change to the listened-duration growth clock or playback controls. */
.botanical-petal {filter:drop-shadow(1.2px 2.3px 1.1px rgba(25,19,12,.36));}
.botanical-petals>g:nth-child(3n) .botanical-petal {filter:drop-shadow(-.8px 2px 1px rgba(22,13,25,.32));}
.botanical-heart-details {transition:opacity .18s linear;filter:drop-shadow(0 1px 1.1px rgba(24,15,9,.42));}
.flower-stage.complete .botanical-heart-details {opacity:1!important;}

/* v33: body of every photo-textured petal remains opaque if SVG image decoding fails. */
.botanical-petal path:first-child{stroke:none}
.botanical-petal path:nth-child(2){stroke:none;paint-order:fill}

/* v34: photograph-preserving bloom renderer. The nine independently revealed
   wedges reconstruct an actual transparent photographic bloom, avoiding SVG
   tile distortion. All audio/growth variable timing remains unchanged. */
.botanical-photo-bloom{pointer-events:none;filter:drop-shadow(.5px 1.4px 1.1px rgba(16,14,8,.35))}
.botanical-photo-petal{opacity:clamp(0,calc((var(--plant-petals,0) - var(--photo-delay,0)) * 3.5),1);transition:opacity .22s linear;}
.botanical-petals{opacity:clamp(0,calc((.95 - var(--plant-petals,0)) * 3.3),1);}
.botanical-heart-details{opacity:clamp(0,calc((.97 - var(--plant-petals,0)) * 3.3),1)!important;}
.flower-stage.complete .botanical-petals,.flower-stage.complete .botanical-heart-details{opacity:0!important}
.flower-stage.complete .botanical-photo-petal{opacity:1!important}
@media(prefers-reduced-motion:reduce){.botanical-photo-petal{transition:none!important}}

/* v35: photograph-based greenery over the existing, unchanged SVG growth stages. */
.v35-photo-stem,.v35-photo-leaf{pointer-events:none;filter:drop-shadow(.6px 1px .6px rgba(9,22,9,.24))}
/* Ruby's two special third-track blooms occur once on each side, not on ordinary siblings. */
.bloom-track.rubink-memorial{--rubink:#c33d81}
.bloom-track.rubink-memorial .ruby-dedication{color:#f7abc9;font-size:.82rem;font-weight:600;letter-spacing:.035em;margin:.2rem 0 .5rem;text-shadow:0 1px 2px rgba(20,0,15,.7)}
.bloom-track.rubink-memorial .flower-progress-text{color:#ee9fbe}
/* Natural handoff: photographic petals become visible as bud begins withdrawing. */
.botanical-photo-petal{transition:opacity .3s ease-out}
@media(prefers-reduced-motion:reduce){.botanical-photo-petal{transition:none!important}}

/* Seed-to-petal memorial coloring applies before the photographic ruby bloom reveals. */
.bloom-track.rubink-memorial .botanical-bud,.bloom-track.rubink-memorial .botanical-petals{filter:hue-rotate(var(--rubink-shift,60deg)) saturate(1.18)}

/* v36: integrate photographic greenery and flowering. No changes to player,
   progress accumulation, unlocks, persistence, or root stages. */
/* Underlying SVG leaf shapes remain as a graceful fallback during early growth,
   then yield to transparent photographic leaf silhouettes once established. */
.botanical-leaf .v36-leaf-underpainting {
  opacity:clamp(.05, calc((.70 - var(--plant-leaves,0))*2.2), 1);
  transition:opacity .24s ease-out;
}
/* Keep the photographic layer dominant, without the older painted leaf outline
   bleeding through at completed bloom. */
.botanical-leaf .v35-photo-leaf {
  opacity:clamp(.5,calc(var(--plant-leaves,0)*1.65),1);
  filter:contrast(1.06) saturate(.94) drop-shadow(.5px 1.3px .9px rgba(9,18,7,.35));
}
/* Make stem/leaf joints read as one botanical structure rather than a
   flat green cartoon stem topped by photographic objects. */
.botanical-shoot .v35-photo-stem {
  filter:contrast(1.08) saturate(.94) drop-shadow(.4px 0 .6px rgba(4,16,6,.25));
}
.botanical-photo-bloom {
  filter:drop-shadow(0 1.4px 1.25px rgba(12,17,8,.30));
}
@media(prefers-reduced-motion:reduce){.botanical-leaf .v36-leaf-underpainting{transition:none!important}}

/* v38 Gold-only leaf anatomy: full photographic silhouettes with visibly supported
   petioles and broad, asymmetric blades. Pawurple and Rubink remain unchanged. */
.botanical-leaf.v38-gold-leaf .v38-gold-photo-leaf{
  opacity:1;
  filter:contrast(1.07) saturate(.98) drop-shadow(.6px 1.3px .9px rgba(7,23,7,.32));
  pointer-events:none;
}
.botanical-leaf.v38-gold-leaf .v38-leaf-petiole{
  filter:drop-shadow(.4px .8px .7px rgba(9,25,7,.28));
}

/* v39 Gold-only: staggered foliage joints and gently asymmetrical leaf planes.
   Growth progression, photos, and all other flower variants are unchanged. */
.botanical-leaf.v39-gold-leaf .v39-leaf-node{
  filter:drop-shadow(.35px .4px .45px rgba(9,27,8,.23));
  pointer-events:none;
}
.botanical-leaf.v39-gold-leaf .v38-leaf-petiole{
  stroke-linejoin:round;
}