#picturePuzzle,#gardenColoring{box-sizing:border-box;position:fixed;inset:0;margin:auto;width:min(1000px,100vw);height:100dvh;max-height:100dvh;max-width:100vw;padding:12px;overflow:hidden;background:#fff9e9;color:#234b3d;border:0}#picturePuzzle[open],#gardenColoring[open]{display:flex;flex-direction:column;gap:9px}#puzzlePicker{overflow:auto;min-height:0;padding:4px}#puzzlePicker select,#coloringPicture{padding:10px 14px;border-radius:14px;border:2px solid #a8c49a;font-size:16px;color:#234b3d;background:white}#puzzleGallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:15px 0}#puzzleGallery button{background:#deebd3;color:#244b3b;border:2px solid #b1c99c;border-radius:16px;padding:0 0 10px;overflow:hidden;font-size:16px}#puzzleGallery img{display:block;width:100%;height:125px;object-fit:cover;margin-bottom:8px}.creativeTools{display:flex;gap:7px;flex-wrap:wrap;align-items:center}.creativeTools button,.creativeTools select{min-height:42px}.creativeTools button,#picturePuzzle .gameTop button,#gardenColoring .gameTop button{padding:9px 13px;border-radius:20px;background:#2c5a49;color:white;min-height:42px}#puzzlePlay{display:flex;flex:1;min-height:0;flex-direction:column;gap:7px}#puzzlePlay.hidden{display:none}#puzzleStatus,#puzzleInstructions,#coloringStatus{margin:0;font-size:15px;line-height:1.35}#puzzleWorkspace{flex:1;min-height:0;display:grid;grid-template-rows:minmax(0,1.1fr) minmax(0,1fr);gap:12px}#puzzleBoard,#puzzleTray{display:grid;min-height:0;min-width:0;overflow:hidden;border-radius:14px}#puzzleBoard{background-color:#dae7cf;border:3px solid #9fba86;background-size:100% 100%;position:relative}#puzzleBoard.noGuide{background-image:none!important}#puzzleTray{gap:5px;padding:7px;background:#ebeddf;align-content:stretch}#puzzleBoard button,#puzzleTray button{min-width:0;min-height:0;aspect-ratio:auto;position:relative;margin:0;touch-action:none;border-radius:3px;background-color:#f9f8e5;padding:0;overflow:hidden}#puzzleBoard button{border:1px dashed #476a4c55;background:#ffffffa8}#puzzleTray button{border:2px solid #d5b769;box-shadow:0 1px 3px #20352333}#puzzleTray button.selectedPiece{outline:3px solid #226956;outline-offset:-3px}#puzzleTray button.usedPiece{visibility:hidden}#puzzleBoard button.placedPiece{border:1px solid #ffffff55;background-color:transparent}#puzzleTray button:focus-visible,#puzzleBoard button:focus-visible{outline:3px solid #1c5b92;outline-offset:-3px}#puzzleDragGhost{position:fixed;z-index:2147483647;pointer-events:none;border:3px solid #d5b769;border-radius:5px;background-repeat:no-repeat;box-shadow:0 10px 22px #1236}#coloringCanvas{flex:1;min-height:0;background:white;border:2px solid #c0d0ac;border-radius:20px;overflow:hidden;display:flex;justify-content:center;align-items:center;touch-action:manipulation}#coloringCanvas svg{width:100%;height:100%;max-height:100%;display:block}#coloringCanvas [data-color-region]{cursor:pointer;transition:fill .12s}#coloringCanvas [data-color-region]:focus-visible{stroke:#167a9c;stroke-width:6}#coloringPalette{display:flex;justify-content:center;flex-wrap:wrap;gap:7px}#coloringPalette button{width:43px;height:43px;min-width:43px;min-height:43px;border:2px solid #69756a;border-radius:50%;padding:0}#coloringPalette button[aria-pressed=true]{outline:3px solid #234d41;outline-offset:2px}@media(max-width:600px){#puzzleGallery{grid-template-columns:repeat(3,1fr);gap:8px}#puzzleGallery img{height:90px}#picturePuzzle,#gardenColoring{padding:8px}.creativeTools button{font-size:13px;padding:8px 10px}.creativeTools{gap:5px}#puzzleInstructions{font-size:12px}#coloringPalette{gap:6px}#coloringPalette button{width:38px;height:38px;min-width:38px;min-height:38px}}@media(orientation:landscape){#puzzleWorkspace{grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr)}#puzzleGallery{grid-template-columns:repeat(5,1fr)}#picturePuzzle,#gardenColoring{gap:5px}.creativeTools button{min-height:34px}#coloringPalette{gap:6px}#coloringPalette button{width:33px;height:33px;min-width:33px;min-height:33px}}
/* Only the colored subject moves; the background and controls stay in place. */
#coloringAnimal{transform-box:fill-box;transform-origin:center;pointer-events:auto}
#coloringAnimal.colorRun{animation:colorRunAway 4s ease-in-out both}
#coloringAnimal.colorSwim{animation:colorSwimAway 4s ease-in-out both}
#coloringAnimal.colorFly{animation:colorFlyAway 4s ease-in-out both}
#coloringAnimal.colorBloom{animation:colorBloom 4s ease-in-out both}
.colorRun [aria-label="Color leg"],.colorRun [aria-label="Color paw"]{transform-box:fill-box;transform-origin:50% 0;animation:colorStride .22s ease-in-out infinite alternate}
.colorFly [aria-label="Color wing"],.colorFly [aria-label="Color upper wing"],.colorFly [aria-label="Color lower wing"]{transform-box:fill-box;transform-origin:center;animation:colorFlap .28s ease-in-out infinite alternate}
@keyframes colorRunAway{0%,8%{transform:translate(0,0)}18%{transform:translate(12%,-2%)}30%{transform:translate(38%,0)}43%{transform:translate(95%,-2%);opacity:1}50%,58%{transform:translate(150%,0);opacity:0}59%{transform:translate(-150%,0);opacity:0}65%{transform:translate(-100%,-2%);opacity:1}85%{transform:translate(-25%,0)}100%{transform:translate(0,0)}}
@keyframes colorSwimAway{0%,8%{transform:translate(0,0) rotate(0)}30%{transform:translate(40%,-6%) rotate(-4deg)}48%{transform:translate(150%,6%) rotate(3deg);opacity:0}58%{transform:translate(-150%,-6%);opacity:0}66%{opacity:1}85%{transform:translate(-30%,5%) rotate(3deg)}100%{transform:translate(0,0) rotate(0);opacity:1}}
@keyframes colorFlyAway{0%,8%{transform:translate(0,0)}30%{transform:translate(30%,-32%) rotate(-8deg)}48%{transform:translate(130%,-120%) scale(.65);opacity:0}58%{transform:translate(-130%,-90%) scale(.65);opacity:0}70%{opacity:1}100%{transform:translate(0,0) scale(1) rotate(0)}}
@keyframes colorBloom{0%,100%{transform:scale(1) rotate(0)}20%{transform:scale(.88) rotate(-3deg)}45%{transform:scale(1.08) rotate(3deg)}70%{transform:scale(1.03) rotate(-2deg)}}
@keyframes colorStride{from{transform:rotate(-11deg)}to{transform:rotate(11deg)}}
@keyframes colorFlap{from{transform:scaleX(.65) rotate(-7deg)}to{transform:scaleX(1) rotate(7deg)}}
@media(prefers-reduced-motion:reduce){#coloringAnimal.colorRun,#coloringAnimal.colorSwim,#coloringAnimal.colorFly,#coloringAnimal.colorBloom{animation:colorGentle 4s ease-in-out}.colorRun [aria-label],.colorFly [aria-label]{animation:none}@keyframes colorGentle{0%,100%{opacity:1}45%,55%{opacity:.35}}}
#puzzleTray button,#puzzleBoard button,#puzzleDragGhost{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#puzzleDragGhost{box-sizing:border-box;touch-action:none}
#puzzlePlay{position:relative}#puzzleCelebration{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:8px;background:#fff0b7;border:2px solid #e6bf62;border-radius:16px;color:#5b471c;font-size:18px}#puzzleCelebration.hidden{display:none}#playPuzzleAgain{padding:9px 16px;border-radius:20px;background:#2c5a49;color:white;font-size:16px}#puzzleStars{position:absolute;inset:15% 0 10%;overflow:hidden;pointer-events:none;z-index:3}#puzzleStars span{position:absolute;top:0;font-size:25px;animation:puzzleStarFall 1.9s ease-out both}#puzzleBoard.puzzleHappy{animation:puzzleHappy .55s ease-in-out 2}@keyframes puzzleHappy{0%,100%{transform:scale(1)}45%{transform:scale(.97) translateY(-5px)}}@keyframes puzzleStarFall{0%{opacity:0;transform:translateY(-15px) rotate(0)}15%{opacity:1}100%{opacity:0;transform:translateY(230px) rotate(170deg)}}@media(prefers-reduced-motion:reduce){#puzzleBoard.puzzleHappy{animation:none}#puzzleStars span{animation:none;display:none}}
#puzzleCelebration{flex-shrink:0;display:block;text-align:center;padding:9px 12px}#puzzleCelebration strong{display:block;font-size:21px}#puzzleCelebration p{margin:4px 0 8px;font-size:15px}.puzzleFinishChoices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.puzzleFinishChoices button,#playPuzzleAgain{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:90px;min-width:0;padding:8px 6px;border:2px solid #abc78f;border-radius:17px;background:#e1efcf;color:#234b3d;font-size:16px;font-weight:700;line-height:1.2}.puzzleFinishChoices button:nth-child(2){background:#ffdf84;border-color:#d1a947}.puzzleFinishChoices img{width:66px;height:43px;object-fit:cover;border-radius:7px}.puzzleChooseIcon{display:block;font-size:32px;line-height:43px}#puzzleWorkspace.puzzleFinished{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr)}#puzzleWorkspace.puzzleFinished #puzzleTray{display:none}@media(max-width:600px){.puzzleFinishChoices{gap:6px}.puzzleFinishChoices button,#playPuzzleAgain{font-size:14px;min-height:86px}#puzzleCelebration strong{font-size:19px}}@media(orientation:landscape) and (max-height:500px){#puzzleCelebration{padding:5px 9px}#puzzleCelebration strong{font-size:17px}#puzzleCelebration p{font-size:12px;margin:2px 0 4px}.puzzleFinishChoices button,#playPuzzleAgain{flex-direction:row;min-height:48px;font-size:14px}.puzzleFinishChoices img{height:30px;width:40px}.puzzleChooseIcon{font-size:24px;line-height:30px}}
#littlePuzzlePieces{padding:8px 3px 14px}#littlePuzzlePieces h3{font-size:25px;margin:5px 0}#littlePuzzlePieces p{font-size:16px;margin:6px 0 12px}#littlePuzzlePieceButtons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}#littlePuzzlePieceButtons button{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:99px;border-radius:20px;background:#e2efcf;color:#244b3c;border:3px solid #b1c797;padding:8px;touch-action:manipulation}#littlePuzzlePieceButtons strong{font-size:46px;font-weight:900;line-height:1.1}#littlePuzzlePieceButtons span{font-size:15px}#littlePuzzlePieceButtons button.chosenPieceCount{background:#ffe193;border-color:#bc8e29;box-shadow:0 0 0 2px #fff5ca inset}#puzzlePieceCount.hidden,#puzzlePieceLabel.hidden,#littlePuzzlePieces.hidden{display:none}.littlePuzzlePicker #puzzleGallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.littlePuzzlePicker #puzzleGallery img{height:155px}.littlePuzzlePicker #puzzleGallery button{font-size:18px;padding-bottom:13px}@media(min-width:700px){#littlePuzzlePieceButtons{grid-template-columns:repeat(5,minmax(0,1fr))}.littlePuzzlePicker #puzzleGallery{grid-template-columns:repeat(3,minmax(0,1fr))}.littlePuzzlePicker #puzzleGallery img{height:180px}}@media(orientation:landscape) and (max-height:500px){#littlePuzzlePieceButtons{grid-template-columns:repeat(5,minmax(0,1fr))}#littlePuzzlePieceButtons button{min-height:85px}.littlePuzzlePicker #puzzleGallery{grid-template-columns:repeat(4,minmax(0,1fr))}}
#gameExperienceChoice.hidden,#gardenGameList.hidden,.littleGameControls.hidden{display:none}.gameExperienceCards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}.gameExperienceCards button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;min-height:220px;padding:22px 15px;background:#e2edcf;border:3px solid #abc89b;border-radius:25px;color:#234b3d}.gameExperienceCards button:first-child{background:#ffe5a5;border-color:#d6ad58}.gameExperienceCards button>span{font-size:56px}.gameExperienceCards strong{font-size:26px}.gameExperienceCards small{font-size:17px;line-height:1.4}.gameExperienceBar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.gameExperienceBar p{font-weight:bold}.gameExperienceBar button{padding:11px 16px;border-radius:18px;background:#2b5747;color:white;font-size:16px}.littleGameControls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0 20px}.littleGameControls button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:100px;background:#e2edcf;color:#234b3d;border:3px solid #abc89b;border-radius:20px;padding:10px 4px}.littleGameControls strong{font-size:43px;font-weight:900;line-height:1.1}.littleGameControls span{font-size:15px}.littleGameControls .selectedLittleOption{background:#ffe193;border-color:#bc8e29}#matchPlayerCount.hidden,#matchDifficulty.hidden,#huntDifficulty.hidden,#creationGameLevel.hidden{display:none}body[data-experience="little"] #gardenGames .gameChoices button{min-height:130px;font-size:38px}body[data-experience="little"] #gardenGames .gameChoices strong{font-size:27px}body[data-experience="little"] :is(#beginMatchRound,#beginHuntRound,#beginCreationGame,#closeGardenGames,#switchGameExperience){min-height:56px;font-size:20px;padding:13px 20px}body[data-experience="little"] #coloringPalette button{min-width:44px;min-height:44px}body[data-experience="little"] #creationGameAnswers button{min-height:75px;font-size:24px}@media(max-width:500px){.gameExperienceCards{grid-template-columns:1fr;gap:12px}.gameExperienceCards button{min-height:180px;padding:18px}.gameExperienceCards button>span{font-size:44px}.gameExperienceCards strong{font-size:25px}} 
#coloringPictureChoices{position:absolute;inset:78px 8px 8px;overflow:auto;z-index:5;background:#fff9e9;padding:12px;border-radius:18px}#coloringPictureGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}#coloringPictureGrid button{min-width:0;padding:8px;border:3px solid #b3cd9d;border-radius:20px;background:white;color:#244e3b;font-size:18px}#coloringPictureGrid svg{width:100%;height:115px;pointer-events:none}#coloringPictureGrid button div{pointer-events:none}#coloringPalette button{font-size:25px;font-weight:900;color:#18372b;text-shadow:0 0 3px white}#coloringFinish{text-align:center;padding:10px;background:#fff0b7;border-radius:16px}#coloringFinish strong{display:block;margin-bottom:8px}#coloringFinish button{font-size:18px;padding:12px;border-radius:18px;background:#285444;color:white;margin:4px}#coloringDemo{position:absolute;bottom:160px;left:20px;border-radius:18px;background:#fff6d8;padding:12px;pointer-events:none;font-size:26px;animation:colorDemoFade 5s forwards}#coloringDemo span{display:inline-block;animation:colorDemoTap 1.5s 3}@keyframes colorDemoTap{0%,100%{transform:translateX(0)}50%{transform:translateX(55px) translateY(-12px)}}@keyframes colorDemoFade{0%,85%{opacity:1}100%{opacity:0;visibility:hidden}}@media(max-width:600px){#coloringPictureGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){#coloringDemo span{animation:none}}
