[hidden]{display:none!important}
:root{--ink:#14233f;--teal:#137f79;--leaf:#3c8a49;--sun:#ffd66f;--coral:#ef6674;--paper:#fffdf7}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{color:var(--ink);background:#eef6ed;font-family:Arial,Helvetica,sans-serif}button,input{font:inherit}button{cursor:pointer}.birdExperience{min-height:100svh}.topbar{position:relative;z-index:30;display:flex;height:72px;align-items:center;gap:12px;padding:0 clamp(15px,4vw,56px);border-bottom:1px solid rgba(20,35,63,.12);background:rgba(255,255,255,.95);box-shadow:0 4px 20px rgba(24,60,44,.08)}.brandMark{display:grid;width:42px;height:42px;place-items:center;border-radius:14px;color:#fff;background:linear-gradient(145deg,#ef7180,#e94c64);box-shadow:0 7px 18px rgba(239,102,116,.3);font-family:Georgia,serif;font-size:26px;font-weight:900}.brandText p{margin:0 0 2px;color:#648178;font-size:10px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.brandText h1{margin:0;font-family:Georgia,serif;font-size:20px;line-height:1}.storyLink{margin-left:auto;padding:8px 14px;border-radius:999px;color:#08726d;background:#e6f5f0;text-decoration:none;font-size:12px;font-weight:900;transition:transform .18s,box-shadow .18s}.storyLink:hover,.storyLink:focus-visible{transform:translateY(-1px);outline:2px solid rgba(19,127,121,.25);outline-offset:2px;box-shadow:0 6px 16px rgba(19,127,121,.16)}.birdStage{position:relative;isolation:isolate;min-height:calc(100svh - 72px);overflow:hidden;background:#79c9ed}.stageBackground,.stageBackground img{position:absolute;z-index:-4;inset:0;width:100%;height:100%}.stageBackground img{object-fit:cover;object-position:center}.birdStage::after{position:absolute;z-index:-2;inset:0;content:"";pointer-events:none;background:linear-gradient(180deg,rgba(13,43,54,.04),transparent 40%,rgba(13,42,31,.2))}.nightShade{position:absolute;z-index:-1;inset:0;opacity:0;pointer-events:none;background:linear-gradient(180deg,rgba(7,17,59,.72),rgba(15,32,63,.56) 54%,rgba(8,28,34,.68));transition:opacity 1s}.nightShade::before{position:absolute;top:58px;right:9%;width:72px;height:72px;border-radius:50%;content:"";background:#fff4c4;box-shadow:0 0 34px rgba(255,244,196,.7)}.nightShade i{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 8px #fff}.nightShade i:nth-child(1){top:13%;left:13%}.nightShade i:nth-child(2){top:21%;left:34%}.nightShade i:nth-child(3){top:12%;left:60%}.nightShade i:nth-child(4){top:29%;left:76%}.nightShade i:nth-child(5){top:37%;left:20%}.sceneProgress{position:absolute;z-index:12;top:18px;left:50%;display:flex;min-width:315px;align-items:center;gap:12px;padding:9px 13px;transform:translateX(-50%);border:1px solid rgba(255,255,255,.7);border-radius:999px;background:rgba(255,255,255,.88);box-shadow:0 8px 28px rgba(17,53,39,.18);backdrop-filter:blur(8px)}.sceneProgress>span{color:#a44353;font-size:11px;font-weight:900}.sceneProgress>strong{margin-left:auto;color:#356355;font-size:11px}.progressDots{display:flex;gap:5px}.progressDots i{display:block;width:8px;height:8px;border-radius:50%;background:#c9d9d2;transition:width .25s,background .25s}.progressDots i.isDone{background:#63a86a}.progressDots i.isCurrent{width:21px;border-radius:8px;background:#ef6674}.sceneAsset{position:absolute;z-index:2;display:none;object-fit:contain;filter:drop-shadow(0 18px 14px rgba(15,43,27,.24));transition:opacity .55s,transform .8s cubic-bezier(.2,.84,.22,1)}.openingCard,.completeCard{position:absolute;z-index:10;top:50%;left:50%;width:min(480px,88vw);padding:28px 31px;transform:translate(-50%,-48%);border:1px solid rgba(255,255,255,.75);border-radius:28px;text-align:center;background:rgba(255,253,247,.93);box-shadow:0 24px 70px rgba(15,48,36,.3);backdrop-filter:blur(12px);animation:cardRise .55s ease-out}.openingKicker{color:#ba4a5b;font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.openingCard h2,.completeCard h2{margin:7px 0 9px;font-family:Georgia,serif;font-size:clamp(31px,4vw,46px);line-height:1.02}.openingCard p,.completeCard p{margin:0 auto;color:#587064;font-size:14px;line-height:1.55}.openingFeatures{display:flex;justify-content:center;gap:7px;margin:17px 0}.openingFeatures span{padding:7px 10px;border:1px solid #dbe8df;border-radius:999px;color:#346252;background:rgba(255,255,255,.8);font-size:10px;font-weight:900}.primaryButton{border:0;border-radius:999px;padding:13px 29px;color:#fff;background:linear-gradient(135deg,#ef6877,#db4960);box-shadow:0 12px 27px rgba(216,68,91,.35);font-weight:900;transition:transform .18s,box-shadow .18s}.primaryButton:hover,.primaryButton:focus-visible{transform:translateY(-2px);box-shadow:0 16px 31px rgba(216,68,91,.43)}.primaryButton span{margin-right:6px}.dialogCard{position:absolute;z-index:14;right:clamp(22px,5vw,70px);bottom:clamp(22px,4vh,44px);width:min(610px,52vw);padding:18px 20px;border:1px solid rgba(255,255,255,.78);border-radius:24px;color:#263d48;background:rgba(255,255,255,.96);box-shadow:0 24px 70px rgba(10,35,28,.4);backdrop-filter:blur(12px);animation:cardRise .45s ease-out}.speakerRow{display:flex;align-items:center;gap:10px;margin-bottom:10px}.speakerAvatar{display:grid;width:38px;height:38px;place-items:center;border-radius:12px;background:#e8f5e7;font-size:20px}.speakerRow strong,.speakerRow small{display:block}.speakerRow strong{font-family:Georgia,serif;font-size:18px}.speakerRow small{margin-top:2px;color:#71867e;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.replayButton{margin-left:auto;border:0;border-radius:10px;padding:8px 10px;color:#245b58;background:#e8f5f1;font-size:11px;font-weight:900}.transcript{min-height:72px;margin:0;color:#294451;font-family:Georgia,serif;font-size:clamp(20px,2vw,27px);font-weight:700;line-height:1.48}.syncWord{opacity:.16;transition:opacity .12s,color .12s,background .12s}.syncWord.isHeard{opacity:1}.syncWord.isCurrent{padding:2px 3px;border-radius:6px;color:#8a2737;background:#ffe0a3}.answerArea{margin-top:12px;padding-top:11px;border-top:1px solid #dfebe7}.answerLabel{display:flex;align-items:center;gap:7px;margin-bottom:7px}.answerLabel label{color:#147872;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.helpButton{display:grid;width:25px;height:25px;place-items:center;border:0;border-radius:50%;color:#fff;background:#ef6674;font-weight:900;box-shadow:0 4px 11px rgba(239,102,116,.32)}.helpButton.isSpeaking{animation:pulse .65s infinite alternate;background:#168f87}.answerRow{display:flex;gap:8px}.answerRow input{min-width:0;flex:1;border:1.5px solid #cbded8;border-radius:12px;padding:11px 13px;color:#253f48;background:#fbfefd;outline:none}.answerRow input:focus{border-color:#168f87;box-shadow:0 0 0 3px rgba(22,143,135,.13)}.answerRow button{border:0;border-radius:12px;font-weight:900}.micButton{min-width:91px;padding:0 11px;color:#13766f;background:#e5f5f0}.micButton.isListening{color:#fff;background:#df5267;animation:pulse .75s infinite alternate}.submitButton{padding:0 16px;color:#fff;background:#173f70}.answerRow button:disabled,.answerRow input:disabled{cursor:default;opacity:.5}.feedback{min-height:17px;margin:7px 0 0;color:#c33f53;font-size:12px;font-weight:800}.feedback.isCorrect{color:#197656}.completeCard{width:min(430px,88vw)}.completeMark{display:grid;width:45px;height:45px;margin:0 auto 8px;place-items:center;border-radius:50%;color:#fff;background:#3b9a64;box-shadow:0 8px 20px rgba(59,154,100,.3);font-size:23px;font-weight:900}.completeCard h2{font-size:36px}.restartButton{margin-top:17px;background:linear-gradient(135deg,#198d84,#116c68);box-shadow:0 12px 27px rgba(25,141,132,.3)}.footerNav{display:flex;justify-content:center;gap:12px;padding:29px 18px 45px;border-top:1px solid #d7e7dd;background:#eff7f1}.footerNav a{display:inline-flex;min-width:150px;align-items:center;justify-content:center;gap:7px;padding:12px 18px;border:1px solid #cadecf;border-radius:999px;color:#17634e;background:#fff;box-shadow:0 8px 21px rgba(24,91,70,.09);text-decoration:none;font-size:13px;font-weight:900;transition:transform .18s,box-shadow .18s}.footerNav a:last-child{color:#fff;border-color:#17634e;background:#17634e}.footerNav a:hover,.footerNav a:focus-visible{transform:translateY(-2px);box-shadow:0 12px 27px rgba(24,91,70,.16)}.birdStage[data-scene="opening"] .birdPerched{display:block;right:5%;bottom:4%;width:min(30vw,390px);opacity:.9}.birdStage[data-scene="home"] .birdPerched{display:block;left:7%;bottom:19%;width:min(34vw,430px);animation:birdArrive .8s ease-out}.birdStage[data-scene="greeting"] .birdPerched{display:block;left:32%;top:12%;width:min(22vw,275px)}.birdStage[data-scene="greeting"] .youngBoy{display:block;left:4%;bottom:1%;height:82%;animation:boyArrive .8s ease-out}.birdStage[data-scene="garden"] .birdFlying{display:block;left:7%;top:12%;width:min(38vw,470px);animation:birdFly 3.2s ease-in-out infinite alternate}.birdStage[data-scene="cat"] .birdFlying{display:block;left:7%;top:12%;width:min(25vw,310px)}.birdStage[data-scene="cat"] .sleepingCat{display:block;left:36%;bottom:3%;width:min(27vw,330px);animation:catBreathe 2.8s ease-in-out infinite}.birdStage[data-scene="night"] .nightShade{opacity:1}.birdStage[data-scene="night"] .birdSleeping{display:block;left:7%;bottom:15%;width:min(38vw,455px);filter:drop-shadow(0 18px 15px rgba(0,0,0,.45));animation:catBreathe 3.2s ease-in-out infinite}.birdStage[data-scene="complete"] .nightShade{opacity:.55}.birdStage[data-scene="complete"] .birdSleeping{display:block;right:4%;bottom:5%;width:min(30vw,360px)}@keyframes cardRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}@keyframes birdArrive{from{opacity:0;transform:translate(-90px,-30px) scale(.75)}to{opacity:1;transform:none}}@keyframes boyArrive{from{opacity:0;transform:translateX(-80px)}to{opacity:1;transform:none}}@keyframes birdFly{to{transform:translate(45px,-24px) rotate(2deg)}}@keyframes catBreathe{50%{transform:translateY(3px) scale(.99)}}@keyframes pulse{to{transform:scale(1.08)}}
@media(max-width:700px){.topbar{height:64px;padding:0 14px}.brandMark{width:36px;height:36px;border-radius:11px;font-size:23px}.brandText p{display:none}.brandText h1{font-size:17px}.storyLink{padding:7px 10px}.birdStage{min-height:780px}.stageBackground img{object-position:center}.sceneProgress{top:13px;min-width:min(315px,90vw);padding:8px 11px}.openingCard,.completeCard{top:auto;bottom:24px;padding:23px 20px;transform:translateX(-50%);border-radius:23px}.openingCard h2{font-size:34px}.openingCard p{font-size:13px}.dialogCard{right:4%;bottom:17px;left:4%;width:auto;padding:14px;border-radius:20px}.transcript{min-height:65px;font-size:18px;line-height:1.42}.answerRow{flex-wrap:wrap}.answerRow input{flex-basis:calc(100% - 99px)}.micButton{height:42px}.submitButton{height:42px;flex:1}.birdStage[data-scene="opening"] .birdPerched{right:-4%;bottom:335px;width:76vw}.birdStage[data-scene="home"] .birdPerched{left:4%;bottom:310px;width:72vw}.birdStage[data-scene="greeting"] .youngBoy{left:-6%;bottom:260px;height:56%}.birdStage[data-scene="greeting"] .birdPerched{top:60px;right:-3%;left:auto;width:48vw}.birdStage[data-scene="garden"] .birdFlying{top:74px;left:5%;width:74vw}.birdStage[data-scene="cat"] .birdFlying{top:75px;left:4%;width:45vw}.birdStage[data-scene="cat"] .sleepingCat{left:27%;bottom:285px;width:65vw}.birdStage[data-scene="night"] .birdSleeping{left:4%;bottom:300px;width:76vw}.birdStage[data-scene="complete"] .birdSleeping{right:-4%;bottom:315px;width:72vw}.nightShade::before{top:72px;right:8%;width:54px;height:54px}.footerNav{padding:35px 15px 55px}.footerNav a{min-width:0;flex:1;padding:12px 9px}}
@media(min-width:701px) and (max-height:760px){.birdStage{min-height:690px}.dialogCard{bottom:22px}.youngBoy{max-height:600px}}
@media(prefers-reduced-motion:reduce){.sceneAsset,.nightShade,.syncWord{transition-duration:.01ms!important;animation:none!important}.openingCard,.dialogCard,.completeCard{animation:none}}
.openingCard,.completeCard{animation-name:cardFade}
@keyframes cardFade{from{opacity:0}}

/* Kediyi arka plandaki sandalyenin ayakları arasına yerleştirir. */
.birdStage[data-scene="cat"] .sleepingCat{left:44%;bottom:9%;width:min(15vw,190px)}
@media(max-width:700px){.birdStage[data-scene="cat"] .sleepingCat{left:27%;bottom:9%;width:42vw}}

/* Mobil selamlaşmada çocuk zemine basar; ayakları diyalog kartının arkasında kalabilir. */
@media(max-width:700px){.birdStage[data-scene="greeting"] .youngBoy{bottom:120px;height:58%}}

/* Kedi anlatılırken kart yukarı çıkar; cevap alanı açılınca yeniden alta döner. */
@media(max-width:700px){.birdStage[data-scene="cat"]:not(.isAnswering) .dialogCard{top:clamp(300px,43svh,355px);bottom:auto}}

/* Tablet: kedi sandalyenin altında görünür, konuşma kartı onu kapatmaz. */
@media(min-width:701px) and (max-width:1024px){
  .birdStage[data-scene="cat"] .sleepingCat{left:40%;bottom:5%;width:min(24vw,230px)}
  .birdStage[data-scene="cat"]:not(.isAnswering) .dialogCard{top:46%;bottom:auto}
}

/* Tüm oranlarda kedinin gövdesi minderin altına iner. */
.birdStage[data-scene="cat"] .sleepingCat{bottom:-4%}
@media(min-width:1025px){.birdStage[data-scene="cat"]:not(.isAnswering) .dialogCard{top:22%;bottom:auto}}

.vocabularyCard{position:absolute;z-index:16;top:50%;left:50%;width:min(760px,92vw);max-height:calc(100% - 44px);padding:24px 26px;transform:translate(-50%,-50%);overflow:auto;border:1px solid rgba(255,255,255,.78);border-radius:27px;text-align:center;background:rgba(255,253,247,.96);box-shadow:0 24px 70px rgba(15,48,36,.34);backdrop-filter:blur(13px);animation:cardFade .45s ease-out}.vocabularyCard h2{margin:5px 0 6px;font-family:Georgia,serif;font-size:clamp(28px,3.4vw,39px);line-height:1.06}.vocabularyLead{margin:0 auto 16px;color:#587064;font-size:13px;line-height:1.45}.vocabularyGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;text-align:left}.vocabularyItem{display:flex;min-width:0;align-items:center;gap:11px;padding:10px 12px;border:1px solid #d9e7dd;border-radius:15px;color:#203b42;background:rgba(255,255,255,.86);box-shadow:0 5px 14px rgba(31,79,56,.07);text-align:left;transition:transform .18s,border-color .18s,background .18s}.vocabularyItem:hover,.vocabularyItem:focus-visible{transform:translateY(-2px);outline:2px solid rgba(19,127,121,.2);outline-offset:1px;border-color:#72b3a0;background:#fff}.vocabularyItem.isPlaying{border-color:#ef6674;background:#fff7f2}.vocabularyItem.isHeard{border-color:#8fc8a1}.vocabularyItem.isHeard .vocabularySound{color:#fff;background:#3d9a66}.vocabularySound{display:grid;flex:0 0 35px;width:35px;height:35px;place-items:center;border-radius:11px;background:#e7f5ed;font-size:15px}.vocabularyItem>span:last-child{display:grid;min-width:0;grid-template-columns:auto 1fr;align-items:baseline;column-gap:7px}.vocabularyItem strong{font-family:Georgia,serif;font-size:19px}.vocabularyItem small{color:#397360;font-size:10px;font-weight:900;text-transform:uppercase}.vocabularyItem em{grid-column:1/-1;margin-top:2px;overflow:hidden;color:#718179;font-size:11px;font-style:normal;text-overflow:ellipsis;white-space:nowrap}.vocabularyFooter{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:16px}.vocabularyFooter>span{color:#668078;font-size:11px;font-weight:900}.vocabularyStartButton{padding:11px 20px;font-size:13px}
@media(max-width:700px){.vocabularyCard{top:16px;bottom:16px;width:92vw;max-height:none;padding:19px 15px;transform:translateX(-50%);border-radius:22px}.vocabularyCard h2{font-size:28px}.vocabularyLead{margin-bottom:12px;font-size:12px}.vocabularyGrid{grid-template-columns:1fr;gap:6px}.vocabularyItem{padding:8px 10px}.vocabularySound{width:31px;height:31px;flex-basis:31px}.vocabularyItem strong{font-size:17px}.vocabularyFooter{position:sticky;bottom:-19px;flex-wrap:wrap;margin:12px -15px -19px;padding:11px 15px 15px;background:linear-gradient(180deg,rgba(255,253,247,.72),#fffdf7 30%)}.vocabularyStartButton{flex:1}}
.vocabularyGroups{display:grid;gap:8px;text-align:left}.vocabularyGroup{overflow:hidden;border:1px solid #d9e7dd;border-radius:15px;background:rgba(246,251,247,.86)}.vocabularyGroup summary{display:flex;align-items:center;justify-content:space-between;padding:11px 13px;color:#285848;font-size:12px;font-weight:900;cursor:pointer;list-style:none}.vocabularyGroup summary::-webkit-details-marker{display:none}.vocabularyGroup summary::before{margin-right:8px;content:"＋";color:#c24b5c;font-size:15px}.vocabularyGroup[open] summary::before{content:"−"}.vocabularyGroup summary span{margin-left:auto;padding:4px 7px;border-radius:999px;color:#687d75;background:#e5f0e9;font-size:9px}.vocabularyGroup .vocabularyGrid{padding:0 8px 8px}.vocabularyCard{max-height:calc(100% - 28px)}
@media(max-width:700px){.vocabularyGroup .vocabularyGrid{grid-template-columns:1fr;padding:0 6px 6px}.vocabularyGroup summary{padding:10px}.vocabularyItem em{font-size:10px}.vocabularyCard{top:10px;bottom:10px}}
.vocabularyItem em{overflow:visible;font-size:14px;line-height:1.35;text-overflow:clip;white-space:normal}.vocabularyTranslation{grid-column:1/-1;margin-top:4px;padding-top:4px;border-top:1px dashed #d7e5dc;color:#a04453;font-size:12px;font-weight:750;line-height:1.35}.vocabularyTranslationToggle{display:flex;margin:12px auto 0;align-items:center;justify-content:center;gap:7px;padding:9px 15px;border:1px solid #b9d9cb;border-radius:999px;color:#176c58;background:#f1faf5;font-size:11px;font-weight:900}.vocabularyTranslationToggle[aria-pressed="true"]{color:#fff;border-color:#287f68;background:#287f68}
@media(max-width:700px){.vocabularyItem em{font-size:13px}.vocabularyTranslation{font-size:11.5px}.vocabularyTranslationToggle{position:sticky;bottom:54px;z-index:2;box-shadow:0 6px 18px rgba(31,79,56,.13)}}
.vocabularyLead{font-size:15px}
@media(max-width:700px){.vocabularyLead{font-size:14px}}