.cat-picker{margin:0 0 26px}.picker-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.picker-heading h2{font-size:21px;margin:5px 0 0}.picker-heading>span{font-size:12px;color:#7c897f}.cat-list{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.cat-choice{border:1px solid #e6e5d9;background:#fffdf8;border-radius:17px;padding:7px 10px 12px;display:flex;flex-direction:column;align-items:center;gap:3px;transition:background .2s,border-color .2s}.cat-choice.selected{border-color:#97b183;background:#edf1e1;box-shadow:0 0 0 2px #dce5cc55}.cat-choice:hover{background:#f3efdf}.cat-preview{display:block;width:66px;height:69px}.cat-preview svg{width:100%;height:100%;overflow:visible}.cat-choice strong{font-size:12px}.cat-choice small{font-size:9px;color:#7c897f}.star{width:44px;height:44px;padding:0;bottom:calc(225px + var(--star-lift));animation:none}.star:hover{filter:drop-shadow(0 0 5px #ffef8f)}.star:before{content:'';position:absolute;inset:5px;border:1px solid #fff5bd55;border-radius:50%;animation:star-glow 2s ease-in-out infinite;pointer-events:none}.speech{pointer-events:none;max-width:70%}.passport-stars{letter-spacing:3px;overflow-wrap:anywhere;line-height:1.8}.passport-grid{display:grid;grid-template-columns:1fr 1fr;text-align:left;gap:4px}.passport-grid p{font-size:12px;margin:6px 0}.sound-option{display:flex;align-items:center;justify-content:space-between;text-align:left;font-size:13px;gap:14px;margin:18px 0 8px}.sound-option small{display:block;color:#7c897f;font-size:11px;margin-top:4px}.sound-option input{width:22px;height:22px;accent-color:#527c62}#volume{width:100%;accent-color:#527c62;min-height:36px}#sound-preview{font-size:12px;padding:10px 16px}dialog{max-height:90dvh;overflow:auto}#level-list{grid-template-columns:repeat(5,1fr)}
.scene[data-habitat="kitchen"]{background:repeating-linear-gradient(90deg,#f5e9d9 0 50px,#e8d8c222 50px 52px)}.scene[data-habitat="kitchen"] .sun{background:#d3e9ef;border:8px solid #fff8e9;border-radius:5px;width:90px;height:100px;top:83px;box-shadow:inset 0 0 0 2px #b4c5c8}.scene[data-habitat="kitchen"] .hills,.scene[data-habitat="kitchen"] .tree,.scene[data-habitat="kitchen"] .garden-fence,.scene[data-habitat="kitchen"] .flowers,.scene[data-habitat="kitchen"] .cloud{display:none}.scene[data-habitat="kitchen"] .ground{border-radius:0;border-top:13px solid #bd9678;height:140px}.scene[data-habitat="forest"] .tree span{box-shadow:100px 20px #82ac87,470px 25px #86b18c}.scene[data-habitat="beach"] .hills{background:#a9dbe2;left:0;width:100%;height:95px;bottom:115px;border-radius:0}.scene[data-habitat="beach"] .h2{display:none}.scene[data-habitat="beach"] .garden-fence,.scene[data-habitat="beach"] .tree,.scene[data-habitat="beach"] .flowers{display:none}.scene[data-habitat="beach"] .ground{border-top:7px solid #fff4d0}.scene[data-habitat="night"] .sun{background:#fff2bb;border:0;box-shadow:inset 15px 0 #f5dfa5}.scene[data-habitat="night"] .cloud{opacity:.3}.scene[data-habitat="night"]:after{content:'✧     ·       ✦         ·       ✧';position:absolute;top:66px;left:10%;color:#fff8d8;white-space:pre;font-size:25px;z-index:-1}.scene[data-habitat="farm"] .tree span{background:#dbc56b;border-radius:50%;box-shadow:inset 0 0 0 25px #f3db77}.scene[data-habitat="mountain"] .hills{height:210px;border-radius:0;background:linear-gradient(135deg,#f2f6f8 0 38%,#b8c9da 38%);clip-path:polygon(50% 0,100% 100%,0 100%);bottom:100px;left:-5%;width:65%}.scene[data-habitat="mountain"] .h2{left:45%;height:170px}.scene[data-habitat="mountain"] .garden-fence,.scene[data-habitat="mountain"] .tree{display:none}.scene[data-habitat="aquarium"] .garden-fence,.scene[data-habitat="aquarium"] .tree,.scene[data-habitat="aquarium"] .hills,.scene[data-habitat="aquarium"] .flowers{display:none}.scene[data-habitat="aquarium"]:before{content:'◦     🐟      ◦      🐠';position:absolute;top:130px;left:12%;right:8%;height:110px;padding:30px 10px;border:8px solid #80b8bd;border-radius:18px;background:#bce5e7;font-size:26px;white-space:pre;box-shadow:inset 0 0 25px #70b8c666}.scene[data-habitat="aquarium"] .sun{display:none}.scene[data-habitat="rainbow"] .sun{background:#ffe7b8}.scene[data-habitat="rainbow"]:before{content:'';position:absolute;top:80px;right:5%;width:190px;height:100px;border-radius:200px 200px 0 0;border:12px solid #e9a2a2;border-bottom:0;box-shadow:0 -10px #eac28b,0 -20px #e3dd99,inset 0 10px #b0ceac,inset 0 20px #aacbdb;opacity:.65}.scene[data-habitat="party"]:before{content:'▼   ▼   ▼   ▼   ▼   ▼   ▼';position:absolute;top:65px;left:5%;right:5%;font-size:27px;letter-spacing:8px;color:#cf979d;border-top:2px solid #c6ab8a;white-space:nowrap;overflow:hidden}.scene[data-habitat="party"] .tree span{background:#d5adcb;box-shadow:inset -15px 0 #c499bc}.scene[data-habitat="party"] .garden-fence{background:repeating-linear-gradient(90deg,transparent 0 31px,#fff5e4 31px 43px,transparent 43px 65px)}@keyframes star-glow{50%{transform:scale(1.25);opacity:.3}}
@media(max-width:720px){.picker-heading{align-items:flex-start}.picker-heading h2{font-size:20px}.picker-heading>span{font-size:10px;max-width:105px;text-align:right;line-height:1.6}.cat-list{grid-template-columns:repeat(3,1fr);gap:8px}.cat-choice{padding:5px 6px 9px}.cat-preview{width:55px;height:57px}.cat-choice small{font-size:8px}.cat-picker{margin-bottom:20px}.star{bottom:calc(174px + var(--star-lift))}.speech{top:66px;left:13%;font-size:10px;max-width:77%}#level-list{grid-template-columns:repeat(5,minmax(112px,1fr));grid-template-rows:repeat(2,auto);grid-auto-flow:row}.header-buttons{gap:7px}.scene[data-habitat="aquarium"]:before{font-size:19px;top:125px;padding:25px 6px}.scene[data-habitat="rainbow"]:before{width:130px;height:80px;right:6%;top:115px}.scene[data-habitat="party"]:before{font-size:22px;top:55px}.controls small{font-size:8px}}
@media(prefers-reduced-motion:reduce){.star:before{animation:none}}
.gate-options{display:flex;gap:14px;justify-content:center;margin:18px 0}
.gate-option{min-width:72px;min-height:72px;font-size:30px;font-weight:800;border-radius:20px;border:3px solid #e9c58f;background:#fff8ec;cursor:pointer}
.gate-option:focus-visible{outline:4px solid #85a690}
.star,.bowl,.friend{min-width:60px;min-height:60px;touch-action:manipulation}
.controls button,.cat,.cat-choice{touch-action:manipulation}
#play{position:absolute;inset:0;pointer-events:none;z-index:6}
.play-item{position:absolute;pointer-events:auto;min-width:60px;min-height:60px;font-size:34px;border:0;background:none;cursor:pointer;touch-action:manipulation;filter:drop-shadow(0 3px 0 #0002);transition:transform .2s}
.play-item:active{transform:scale(1.25)}
.play-item:focus-visible{outline:4px solid #85a690;border-radius:50%}
#play[data-kind="find"] .play-item{opacity:.6;font-size:26px;animation:peek 2.6s ease-in-out infinite}
#play[data-kind="chase"] .play-item{animation:drift 5s ease-in-out infinite}
#play[data-kind="order"] .play-item[data-next="true"]{animation:glow 1.4s ease-in-out infinite}
.play-item.wrong{animation:wiggle .4s!important}
@keyframes peek{0%,100%{transform:translateY(6px) scale(.92)}50%{transform:translateY(-4px) scale(1.05);opacity:.9}}
@keyframes drift{0%,100%{transform:translate(0,0)}25%{transform:translate(28px,-18px)}50%{transform:translate(-10px,-30px)}75%{transform:translate(-26px,-8px)}}
@keyframes glow{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-14deg)}75%{transform:rotate(14deg)}}
@media (prefers-reduced-motion:reduce){.play-item{animation:none!important}}
.mission-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.narrate{border:2px solid #e9c58f;background:#fff8ec;border-radius:999px;padding:8px 14px;font-weight:700;font-size:15px;min-height:44px;cursor:pointer;color:inherit}