:root{--ink:#243f35;--paper:#fffaf0;--gold:#dfae52;--green:#49634d}*{box-sizing:border-box}body{margin:0;background:#f4f0e6;color:var(--ink);font:18px/1.5 system-ui,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;color:inherit;min-width:56px;min-height:56px}button:focus-visible,a:focus-visible{outline:4px solid #d39125;outline-offset:5px}button:disabled{cursor:default}header{max-width:1180px;margin:auto;padding:20px 26px;display:flex;justify-content:space-between;align-items:center}header a{font-size:25px;font-weight:750;letter-spacing:-1px;color:inherit;text-decoration:none}header a span{font-weight:350}header button{border:1px solid #cbd2c5;border-radius:var(--radius-md);background:transparent;font-size:27px}main{max-width:1180px;margin:0 auto 35px;padding:0 var(--space-24)}.intro{display:grid;grid-template-columns:1fr 1fr;min-height:640px;border-radius:32px;overflow:hidden;background:var(--paper);box-shadow:0 20px 65px #29483114}.intro-copy{padding:56px 40px;align-self:center}.eyebrow{font-size:11px;letter-spacing:3px;text-transform:uppercase;font-weight:750;color:#647360}h1{font-family:Georgia,serif;font-size:clamp(44px,6vw,76px);font-weight:400;line-height:1.04;margin:22px 0}p{margin:15px 0}.intro-copy p{color:#5e6c60}.forest{background:url('pet-art/forest.png') center/cover;position:relative;min-height:340px}.owl-intro{width:180px;height:180px;position:absolute;bottom:35px;left:30px;border-radius:50%;box-shadow:0 12px 40px #21332944}.primary{display:inline-flex;align-items:center;justify-content:center;background:var(--ink);color:white;padding:17px 30px;border-radius:var(--radius-md);font-weight:650;text-decoration:none;margin-top:22px}.art{display:block;width:100%;aspect-ratio:1;background-image:url('pet-art/animals.png');background-size:300% 200%;background-repeat:no-repeat;pointer-events:none}.guide-art{background-image:url('pet-art/guide.png');background-size:300% 100%}.scene{background:linear-gradient(#fffaf0ee,#fffaf0f7),url('pet-art/forest.png') center/cover;border-radius:30px;padding:var(--space-24) var(--space-32) 30px;min-height:650px;position:relative;border:1px solid #e1dfd0}.trail{display:flex;justify-content:center;gap:10px;margin-bottom:20px}.trail i{height:8px;width:24px;border-radius:10px;background:#dbdfd1}.trail i.done{background:#91a478}.trail i.current{background:var(--gold);width:40px}.guide-row{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:var(--space-24)}.guide-button{width:106px;height:106px;border-radius:50%;position:relative;background:#fff8e8;padding:0;border:3px solid #e4d2a8;overflow:hidden}.guide-button .art{border-radius:50%}.speaker{position:absolute;bottom:0;right:0;background:var(--ink);color:white;width:34px;height:34px;border-radius:50%;font-size:20px}.guide-button.playing{box-shadow:0 0 0 8px #debc6650}.guide-button.needs-play{animation:glow 1.5s ease-in-out infinite}.sound-waves{display:flex;gap:5px;align-items:center;height:35px}.sound-waves i{height:8px;width:5px;border-radius:5px;background:#9aab8b}.is-speaking .sound-waves i{animation:wave .8s ease-in-out infinite alternate}.sound-waves i:nth-child(2){animation-delay:.2s}.sound-waves i:nth-child(3){animation-delay:.4s}.choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:880px;margin:auto}.choices.four{grid-template-columns:repeat(4,minmax(0,1fr))}.choice{padding:10px;border-radius:var(--radius-md);background:#fff9e9;border:2px solid #e8dfc8;box-shadow:0 8px 0 #dedccb;position:relative;overflow:hidden;transition:transform .2s,border-color .2s}.choice .art{border-radius:var(--radius-md)}.choice:hover{transform:translateY(-3px)}.choice.correct{border-color:#87a473;box-shadow:0 0 0 5px #c6d4a866}.choice.correct:after{content:'✦';position:absolute;right:12px;top:0;font-size:38px;color:#b28b32}.choice.hint{border-color:#d4b66b;animation:glow 1s 2}.choice.soft{opacity:.6}.choice.small-animal .art{transform:scale(.60)}.choice.small-animal{background:#fff7e4}.foot{display:flex;justify-content:space-between;align-items:center;margin-top:30px;min-height:64px}.rounds{display:flex;gap:var(--space-8)}.rounds span{height:12px;width:12px;border-radius:50%;background:#dfdac9}.rounds span.done{background:#6f8b59}.arrow{font-size:32px;border-radius:50%;width:66px;height:66px;background:var(--ink);color:#fff}.arrow:disabled{opacity:.2}.back{background:transparent;font-size:25px;color:#657360}.nest-area{position:relative;min-height:330px;display:flex;justify-content:space-around;align-items:center;gap:20px;background:#f3eedb;border-radius:28px;padding:25px}.bird-move{width:190px;height:190px;border-radius:50%;padding:0;touch-action:none;z-index:3;position:relative;box-shadow:0 5px 25px #39462a20}.bird-move.selected{outline:5px solid #d8b368}.nest{width:230px;height:210px;background:transparent;position:relative;border:3px dashed #c7ae80;border-radius:35px}.nest svg{width:100%;height:100%;pointer-events:none}.nest .art{position:absolute;width:135px;height:135px;left:calc(50% - 67px);top:2px;border-radius:50%}.demonstration{font-size:38px;color:#ab8d48;pointer-events:none}.nest-area.placed .bird-move{visibility:hidden}.bonus{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}.pet-portrait{position:relative;max-width:370px;margin:auto;width:100%;background:#fff7e3;border-radius:30px;overflow:hidden}.pet-portrait .art{width:100%}.ribbon{position:absolute;left:60%;top:36%;width:90px;height:65px;background:transparent;padding:0;min-width:0;min-height:0;transform:rotate(12deg)}.ribbon svg{width:100%;height:100%;fill:var(--ribbon,#e4ddca);stroke:#fff8e8;stroke-width:2}.ribbon.unpainted{animation:glow 1.5s infinite}.names{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-12)}.names button{border-radius:var(--radius-md);background:#fffaf0;border:2px solid #ded9c9;font-size:20px;padding:18px 10px}.names button[aria-pressed=true]{background:#d9e3cb;border-color:#718a60}.palette{display:flex;justify-content:center;gap:20px;margin-top:25px}.paint{width:65px;height:65px;border-radius:50%;border:6px solid #fff;box-shadow:0 0 0 2px #ded9c9}.paint[aria-pressed=true]{box-shadow:0 0 0 4px #42604b}.pet-name{text-align:center;font-size:28px;margin:10px;font-family:Georgia,serif}.parent-copy{max-width:650px;margin:30px auto;background:var(--paper);padding:40px;border-radius:25px}.parent-copy h1{font-size:44px}.parent-copy p{color:#536353}.finished{text-align:center}.finished .pet-portrait{max-width:240px}dialog{max-width:530px;width:calc(100% - 32px);border:0;border-radius:25px;background:var(--paper);color:var(--ink);padding:30px}dialog::backdrop{background:#17372c88}dialog button{border-radius:var(--radius-md);background:var(--ink);color:white;padding:10px 25px}.tiny{font-size:13px;color:#66765c}.finish-actions{display:flex;gap:var(--space-12);flex-wrap:wrap;justify-content:center}.finish-actions button{background:#e5e7d8;border-radius:var(--radius-md);padding:var(--space-12) var(--space-24)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@keyframes glow{50%{box-shadow:0 0 0 8px #dfbd6644}}@keyframes wave{to{height:30px}}@media(max-width:700px){main{padding:0 var(--space-12)}.intro{grid-template-columns:1fr;min-height:0}.intro-copy{padding:30px 25px}.forest{min-height:280px;grid-row:1}.owl-intro{width:115px;height:115px}.scene{padding:18px 14px;min-height:550px}.choices,.choices.four{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.choices:not(.four) .choice:last-child{grid-column:1/-1;max-width:calc(50% - 7px);width:100%;justify-self:center}.choice{padding:5px;border-radius:var(--radius-md)}.guide-row{margin-bottom:var(--space-16)}.guide-button{width:82px;height:82px}.bonus{grid-template-columns:1fr;gap:20px}.pet-portrait{max-width:230px}.nest-area{padding:10px;gap:var(--space-8);min-height:270px}.bird-move{width:115px;height:115px;flex-shrink:0}.nest{width:145px;height:175px}.nest .art{width:100px;height:100px;left:calc(50% - 50px);top:8px}.demonstration{font-size:23px}.parent-copy{padding:var(--space-24)}.ribbon{width:65px;height:48px}.trail{gap:5px}.trail i{width:18px}.foot{margin-top:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
.forest,.scene{isolation:isolate}.fireflies{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1;border-radius:inherit}.forest .fireflies{z-index:0}.fireflies i{position:absolute;left:var(--x);top:var(--y);width:5px;height:5px;border-radius:50%;background:#f5d780;box-shadow:0 0 9px 4px #f4d97955;animation:firefly var(--time) ease-in-out infinite alternate;animation-delay:var(--delay);opacity:.65}.scene .fireflies i{width:3px;height:3px;opacity:.4}.forest .owl-intro{z-index:1}@keyframes firefly{0%{transform:translate(0,0);opacity:.25}50%{opacity:.85}100%{transform:translate(22px,-35px);opacity:.35}}@media(prefers-reduced-motion:reduce){.fireflies{display:none}}
/* v36: a forest stage, transparent characters and foreground fireflies */
.art.cutout{background-size:contain;background-position:center!important;background-repeat:no-repeat}
.owl-intro{width:260px;height:290px;left:24px;bottom:28px;border-radius:0;box-shadow:none;filter:drop-shadow(0 12px 12px #18332450)}
.owl-intro .art{height:100%;aspect-ratio:auto}
.scene{background:linear-gradient(#18352518,#10291c35),url('pet-art/forest.png') center/cover;border:1px solid #77866b;overflow:hidden;padding-top:28px}
.choices{max-width:930px;padding:var(--space-24);background:#fffaf0d9;backdrop-filter:blur(9px);border:1px solid #fff8;border-radius:30px;box-shadow:0 18px 50px #14271935}
.choice{background:#fff8e6;box-shadow:0 5px 0 #cfc7ab}.choice.small-animal{background:#fff8e6}
.guide-row{background:#fffaf0de;border:1px solid #fff8;border-radius:70px;width:max-content;max-width:100%;padding:var(--space-8) 22px var(--space-8) var(--space-8);margin:0 auto var(--space-24);backdrop-filter:blur(8px)}
.guide-button{background:transparent;border-color:#d3bf89;overflow:visible}.guide-button .art{border-radius:0}
.trail{filter:drop-shadow(0 2px 3px #173622)}.trail i{background:#fff9}.trail i.done{background:#b9d096}.trail i.current{background:#f9d880}
.foot{background:#fffaf0d9;border-radius:45px;padding:6px 10px;backdrop-filter:blur(8px)}
.bonus{background:#fffaf0dd;border:1px solid #fff8;border-radius:28px;padding:var(--space-24);backdrop-filter:blur(8px)}
.pet-portrait{background:transparent;overflow:visible}.pet-portrait .art{background-color:transparent}.bird-move{background:transparent;box-shadow:none}.nest-area{background:#fffaf0b8;backdrop-filter:blur(7px)}
.finished{background:#fffaf0e8;border-radius:28px;padding:25px}.finished .ribbon{pointer-events:none}
.fireflies,.forest .fireflies{z-index:10;pointer-events:none!important}.fireflies i,.scene .fireflies i{width:var(--size);height:var(--size);background:#ffdf77;box-shadow:0 0 5px 2px #ffd455b0,0 0 17px 5px #efb94360;opacity:.8;animation:golden-flight var(--time) ease-in-out infinite alternate;animation-delay:var(--delay)}
@keyframes golden-flight{0%{transform:translate3d(0,12px,0);opacity:.48}35%{transform:translate3d(calc(var(--drift)*.4),-22px,0);opacity:.95}70%{transform:translate3d(calc(var(--drift)*.75),8px,0);opacity:.65}100%{transform:translate3d(var(--drift),-60px,0);opacity:.8}}
@media(max-width:700px){.owl-intro{width:180px;height:210px;bottom:16px;left:20px}.choices{padding:var(--space-12);gap:var(--space-12);border-radius:22px}.bonus{padding:14px}.scene{padding:18px var(--space-12)}.guide-row{padding:5px 15px 5px 5px}.choices:not(.four) .choice:last-child{max-width:calc(50% - 6px)}.scene .fireflies i:nth-child(3n){width:3px;height:3px}}
@media(prefers-reduced-motion:reduce){.fireflies{display:none}}