.flower-carousel{text-align:center}
.flower-stage{display:grid;grid-template-columns:100px minmax(0,1fr) 100px;align-items:center;max-width:740px;margin:26px auto 12px;gap:20px}
.flower-stage>button{display:grid;place-items:center;width:72px;height:72px;margin:auto;padding:6px;background:transparent;border:0;border-radius:14px;transition:transform .18s ease}
.flower-stage>button img{width:56px;height:56px;pointer-events:none}
.flower-previous img{transform:scaleX(-1)}
.flower-previous:hover{transform:translateX(-4px)}
.flower-next:hover{transform:translateX(4px)}
.flower-slide{min-width:0;touch-action:pan-y}
.flower-portrait{height:210px;width:calc(210px * var(--portrait-ratio));max-width:100%;position:relative;margin:0 auto 24px;transform-origin:50% 92%;animation:flower-sway 5.6s ease-in-out infinite}
.flower-portrait[hidden],#flower-mystery[hidden]{display:none}
.flower-portrait>img{width:100%;height:100%;object-fit:contain;user-select:none}
.flower-face{position:absolute;left:50%;top:var(--face-y);width:var(--face-width);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none}
/* G_FlowerFace: 160px eyes at 1024 PPU, scale .618, separation .1459.
   Keep the 320px lash canvas and both highlight offsets (.0197 units). */
.flower-eye{position:absolute;top:18.292%;width:34.416%;aspect-ratio:1;background:url('assets/eye.png') center/contain no-repeat}
.flower-eye.left{left:6.792%}.flower-eye.right{right:6.792%;transform:scaleX(-1)}
.flower-eye::before{content:'';position:absolute;inset:-50%;background:url('assets/eye-lashes.png') center/contain no-repeat}
.eye-highlights{position:absolute;inset:0}
.eye-highlights::before,.eye-highlights::after{content:'';position:absolute;width:100%;height:100%;background:center/contain no-repeat}
.eye-highlights::before{left:12.608%;top:-12.608%;background-image:url('assets/eye-highlight.png')}
.eye-highlights::after{left:-12.608%;top:12.608%;background-image:url('assets/eye-highlight-small.png')}
.flower-mouth{position:absolute;left:25%;top:var(--mouth-top,40%);width:50%;aspect-ratio:1;background:url('assets/mouths.webp') var(--mouth-frame,0% 0%)/400% 400% no-repeat}
[data-eyes=closed] .flower-eye,[data-eyes=wink-left] .flower-eye.left,[data-eyes=wink-right] .flower-eye.right,[data-blink] .flower-eye{background-image:url('assets/eye-closed.png')}
[data-eyes=closed] .eye-highlights,[data-eyes=wink-left] .left .eye-highlights,[data-eyes=wink-right] .right .eye-highlights,[data-blink] .eye-highlights{display:none}
[data-eyes=sparkle] .flower-eye::after{content:'';position:absolute;inset:0;background:url('assets/eye-enthusiasm.png') center/contain no-repeat;transform:translate(-21.12%,-7.68%)}
[data-blink] .flower-eye::after{display:none}
#flower-name{font-size:25px;min-height:1.3em;margin-bottom:8px}
#flower-line{margin-inline:auto;min-height:52px;max-width:36ch;font-size:18px}
#flower-mystery{width:210px;height:210px;object-fit:contain;margin:0 auto 24px;animation:flower-bob 4.2s ease-in-out infinite}
.flower-recipe{min-height:40px;margin:2px auto 0;font-size:20px;font-weight:700}
.recipe-part{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.recipe-part img{width:auto;height:34px}
.recipe-part .recipe-direction{height:22px;margin:0 6px 0 -4px}
.flower-picker{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.flower-picker button{display:grid;place-items:center;width:58px;height:58px;padding:7px;border:2px solid transparent;border-radius:12px;background:transparent}
.flower-picker button img{width:40px;height:40px;object-fit:contain;pointer-events:none}
.flower-picker button[aria-pressed=true]{border-color:var(--ink);background:var(--cream)}
.flower-picker button:hover{background:var(--cream)}
@keyframes flower-sway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg) translateY(-3px)}}
@keyframes flower-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media(prefers-reduced-motion:reduce){.flower-portrait,#flower-mystery{animation:none}}
@media(max-width:520px){.flower-stage{grid-template-columns:1fr 1fr;gap:10px 18px;margin-top:27px;max-width:350px}.flower-slide{grid-column:1/-1;grid-row:1}.flower-previous{grid-column:1;grid-row:2;justify-self:end}.flower-next{grid-column:2;grid-row:2;justify-self:start}.flower-stage>button{margin:0}.flower-portrait{height:170px;width:calc(170px * var(--portrait-ratio));margin-bottom:18px}#flower-mystery{height:170px;width:170px;margin-bottom:18px}#flower-line{font-size:16px;min-height:52px}#flower-name{font-size:23px}.flower-picker{gap:4px}.flower-picker button{width:44px;height:48px;padding:5px}.flower-picker button img{width:32px;height:34px}}
