/* игра «Огород с дедушкой» (garden): стили только через #s-garden и с префиксом gd-. Раскладку (px) считает layout() в garden.js. */
#s-garden{background:#bfe6ff}
#s-garden .bg{object-position:50% 100%}
#s-garden .gd-fx,#s-garden .gd-sky,#s-garden .gd-props,#s-garden .gd-beds,#s-garden .gd-tray,#s-garden .gd-row{position:absolute;inset:0;pointer-events:none}
#s-garden .gd-fx{z-index:2;overflow:hidden}
#s-garden .gd-sky{z-index:5}
#s-garden .gd-props{z-index:4}
#s-garden .gd-beds{z-index:6}
#s-garden .gd-row{z-index:7}
#s-garden .gd-tray{z-index:8}
#s-garden .helper{z-index:6}
#s-garden img{-webkit-user-drag:none;user-select:none}
/* sky: the sun (a tap makes it smile and sparkle), the task cloud (drag it off the sun / onto the bed), the rainbow */
#s-garden .gd-sun{position:absolute;pointer-events:auto;touch-action:none}
#s-garden .gd-sun img{width:100%;height:100%;object-fit:contain;animation:gd-sunbob 5s ease-in-out infinite;filter:drop-shadow(0 0 2vmin rgba(255,220,80,.7))}
#s-garden .gd-sun.dim img{filter:none;opacity:.75}
#s-garden .gd-sun.joy img{animation:gd-sunjoy .9s ease-in-out}
@keyframes gd-sunbob{0%,100%{transform:rotate(-3deg) scale(1)}50%{transform:rotate(3deg) scale(1.05)}}
@keyframes gd-sunjoy{0%{transform:scale(1) rotate(0)}30%{transform:scale(1.25) rotate(-12deg)}60%{transform:scale(1.15) rotate(10deg)}100%{transform:scale(1) rotate(0)}}
#s-garden .gd-cloud{position:absolute;pointer-events:auto;touch-action:none;z-index:3;transition:left .5s ease-out,top .5s ease-out}
#s-garden .gd-cloud.drag{transition:none}
#s-garden .gd-cloud img{width:100%;height:100%;object-fit:contain;animation:gd-floaty 2.6s ease-in-out infinite;filter:drop-shadow(0 .8vmin .8vmin rgba(0,0,0,.2))}
#s-garden .gd-cloud.want img{filter:drop-shadow(0 0 1.6vmin rgba(255,230,90,.95)) drop-shadow(0 .8vmin .8vmin rgba(0,0,0,.2))}
#s-garden .gd-cloud.bye{opacity:0;transition:opacity .5s,left .8s ease-in,top .8s ease-in}
@keyframes gd-floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6%)}}
#s-garden .gd-rainbow{position:absolute;pointer-events:none;opacity:0;transform-origin:50% 100%;transition:opacity 1.2s}
#s-garden .gd-rainbow.show{opacity:.92;animation:gd-rb 1.4s cubic-bezier(.3,1.4,.5,1)}
#s-garden .gd-rainbow img{width:100%;height:100%;object-fit:contain}
@keyframes gd-rb{from{scale:.2;opacity:0}}
#s-garden .gd-drop{position:absolute;width:1.6vmin;height:2.6vmin;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:#5ab8ff;pointer-events:none;z-index:9;opacity:.9}
#s-garden .gd-ray{position:absolute;pointer-events:none;z-index:2;border-radius:50%;background:radial-gradient(circle,rgba(255,240,150,.85),rgba(255,220,80,0) 70%);animation:gd-ray 1.6s ease-out forwards}
@keyframes gd-ray{from{scale:.2;opacity:1}to{scale:2.2;opacity:0}}
/* props: everything in the scene is alive — a tap gives a reaction */
#s-garden .gd-prop{position:absolute;pointer-events:auto;touch-action:none}
#s-garden .gd-prop>img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 .8vmin .8vmin rgba(60,30,10,.25));transition:opacity .25s}
#s-garden .gd-prop>img.alt{opacity:0}
#s-garden .gd-prop.alt>img.main{opacity:0}
#s-garden .gd-prop.alt>img.alt{opacity:1}
#s-garden .gd-prop.want>img{filter:drop-shadow(0 0 1.8vmin rgba(255,230,90,.95)) drop-shadow(0 .8vmin .8vmin rgba(60,30,10,.25))}
#s-garden .gd-prop .gd-sub{position:absolute;pointer-events:none;object-fit:contain;transition:left .4s,top .4s;filter:drop-shadow(0 .5vmin .5vmin rgba(0,0,0,.25))}
#s-garden .gd-prop.jiggle{animation:gd-jiggle .5s}
@keyframes gd-jiggle{25%{rotate:-5deg}75%{rotate:5deg}}
#s-garden .gd-frogjump{animation:gd-frog .9s cubic-bezier(.3,1.2,.5,1) forwards}
@keyframes gd-frog{0%{translate:0 10%;opacity:0}25%{translate:0 -45%;opacity:1}60%{translate:0 -45%;opacity:1}100%{translate:0 10%;opacity:0}}
#s-garden .gd-ring{position:absolute;border:.5vmin solid rgba(255,255,255,.8);border-radius:50%;pointer-events:none;animation:gd-ring 1s ease-out forwards}
@keyframes gd-ring{from{scale:.3;opacity:1}to{scale:1.4;opacity:0}}
#s-garden .gd-cat{position:absolute;width:0;height:0;pointer-events:auto;touch-action:none;z-index:3}
#s-garden .gd-cat-f{position:absolute;left:0;top:0;width:0;height:0;transition:transform .22s ease-in-out}
#s-garden .gd-cat-b{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0}
#s-garden .gd-cat-b>img{position:absolute;bottom:0;max-width:none;pointer-events:none;filter:drop-shadow(0 .4vmin .4vmin rgba(0,0,0,.25))}
#s-garden .gd-cat-b>img{bottom:0;top:auto}
#s-garden .gd-cat-hit{position:absolute;display:block}
#s-garden .gd-hop{animation:gd-hop .5s ease-out}
@keyframes gd-hop{40%{translate:0 -22%}}
#s-garden .gd-bee{position:absolute;pointer-events:auto;z-index:6;transition:left 1.6s ease-in-out,top 1.6s ease-in-out}
#s-garden .gd-bee img{width:100%;height:100%;object-fit:contain;animation:gd-buzz .22s linear infinite}
@keyframes gd-buzz{0%,100%{translate:0 0;rotate:-6deg}50%{translate:0 -8%;rotate:6deg}}
#s-garden .gd-bee.loop img{animation:gd-loop .9s ease-in-out}
@keyframes gd-loop{to{rotate:360deg}}
#s-garden .gd-grass{position:absolute;pointer-events:auto;z-index:4}
#s-garden .gd-crit{position:absolute;pointer-events:auto;touch-action:none;z-index:7}
#s-garden .gd-crit img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 .5vmin .5vmin rgba(0,0,0,.25))}
#s-garden .gd-crit.fly{transition:left 1.6s cubic-bezier(.4,0,.6,1),top 1.6s cubic-bezier(.4,0,.6,1),opacity .4s 1.2s;opacity:0}
#s-garden .gd-crit.flap img{animation:gd-flap .25s linear infinite}
@keyframes gd-flap{50%{scale:1 .82;translate:0 -6%}}
#s-garden .gd-crit.peck img{animation:gd-peck .7s ease-in-out infinite}
@keyframes gd-peck{0%,100%{rotate:0deg}50%{rotate:14deg;translate:4% 6%}}
#s-garden .gd-crit.crawl img{animation:gd-crawl 1.1s ease-in-out infinite}
@keyframes gd-crawl{0%,100%{scale:1 1}50%{scale:.88 1.08}}
#s-garden .gd-crit.curl img{animation:gd-curl .6s ease-in-out}
@keyframes gd-curl{50%{scale:.7 .7;rotate:-20deg}}
#s-garden .gd-crit.held{z-index:60}
/* beds */
#s-garden .gd-bed{position:absolute;pointer-events:auto;touch-action:none}
#s-garden .gd-soil{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;transition:opacity .35s}
#s-garden .gd-soil.under{opacity:0}
#s-garden .gd-plant{position:absolute;left:50%;bottom:38%;translate:-50% 0;transform-origin:50% 100%;pointer-events:none;animation:gd-sway 4s ease-in-out infinite}
#s-garden .gd-plant>img{position:absolute;left:50%;bottom:0;translate:-50% 0;height:100%;width:auto;max-width:130%;object-fit:contain;object-position:50% 100%;opacity:0;transition:opacity .3s;pointer-events:none;filter:drop-shadow(0 .6vmin .6vmin rgba(40,30,10,.25))}
#s-garden .gd-plant>img.on{opacity:1}
#s-garden .gd-plant.clip{overflow:hidden}
/* the fruits hang on the plant: a box with the proportions of the plant picture */
#s-garden .gd-fr{position:absolute;left:50%;bottom:0;height:100%;translate:-50% 0;pointer-events:none}
@keyframes gd-sway{0%,100%{rotate:-1.5deg}50%{rotate:1.5deg}}
#s-garden .gd-plant.grow{animation:gd-grow .9s cubic-bezier(.3,1.5,.5,1)}
@keyframes gd-grow{0%{scale:.6 .4}35%{scale:1.1 1.15}70%{scale:.95 .95}100%{scale:1 1}}
#s-garden .gd-plant.wilt{animation:gd-wilt 2.2s ease-in-out infinite}
@keyframes gd-wilt{0%,100%{rotate:-2deg;scale:1 .97}50%{rotate:2deg;scale:1 1}}
#s-garden .gd-plant.shake{animation:gd-shake .6s ease-in-out}
@keyframes gd-shake{20%{rotate:-9deg}40%{rotate:8deg}60%{rotate:-6deg}80%{rotate:4deg}}
#s-garden .gd-plant.perk{animation:gd-perk .7s cubic-bezier(.3,1.6,.5,1)}
@keyframes gd-perk{0%{scale:1 .9}50%{scale:1.08 1.12}100%{scale:1 1}}
#s-garden .gd-ov{position:absolute;inset:0;pointer-events:none}
#s-garden .gd-it{position:absolute;pointer-events:auto;touch-action:none;translate:-50% -50%;transition:opacity .3s}
#s-garden .gd-it img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 .5vmin .5vmin rgba(40,30,10,.3))}
#s-garden .gd-it.pick{animation:gd-pick .5s ease-in forwards;pointer-events:none}
@keyframes gd-pick{to{scale:.2;opacity:0}}
#s-garden .gd-it.blush img{animation:gd-blush 1.2s ease-in-out forwards}
@keyframes gd-blush{0%{filter:drop-shadow(0 .5vmin .5vmin rgba(40,30,10,.3)) saturate(1)}50%{scale:1.15}100%{scale:1}}
#s-garden .gd-it.fell{animation:gd-fell .8s cubic-bezier(.3,.8,.5,1.4) forwards}
@keyframes gd-fell{0%{translate:-50% -50%}60%{translate:-50% calc(-50% + var(--dy))}80%{translate:-50% calc(-50% + var(--dy) - 12%)}100%{translate:-50% calc(-50% + var(--dy))}}
#s-garden .gd-it.held{z-index:60;scale:1.15}
#s-garden .gd-it.away{opacity:0;transition:left .5s,top .5s,opacity .4s .2s}
#s-garden .gd-it.tug img{animation:gd-tug .35s ease-out}
@keyframes gd-tug{30%{scale:.9 1.25}70%{scale:1.08 .92}}
/* a ripe root in the soil: the box stands on the soil line, the part of the picture below it is hidden in the ground */
#s-garden .gd-root{position:absolute;bottom:38%;height:200%;translate:-50% 0;overflow:hidden;pointer-events:none;touch-action:none}
#s-garden .gd-root img{position:absolute;left:0;width:100%;height:auto;pointer-events:auto;touch-action:none;transition:bottom .35s cubic-bezier(.3,1.6,.5,1),translate .12s;filter:drop-shadow(0 .5vmin .5vmin rgba(40,30,10,.3))}
#s-garden .gd-root[data-out] img{transition:bottom .4s cubic-bezier(.3,1.4,.5,1)}
#s-garden .gd-root.tug img{animation:gd-tug .35s ease-out}
#s-garden .gd-bed.want .gd-soil{filter:drop-shadow(0 0 1.6vmin rgba(255,230,90,1)) brightness(1.08)}
#s-garden .gd-bed.no{animation:gd-no .4s}
@keyframes gd-no{25%{translate:-2% 0}75%{translate:2% 0}}
#s-garden .gd-think{position:absolute;left:50%;top:-8%;translate:-50% -100%;width:30%;aspect-ratio:1;background:#fff;border-radius:50%;box-shadow:0 .6vmin 1.4vmin rgba(0,0,0,.2);display:none;align-items:center;justify-content:center;pointer-events:none;animation:bob 1.6s infinite ease-in-out;z-index:3}
#s-garden .gd-think:before{content:"";position:absolute;left:12%;bottom:-16%;width:22%;height:22%;border-radius:50%;background:#fff}
#s-garden .gd-think.show{display:flex}
#s-garden .gd-think img,#s-garden .gd-think svg{width:70%;height:70%;object-fit:contain}
#s-garden .gd-puddle{position:absolute;left:50%;bottom:30%;width:46%;height:14%;translate:-50% 0;border-radius:50%;background:radial-gradient(ellipse,rgba(120,190,255,.75),rgba(120,190,255,0) 70%);pointer-events:none;opacity:0;transition:opacity .5s}
#s-garden .gd-puddle.show{opacity:1}
#s-garden .gd-house{position:absolute;left:-4%;top:-55%;width:108%;height:160%;object-fit:contain;object-position:50% 100%;pointer-events:none;opacity:.85;z-index:2}
/* tools */
#s-garden .gd-tool{position:absolute;pointer-events:auto;touch-action:none;border-radius:28%;background:rgba(255,255,255,.88);box-shadow:0 .7vmin 0 #8bb36b,0 1vmin 2vmin rgba(0,0,0,.18);display:flex;align-items:center;justify-content:center;transition:scale .2s,box-shadow .2s;animation:pop-in .4s backwards}
#s-garden .gd-tool img{width:80%;height:80%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 .4vmin .4vmin rgba(0,0,0,.2))}
#s-garden .gd-tool.sel{scale:1.12;box-shadow:0 .7vmin 0 #8bb36b,0 0 0 .9vmin #ffd23f,0 1vmin 2.4vmin rgba(0,0,0,.25)}
#s-garden .gd-tool.st{animation:none}   /* after the first pop-in: removing a glow must not replay the pop-in (the button blinked away) */
#s-garden .gd-tool.glow,#s-garden .gd-tool.st.glow{animation:gd-glow .9s ease-in-out infinite alternate}
@keyframes gd-glow{from{box-shadow:0 .7vmin 0 #8bb36b,0 0 0 .4vmin rgba(255,210,63,.5)}to{box-shadow:0 .7vmin 0 #8bb36b,0 0 0 1.4vmin rgba(255,210,63,1)}}
#s-garden .gd-tool.held{opacity:.35}
#s-garden .gd-tool.basket img{width:88%;height:88%}
#s-garden .gd-tool .gd-in{position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none}
#s-garden .gd-tool .gd-in img{position:absolute;width:38%;height:38%;left:50%;top:40%;translate:-50% -50%;filter:drop-shadow(0 .3vmin .3vmin rgba(0,0,0,.3))}
#s-garden .gd-tool .gd-in img:nth-child(2){left:33%;top:44%;scale:.9}
#s-garden .gd-tool .gd-in img:nth-child(3){left:67%;top:44%;scale:.9}
#s-garden .gd-tool .gd-in img:nth-child(4){left:42%;top:34%;scale:.8}
#s-garden .gd-tool .gd-in img:nth-child(n+5){display:none}
#s-garden .gd-tool.basket.hi,#s-garden .gd-tool.basket.st.hi{animation:gd-glow .9s ease-in-out infinite alternate}
#s-garden .gd-tool i{position:absolute;right:-6%;top:-6%;min-width:34%;height:34%;padding:0 6%;border-radius:1.2em;background:#ff5b6e;color:#fff;font:900 min(4.4vmin,22px)/1 Arial,sans-serif;display:flex;align-items:center;justify-content:center;border:.4vmin solid #fff;box-sizing:border-box}
.gd-ghost{position:fixed;z-index:70;pointer-events:none;translate:-50% -50%;width:18vmin;height:18vmin;object-fit:contain;filter:drop-shadow(0 1vmin 1.2vmin rgba(0,0,0,.35))}
/* watering: the can tilts on its handle, the spout (left) dips over the bed; digging: the blade stays in the soil, the handle levers */
.gd-ghost.pour{transform-origin:85% 45%;animation:gd-pour .7s ease-in-out infinite alternate}
@keyframes gd-pour{from{rotate:5deg}to{rotate:-7deg}}
.gd-ghost.dig{transform-origin:24% 95%;animation:gd-dig .45s ease-in-out infinite}
@keyframes gd-dig{0%,100%{rotate:12deg;translate:-50% -50%}50%{rotate:-20deg;translate:-50% -58%}}
.gd-hand{position:fixed;left:0;top:0;width:12vmin;height:14vmin;z-index:80;pointer-events:none;filter:drop-shadow(0 .6vmin .8vmin rgba(0,0,0,.35))}
.gd-hand svg{width:100%;height:100%}
.gd-hand-thing{position:fixed;left:0;top:0;z-index:79;pointer-events:none;translate:-50% -90%;object-fit:contain}
.gd-fly{position:fixed;z-index:72;pointer-events:none;translate:-50% -50%;object-fit:contain;transition:left .55s cubic-bezier(.4,0,.6,1),top .55s cubic-bezier(.3,-.4,.6,1),scale .55s,opacity .2s .4s;filter:drop-shadow(0 .6vmin .6vmin rgba(0,0,0,.3))}
#s-garden .gd-pt{position:absolute;border-radius:50%;pointer-events:none;z-index:9}
/* family row (the Turnip tale): peek figures line up and pull */
#s-garden .gd-fam{position:absolute;bottom:0;transform-origin:50% 100%;pointer-events:none;animation:pop-in .5s backwards}
#s-garden .gd-fam img{width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 .6vmin .6vmin rgba(0,0,0,.3))}
#s-garden .gd-row.pull .gd-fam{animation:gd-pull .6s ease-in-out}
@keyframes gd-pull{30%{rotate:-9deg;translate:-6% 0}70%{rotate:3deg}}
#s-garden .gd-row.pop .gd-fam{animation:gd-fall .9s ease-out}
@keyframes gd-fall{30%{rotate:-18deg;translate:-14% 0}60%{translate:-10% -14%}100%{rotate:0deg;translate:0 0}}
/* panels: seeds, what to do, treat, cook, cellar, snowman */
#s-garden .gd-panel{position:absolute;inset:0;z-index:30;display:none;pointer-events:none}
#s-garden .gd-panel.show{display:block}
#s-garden .gd-pn{position:absolute;pointer-events:auto;background:#fffaeb;border-radius:5vmin;box-shadow:0 1vmin 3vmin rgba(0,0,0,.3);animation:hp-pop .42s cubic-bezier(.3,1.6,.5,1);overflow:hidden}
#s-garden .gd-pn.cellar{background:#4a3524 url(../../img/gd_cellar.jpg) center/cover}
#s-garden .gd-pn.snow{background:linear-gradient(#bfe3ff,#eef7ff 55%,#fff 56%,#f4faff)}
#s-garden .gd-snowghost{position:absolute;pointer-events:none;object-fit:contain;object-position:50% 100%;opacity:.32}
#s-garden .gd-pn .gd-x{position:absolute;right:1.5vmin;top:1.5vmin;width:12vmin;height:12vmin;border-radius:50%;background:linear-gradient(#ff8a8a,#e04848);box-shadow:0 .6vmin 0 #a02828;display:flex;align-items:center;justify-content:center;z-index:3;touch-action:manipulation}
#s-garden .gd-pn .gd-x svg{width:55%;height:55%}
#s-garden .gd-pn .gd-ok{position:absolute;right:1.5vmin;bottom:1.5vmin;width:15vmin;height:15vmin;border-radius:50%;background:linear-gradient(#7ddf7a,#35b955);box-shadow:0 .7vmin 0 #1f8038;display:none;align-items:center;justify-content:center;z-index:3;animation:pop-in .4s,next-pulse 1.4s .4s ease-in-out infinite}
#s-garden .gd-pn .gd-ok.show{display:flex}
#s-garden .gd-pn .gd-ok svg{width:60%;height:60%}
#s-garden .gd-pk,#s-garden .gd-face,#s-garden .gd-big,#s-garden .gd-jar{position:absolute;display:flex;align-items:center;justify-content:center;pointer-events:auto;touch-action:none;animation:pop-in .4s backwards}
#s-garden .gd-pk img,#s-garden .gd-big img,#s-garden .gd-jar img{width:92%;height:92%;object-fit:contain;filter:drop-shadow(0 .6vmin .6vmin rgba(0,0,0,.25))}
#s-garden .gd-pk.want img{animation:gd-wob 1s ease-in-out infinite;filter:drop-shadow(0 0 1.6vmin rgba(255,220,60,1))}
@keyframes gd-wob{0%,100%{rotate:-5deg}50%{rotate:5deg;scale:1.08}}
#s-garden .gd-pk.lock{opacity:.35;filter:grayscale(1)}
#s-garden .gd-pk.new:after{content:"";position:absolute;right:4%;top:4%;width:22%;height:22%;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff6b0,#ffb300);box-shadow:0 .3vmin .6vmin rgba(0,0,0,.3)}
#s-garden .gd-big{border-radius:5vmin;background:#fff;box-shadow:0 .8vmin 0 #d0c3a0,0 1vmin 2vmin rgba(0,0,0,.18)}
#s-garden .gd-big img{width:78%;height:78%}
#s-garden .gd-big .gd-faces{position:absolute;inset:8%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:4%}
#s-garden .gd-big .gd-faces img{width:100%;height:100%;min-height:0;min-width:0;border-radius:50%;object-fit:cover;object-position:50% 0;border:.5vmin solid #fff;box-shadow:0 .4vmin .8vmin rgba(0,0,0,.25)}
#s-garden .gd-face{border-radius:50%;overflow:hidden;border:.7vmin solid #fff;box-shadow:0 .8vmin 0 #e89a5c,0 1vmin 2vmin rgba(0,0,0,.25);background:radial-gradient(circle at 50% 35%,#fff7e0,#ffc9a0)}
#s-garden .gd-face img{width:100%;height:118%;object-fit:cover;object-position:50% 0}
#s-garden .gd-face.fed{box-shadow:0 .8vmin 0 #e89a5c,0 0 0 1vmin #ffd23f,0 1vmin 2vmin rgba(0,0,0,.25)}
#s-garden .gd-face .gd-cup{position:absolute;right:-4%;bottom:-4%;width:46%;height:46%;object-fit:contain;filter:drop-shadow(0 .4vmin .4vmin rgba(0,0,0,.3));animation:pop-in .4s}
#s-garden .gd-pn.cook .gd-pot{position:absolute;pointer-events:auto;touch-action:none}
#s-garden .gd-pn.cook .gd-pot>img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 .8vmin .8vmin rgba(0,0,0,.3))}
#s-garden .gd-pn.cook .gd-soup{position:absolute;left:19%;right:19%;top:19%;height:20%;border-radius:50%;background:var(--c,#f7c86e);opacity:0;transition:opacity .5s,background .8s;box-shadow:inset 0 .6vmin 1.2vmin rgba(0,0,0,.2)}
#s-garden .gd-pn.cook .gd-soup.show{opacity:1}
#s-garden .gd-pn.cook .gd-steam{position:absolute;left:50%;top:0;width:40%;height:30%;translate:-50% -60%;pointer-events:none;opacity:0;transition:opacity .4s}
#s-garden .gd-pn.cook .gd-steam.show{opacity:.85}
#s-garden .gd-pn.cook .gd-steam i{position:absolute;bottom:0;width:18%;height:70%;border-radius:50%;background:rgba(255,255,255,.75);animation:gd-steam 1.6s ease-in-out infinite}
#s-garden .gd-pn.cook .gd-steam i:nth-child(2){left:38%;animation-delay:-.5s}
#s-garden .gd-pn.cook .gd-steam i:nth-child(3){left:72%;animation-delay:-1s}
@keyframes gd-steam{0%{translate:0 0;opacity:.7;scale:.6}100%{translate:0 -90%;opacity:0;scale:1.2}}
#s-garden .gd-pn.cook .gd-ladle{position:absolute;pointer-events:none;object-fit:contain;transform-origin:50% 90%;transition:rotate .2s}
#s-garden .gd-pn.cook .gd-ing{position:absolute;pointer-events:auto;touch-action:none;object-fit:contain;filter:drop-shadow(0 .5vmin .5vmin rgba(0,0,0,.3))}
#s-garden .gd-pn.cook .gd-ing.held{z-index:5;scale:1.15}
#s-garden .gd-pn.cook .gd-ing.in{animation:gd-pick .5s ease-in forwards;pointer-events:none}
#s-garden .gd-pn.cook .gd-dish{position:absolute;pointer-events:none;object-fit:contain;opacity:0;scale:.3;transition:opacity .5s,scale .6s cubic-bezier(.3,1.6,.5,1);filter:drop-shadow(0 .8vmin .8vmin rgba(0,0,0,.3))}
#s-garden .gd-pn.cook .gd-dish.show{opacity:1;scale:1}
#s-garden .gd-bub{position:absolute;border-radius:50%;background:rgba(255,255,255,.7);pointer-events:none;animation:gd-bub 1s ease-out forwards}
@keyframes gd-bub{to{translate:0 -120%;opacity:0;scale:1.6}}
#s-garden .gd-jar.empty img{opacity:.38;filter:grayscale(1) brightness(1.2)}
#s-garden .gd-jar i{position:absolute;right:2%;bottom:2%;min-width:34%;height:34%;padding:0 8%;border-radius:1.2em;background:#ffc531;color:#5a3b1f;font:900 min(4.2vmin,22px)/1 Arial,sans-serif;display:flex;align-items:center;justify-content:center;border:.4vmin solid #fff;box-sizing:border-box}
#s-garden .gd-jar.new img{animation:feed-new 1.2s cubic-bezier(.3,1.6,.5,1)}
#s-garden .gd-shelf{position:absolute;left:4%;right:4%;height:3%;border-radius:1vmin;background:linear-gradient(#a0703f,#6b4320);box-shadow:0 .6vmin .8vmin rgba(0,0,0,.4)}
#s-garden .gd-pn.cellar .gd-medal{position:absolute;pointer-events:none;object-fit:contain;animation:feed-new 1.2s cubic-bezier(.3,1.6,.5,1)}
/* snow and leaves */
#s-garden .gd-flake{position:absolute;top:-6%;pointer-events:none;animation:gd-flake linear infinite}
@keyframes gd-flake{to{translate:var(--dx) 112vh;rotate:var(--r)}}
#s-garden .gd-flake.snow{width:1.6vmin;height:1.6vmin;border-radius:50%;background:#fff;opacity:.9}
#s-garden .gd-flake.leaf{width:3vmin;height:2vmin;border-radius:60% 0 60% 0;background:var(--c);opacity:.9}
#s-garden .gd-snowpile{position:absolute;pointer-events:auto;touch-action:none}
#s-garden .gd-snowpile img{width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 .5vmin .5vmin rgba(0,0,0,.2))}
#s-garden .gd-snowpile.held{z-index:60}
/* the helper from the family: placed by helper.place() in layout(); defaults for the first paint */
#s-garden .helper.fam3d{--hp-h:44%;--hp-x:2.5vmin;--hp-y:1%}
@media (orientation:portrait){#s-garden .helper.fam3d{--hp-h:30%}}
#s-garden .helper.gd-off{display:none}
/* winter: the water in the barrel is frozen */
#s-garden .gd-ice{position:absolute;border-radius:50%;background:radial-gradient(ellipse at 40% 40%,#ffffff,#d8f0ff 55%,#a9d6f5);box-shadow:inset 0 -.4vmin .8vmin rgba(80,140,200,.35);pointer-events:none}
/* cooking: a floor; the stove and the basket stand on it */
#s-garden .gd-pn.cook{background:linear-gradient(#fff6e2 0,#fff1d6 89%,#c99a63 89%,#a87a48)}
#s-garden .gd-pn.cook .gd-stove,#s-garden .gd-pn.cook .gd-bask{position:absolute;object-fit:contain;object-position:50% 100%;pointer-events:none;filter:drop-shadow(0 .8vmin .8vmin rgba(0,0,0,.25))}
/* the Turnip tale: a scene of its own over the whole screen */
#s-garden .gd-pn.full{border-radius:0;background-color:#bfe6ff;background-size:cover;background-position:50% 100%;box-shadow:none;animation:none}
#s-garden .gd-pn.full .gd-x{z-index:60}
#s-garden .gd-rp-soil{position:absolute;object-fit:contain;object-position:50% 100%;pointer-events:none}
#s-garden .gd-rp-root{position:absolute;overflow:hidden;pointer-events:none;z-index:55}
#s-garden .gd-rp-root img{position:absolute;left:0;width:100%;filter:drop-shadow(0 .8vmin .8vmin rgba(40,30,10,.3));transition:bottom .7s cubic-bezier(.3,1.5,.5,1),rotate .7s}
#s-garden .gd-rp-root.tug img{animation:gd-rp-tug .5s ease-out}
@keyframes gd-rp-tug{40%{translate:3% -7%;rotate:6deg}}
#s-garden .gd-rp-root.out{overflow:visible}
#s-garden .gd-rp-root.out img{bottom:34%!important;rotate:-14deg}
#s-garden .gd-rp-f{position:absolute;transform-origin:35% 100%;pointer-events:none}
#s-garden .gd-rp-f img{width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 .6vmin .6vmin rgba(0,0,0,.3))}
#s-garden .gd-rp-f.pull{animation:gd-rp-pull .6s ease-in-out}
@keyframes gd-rp-pull{45%{rotate:10deg;translate:3% 0}}
#s-garden .gd-rp-f.come{animation:gd-rp-come .8s cubic-bezier(.3,1.2,.5,1)}
@keyframes gd-rp-come{from{translate:70vw 0;opacity:.2}to{translate:0 0;opacity:1}}
/* pop! everybody tumbles over backwards, in a heap, as in the tale */
#s-garden .gd-pn.pop .gd-rp-f{animation:gd-rp-fall .9s cubic-bezier(.4,0,.6,1.3) forwards}
#s-garden .gd-pn.pop .gd-rp-f:nth-of-type(2n){animation-delay:.08s}
@keyframes gd-rp-fall{to{rotate:58deg;translate:6% 3%}}
#s-garden .helper.gd-hide,#s-garden .helper.gd-clip{display:none!important}
#s-garden .gd-it.ripe img{filter:drop-shadow(0 0 1.2vmin rgba(255,240,120,.95)) drop-shadow(0 .5vmin .5vmin rgba(40,30,10,.3))}
/* ===== logic & hands (06.10.2026): tools in the hand, the close-up harvest, the feast without buttons ===== */
#s-garden .gd-soil2{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;opacity:0;transition:opacity .3s;pointer-events:none}
/* the shovel left standing in the soil: press it to dig on */
#s-garden .gd-stuck{position:absolute;z-index:4;pointer-events:auto;touch-action:none;transform-origin:20% 95%;rotate:-14deg}
#s-garden .gd-stuck img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 .6vmin .6vmin rgba(0,0,0,.3))}
#s-garden .gd-stuck.push{animation:gd-push .35s ease-out}
@keyframes gd-push{40%{translate:0 12%;rotate:-6deg}}
/* a tool in the hand: held by the handle (translate/transform-origin set from JS); over a bed the shovel points down, the can tilts */
.gd-ghost.hold{transition:rotate .18s}
.gd-ghost.hold.shovel.in{rotate:-20deg}
.gd-ghost.hold.can.tilt{rotate:-30deg}
.gd-ghost.hold.seeds{filter:drop-shadow(0 .6vmin .6vmin rgba(0,0,0,.35))}
.gd-hand{margin:-1.4vmin 0 0 -5.6vmin}
.gd-hand-thing{left:0;top:0;margin:0}
/* the close-up of a ripe bed: the season's garden behind, the plant big on its soil, the basket beside it */
#s-garden .gd-pn.pick{background-color:#bfe6ff;background-size:cover;background-position:50% 85%}
#s-garden .gd-pk-soil{position:absolute;object-fit:fill;pointer-events:none;filter:drop-shadow(0 .6vmin .8vmin rgba(40,30,10,.3))}
#s-garden .gd-pk-plant{position:absolute;pointer-events:none;transform-origin:50% 100%}
#s-garden .gd-pk-plant.shake{animation:gd-shake .6s ease-in-out}
#s-garden .gd-pk-plant.gd-rustle{animation:gd-rustle .5s ease-in-out}
@keyframes gd-rustle{25%{rotate:-2deg}75%{rotate:2deg}}
#s-garden .gd-pk-im{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;pointer-events:none;filter:drop-shadow(0 .8vmin .8vmin rgba(40,30,10,.3))}
#s-garden .gd-pk-bask{position:absolute;pointer-events:none;z-index:3}
#s-garden .gd-pk-bask img{width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 1vmin 1vmin rgba(40,30,10,.35))}
#s-garden .gd-pk-bask.want img{filter:drop-shadow(0 0 2vmin rgba(255,230,90,1)) drop-shadow(0 1vmin 1vmin rgba(40,30,10,.35))}
#s-garden .gd-pk-bask.gd-plop,#s-garden .gd-pot.gd-plop{animation:gd-plop .4s ease-out}
@keyframes gd-plop{40%{scale:1.06 .94}}
#s-garden .gd-pc{position:absolute;pointer-events:auto;touch-action:none;z-index:4}
#s-garden .gd-pc img{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 .5vmin .5vmin rgba(40,30,10,.35))}
#s-garden .gd-pc.held{z-index:30;scale:1.12;transition:none}
#s-garden .gd-pc.inb{z-index:5}
#s-garden .gd-pc.tug img{animation:gd-tug .35s ease-out}
#s-garden .gd-pc.blush img{animation:gd-blush 1.2s ease-in-out}
#s-garden .gd-pk-root{position:absolute;overflow:hidden;pointer-events:none;z-index:2}
#s-garden .gd-pk-root img{position:absolute;left:0;width:100%;pointer-events:auto;touch-action:none;transition:top .12s;filter:drop-shadow(0 .5vmin .5vmin rgba(40,30,10,.3))}
#s-garden .gd-pk-root.tug img{animation:gd-tug .35s ease-out}
#s-garden .gd-pk-head{position:absolute;pointer-events:auto;touch-action:none;transform-origin:50% 96%;z-index:2}
#s-garden .gd-pk-head img{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 .6vmin .6vmin rgba(40,30,10,.3))}
#s-garden .gd-pk-head.gd-pc{transform-origin:50% 50%}
#s-garden .gd-pk-leaf{position:absolute;pointer-events:auto;touch-action:none;z-index:6;transition:translate .5s ease-out,opacity .4s .25s}
#s-garden .gd-pk-leaf img{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 .6vmin .8vmin rgba(20,60,10,.35))}
#s-garden .gd-pk-leaf.away{opacity:0}
#s-garden .gd-pk-leaf.tug img{animation:gd-tug .35s ease-out}
/* the feast: a warm room, the family along the top, the basket and the stove on the floor */
#s-garden .gd-pn.feast{background:linear-gradient(#fff6e2 0,#fff1d6 92%,#c99a63 92%,#a87a48)}
#s-garden .gd-fe-bask,#s-garden .gd-pn.feast .gd-stove{position:absolute;object-fit:contain;object-position:50% 100%;pointer-events:none;filter:drop-shadow(0 .8vmin .8vmin rgba(0,0,0,.25))}
#s-garden .gd-pc.dish{animation:pop-in .45s backwards}
#s-garden .gd-face.want{scale:1.08;box-shadow:0 .8vmin 0 #e89a5c,0 0 0 1.2vmin rgba(255,220,60,.95),0 1vmin 2vmin rgba(0,0,0,.25)}
#s-garden .gd-face.gd-chomp img:first-child{animation:gd-chomp .7s ease-in-out}
@keyframes gd-chomp{20%{scale:1.06 .94}40%{scale:.96 1.05}60%{scale:1.05 .95}80%{scale:.98 1.02}}
#s-garden .gd-pn.feast .gd-pot{position:absolute;pointer-events:auto;touch-action:none;z-index:2}
#s-garden .gd-pn.feast .gd-pot.want>img{filter:drop-shadow(0 0 2vmin rgba(255,220,60,1))}
#s-garden .gd-pn.feast .gd-pot>img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 .8vmin .8vmin rgba(0,0,0,.3))}
#s-garden .gd-pn.feast .gd-soup{position:absolute;left:17%;right:17%;top:10%;height:22%;border-radius:50%;background:var(--c,#f7c86e);opacity:0;transition:opacity .5s,background .8s;box-shadow:inset 0 .6vmin 1.2vmin rgba(0,0,0,.2)}
#s-garden .gd-pn.feast .gd-soup.show{opacity:1}
#s-garden .gd-pn.feast .gd-steam{position:absolute;left:50%;top:0;width:40%;height:34%;translate:-50% -70%;pointer-events:none;opacity:0;transition:opacity .4s}
#s-garden .gd-pn.feast .gd-steam.show{opacity:.85}
#s-garden .gd-pn.feast .gd-steam i{position:absolute;bottom:0;width:18%;height:70%;border-radius:50%;background:rgba(255,255,255,.75);animation:gd-steam 1.6s ease-in-out infinite}
#s-garden .gd-pn.feast .gd-steam i:nth-child(2){left:38%;animation-delay:-.5s}
#s-garden .gd-pn.feast .gd-steam i:nth-child(3){left:72%;animation-delay:-1s}
#s-garden .gd-pn.feast .gd-ladle{position:absolute;pointer-events:none;object-fit:contain;transform-origin:50% 90%;transition:opacity .3s;z-index:3}
#s-garden .gd-fe-table{position:absolute;border-radius:1vmin;background:linear-gradient(#c08a52,#8b5a2b);box-shadow:0 .8vmin 1vmin rgba(0,0,0,.3);pointer-events:none}
#s-garden .gd-tray.gd-dim{opacity:.35;filter:grayscale(.6);transition:opacity .3s}
/* who has not eaten yet waits: a gentle bob */
#s-garden .gd-pn.feast .gd-face:not(.fed){animation:pop-in .4s backwards,gd-wait 1.6s .5s ease-in-out infinite}
@keyframes gd-wait{0%,100%{translate:0 0}50%{translate:0 -4%}}
/* ===== no second screen (06.10.2026): the camera comes closer to the garden itself; the layers over it are transparent ===== */
#s-garden .gd-cam{position:absolute;inset:0;transform-origin:0 0;transition:transform .6s cubic-bezier(.45,.05,.25,1)}
#s-garden .gd-bed.gd-close .gd-plant,#s-garden .gd-bed.gd-close .gd-ov{visibility:hidden}
#s-garden .gd-pn.zoom{background:none;box-shadow:none;border-radius:0;animation:none;overflow:visible}
#s-garden .gd-pn.gd-in{animation:gd-fadein .3s ease-out}
@keyframes gd-fadein{from{opacity:0}}
#s-garden .gd-pn.gd-out{opacity:0;transition:opacity .28s;pointer-events:none}
#s-garden .gd-tray{transition:opacity .3s}
#s-garden .gd-tray.gd-away{opacity:0;pointer-events:none}
#s-garden .gd-panel.catch{pointer-events:auto}
#s-garden .gd-think{display:none}
/* the harvest close up: the basket comes onto the ground beside the bed; the apple tree is shaken by a swipe */
#s-garden .gd-pn.zoom .gd-pk-bask{animation:pop-in .45s cubic-bezier(.3,1.5,.5,1) .1s backwards}
#s-garden .gd-pk-plant.tree{pointer-events:auto;touch-action:none}
/* the feast at a table in the garden: a light glade behind, the faces sit behind the cloth, the cups on it */
#s-garden .gd-fe-veil{position:absolute;pointer-events:none;border-radius:8vmin;background:radial-gradient(ellipse at 50% 55%,rgba(255,248,226,.8) 0,rgba(255,248,226,.62) 55%,rgba(255,248,226,0) 72%);animation:gd-fadein .5s backwards}
#s-garden .gd-fe-tbl{position:absolute;object-fit:fill;pointer-events:none;z-index:5;filter:drop-shadow(0 1vmin 1vmin rgba(60,30,10,.3));animation:gd-tbl-in .6s cubic-bezier(.3,1.25,.5,1) backwards}
@keyframes gd-tbl-in{from{translate:0 40vh;opacity:0}}
#s-garden .gd-pn.feast .gd-pc{z-index:6}
#s-garden .gd-pn.feast .gd-pc.held{z-index:30}
#s-garden .gd-pn.feast .gd-stove,#s-garden .gd-pn.feast .gd-pot{animation:pop-in .45s .5s backwards}
#s-garden .gd-pn.feast .gd-fe-bask{z-index:6}
/* the cellar opens out of the shed and goes back into it */
#s-garden .gd-pn.cellar{animation:none}
#s-garden .gd-pn.cellar.gd-open{animation:gd-door .5s cubic-bezier(.3,1.2,.5,1)}
@keyframes gd-door{from{scale:.06;opacity:.2}}
#s-garden .gd-pn.cellar.gd-shut{scale:.06;opacity:0;transition:scale .32s ease-in,opacity .32s ease-in}
/* the snowman is built on the snow of the garden itself */
#s-garden .gd-pn.snow.zoom{background:linear-gradient(rgba(255,255,255,0) 58%,rgba(246,251,255,.75) 78%,rgba(250,253,255,.9))}
/* a new bed comes up out of the grass */
#s-garden .gd-bed.gd-born{animation:gd-born 1s cubic-bezier(.3,1.4,.5,1)}
@keyframes gd-born{0%{scale:.2 .05;opacity:0}60%{opacity:1}}
#s-garden .gd-bed{transition:opacity .4s}
#s-garden .gd-bed.gd-fade{opacity:.25;pointer-events:none}
/* (review) a neighbour in the frame: its plant gives way completely, the soil stays faint; the snow haze is light */
#s-garden .gd-bed.gd-fade{opacity:.45}
#s-garden .gd-bed.gd-fade .gd-plant,#s-garden .gd-bed.gd-fade .gd-ov,#s-garden .gd-bed.gd-fade .gd-house{opacity:0;transition:opacity .3s}
#s-garden .gd-pn.snow.zoom{background:linear-gradient(rgba(255,255,255,0) 66%,rgba(246,251,255,.55) 84%,rgba(250,253,255,.7))}
#s-garden .gd-pn.cellar{border:1vmin solid #7a5230;box-shadow:0 1.2vmin 3vmin rgba(40,20,0,.45)}
#s-garden .gd-fe-veil{background:radial-gradient(ellipse at 50% 55%,rgba(255,248,226,.6) 0,rgba(255,248,226,.4) 50%,rgba(255,248,226,0) 70%)}
/* ---------- feast v2 (10.10): the family sits at a long table, plates on its top, the harvest IN the basket, the stove with the pot on the ground ---------- */
#s-garden .gd-fe-tb{position:absolute;pointer-events:none;filter:drop-shadow(0 1vmin 1vmin rgba(60,30,10,.28));animation:gd-tbl-in .6s cubic-bezier(.3,1.25,.5,1) backwards}
#s-garden .gd-fe-tb>img{position:absolute;top:0;height:100%;left:0}
#s-garden .gd-fe-tb>img:last-child{left:auto;right:0}
#s-garden .gd-fe-tb>i{position:absolute;top:0;height:100%;background-repeat:repeat-x;background-position:0 0}
#s-garden .gd-fe-p{position:absolute;pointer-events:auto;touch-action:none;animation:pop-in .4s backwards}
#s-garden .gd-fe-p>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:none;pointer-events:none;filter:drop-shadow(0 .5vmin .6vmin rgba(40,25,10,.3))}
#s-garden .gd-fe-p>img.gd-on{display:block}
#s-garden .gd-fe-p.gd-fe-av>img{border-radius:50%;object-fit:cover;inset:20%;width:60%;height:60%;border:.6vmin solid #fff}
#s-garden .gd-fe-p:not(.gd-fed)>img.gd-on{animation:gd-fe-wait 1.8s ease-in-out infinite;transform-origin:50% 90%}
@keyframes gd-fe-wait{0%,100%{rotate:0deg}30%{rotate:-2deg}70%{rotate:2deg}}
#s-garden .gd-fe-p.gd-want>img.gd-on{filter:drop-shadow(0 0 .7vmin #fff) drop-shadow(0 0 1.6vmin rgba(255,200,40,1))}
#s-garden .gd-fe-p.gd-chomp>img.gd-on{animation:gd-chomp .7s ease-in-out}
#s-garden .gd-fe-plate{position:absolute;pointer-events:none;object-fit:fill;filter:drop-shadow(0 .3vmin .3vmin rgba(60,20,10,.3));animation:pop-in .35s .4s backwards}
#s-garden .gd-fe-plate.gd-want{filter:drop-shadow(0 0 1.2vmin rgba(255,210,40,1))}
#s-garden .gd-pc.gd-fe-food{pointer-events:none;scale:1}
#s-garden .gd-fe-bask{position:absolute;object-fit:fill;pointer-events:auto;touch-action:none;filter:drop-shadow(0 .8vmin .8vmin rgba(0,0,0,.22))}
#s-garden .gd-fe-bf{filter:none}
#s-garden .gd-fe-bask.gd-hot{animation:gd-fe-hot 1.4s ease-in-out infinite}
#s-garden .gd-fe-bask{transform-origin:50% 100%}
#s-garden .gd-pot.gd-hot>img:first-child,#s-garden .gd-fe-lad.gd-hot{animation:gd-fe-hot 1.4s ease-in-out infinite}
@keyframes gd-fe-hot{0%,100%{filter:drop-shadow(0 0 .6vmin rgba(255,255,255,.8)) drop-shadow(0 0 1vmin rgba(255,205,40,.6));scale:1}50%{filter:drop-shadow(0 0 1.2vmin #fff) drop-shadow(0 0 3vmin rgba(255,200,30,1));scale:1.04}}
#s-garden .gd-pn.feast .gd-stove{z-index:7}
#s-garden .gd-fe-fire{position:absolute;pointer-events:none;border-radius:50%;background:radial-gradient(ellipse at 50% 70%,rgba(255,230,120,.75),rgba(255,140,30,.35) 45%,rgba(255,120,0,0) 70%);mix-blend-mode:screen;opacity:.35;animation:gd-fe-fl .5s ease-in-out infinite alternate}
#s-garden .gd-fe-fire.gd-cook{opacity:.9}
@keyframes gd-fe-fl{from{scale:.92 .9}to{scale:1.06 1.1}}
#s-garden .gd-pn.feast .gd-pot .gd-fe-lad{position:absolute;pointer-events:none;object-fit:contain;transform-origin:30% 80%;filter:drop-shadow(0 .4vmin .4vmin rgba(0,0,0,.25))}
#s-garden .gd-pn.feast .gd-pot .gd-fe-pf{filter:none}
#s-garden .gd-pn.feast .gd-soup{left:16%;right:16%;top:9.5%;height:22%;overflow:hidden}
#s-garden .gd-fe-bits{position:absolute;inset:0}
#s-garden .gd-fe-bits img{position:absolute;width:30%;height:auto;aspect-ratio:1;translate:-50% -55%;transition:left .15s,top .15s,opacity .6s;filter:drop-shadow(0 .3vmin .3vmin rgba(0,0,0,.3))}
#s-garden .gd-fe-bits.gd-done img{opacity:.55}
/* ---------- end feast v2 ---------- */

/* ===== polish (feel): the layer over the scene, all pointer-transparent; only transform/opacity animate ===== */
#s-garden .gd-pol{position:absolute;inset:0;z-index:95;pointer-events:none;overflow:hidden}
#s-garden .gd-pol>i{position:absolute;display:block}
#s-garden .gd-flash{inset:0;background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.95),rgba(255,250,225,.55) 55%,rgba(255,250,225,0) 85%);opacity:0}
#s-garden .gd-veil{inset:0;background:#fff8e8;opacity:0}
#s-garden .gd-plus{font:900 min(9vmin,44px)/1 Arial,sans-serif;color:#ffd23f;-webkit-text-stroke:.8vmin #b35500;paint-order:stroke fill;text-shadow:0 .5vmin 0 #7a3a00;white-space:nowrap}
#s-garden .gd-banner{left:50%;top:29%;translate:-50% 0;display:flex;align-items:center;gap:1.6vmin;padding:1.2vmin 4vmin 1.2vmin 2.4vmin;border-radius:8vmin;background:rgba(255,255,255,.88);box-shadow:0 .8vmin 0 #e0a800,0 1.2vmin 2.4vmin rgba(0,0,0,.2);font:900 min(7vmin,36px)/1 Arial,sans-serif;color:#e07b00;white-space:nowrap}
#s-garden .gd-banner b{color:#ffc531;font-size:1.2em;-webkit-text-stroke:.5vmin #e0a800}
#s-garden .gd-banner.rec{background:linear-gradient(90deg,#fff3a0,#ffd1f0,#c8f0ff,#fff3a0);color:#b04500}
#s-garden .gd-pulse{left:0;top:0;width:100%;height:100%;position:absolute;background:radial-gradient(circle at 50% 55%,rgba(255,236,150,.85),rgba(255,236,150,0) 70%);opacity:0;pointer-events:none;z-index:1}
/* the living sky: clouds drift at different speeds (parallax), butterflies flit over the sky only */
#s-garden .gd-cl{position:absolute;left:0;pointer-events:none;animation:gd-cldrift linear infinite;will-change:translate}
#s-garden .gd-cl svg{width:100%;display:block}
@keyframes gd-cldrift{from{translate:-40vmin 0}to{translate:calc(100vw + 10vmin) 0}}
#s-garden .gd-bf{pointer-events:none;opacity:.9}
/* buttons and cards are pressed in and spring back */
#s-garden .gd-tool{transition:scale .22s cubic-bezier(.3,1.7,.5,1),box-shadow .2s}
#s-garden .gd-tool:active{scale:.9;box-shadow:0 .2vmin 0 #8bb36b,0 .4vmin 1vmin rgba(0,0,0,.18)}
#s-garden .gd-tool.sel:active{scale:1}
/* a shimmering rainbow behind the reward (only while the garden's round is over: the class is put by endRound, taken off by restart / cleanup) */
.reward.gd-rw{overflow:hidden}
.reward.gd-rw::before{content:'';position:absolute;top:0;bottom:0;left:-100%;width:300%;pointer-events:none;opacity:.55;background:linear-gradient(90deg,#ffc9c9,#fff0a8,#c8f5c8,#bfe3ff,#e0c8ff,#ffc9c9,#fff0a8,#c8f5c8,#bfe3ff,#e0c8ff,#ffc9c9);animation:gd-rwslide 9s linear infinite;will-change:translate}
@keyframes gd-rwslide{from{translate:0 0}to{translate:33.33% 0}}
@media (prefers-reduced-motion:reduce){#s-garden .gd-cl,.reward.gd-rw::before{animation:none}}
#s-garden .gd-pn .gd-x,#s-garden .gd-pn .gd-ok{transition:scale .22s cubic-bezier(.3,1.7,.5,1)}
#s-garden .gd-pn .gd-x:active,#s-garden .gd-pn .gd-ok:active{scale:.9}
#s-garden{--gd-x:0}.gd-spk{will-change:transform,opacity}