/* Restyled original games: no changes to the shared home/Pop layout. */
.classic-game{background:#c9ecff url('../images/classic-garden/meadow.png') center center/cover fixed no-repeat;color:#263e66;min-height:100svh}
.classic-game .page{max-width:1050px;padding:10px 0 28px}.classic-game .page>h1{text-align:center;color:#ce3573;text-shadow:0 2px white;margin:4px 0;font-size:clamp(22px,4vw,32px)}
.classic-game .lead,.classic-game .game-help,.classic-game .game-note{text-align:center;color:#284868;background:#ffffffcc;border-radius:14px;padding:4px 8px}
.classic-game .panel,.classic-game .math-scene,.classic-game .game-shell{background:#fffdf4eb;border:3px solid #f8bad0;box-shadow:0 6px 0 #ffffffae,0 14px 35px #5b9b7429;border-radius:26px}
.classic-game .game-shell{background:#e8f7ffb8;border-color:#add96f}
.classic-game button,.classic-game select{touch-action:manipulation;font:inherit;min-height:44px}
.classic-game .btn{background:#fffaf4;border-color:#efbdd1;color:#8c365b;padding:7px 12px;align-items:center;justify-content:center}.classic-game .btn.primary{background:#e66a9c;color:white}
.classic-game :is(button,a,select,canvas):focus-visible{outline:3px solid #246fa8;outline-offset:3px}
.classic-level{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;font-size:14px;font-weight:800}.classic-level select{border:2px solid #efd4a0;border-radius:12px;background:#fff;padding:4px 8px;color:#263e66}
.classic-controls{display:flex;gap:10px;justify-content:center;margin:12px 0}
.classic-game .memory-grid{width:100%;max-width:740px;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:10px auto}
.classic-game .memory-card{min-width:0;min-height:44px;border:2px solid #f4a8ca;background:linear-gradient(145deg,#fff6fa,#ffcddd);border-radius:13px;box-shadow:0 3px 0 #e9b6cb;aspect-ratio:1}
.new-card-rabbit{display:block;width:94%;height:94%;background:url('../images/classic-garden/card-rabbit.png') left top/200% 200% no-repeat}
.classic-game .memory-card.open,.classic-game .memory-card.matched{background:#fffef5;border-color:#f4d277}
.classic-game .memory-card.gone{visibility:hidden;pointer-events:none}
.classic-sprite{display:block;width:93%;height:93%;background-size:500% 100%;background-position:0 0;background-repeat:no-repeat}
.memory-card.open .classic-sprite{animation:classic-face .85s steps(1,end) 1}
@keyframes classic-face{0%,20%{background-position:0 0}35%{background-position:50% 0}60%,100%{background-position:100% 0}}
.classic-game .math-stage{align-items:center}.classic-game .math-visual{max-height:340px;overflow:auto;padding:10px;min-width:0}
.classic-game .math-question .equation{display:block;font-size:clamp(26px,5vw,40px);color:#18375a}.classic-game .math-question span{display:block;font-size:15px}
.classic-game .carrot-group,.classic-game .bundle-box{flex-wrap:wrap;justify-content:center;max-width:100%;min-width:46px;gap:3px;padding:7px}
.classic-game .div-bundles{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;width:100%}
.carrot-picture{display:inline-block;flex:0 0 28px;width:28px;height:32px;background:url('../images/garden-games/carrot.webp') 0 0/500% 100% no-repeat}
.many-carrots .carrot-picture{flex-basis:20px;width:20px;height:24px}.classic-game .mult-groups{max-width:100%;gap:6px}
.classic-game .math-option{border-color:#cbdde5;border-radius:16px;background:#fff9ec;font-size:20px}.classic-game .math-option:nth-child(2){background:#e9f9d2}.classic-game .math-option:nth-child(3){background:#ffebcc}.classic-game .math-option:nth-child(4){background:#e3f4ff}
.classic-game #gameCanvas{touch-action:none;display:block;width:100%;background:linear-gradient(#d3eeff66,#ecfbff11);border:2px solid #ffffffa6}
.classic-game .game-canvas-wrap{width:min(100%,720px,calc((100svh - 255px)*1.2))}
.classic-game .learning-content{background:#fffdf4ed;border-radius:20px}.classic-game .footer{background:#345f48}
@media(min-width:900px){.classic-game .memory-grid[data-pairs='19'],.classic-game .memory-grid[data-pairs='20']{grid-template-columns:repeat(8,minmax(0,1fr))}}
@media(max-width:599px){.classic-game .memory-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.classic-game .panel{padding:9px}.classic-game .memory-card{border-radius:10px}.classic-game .math-stage{flex-direction:column;gap:5px}.classic-game .rabbit-character img{width:80px;height:80px}.classic-game .rabbit-character strong{display:none}.classic-game .math-visual{width:100%;max-height:255px}.classic-game .math-question span{font-size:13px}.classic-level{gap:7px;font-size:12px}.classic-game .math-options{grid-template-columns:repeat(4,minmax(0,1fr))}.classic-game .math-option{font-size:16px;padding:5px}.classic-game .game-canvas-wrap{width:100%}.classic-game .page{width:calc(100% - 16px)}}
@media(orientation:landscape) and (max-height:550px){.classic-game .page>h1{font-size:20px}.classic-game .lead,.classic-game .game-help{display:none}.classic-game .game-canvas-wrap{width:min(100%,calc((100svh - 130px)*1.2))}.classic-game .classic-controls{margin:5px}.classic-game .memory-grid{grid-template-columns:repeat(8,minmax(44px,1fr));max-width:720px}.classic-game .math-stage{flex-direction:row}.classic-game .math-visual{max-height:170px}}
@media(prefers-reduced-motion:reduce){.classic-game *{animation:none!important;scroll-behavior:auto!important}}

.classic-game .celebration-text.with-rabbit .celebration-rabbit{width:160px;height:160px;object-position:-9999px;background:url('../images/rabbit-jump-sprite.png') 0 0/300% 100% no-repeat;animation:classic-jump 1.1s steps(3) infinite}
@keyframes classic-jump{from{background-position:0 0}to{background-position:150% 0}}
@media(prefers-reduced-motion:reduce){.classic-game .celebration-text.with-rabbit .celebration-rabbit{animation:none}}

@media(prefers-reduced-motion:reduce){.classic-game .carrot-eaten{opacity:0}.classic-game #celebrationLayer.show .celebration-text{opacity:1;transform:translate(-50%,-50%)}}

/* Each card renders one normalized frame, with room around ears and cheeks. */
.classic-game .memory-grid{position:relative}
.classic-game .memory-card .card-back,.classic-game .memory-card .card-face{padding:0;inset:0;overflow:hidden}
.classic-game .classic-card-art{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.classic-game .memory-card.matched{animation:memory-golden-match .9s ease both;border-color:#ffcd42;z-index:2}
@keyframes memory-golden-match{0%,40%{box-shadow:0 0 0 3px #ffe66b,0 0 22px 6px #ffd447b3;transform:scale(1)}20%,60%{box-shadow:0 0 0 5px #fff5a3,0 0 30px 8px #ffdb59db;transform:scale(1.035)}80%{opacity:1;transform:scale(.96)}100%{opacity:0;transform:scale(.7)}}
.memory-match-link{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:4}
.memory-match-link path{fill:none;stroke:#ff70b8;stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 0 5px #ff90ce);stroke-dasharray:1;stroke-dashoffset:1;animation:memory-pink-trail .9s ease forwards}
@keyframes memory-pink-trail{0%{stroke-dashoffset:1;opacity:1}55%{stroke-dashoffset:0;opacity:1}80%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
/* Reserve space above the bunny so neither the question nor cheer covers its face. */
.classic-game .rabbit-character{width:min(300px,100%);height:280px;padding-top:65px;display:flex;align-items:center;justify-content:center;flex-direction:column;flex-shrink:0}
.classic-game .rabbit-character img{display:block;width:100%;height:205px;max-height:none;object-fit:contain}
.classic-game .rabbit-character.happy img{height:240px}
.classic-game .rabbit-character strong{display:none}
.classic-game .rabbit-character .thought{top:4px;left:50%;right:auto;transform:translateX(-50%);width:32px;height:42px;border:0;border-radius:0;background:transparent;font-family:system-ui;font-size:38px;font-weight:900;color:#ed699b;text-shadow:0 2px #fff;line-height:1;pointer-events:none}
.classic-game .rabbit-character .thought.shout{width:180px;height:76px;padding:0 20px 12px;background:url('../images/classic-garden/cheer-bubble.png') center/contain no-repeat;color:#be336b;font-size:25px;line-height:1;animation:math-bubble-pop .35s ease both;text-shadow:none;top:-8px}
@keyframes math-bubble-pop{0%{transform:translateX(-50%) scale(.65)}70%{transform:translateX(-50%) scale(1.1)}100%{transform:translateX(-50%) scale(1)}}
@media(max-width:599px){.classic-game .rabbit-character{width:260px;height:240px;padding-top:50px}.classic-game .rabbit-character img{height:180px}.classic-game .rabbit-character.happy img{height:205px}.classic-game .rabbit-character .thought{font-size:30px;height:34px}.classic-game .rabbit-character .thought.shout{width:165px;height:70px;font-size:23px;top:-6px}}
@media(orientation:landscape) and (max-height:550px){.classic-game .rabbit-character{width:190px;height:220px;padding-top:45px}.classic-game .rabbit-character img{height:150px}.classic-game .rabbit-character.happy img{height:175px}}
@media(prefers-reduced-motion:reduce){.classic-game .memory-card.matched{opacity:1;transform:none}.memory-match-link path{animation:none;stroke-dashoffset:0}.classic-game .thought.shout{transform:translateX(-50%)}}
@media(max-width:599px){.classic-game .rabbit-character{width:min(250px,100%);height:190px;padding-top:40px}.classic-game .rabbit-character img{height:140px}.classic-game .rabbit-character.happy img{height:180px}.classic-game .rabbit-character .thought.shout{top:-14px}}
.classic-game .memory-card.open .card-face .classic-card-art{animation:card-art-bob .85s ease both}
@keyframes card-art-bob{0%,100%{transform:translateY(0)}35%{transform:translateY(-3px) rotate(-2deg)}65%{transform:translateY(1px) rotate(2deg)}}


/* Three isolated generated frames share a fixed square registration. */
.carrot-cheek-guide{flex:0 0 100%;width:100%;margin:0 0 7px;font-size:12px;line-height:1.5;color:#9a5473;background:#fff1f6;border-radius:12px;padding:5px}
.carrot-ten-rabbit{display:inline-block;position:relative;flex:0 0 84px;width:84px;height:104px;isolation:isolate}
.gulp-frame{position:absolute;top:0;left:0;width:84px;height:84px;object-fit:contain;pointer-events:none;opacity:0}
.gulp-frame.full{opacity:1}
.carrot-cheek{position:absolute;top:61px;width:28px;height:23px;border-radius:50%;background:#ffe4d7b0;display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:0;z-index:1}
.carrot-cheek.left{left:5px;--gulp-x:23px}.carrot-cheek.right{right:5px;--gulp-x:-23px}
.classic-game .carrot-cheek .carrot-picture{flex:0 0 9px;width:9px;height:11px}
.cheek-count{position:absolute;bottom:0;left:0;width:100%;text-align:center;color:#975b75;font-size:11px;font-weight:800;line-height:1}
.gulp-word{position:absolute;top:25px;left:24px;background:#fff7ca;border:1px solid #ffd574;border-radius:9px;padding:1px 4px;white-space:nowrap;font-size:11px;opacity:0;z-index:2}
.gulp-in .gulp-frame.open{animation:gulp-open 2s step-end both}
.gulp-in .gulp-frame.chew{animation:gulp-chew 2s step-end both}
.gulp-in .gulp-frame.full{animation:gulp-full 2s step-end both}
.gulp-in .gulp-word{animation:cheek-gulp-word 2s ease both}
.gulp-in .carrot-cheek{animation:cheek-fill 2s ease both}
.gulp-in{animation:gulp-bob 2s ease both}
.carrot-bite{animation:cheek-bite .28s ease}
@keyframes gulp-open{0%{opacity:1}40%,100%{opacity:0}}
@keyframes gulp-chew{0%{opacity:0}40%{opacity:1}52%{opacity:0}62%{opacity:1}76%,100%{opacity:0}}
@keyframes gulp-full{0%{opacity:0}52%{opacity:1}62%{opacity:0}76%,100%{opacity:1}}
@keyframes cheek-gulp-word{0%,30%{opacity:1}45%,100%{opacity:0}}
@keyframes cheek-fill{0%{opacity:1;transform:translate(var(--gulp-x),24px) scale(1)}35%{opacity:1;transform:translate(var(--gulp-x),-1px) scale(.4)}42%{opacity:0;transform:translate(var(--gulp-x),-1px) scale(.2)}76%{opacity:1;transform:scale(1.1)}100%{opacity:1;transform:none}}
@keyframes gulp-bob{0%,38%,100%{transform:none}46%,64%{transform:scale(1.02,.98)}56%,72%{transform:scale(.98,1.02)}}
@keyframes cheek-bite{50%{transform:scale(.98)}}
@media(prefers-reduced-motion:reduce){.gulp-word{display:none}.gulp-frame.open,.gulp-frame.chew{opacity:0!important}.gulp-frame.full{opacity:1!important}}

.memory-match-link .memory-gem{stroke:#ff83c3;stroke-width:1;transform-box:fill-box;transform-origin:center;animation:memory-gem-shine .65s ease both}
@keyframes memory-gem-shine{0%{opacity:0;transform:scale(.25) rotate(-20deg)}25%,65%{opacity:1;transform:scale(1.25) rotate(12deg)}100%{opacity:0;transform:scale(.6) rotate(30deg)}}
@media(prefers-reduced-motion:reduce){.memory-match-link .memory-gem{animation:none;opacity:1;transform:none}}