/* Türkçe Yolu — один визуальный мир (детский), без тёмной темы намеренно */
:root{
  --ground:#CFEAF7; --ink:#15314A; --muted:#5C7486;
  --teal:#0E6E6A; --teal-2:#15928C; --sun:#FFC83D; --tomato:#FF6B4A;
  --card:#FFFFFF; --lock:#C9D6DC; --grass:#BFE3B4; --ok:#35B26B;
  --display:"Baloo 2","Nunito",system-ui,sans-serif;
  --body:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;margin:0}
body{background:var(--ground);color:var(--ink);font-family:var(--body);overscroll-behavior:none;user-select:none;-webkit-user-select:none}
.app{position:relative;height:100%;max-width:560px;margin:0 auto;overflow:hidden}
.screen{position:absolute;inset:0;display:flex;flex-direction:column;padding:12px 16px calc(16px + env(safe-area-inset-bottom,0px))}
.screen[hidden]{display:none!important}
.top{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px}
.center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;min-height:0}
button{font-family:inherit;color:inherit}
.iconbtn{width:52px;height:52px;border-radius:18px;border:0;background:rgba(255,255,255,.8);display:grid;place-items:center;cursor:pointer;font-size:24px;flex:none}
.iconbtn.ghost{background:transparent}
.iconbtn svg{width:40px;height:44px}
:focus-visible{outline:4px solid var(--tomato);outline-offset:2px}
.bar{flex:1;height:14px;border-radius:8px;background:rgba(255,255,255,.7);overflow:hidden;max-width:260px}
.bar i{display:block;height:100%;width:0;background:var(--teal-2);border-radius:8px;transition:width .3s}
.big{font:800 30px var(--display);border:0;border-radius:26px;background:var(--teal);color:#fff;min-width:96px;min-height:72px;padding:8px 26px;cursor:pointer;box-shadow:0 6px 0 #094744}
.big:active{transform:translateY(4px);box-shadow:0 2px 0 #094744}
.big.sun{background:var(--sun);color:var(--ink);box-shadow:0 6px 0 #C99612}
.big[hidden]{display:none}
.dock{display:flex;justify-content:center;padding-top:8px}

/* выбор ребёнка */
.kids{display:grid;gap:18px;width:100%;max-width:420px}
.kid{border:0;border-radius:30px;padding:16px 20px;display:flex;align-items:center;gap:16px;cursor:pointer;font:800 28px var(--display)}
.kid svg{width:88px;height:96px;flex:none}
.kid .badge{font-size:44px;margin-left:auto}

/* дорога */
.map{flex:1;position:relative;margin:6px 0;overflow-y:auto;overflow-x:hidden;min-height:0;scrollbar-width:none}
.map::-webkit-scrollbar{display:none}
.road-in{position:relative;width:100%}
.road-in svg.road{position:absolute;inset:0;width:100%;height:100%}
.stop{position:absolute;width:80px;height:80px;margin:-40px 0 0 -40px;border-radius:50%;border:6px solid #fff;display:grid;place-items:center;font-size:36px;background:var(--card);cursor:default}
.stop.done{background:var(--grass)}
.stop.now{background:var(--sun);animation:pulse 1.6s ease-in-out infinite;cursor:pointer}
.stop.open{background:#fff;border-color:var(--teal-2)}
.stop.locked{background:var(--lock);filter:grayscale(1);opacity:.7}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,200,61,.85)}50%{box-shadow:0 0 0 16px rgba(255,200,61,0)}}

/* урок */
.stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;min-height:0}
.photo{width:min(78vw,300px);aspect-ratio:1;border-radius:32px;background:var(--card);display:grid;place-items:center;font-size:min(36vw,150px);line-height:1;box-shadow:0 10px 0 rgba(21,49,74,.1)}
.swatch{width:62%;aspect-ratio:1;border-radius:50%;border:4px solid rgba(21,49,74,.12)}
.bubble{background:var(--card);border-radius:24px;padding:10px 20px;font:800 30px var(--display);display:flex;gap:10px;align-items:center;cursor:pointer;border:0;min-height:60px}
.bubble .spk{font-size:24px}
.dots{display:flex;gap:8px}
.dots i{width:14px;height:14px;border-radius:50%;background:rgba(21,49,74,.18)}
.dots i.on{background:var(--teal)}
.grid{display:grid;gap:12px;width:100%;max-width:460px;grid-template-columns:1fr 1fr}
.choice{aspect-ratio:1;border-radius:26px;border:6px solid transparent;background:var(--card);font-size:min(18vw,84px);line-height:1;display:grid;place-items:center;cursor:pointer;padding:0}
.choice .swatch{width:70%}
.choice.right{border-color:var(--ok);background:#E3F7EA;animation:pop .4s}
.choice.wrong{animation:wiggle .45s}
.choice.hint{border-color:var(--ok);animation:glow 1s ease-in-out infinite}
.choice.dim{opacity:.35}
@keyframes pop{50%{transform:scale(1.08)}}
@keyframes wiggle{20%{transform:rotate(-6deg)}40%{transform:rotate(6deg)}60%{transform:rotate(-4deg)}80%{transform:rotate(3deg)}}
@keyframes glow{50%{box-shadow:0 0 0 12px rgba(53,178,107,.35)}}
.ring{width:120px;height:120px;border-radius:50%;background:conic-gradient(var(--tomato) var(--p,0%),rgba(255,255,255,.7) 0);display:grid;place-items:center}
.ring span{width:96px;height:96px;border-radius:50%;background:var(--card);display:grid;place-items:center;font-size:46px}
.row{display:flex;gap:14px;align-items:center}

/* Али (аватар) */
.ali{width:140px;height:156px;overflow:visible}
.mine{--shirt:var(--kid-shirt,#D9480F)}
.phases{display:flex;gap:6px;background:rgba(255,255,255,.8);border-radius:16px;padding:6px 10px;font-size:22px}
.phases span{opacity:.28} .phases span.on{opacity:1}

/* Сцены глаголов (scenes.js): части тела вращаются вокруг плеч, бёдер, ладони */
.scenebox{--shirt:var(--kid-shirt,#D9480F);position:relative;width:100%;aspect-ratio:1;border-radius:22px;background:#E7F5FB;overflow:hidden;transition:background .8s}
.scenebox.night{background:#1D2B4F}
.scene{display:block;width:100%;height:100%}
.scene g{transform-box:view-box}
.s-ali{transform-origin:120px 150px}
.s-armL{transform-origin:96px 92px} .s-armR{transform-origin:144px 92px}
.s-legs{transform-origin:120px 192px}
.s-legL{transform-origin:111px 124px} .s-legR{transform-origin:129px 124px}
.p-cup{transform-origin:143.5px 132px} .p-water{transform-origin:143px 144px}
.p-chair,.p-bed,.p-apple,.p-cup,.p-arrow,.p-moon,.p-zzz,.p-dust{opacity:0;transition:opacity .5s}
.scene .show{opacity:1}
.night .p-moon{opacity:1}
.zz .p-zzz{opacity:1}
.act[data-anim="run"] .p-dust{opacity:1}
.p-zzz text{font:800 22px var(--body);fill:#fff}
.zz .p-zzz text{animation:zz 1.6s ease-out infinite}
.zz .p-zzz text:nth-child(2){animation-delay:.5s} .zz .p-zzz text:nth-child(3){animation-delay:1s}
@keyframes zz{from{transform:translateY(0);opacity:1}to{transform:translateY(-30px);opacity:0}}
.photo.doscene{padding:0;overflow:hidden}
.photo.doscene.you{box-shadow:0 0 0 6px var(--sun),0 10px 0 rgba(21,49,74,.1)}
.choice .scenebox{border-radius:16px}

/* число: «десяток» 5×2 */
.ten{display:grid;grid-template-columns:repeat(5,1fr);gap:6%;width:84%;padding:5%;border-radius:14px;background:#EEF4F7}
.ten i{aspect-ratio:1;border-radius:50%;background:#fff;border:2px solid #D3DFE5}
.ten i.on{background:var(--tomato);border-color:var(--tomato)}
.choice .ten{width:88%}
.boardgrid .choice .ten{gap:4%}

/* похвала */
.cheer{position:absolute;left:50%;top:18%;transform:translateX(-50%);font:800 44px var(--display);color:var(--teal);background:#fff;border-radius:24px;padding:6px 22px;box-shadow:0 8px 0 rgba(21,49,74,.12);animation:cheer 1.2s ease-out forwards;pointer-events:none}
@keyframes cheer{0%{opacity:0;transform:translate(-50%,20px) scale(.7)}20%{opacity:1;transform:translate(-50%,0) scale(1.05)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-10px)}}
.burst{position:relative;width:220px;height:220px;display:grid;place-items:center}
.burst .ali{width:150px;height:165px}
.burst b{position:absolute;width:26px;height:26px;border-radius:6px;animation:fly 1.3s ease-out forwards}
@keyframes fly{from{transform:translate(0,0) rotate(0);opacity:1}to{transform:translate(var(--x),var(--y)) rotate(220deg);opacity:0}}
.praise{font:800 44px var(--display);text-align:center}

/* сообщение для взрослого (подключение устройства) */
.toast{position:absolute;left:16px;right:16px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:10;background:var(--ink);color:#fff;border-radius:16px;padding:12px 16px;font:700 16px var(--body);text-align:center}
.toast[hidden]{display:none}

/* свободная игра */
.boardgrid{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px;align-content:start;padding:6px 0 16px}
.boardgrid .choice{font-size:54px;border-radius:22px}
.empty{color:var(--muted);text-align:center;font-size:40px}

@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important}}