/* Animal Explorer / Hayvan Kâşifi. Builds on the Kids design system v3 tokens in kids-product.css. Accent: mint. */
#kids-animals{
 --ae-mint:var(--k-mint,#62e3ab);--ae-mint-d:#2fb87d;
 --ae-paper:#fffaf0;--ae-paper-edge:#ead9b4;--ae-ink:#1d2246;--ae-ink-2:#4a5180;
 --ae-tile:#fbfbff;--ae-tile-edge:#d3d9f2;--ae-frame:#0a1031
}
.ae-stage{position:relative}
.ae-vh,.ae-live{position:absolute!important;width:1px;height:1px;margin:-1px!important;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;min-height:0!important}
.ae-print{display:none}
.ae-pic{display:block;width:100%;height:100%;overflow:visible}
.ae-scene{display:block;width:100%;height:100%}
.ae-stage button{font-family:inherit;-webkit-tap-highlight-color:transparent}
.ae-stage button:focus-visible,.ae-panel:focus-visible,.ae-win:focus-visible{outline:4px solid var(--k-gold,#f6c96c);outline-offset:3px}
.ae-panel:focus:not(:focus-visible),.ae-win:focus:not(:focus-visible){outline:none}
.ae-stage .kg-toolbar{margin-bottom:14px}

/* ---------- Tabs ---------- */
.ae-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:6px;margin-bottom:20px;border-radius:24px;background:var(--k-bg-2,#0c1234);border:1px solid var(--k-line-soft,#1f2a62)}
.ae-tab{display:flex;align-items:center;justify-content:center;gap:10px;min-height:60px;padding:8px 12px;border:0;border-radius:18px;background:transparent;color:var(--k-ink-2,#d5dbf5);font:800 1rem/1.15 "Manrope",Inter,sans-serif;cursor:pointer;text-align:left;transition:background .15s,color .15s}
.ae-tab svg{flex:none;width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ae-tab span{min-width:0;overflow-wrap:break-word}
.ae-tab:hover{background:var(--k-surface-2,#172154)}
.ae-tab[aria-selected="true"]{background:linear-gradient(135deg,var(--ae-mint),#3dd5f3);color:#05261a;box-shadow:0 8px 20px rgba(98,227,171,.25)}
.ae-tab-stickers svg{fill:currentColor;stroke-width:1}
@keyframes ae-bump{0%{transform:scale(1)}40%{transform:scale(1.08)}100%{transform:scale(1)}}
.ae-bump{animation:ae-bump .5s ease}
.ae-panel[hidden]{display:none}

/* ---------- Field guide ---------- */
.ae-guide{display:grid;grid-template-columns:minmax(300px,400px) minmax(0,1fr);gap:24px;align-items:start}
.ae-card-col{position:sticky;top:84px}
.ae-card{perspective:1400px}
.ae-card-inner{display:grid;transition:transform .55s cubic-bezier(.3,.8,.3,1);transform-style:preserve-3d}
.ae-flipped .ae-card-inner{transform:rotateY(180deg)}
.ae-face{grid-area:1/1;min-width:0;display:flex;flex-direction:column;padding:16px 16px 18px;border-radius:26px;background:var(--ae-paper);color:var(--ae-ink);box-shadow:inset 0 -7px 0 var(--ae-paper-edge),0 18px 40px rgba(2,4,20,.45);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.ae-back{transform:rotateY(180deg)}
@keyframes ae-turn{0%{transform:rotateY(-90deg)}100%{transform:rotateY(0)}}
.ae-turn .ae-card-inner{animation:ae-turn .45s cubic-bezier(.3,.9,.3,1.1)}
.ae-card-art{position:relative;aspect-ratio:16/10;border-radius:18px;overflow:hidden;background:#cfeeff}
.ae-card-scene{position:absolute;inset:0}
.ae-card-pic{position:absolute;left:50%;top:52%;width:52%;aspect-ratio:1;transform:translate(-50%,-50%);padding:5%;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 8px 20px rgba(13,19,51,.25);box-sizing:border-box}
.ae-card-class{align-self:flex-start;margin:14px 0 0!important;padding:5px 12px;border-radius:999px;font:800 .78rem/1.1 "Manrope",Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase;background:#e4f9ef;color:#0d6b45!important}
.ae-card-class[data-cls="bird"]{background:#e3f0ff;color:#1f5fa8!important}
.ae-card-class[data-cls="fish"]{background:#dff6fb;color:#0f6d80!important}
.ae-card-class[data-cls="reptile"]{background:#eef8d9;color:#4f6b12!important}
.ae-card-class[data-cls="amphibian"]{background:#f1e9ff;color:#5b3fb0!important}
.ae-card-class[data-cls="insect"]{background:#fff0d6;color:#8a5200!important}
.ae-stage .ae-face h3{margin:6px 0 10px!important;font:800 clamp(1.6rem,3vw,2rem)/1.1 "Manrope",Inter,sans-serif;color:var(--ae-ink)!important;letter-spacing:-.02em;overflow-wrap:anywhere}
.ae-rows{margin:0 0 14px;display:grid;gap:0}
.ae-row{display:grid;grid-template-columns:minmax(0,8.5em) minmax(0,1fr);gap:4px 10px;padding:8px 0;border-top:1.5px dashed #e3d3ad}
.ae-row dt{font:800 .76rem/1.4 "Manrope",Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#8a6a2c}
.ae-row dd{margin:0;font-weight:700;font-size:.98rem;line-height:1.35;color:var(--ae-ink)!important;overflow-wrap:break-word}
.ae-flip,.ae-unflip{margin-top:auto;align-self:stretch}
.ae-back-head{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.ae-back-pic{flex:none;width:72px;height:72px;padding:6px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 3px var(--ae-paper-edge);box-sizing:border-box}
.ae-stage .ae-back-title{margin:0!important;font:800 1.4rem/1.2 "Manrope",Inter,sans-serif;color:var(--ae-ink)!important}
.ae-facts{list-style:none;margin:6px 0 18px;padding:0;display:grid;gap:12px;counter-reset:fact}
.ae-stage .ae-facts li{position:relative;padding:14px 14px 14px 52px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 2px #f0e3c4;color:var(--ae-ink)!important;font-weight:700;font-size:1.04rem;line-height:1.45;counter-increment:fact}
.ae-facts li:before{content:counter(fact);position:absolute;left:12px;top:12px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--k-gold,#f6c96c);color:#3a2805;font:800 .95rem/1 "Manrope",Inter,sans-serif}
.ae-card-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:14px}
.ae-nav-btn{width:52px;height:52px;border-radius:50%;border:2px solid var(--k-line,#2a3678);background:var(--k-surface-2,#172154);color:var(--k-ink,#f4f6ff);display:grid;place-items:center;cursor:pointer}
.ae-nav-btn:hover{border-color:var(--ae-mint)}
.ae-nav-btn svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.ae-card-count{min-width:5.5em;text-align:center;font:800 .95rem/1 "Manrope",Inter,sans-serif;color:var(--k-muted,#aab3da)}

.ae-filter{margin-bottom:12px}
.ae-stage .ae-filter-label{margin:0 0 6px!important;font:800 .78rem/1.2 "Manrope",Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--k-gold,#f6c96c)!important}
.ae-chips{display:flex;flex-wrap:wrap;gap:6px}
.ae-chip{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:6px 14px;border-radius:999px;border:2px solid var(--k-line,#2a3678);background:var(--k-surface-2,#172154);color:var(--k-ink-2,#d5dbf5);font:800 .9rem/1.1 "Manrope",Inter,sans-serif;cursor:pointer}
.ae-chip:hover{border-color:#3b4a9a}
.ae-chip[aria-pressed="true"]{background:var(--ae-mint);border-color:var(--ae-mint);color:#05261a}
.ae-dot{width:12px;height:12px;border-radius:50%;flex:none;box-shadow:0 0 0 2px rgba(255,255,255,.35)}
.ae-chip-ocean .ae-dot{background:#4aa3ff}.ae-chip-forest .ae-dot{background:#3fae74}.ae-chip-desert .ae-dot{background:#f4c76b}.ae-chip-polar .ae-dot{background:#dff3ff}.ae-chip-savanna .ae-dot{background:#f0a85a}.ae-chip-farm .ae-dot{background:#ef6f5e}.ae-chip-jungle .ae-dot{background:#2f9e5a}.ae-chip-river .ae-dot{background:#3dd5f3}.ae-chip-mountains .ae-dot{background:#a594ff}
.ae-count{margin:6px 0 12px!important}
.ae-count span{font-weight:800;color:var(--k-ink,#f4f6ff)}
.ae-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px}
.ae-tile{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;min-height:56px;padding:10px 6px 8px;border:0;border-radius:20px;background:var(--ae-tile);box-shadow:inset 0 -5px 0 var(--ae-tile-edge),0 6px 14px rgba(2,4,20,.3);color:var(--ae-ink);cursor:pointer;transition:transform .15s ease,box-shadow .15s}
.ae-tile[hidden]{display:none}
.ae-tile:hover{transform:translateY(-3px);box-shadow:inset 0 -5px 0 var(--ae-tile-edge),0 0 0 4px rgba(98,227,171,.45),0 10px 20px rgba(2,4,20,.35)}
.ae-tile[aria-pressed="true"]{background:#effff7;box-shadow:inset 0 -5px 0 #bdeed6,0 0 0 4px var(--ae-mint),0 10px 24px rgba(98,227,171,.3)}
.ae-tile-art{display:block;width:100%;max-width:84px;aspect-ratio:1}
.ae-tile-name{font:800 .84rem/1.15 "Manrope",Inter,sans-serif;text-align:center;color:#2a3370;overflow-wrap:anywhere}
.ae-empty{padding:18px;border-radius:18px;background:var(--k-bg-2,#0c1234);border:1px dashed #3a4588;font-weight:700;text-align:center}

/* ---------- Shared board pieces ---------- */
.ae-levels{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,9rem),1fr));border-radius:22px!important;margin-bottom:16px}
.ae-levels button{display:flex;align-items:center;justify-content:center;gap:9px;min-height:52px!important;padding:6px 12px!important;border-radius:17px!important;text-align:left;line-height:1.15;cursor:pointer}
.ae-lv-num{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--k-surface-2,#172154);color:var(--ae-mint);font:900 .95rem/1 "Manrope",Inter,sans-serif;box-shadow:inset 0 0 0 2px #2c3a86}
.ae-levels button[aria-pressed="true"] .ae-lv-num{background:var(--ae-mint);color:#06271a;box-shadow:none}
.ae-lv-text{min-width:0;overflow-wrap:break-word}
.ae-board{padding:clamp(14px,2.6vw,24px);border-radius:26px;background:radial-gradient(120% 90% at 50% 0%,#18245e 0,var(--ae-frame) 70%);border:2px solid #2a3986}
.ae-board[hidden]{display:none}
.ae-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-bottom:12px}
.ae-head-text{font:800 .95rem/1.2 "Manrope",Inter,sans-serif;color:var(--k-ink,#f4f6ff)}
.ae-head-left{margin-left:auto;font:800 .82rem/1 "Manrope",Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ae-mint);background:rgba(98,227,171,.12);border:1px solid rgba(98,227,171,.35);border-radius:999px;padding:7px 12px}
.ae-progress{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.ae-progress li{width:14px;height:14px;margin:0;border-radius:50%;background:#1b2560;box-shadow:inset 0 0 0 2px #2f3d8c;transition:transform .2s ease,background .2s}
.ae-progress li.ae-p-now{background:transparent;box-shadow:inset 0 0 0 3px var(--ae-mint);transform:scale(1.2)}
.ae-progress li.ae-p-done{background:var(--k-sky,#7cbcff);box-shadow:none}
.ae-progress li.ae-p-star{background:var(--k-gold,#f6c96c);box-shadow:0 0 8px rgba(246,201,108,.6)}
.ae-stage .ae-howline{margin:0 0 12px!important;color:var(--k-muted,#aab3da)!important;font-weight:700}
.ae-key{display:inline-grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;background:#e6eaf8;color:#4a5490;font:800 .8rem/1 "Manrope",Inter,sans-serif}

.ae-feedback{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin-top:18px}
.ae-say{min-width:0;flex:1 1 320px;display:flex;align-items:flex-start;gap:14px;padding:14px 18px;border-radius:20px;background:var(--k-bg-2,#0c1234);border:2px solid var(--k-line-soft,#1f2a62);min-height:3.6em;transition:border-color .2s,background .2s}
.ae-stage .ae-say p{margin:0!important;min-width:0;overflow-wrap:break-word;font:800 1.08rem/1.45 "Manrope",Inter,sans-serif;color:var(--k-ink,#f4f6ff)!important}
.ae-mood{flex:none;width:44px;height:44px}
.ae-mood svg{display:block;width:100%;height:100%}
.ae-mood-bg{fill:var(--k-sky,#7cbcff)}
.ae-mood-eye{fill:#0b1030}
.ae-mood-mouth{fill:none;stroke:#0b1030;stroke-width:2.6;stroke-linecap:round}
.ae-say[data-tone="yes"]{border-color:var(--ae-mint);background:linear-gradient(135deg,rgba(98,227,171,.16),rgba(12,18,52,.9))}
.ae-say[data-tone="yes"] .ae-mood-bg{fill:var(--ae-mint)}
.ae-say[data-tone="hint"]{border-color:#8a7440;background:linear-gradient(135deg,rgba(246,201,108,.13),rgba(12,18,52,.9))}
.ae-say[data-tone="hint"] .ae-mood-bg{fill:var(--k-gold,#f6c96c)}
.ae-say[data-tone="reveal"]{border-color:var(--k-violet,#a594ff);background:linear-gradient(135deg,rgba(165,148,255,.16),rgba(12,18,52,.9))}
.ae-say[data-tone="reveal"] .ae-mood-bg{fill:var(--k-violet,#a594ff)}
.ae-next{flex:0 0 auto;min-width:180px;min-height:60px!important;font-size:1.1rem}
.ae-next[hidden]{display:none}

@keyframes ae-deal{0%{opacity:0;transform:translateY(14px) scale(.94)}100%{opacity:1;transform:none}}
@keyframes ae-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
@keyframes ae-pop{0%{transform:scale(.4) rotate(-30deg)}70%{transform:scale(1.18) rotate(6deg)}100%{transform:scale(1)}}
.ae-deal{animation:ae-deal .38s cubic-bezier(.2,.9,.3,1.2) both}
.ae-shake{animation:ae-shake .42s ease}
.ae-nudge{animation:ae-bump .5s ease}

/* ---------- Habitat sort ---------- */
.ae-tray{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;min-height:120px;padding:12px;margin-bottom:16px;border-radius:22px;background:rgba(255,255,255,.04);border:2px dashed #34428f}
.ae-token{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;width:108px;min-height:56px;padding:8px 6px 6px;border:0;border-radius:20px;background:var(--ae-tile);box-shadow:inset 0 -5px 0 var(--ae-tile-edge),0 6px 14px rgba(2,4,20,.35);color:var(--ae-ink);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;transition:transform .15s,box-shadow .15s}
.ae-token:hover{transform:translateY(-3px)}
.ae-token[aria-pressed="true"]{transform:translateY(-6px) scale(1.04);background:#effff7;box-shadow:inset 0 -5px 0 #bdeed6,0 0 0 5px var(--ae-mint),0 14px 28px rgba(98,227,171,.35)}
.ae-token.ae-lifted{opacity:.35}
.ae-token-art{display:block;width:72px;height:72px;pointer-events:none}
.ae-token-name{font:800 .8rem/1.15 "Manrope",Inter,sans-serif;text-align:center;color:#2a3370;overflow-wrap:anywhere;pointer-events:none}
.ae-ghost{position:fixed;left:0;top:0;z-index:60;width:88px;height:88px;padding:8px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px var(--ae-mint),0 16px 30px rgba(2,4,20,.5);transform:translate(-50%,-60%) rotate(-6deg);pointer-events:none;box-sizing:border-box}
.ae-zones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ae-z4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ae-z5{grid-template-columns:repeat(5,minmax(0,1fr))}
.ae-zone{position:relative;display:flex;flex-direction:column;min-width:0;min-height:56px;padding:0;border:3px solid #2f3d8c;border-radius:22px;background:#111a4a;color:var(--k-ink,#f4f6ff);overflow:hidden;cursor:pointer;text-align:left;transition:border-color .15s,box-shadow .15s,transform .15s}
.ae-zone-scene{display:block;aspect-ratio:16/9;width:100%;min-height:0;overflow:hidden}
.ae-zone-label{display:flex;align-items:center;gap:8px;padding:8px 10px;font:800 .98rem/1.15 "Manrope",Inter,sans-serif;background:rgba(7,11,33,.85);overflow-wrap:anywhere;min-width:0}
.ae-zone-list{display:flex;flex-wrap:wrap;gap:4px;min-height:58px;padding:6px 8px 8px;align-content:flex-start}
.ae-zone-list .ae-placed{width:46px;height:46px;padding:4px;border-radius:50%;background:#fff;box-sizing:border-box;animation:ae-pop .4s cubic-bezier(.2,.9,.3,1.3)}
.ae-armed .ae-zone{border-style:dashed;border-color:#5466c0}
.ae-zone:hover,.ae-zone.ae-over{border-color:var(--ae-mint);border-style:solid;transform:translateY(-3px);box-shadow:0 0 0 4px rgba(98,227,171,.3)}
.ae-zone.ae-glow{border-color:var(--k-gold,#f6c96c);border-style:solid;box-shadow:0 0 0 5px rgba(246,201,108,.35),0 0 28px rgba(246,201,108,.4)}
@keyframes ae-yes{0%{box-shadow:0 0 0 0 rgba(98,227,171,.8)}100%{box-shadow:0 0 0 18px rgba(98,227,171,0)}}
.ae-zone.ae-yes{animation:ae-yes .6s ease-out;border-color:var(--ae-mint)}

/* ---------- Quiz ---------- */
.ae-stage .ae-question{display:flex;align-items:center;gap:12px;margin:4px 0 18px!important;font:800 clamp(1.3rem,2.6vw,1.75rem)/1.25 "Manrope",Inter,sans-serif;color:var(--k-ink,#f4f6ff)!important;overflow-wrap:break-word}
.ae-question:before{content:"?";flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,var(--ae-mint),#3dd5f3);color:#05261a;font-size:1.4rem}
.ae-options{--cols:3;--gap:clamp(10px,1.8vw,18px);display:flex;flex-wrap:wrap;justify-content:center;gap:var(--gap);max-width:760px;margin:0 auto}
.ae-n4{--cols:4;max-width:880px}
.ae-opt{position:relative;flex:0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));min-width:0;min-height:56px;display:flex;flex-direction:column;align-items:center;padding:12px 10px 10px;border:0;border-radius:22px;background:var(--ae-tile);box-shadow:inset 0 -6px 0 var(--ae-tile-edge),0 8px 18px rgba(2,4,20,.35);color:var(--ae-ink);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,opacity .2s}
.ae-opt:hover{transform:translateY(-3px);box-shadow:inset 0 -6px 0 var(--ae-tile-edge),0 0 0 4px rgba(98,227,171,.45),0 12px 24px rgba(2,4,20,.4)}
.ae-opt .ae-key{position:absolute;top:8px;left:9px}
.ae-opt-art{display:block;width:100%;max-width:160px;aspect-ratio:1}
.ae-opt-name{margin-top:4px;font:800 clamp(13px,.95rem,17px)/1.2 "Manrope",Inter,sans-serif;color:#2a3370;text-align:center;overflow-wrap:anywhere}
.ae-opt.ae-nope{opacity:.5;background:#eef0f8;cursor:default}
.ae-opt.ae-nope:hover,.ae-opt.ae-other:hover,.ae-opt.ae-right:hover{transform:none}
.ae-opt.ae-other{opacity:.6;cursor:default}
.ae-opt.ae-right{cursor:default;background:#f2fff8;box-shadow:inset 0 -6px 0 #bdeed6,0 0 0 5px var(--ae-mint),0 0 30px rgba(98,227,171,.55);transform:translateY(-4px)}
.ae-opt.ae-right .ae-key{background:var(--ae-mint);color:#06271a}
.ae-check{position:absolute;top:-12px;right:-10px;width:40px;height:40px;padding:7px;border-radius:50%;background:var(--ae-mint);fill:none;stroke:#06271a;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;box-shadow:0 0 0 4px var(--ae-frame);box-sizing:border-box;animation:ae-pop .45s cubic-bezier(.2,.9,.3,1.3)}

/* ---------- Win ---------- */
.ae-win{position:relative;overflow:hidden;padding:34px 20px!important}
.ae-win h3,.ae-win p,.ae-win .kg-stars{position:relative}
.ae-win p{max-width:520px}
.ae-win-actions{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.ae-win-actions .kp-button{flex:0 1 240px}
.ae-win-actions .kp-button[hidden]{display:none}
.ae-star{width:60px;height:60px;fill:#2c3770;stroke:#4a568f;stroke-width:1;stroke-linejoin:round}
.ae-star-on{fill:var(--k-gold,#f6c96c);stroke:#c79a3a;filter:drop-shadow(0 4px 10px rgba(246,201,108,.45))}
@keyframes ae-star{0%{transform:scale(0) rotate(-40deg)}70%{transform:scale(1.2) rotate(8deg)}100%{transform:scale(1) rotate(0)}}
.ae-win:not([hidden]) .ae-star{animation:ae-star .5s cubic-bezier(.2,.9,.3,1.3) both}
.ae-win:not([hidden]) .ae-star:nth-child(2){animation-delay:.15s}
.ae-win:not([hidden]) .ae-star:nth-child(3){animation-delay:.3s}
.ae-confetti{position:absolute;inset:0;pointer-events:none}
.ae-bit{position:absolute;top:-14px;width:10px;height:14px;border-radius:3px;opacity:0}
.ae-bit:nth-child(4n+1){background:var(--ae-mint)}.ae-bit:nth-child(4n+2){background:var(--k-gold,#f6c96c)}.ae-bit:nth-child(4n+3){background:var(--k-coral,#ff8f7f)}.ae-bit:nth-child(4n){background:var(--k-sky,#7cbcff);border-radius:50%}
.ae-bit-0{left:5%}.ae-bit-1{left:13%}.ae-bit-2{left:21%}.ae-bit-3{left:30%}.ae-bit-4{left:38%}.ae-bit-5{left:46%}.ae-bit-6{left:54%}.ae-bit-7{left:62%}.ae-bit-8{left:70%}.ae-bit-9{left:79%}.ae-bit-10{left:87%}.ae-bit-11{left:95%}
@keyframes ae-fall{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(280px) rotate(540deg);opacity:0}}
.ae-win:not([hidden]) .ae-bit{animation:ae-fall 1.9s ease-in both}
.ae-win:not([hidden]) .ae-bit:nth-child(3n+1){animation-delay:.2s;animation-duration:2.2s}
.ae-win:not([hidden]) .ae-bit:nth-child(3n+2){animation-delay:.45s;animation-duration:1.7s}

/* ---------- Sticker book ---------- */
.ae-book-head{padding:18px 20px;border-radius:22px;background:linear-gradient(135deg,rgba(246,201,108,.14),rgba(98,227,171,.1));border:1px solid #5e5030;margin-bottom:16px}
.ae-stage .ae-book-head h3{overflow-wrap:anywhere;margin:0 0 4px!important;font:800 1.4rem/1.2 "Manrope",Inter,sans-serif}
.ae-book-head p{margin:0 0 12px!important}
.ae-meter{height:14px;border-radius:999px;background:var(--k-bg-2,#0c1234);box-shadow:inset 0 0 0 2px #2f3d8c;overflow:hidden}
.ae-meter span{display:block;width:0;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--ae-mint),var(--k-gold,#f6c96c));transition:width .4s ease}
.ae-book-empty{margin:0 0 14px!important;font-weight:700;color:var(--k-ink-2,#d5dbf5)}
.ae-book-empty[hidden]{display:none}
.ae-stickers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:14px}
.ae-sticker{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0;min-width:0}
.ae-sticker-art{display:block;width:88px;height:88px;padding:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px #fff,0 0 0 6px var(--ae-mint),0 8px 16px rgba(2,4,20,.4);box-sizing:border-box;transform:rotate(-4deg)}
.ae-sticker:nth-child(even) .ae-sticker-art{transform:rotate(5deg)}
.ae-sticker-name{font:800 .82rem/1.15 "Manrope",Inter,sans-serif;text-align:center;color:var(--k-ink,#f4f6ff);overflow-wrap:anywhere}
.ae-locked .ae-sticker-art{background:transparent;box-shadow:inset 0 0 0 3px #2c3a86;transform:none!important}
.ae-locked .ae-sticker-art svg{filter:brightness(0) invert(.6);opacity:.16}
.ae-locked .ae-sticker-name{color:var(--k-muted,#aab3da);font-weight:700}
@keyframes ae-stick{0%{transform:scale(.3) rotate(-30deg)}70%{transform:scale(1.15) rotate(6deg)}100%{transform:scale(1) rotate(-4deg)}}
.ae-new .ae-sticker-art{animation:ae-stick .6s cubic-bezier(.2,.9,.3,1.3)}

/* ---------- Actions, how to play ---------- */
.ae-actions{justify-content:center}
.ae-actions .kp-button{display:inline-flex;align-items:center;justify-content:center;gap:9px}
.ae-actions svg{flex:none;width:1.3em;height:1.3em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ae-howto{margin-top:22px;padding:clamp(18px,3vw,30px);border-radius:28px;background:var(--k-surface,#111944);border:1px solid var(--k-line-soft,#1f2a62)}
.ae-howto h2{margin:0 0 16px!important;font-size:1.35rem!important}
.ae-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.ae-steps li{margin:0;padding:16px;border-radius:20px;background:var(--k-bg-2,#0c1234);border:1px solid var(--k-line-soft,#1f2a62);font-size:.95rem}
.ae-steps strong{display:block;margin:10px 0 4px;color:var(--k-ink,#f4f6ff);font-family:"Manrope",Inter,sans-serif;font-size:1.05rem}
.ae-step-pic{display:block;width:64px;height:64px;padding:7px;border-radius:18px;background:var(--ae-tile);box-sizing:border-box;overflow:hidden}
.ae-step-pic .ae-scene{border-radius:12px}
.ae-step-pic:has(.ae-scene){padding:0;width:96px}
.ae-step-star svg{width:100%;height:100%;fill:var(--k-gold,#f6c96c);stroke:#c79a3a;stroke-width:1}

/* ---------- Responsive ---------- */
@media(max-width:1100px){.ae-z5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:980px){.ae-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){
 .ae-guide{grid-template-columns:minmax(0,1fr)}
 .ae-card-col{position:static;max-width:460px;width:100%;margin:0 auto}
 .ae-z4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
 .ae-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ae-zones,.ae-z5{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ae-n4{--cols:2;max-width:440px}
}
@media(max-width:560px){
 .ae-tab{flex-direction:column;gap:4px;text-align:center;font-size:.88rem;padding:8px 6px}
 .ae-grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}
 .ae-tile-art{max-width:64px}
 .ae-token{width:92px}
 .ae-token-art{width:60px;height:60px}
 .ae-n3{--cols:3}
 .ae-opt{padding:10px 6px 8px;border-radius:18px}
 .ae-opt .ae-key{width:22px;height:22px;font-size:.72rem;top:6px;left:7px}
 .ae-check{width:34px;height:34px;padding:6px;top:-10px;right:-8px}
 .ae-feedback{flex-direction:column;align-items:stretch}
 .ae-say{flex-basis:auto}
 .ae-next{width:100%}
 .ae-mood{width:36px;height:36px}
 .ae-stage .ae-say p{font-size:1rem}
 .ae-steps{grid-template-columns:1fr}
 .ae-row{grid-template-columns:1fr;gap:2px}
 .ae-stickers{grid-template-columns:repeat(auto-fill,minmax(min(84px,100%),1fr))}
 .ae-sticker-art{width:72px;height:72px;padding:8px}
}
@media(max-width:400px){
 .ae-board{padding:12px 10px;border-radius:20px;margin-inline:-4px}
 .ae-mood{display:none}
 .ae-n3{--cols:2;max-width:320px}
 .ae-tray{padding:8px;gap:8px}
 .ae-levels button{gap:6px;padding:6px 8px!important}
 .ae-chip{padding:6px 11px;font-size:.84rem}
 .ae-front,.ae-back{padding:12px}
}
@media(prefers-reduced-motion:reduce){
 .ae-card-inner{transition:none!important}
 .ae-turn .ae-card-inner,.ae-deal,.ae-shake,.ae-nudge,.ae-bump,.ae-check,.ae-zone.ae-yes,.ae-zone-list .ae-placed,.ae-new .ae-sticker-art,.ae-win:not([hidden]) .ae-star{animation:none!important}
 .ae-tile,.ae-token,.ae-opt,.ae-zone,.ae-progress li,.ae-meter span{transition:none!important}
 .ae-tile:hover,.ae-token:hover,.ae-token[aria-pressed="true"],.ae-opt:hover,.ae-opt.ae-right,.ae-zone:hover,.ae-zone.ae-over{transform:none!important}
 .ae-confetti{display:none}
}

/* ---------- Print: a blank fact card or a habitat colouring sheet, black and white, A4 ---------- */
@media print{
 @page{size:A4;margin:12mm}
 .kp-header,.kp-footer,.kids-skip,.kp-back,.kg-hero,.kg-toolbar,.ae-tabs,.ae-panel,.ae-actions,.ae-howto,.kg-grownups,.ae-live{display:none!important}
 .kg-stage.ae-stage{background:#fff!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important}
 .ae-stage[data-print="card"] .ae-print-card,.ae-stage[data-print="colour"] .ae-print-colour{display:block;color:#000}
 .ae-print p{color:#000!important;margin:0}
 .ae-pt{font:800 24pt/1.2 "Manrope",Inter,sans-serif;text-align:center;margin:0 0 5mm!important}
 .ae-pc-grid{display:grid;grid-template-columns:70mm 1fr;gap:6mm;margin-bottom:5mm}
 .ae-pc-draw{height:80mm;border:.6mm dashed #000;border-radius:5mm;display:flex;align-items:flex-end;justify-content:center;padding:3mm;box-sizing:border-box;font-size:10pt;color:#444}
 .ae-pc-fields{display:grid;gap:3mm;align-content:start}
 .ae-pc-q{font-size:11.5pt;line-height:1.9}
 .ae-box{display:inline-flex;align-items:center;gap:1.5mm;margin-right:3mm;white-space:nowrap}
 .ae-box:before{content:"";width:3.6mm;height:3.6mm;border:.4mm solid #000;border-radius:.8mm}
 .ae-pc-line{min-height:11mm;border-bottom:.4mm solid #000;font-size:12pt;padding-top:3mm;box-sizing:border-box;margin-bottom:2mm!important}
 .ae-pc-tall{min-height:14mm}
 .ae-pc-foot{margin-top:6mm!important;font-size:8pt;color:#555!important;text-align:right}
 .ae-pc-ask{text-align:center;font-size:12pt;margin-bottom:4mm!important}
 .ae-colour-scene{height:110mm;border:.5mm solid #000;border-radius:4mm;overflow:hidden}
 .ae-colour-scene svg{width:100%;height:100%}
 .ae-colour-bg *{fill:#fff!important;stroke:#000;stroke-width:.5px}
 .ae-colour-bg rect:first-child{stroke:none}
 .ae-colour-animals{list-style:none;margin:6mm 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:4mm}
 .ae-colour-animals li{display:flex;flex-direction:column;align-items:center;gap:2mm;font-size:10pt;break-inside:avoid}
 .ae-colour-animals svg{width:40mm;height:40mm}
 .ae-colour-animals svg [fill]:not([fill="#1d2246"]):not([fill="none"]){fill:#fff!important}
 .ae-colour-animals svg [opacity]{display:none}
 .ae-colour-animals svg [stroke]:not([stroke="#1d2246"]):not([stroke="none"]){stroke:#fff!important}
}
@media(max-width:560px){
 .ae-levels{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:4px!important}
 .ae-levels button{flex-direction:column;gap:3px;padding:6px 4px!important;text-align:center;font-size:.8rem}
 .ae-lv-num{width:26px;height:26px;font-size:.85rem}
}
@media(max-width:400px){.ae-book-head{padding:14px 12px}.ae-zones{gap:8px}.ae-zone-label{font-size:.88rem;padding:6px 8px;gap:6px}.ae-zone-list .ae-placed{width:38px;height:38px}.ae-zone-list{min-height:50px}}
@media(max-width:340px){.ae-zones,.ae-z4,.ae-z5{grid-template-columns:1fr}.ae-zone-scene{aspect-ratio:16/6}}
.ae-tray:empty{display:none}