/* ===== Яша Умняша 3.0 — единая дизайн-система =====
   Сказочный свет: небо, луг, дерево, крем. Объёмные кнопки, деревянные планки.
   Все графические объекты — отдельные компоненты (SVG/CSS/спрайты), не полноэкранные картинки. */
:root{
 --ink:#4a2a10;--ink2:#7d5a38;--cream:#fff7e1;--cream2:#fbeec6;--cream-sd:#d2b676;
 --wood:#a56a33;--wood-d:#6a4021;--wood-l:#d39a58;
 --green:#47bf55;--green-d:#23802f;--blue:#2f8cf0;--blue-d:#1d62b8;--blue-ink:#1a4f9c;--gold:#ffcb3d;--red:#e5483d;
 --sky:#bfe8ff;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);
 --font:"Nunito","Baloo 2",ui-rounded,"SF Pro Rounded","Segoe UI",system-ui,Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;font-family:var(--font);color:var(--ink);background:#8fd3ff;overscroll-behavior:none;-webkit-text-size-adjust:100%}
body{display:flex;justify-content:center;background:radial-gradient(circle at 20% 10%,#d8f3ff,#9fdcff 50%,#7bc6f0)}
button{font:inherit;color:inherit;cursor:pointer;-webkit-user-select:none;user-select:none}
button:disabled{cursor:default}
button:focus-visible,[role=button]:focus-visible,input:focus-visible{outline:4px solid #2f8cf0;outline-offset:2px}
img{-webkit-user-drag:none}
.ic{width:1.15em;height:1.15em;flex:0 0 auto;display:inline-block;vertical-align:middle}
.app{position:relative;width:100%;max-width:445px;height:100vh;height:100dvh;overflow:hidden;background:var(--sky);box-shadow:0 0 0 1px #fff,0 18px 60px rgba(20,60,90,.35)}
.view{position:absolute;inset:0;display:none;flex-direction:column;overflow:hidden}
.view.active{display:flex;animation:viewIn .28s ease-out}
@keyframes viewIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- примитивы ---------- */
.plank{position:relative;color:#fff3d6;font-weight:900;text-align:center;padding:9px 26px;border-radius:14px;
 background:repeating-linear-gradient(92deg,rgba(0,0,0,.06) 0 2px,transparent 2px 11px),linear-gradient(#c98d4d,#a56a33 55%,#94592a);
 border:2px solid #7a4a22;box-shadow:inset 0 2px 0 rgba(255,235,190,.5),inset 0 -3px 0 rgba(60,30,5,.25),0 4px 0 #5e3a1c,0 8px 12px rgba(50,30,10,.28);text-shadow:0 2px 0 rgba(70,35,8,.6)}
.plank::before,.plank::after{content:'';position:absolute;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:radial-gradient(#ecdcae,#8a6a3a);box-shadow:inset 0 1px 1px rgba(0,0,0,.45)}
.plank::before{left:9px}.plank::after{right:9px}
.btn{--c1:#76e070;--c2:#3dbb52;--sd:#23802f;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:56px;padding:0 22px;border:0;border-radius:20px;font-weight:900;font-size:19px;color:#fff;
 background:linear-gradient(var(--c1),var(--c2));box-shadow:inset 0 2px 0 rgba(255,255,255,.55),inset 0 -3px 0 rgba(0,40,10,.12),0 5px 0 var(--sd),0 10px 16px rgba(20,60,30,.3);
 text-shadow:0 2px 0 rgba(0,0,0,.22);transition:transform .08s,box-shadow .08s,filter .15s;touch-action:manipulation;position:relative;line-height:1.1}
.btn:active:not(:disabled){transform:translateY(4px);box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 1px 0 var(--sd),0 3px 6px rgba(20,60,30,.3)}
.btn:disabled{filter:grayscale(.55) brightness(1.04);opacity:.62}
.btn.btn-green{--c1:#76e070;--c2:#3dbb52;--sd:#23802f}
.btn-blue{--c1:#63b8ff;--c2:#2f8cf0;--sd:#1d62b8}
.btn-red{--c1:#ff8575;--c2:#e5483d;--sd:#a8281f}
.btn-cream{--c1:#fffdf2;--c2:#fbeec6;--sd:#d2b676;color:var(--ink);text-shadow:none}
.btn.wide{width:100%}.btn.sm{min-height:44px;font-size:15px;padding:0 14px;border-radius:16px}.btn.big{min-height:72px;flex-direction:column;gap:2px}
.btn.big small{font-size:12px;font-weight:800;opacity:.92}
.btn.danger{color:#b3261e}
.round-btn{width:46px;height:46px;flex:0 0 46px;border-radius:50%;border:2px solid #fff;display:grid;place-items:center;color:var(--blue-ink);
 background:linear-gradient(#fffdf2,#fbeec6);box-shadow:0 4px 0 var(--cream-sd),0 8px 12px rgba(60,40,10,.25);padding:0;touch-action:manipulation}
.round-btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--cream-sd)}
.round-btn .ic{width:24px;height:24px}
.round-btn.wood{background:linear-gradient(#d39a58,#a56a33);color:#fff3d6;border-color:#7a4a22;box-shadow:0 4px 0 #5e3a1c,0 8px 12px rgba(60,40,10,.3)}
.round-spacer{width:46px;flex:0 0 46px}
.pill{display:flex;align-items:center;gap:5px;height:40px;padding:0 11px 0 7px;border-radius:20px;font-weight:900;font-size:16px;color:var(--ink);
 background:linear-gradient(#fffdf2,#fbeec6);border:2px solid #fff;box-shadow:0 3px 0 var(--cream-sd),0 7px 10px rgba(60,40,10,.2)}
.pill img{width:24px;height:28px;object-fit:contain}.pill .ic{width:26px;height:26px}
.pill.dim{opacity:.8}.flame{color:#ff7a1a;display:inline-flex}.pill.dim .flame{color:#b9a98a}
.tag{display:inline-flex;align-items:center;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:900;background:#e3f6dc;color:#2b8f3a;line-height:1.1}
.tag.level.l0{background:#e3f6dc;color:#2b8f3a}.tag.level.l1{background:#dcecff;color:#1d62b8}.tag.level.l2{background:#ffe9c7;color:#b05a00}
.card{background:linear-gradient(#fffaf0,#fff3d6);border-radius:22px;border:3px solid #fff;box-shadow:0 4px 0 #d8c08a,0 10px 16px rgba(80,60,20,.16);padding:14px;margin-bottom:14px}
.card h3{margin:0 0 10px;font-size:18px;color:var(--ink)}
.muted{color:var(--ink2);font-size:13.5px;line-height:1.35}.tiny-note{font-size:12px;color:var(--ink2);margin:8px 0 0;line-height:1.3}
.section-title{margin:16px 4px 8px;font-size:17px;font-weight:900;color:#2a4a1a;text-shadow:0 1px 0 #fff}
.meter{height:12px;border-radius:7px;background:#ecdcb4;box-shadow:inset 0 2px 3px rgba(100,70,20,.3);overflow:hidden}
.meter i{display:block;height:100%;border-radius:7px;background:linear-gradient(#ffd96a,#f0a21c);transition:width .5s}
.meter.hi i{background:linear-gradient(#7ee07a,#3dbb52)}.meter.mid i{background:linear-gradient(#ffd96a,#f0b21c)}.meter.lo i{background:linear-gradient(#ff9a8a,#e5483d)}
.bubble{position:relative;background:#fffdf6;border:3px solid #fff;border-radius:20px;padding:9px 13px;font-weight:900;font-size:14.5px;line-height:1.2;color:var(--blue-ink);box-shadow:0 4px 0 #e5d3a2,0 8px 14px rgba(60,40,10,.2);min-height:44px;display:flex;align-items:center}
.bubble::before{content:'';position:absolute;left:-11px;bottom:12px;width:16px;height:16px;background:#fffdf6;transform:rotate(45deg);border-radius:3px;border-left:3px solid #fff;border-bottom:3px solid #fff}
.bubble.pop{animation:popIn .3s ease-out}
.toggle{display:flex;align-items:center;justify-content:space-between;padding:14px 4px;font-weight:800;border-bottom:2px dashed #e6d3a4}
.toggle input{position:absolute;opacity:0;width:1px;height:1px}
.toggle i{width:56px;height:32px;border-radius:16px;background:#cdbf9f;position:relative;transition:.2s;box-shadow:inset 0 2px 4px rgba(0,0,0,.2)}
.toggle i::after{content:'';position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 2px 3px rgba(0,0,0,.3);transition:.2s}
.toggle input:checked+i{background:var(--green)}.toggle input:checked+i::after{transform:translateX(24px)}
.toggle input:focus-visible+i{outline:4px solid #2f8cf0}

/* ---------- Яша: общий компонент ---------- */
.yasha-wrap{display:block;background:none;border:0;padding:0;transform-origin:50% 100%;position:relative}
.yasha-wrap img{display:block;width:100%;height:auto;pointer-events:none;user-select:none;filter:drop-shadow(0 4px 3px rgba(20,40,60,.3))}
.yasha-wrap.flip img{transform:scaleX(-1)}
.yasha-wrap.small{width:76px;flex:0 0 76px}
.anim-wave{animation:wave 1.1s ease-in-out 2}.anim-breathe{animation:breathe 3.2s ease-in-out infinite}.anim-nod{animation:nod 1.4s ease-in-out infinite}
.anim-tilt{animation:tilt 2.4s ease-in-out infinite}.anim-sway{animation:sway 2.2s ease-in-out infinite}.anim-nudge{animation:nudge 1s ease-in-out 3}
.anim-hop{animation:hop .6s ease-out 3}.anim-pop{animation:pop .5s ease-out}.anim-stride{animation:stride .7s ease-in-out infinite}
.anim-spinstar{animation:hop 1s ease-in-out infinite}.anim-party{animation:party .8s ease-in-out infinite}
@keyframes wave{0%,100%{transform:rotate(0)}25%{transform:rotate(-7deg)}75%{transform:rotate(6deg)}}
@keyframes breathe{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.025)}}
@keyframes nod{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes tilt{0%,100%{transform:rotate(0)}50%{transform:rotate(-5deg)}}
@keyframes sway{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(7px)}}
.flip.anim-nudge{animation-name:nudgeL}@keyframes nudgeL{0%,100%{transform:translateX(0)}50%{transform:translateX(-7px)}}
@keyframes hop{0%,100%{transform:translateY(0) scale(1)}40%{transform:translateY(-16px) scale(1.04,.97)}}
@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.14)}100%{transform:scale(1)}}
@keyframes stride{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes party{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-12px) rotate(4deg)}}

/* ======================= ГЛАВНАЯ / КАРТА ======================= */
#view-home{background:#6ec6ff}
.map-scroll{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;background:#5f9e33}
.map-scroll::-webkit-scrollbar{display:none}
.map-scroll::after{content:'';display:block;height:150px;background:linear-gradient(#6aa83a,#4f8f2c)}
.world{position:relative;width:100%;aspect-ratio:941/3144}
.world-art{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;user-select:none}
.world-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.cloud{animation:cloud 18s ease-in-out infinite alternate}.cloud.c1{animation-duration:23s}.cloud.c2{animation-duration:28s}
@keyframes cloud{from{transform:translateX(-14px)}to{transform:translateX(18px)}}
.wave{animation:waterDash 4s linear infinite;stroke-dasharray:6 5}@keyframes waterDash{to{stroke-dashoffset:-22}}
.duck{animation:duck 6s ease-in-out infinite alternate}@keyframes duck{from{transform:translate(70px,864px)}to{transform:translate(120px,870px)}}
.flag{animation:flag 1.6s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:0 50%}@keyframes flag{to{transform:skewY(10deg) scaleX(.9)}}
.hud{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;gap:6px;padding:calc(8px + var(--safe-t)) 10px 12px;pointer-events:none;background:linear-gradient(rgba(60,150,220,.55),rgba(60,150,220,0))}
.hud>*{pointer-events:auto}
.hud-avatar{display:flex;align-items:center;gap:6px;height:48px;padding:0 10px 0 4px;border-radius:24px;border:2px solid #fff;background:linear-gradient(#fffdf2,#fbeec6);box-shadow:0 4px 0 var(--cream-sd),0 8px 12px rgba(60,40,10,.25);flex:0 1 auto}
.av-ring{width:42px;height:42px;border-radius:50%;background:conic-gradient(var(--green) var(--p),#e5d3a2 0);display:grid;place-items:center;flex:0 0 42px}
.av-face{width:34px;height:34px;border-radius:50%;overflow:hidden;background:#cfeaff;display:block;border:2px solid #fff}
.av-face img{display:block;width:100%;height:100%;object-fit:cover}
.av-ring{position:relative}.av-lv{position:absolute;right:-4px;bottom:-4px;min-width:20px;height:20px;padding:0 4px;border-radius:10px;background:var(--blue);color:#fff;font-size:12px;font-weight:900;display:grid;place-items:center;border:2px solid #fff;display:none}
.av-text{display:flex;flex-direction:column;text-align:left;line-height:1.05}.av-text b{font-size:15px}.av-text small{font-size:11px;color:var(--ink2);font-weight:800;white-space:nowrap}
.hud .round-btn{margin-left:auto}
.daily-chip{position:absolute;z-index:15;top:calc(62px + var(--safe-t));left:10px;display:flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border-radius:16px;border:2px solid #fff;background:linear-gradient(#fffdf2,#fbeec6);box-shadow:0 4px 0 var(--cream-sd),0 8px 12px rgba(60,40,10,.25);text-align:left;color:var(--ink)}
.dc-text{display:flex;flex-direction:column;line-height:1.1}.dc-text b{font-size:13px}.dc-text small{font-size:11px;color:var(--ink2);font-weight:800}
.dc-count{font-weight:900;font-size:13px;background:#e3f1ff;color:var(--blue-ink);border-radius:10px;padding:2px 7px}
.clip{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(#d39a58,#a56a33);color:#fff3d6}.clip .ic{width:20px;height:20px}
.daily-chip.ready{animation:pulseS 1.2s ease-in-out infinite}.daily-chip.ready .dc-count{background:#ffe08a;color:#9a5a00}.daily-chip.claimed .dc-count{background:#d6efc9;color:#1f6b2a}
.map-bubble{position:absolute;z-index:16;top:calc(114px + var(--safe-t));left:12px;right:12px;margin:auto;max-width:330px;background:#fffdf6;border:3px solid #fff;border-radius:18px;padding:10px 14px;font-weight:900;font-size:14px;line-height:1.25;color:var(--blue-ink);box-shadow:0 4px 0 #e5d3a2,0 10px 16px rgba(60,40,10,.25);opacity:0;transform:translateY(-8px) scale(.98);pointer-events:none;transition:.25s;text-align:center}
.map-bubble.show{opacity:1;transform:none}
.play-cta{position:absolute;z-index:25;left:14px;right:14px;bottom:calc(84px + var(--safe-b));min-height:62px;flex-direction:column;gap:1px;padding:6px 16px}
.cta-main{display:flex;align-items:center;gap:8px;font-size:21px}.cta-main .ic{width:22px;height:22px}
.play-cta small{font-size:12.5px;font-weight:800;opacity:.95;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bottomnav{position:absolute;left:10px;right:10px;bottom:calc(8px + var(--safe-b));z-index:30;display:flex;gap:2px;padding:6px;border-radius:26px;background:linear-gradient(#fffdf4,#fdf0d2);border:2px solid #fff;box-shadow:0 5px 0 var(--cream-sd),0 12px 22px rgba(60,40,10,.3)}
.navbtn{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:1px;padding:6px 2px 5px;border:0;background:none;border-radius:20px;color:#8c7b60;font-weight:900;font-size:11.5px;min-height:54px;touch-action:manipulation}
.navbtn .ic{width:26px;height:26px}.navbtn.on{background:#e3f1ff;color:var(--blue-ink)}.navbtn span{white-space:nowrap}
/* станции карты */
.station{position:absolute;transform:translate(-50%,-41px);width:112px;background:none;border:0;padding:0;display:flex;flex-direction:column;align-items:center;z-index:5;touch-action:manipulation}
.st-ring{position:relative;z-index:1;width:82px;height:82px;border-radius:50%;padding:5px;background:linear-gradient(#e0a560,#9a6532);box-shadow:inset 0 2px 0 rgba(255,235,190,.6),0 5px 0 #5e3a1c,0 11px 14px rgba(30,40,10,.4);display:block;transition:transform .15s}
.station:active .st-ring{transform:translateY(3px) scale(.97)}
.st-ring img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;border:2px solid #fff3d0}
.st-num{position:absolute;z-index:2;left:8px;top:-4px;width:30px;height:30px;border-radius:50%;background:var(--cc);color:#fff;font-weight:900;font-size:16px;display:grid;place-items:center;border:2.5px solid #fff;box-shadow:0 3px 0 rgba(0,0,0,.25)}
.st-badge{position:absolute;z-index:2;right:10px;top:50px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:2.5px solid #fff;box-shadow:0 3px 0 rgba(0,0,0,.25);color:#fff}
.st-badge .ic{width:17px;height:17px}.station.done .st-badge{background:var(--green)}.station.locked .st-badge{background:#8e9aa4}.station.open .st-badge{background:var(--blue)}
.st-sign{margin-top:11px;position:relative;z-index:1;min-width:92px;max-width:118px;padding:4px 8px 5px;border-radius:11px;background:linear-gradient(#fff8e0,#f3deaa);border:2px solid #b98542;box-shadow:0 3px 0 #8a5f2a,0 6px 8px rgba(30,30,10,.3);color:var(--ink);text-align:center;display:flex;flex-direction:column;align-items:center;gap:3px}
.st-sign b{font-size:11.5px;line-height:1.1;font-weight:900}
.st-pips{display:flex;gap:2px}.st-pips i{width:6px;height:6px;border-radius:50%;background:#d9c28e}.st-pips i.on{background:var(--green)}
.st-stars{display:flex;gap:1px}.st-stars span{color:#d9c28e;display:inline-flex}.st-stars span.on{color:#ffb800}.st-stars .ic{width:13px;height:13px}
.station.locked .st-ring img{filter:grayscale(1) brightness(.8)}.station.locked .st-ring{background:linear-gradient(#b8aa93,#8a7e69)}.station.locked .st-sign{filter:grayscale(.75);opacity:.92}
.st-glow{position:absolute;z-index:0;top:-22px;left:50%;width:126px;height:126px;margin-left:-63px;border-radius:50%;background:radial-gradient(circle,rgba(255,236,120,.95),rgba(255,210,60,0) 68%);display:none}
.station.now .st-glow{display:block;animation:glowP 1.8s ease-in-out infinite}
@keyframes glowP{0%,100%{transform:scale(.9);opacity:.75}50%{transform:scale(1.08);opacity:1}}
.st-now{position:absolute;z-index:3;top:-24px;left:50%;transform:translateX(-50%);background:var(--blue);color:#fff;font-size:11.5px;padding:3px 10px;border-radius:11px;font-weight:900;border:2px solid #fff;box-shadow:0 3px 0 var(--blue-d);animation:bobX 1.6s ease-in-out infinite}
@keyframes bobX{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-4px)}}
.map-yasha{position:absolute;z-index:4;width:60px;transform:translate(calc(-50% + var(--side,1)*40px),-92%);pointer-events:none}
.map-y-btn{width:60px;pointer-events:auto}
.y-shadow{position:absolute;left:50%;bottom:-3px;width:44px;height:10px;margin-left:-22px;border-radius:50%;background:rgba(10,50,20,.28);z-index:-1}
.map-chest,.map-bird,.find{position:absolute;transform:translate(-50%,-70%);background:none;border:0;padding:0;z-index:4;touch-action:manipulation}
.map-chest{width:60px}.map-chest svg{display:block;width:100%;filter:saturate(.75) brightness(.95)}
.map-chest.ready svg{filter:drop-shadow(0 0 8px #ffe36a) saturate(1.1);animation:wiggle 1.2s ease-in-out infinite}.map-chest.open svg{filter:none}
.map-bird{width:42px;transition:transform 1.2s ease-in,opacity 1.2s}.map-bird svg{display:block;width:100%;animation:bobX2 2.4s ease-in-out infinite}.map-bird .wing{transform-box:fill-box;transform-origin:30% 100%;animation:flap 1s ease-in-out infinite}
.map-bird.fly{transform:translate(520%,-480%) scale(.5);opacity:0;pointer-events:none}
@keyframes bobX2{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes flap{0%,100%{transform:rotate(0)}50%{transform:rotate(-18deg)}}
.find{width:34px;height:34px;transform:translate(-50%,-50%)}.find span{display:block;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,#fff 0 18%,rgba(255,240,150,.9) 30%,rgba(255,220,80,0) 70%);animation:twinkle 1.6s ease-in-out infinite}
@keyframes twinkle{0%,100%{transform:scale(.55) rotate(0);opacity:.55}50%{transform:scale(1.1) rotate(45deg);opacity:1}}
@keyframes wiggle{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
.shake{animation:shake .45s}@keyframes shake{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
.station.shake{animation:shakeS .45s}@keyframes shakeS{20%{transform:translate(calc(-50% - 6px),-41px)}40%{transform:translate(calc(-50% + 6px),-41px)}60%{transform:translate(calc(-50% - 3px),-41px)}}
@keyframes pulseS{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}

/* ---------- шторка ---------- */
.sheet-backdrop{position:absolute;inset:0;z-index:55;background:rgba(30,40,60,.45);opacity:0;transition:opacity .2s}.sheet-backdrop.open{opacity:1}
.sheet{position:absolute;left:0;right:0;bottom:0;z-index:60;max-height:88%;overflow-y:auto;padding:18px 16px calc(18px + var(--safe-b));background:linear-gradient(#fffaf0,#fff0cf);border-radius:30px 30px 0 0;border-top:6px solid var(--wood);box-shadow:0 -12px 30px rgba(40,30,10,.4);transform:translateY(105%);transition:transform .24s cubic-bezier(.2,.9,.3,1)}
.sheet.open{transform:none}.sheet[hidden],.sheet-backdrop[hidden]{display:none}
.sheet-close{position:absolute;right:10px;top:10px;width:40px;height:40px;flex-basis:40px}.sheet-close .ic{width:20px;height:20px}
.sheet-head{display:flex;gap:12px;align-items:center;padding-right:44px;margin-bottom:12px}.sheet-head h2{margin:0;font-size:20px;line-height:1.1}.sheet-head p{margin:3px 0 6px;font-size:13px;color:var(--ink2);font-weight:700}
.sh-medal{width:68px;height:68px;flex:0 0 68px;border-radius:50%;padding:4px;background:linear-gradient(#e0a560,#9a6532);box-shadow:0 4px 0 #5e3a1c}.sh-medal img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.sh-prog{height:10px;border-radius:5px;background:#ecdcb4;overflow:hidden}.sh-prog i{display:block;height:100%;background:linear-gradient(#7ee07a,#3dbb52)}
.sheet-head small{font-weight:800;color:var(--ink2);font-size:12px}
.lesson-list{margin-bottom:12px}
.lesson-row{display:flex;align-items:center;gap:10px;width:100%;min-height:54px;padding:8px 12px 8px 8px;margin-bottom:7px;border-radius:16px;border:0;background:#fff;box-shadow:0 3px 0 #e2cb94;font-weight:800;color:var(--ink);text-align:left;font-size:15px;touch-action:manipulation}
.lesson-row:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 #e2cb94}
.lr-num{width:36px;height:36px;flex:0 0 36px;border-radius:50%;display:grid;place-items:center;background:#dcecff;color:var(--blue-ink);font-weight:900}.lr-num .ic{width:18px;height:18px}
.lr-title{flex:1;min-width:0;line-height:1.15}.lr-stars{display:flex;color:#d9c28e}.lr-stars .on{color:#ffb800}.lr-stars .ic{width:17px;height:17px}
.lesson-row.done .lr-num{background:var(--green);color:#fff}.lesson-row.now{box-shadow:0 0 0 3px var(--blue),0 3px 0 var(--blue-d)}.lesson-row.now .lr-num{background:var(--blue);color:#fff}
.lesson-row.locked{opacity:.55;background:#f0e8d4}.lesson-row.locked .lr-num{background:#b9ad95;color:#fff}
.sheet-body p{margin:0 0 10px;line-height:1.35}.daily-info{display:flex;gap:10px;align-items:flex-end;margin-bottom:6px}.daily-info p{flex:1;margin:0 0 10px}
.two-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px}

/* ======================= УРОК: сцена → доска → действия ======================= */
#view-lesson{background:#5fbf55}
.lesson-bg{position:absolute;inset:0;z-index:0;overflow:hidden;background:#a8defd}
.scene-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.mill{animation:spin 16s linear infinite;transform-box:fill-box;transform-origin:center}@keyframes spin{to{transform:rotate(360deg)}}
#view-lesson>*:not(.lesson-bg){position:relative;z-index:1}
#view-lesson .stage{z-index:6}
.lesson-top{display:flex;align-items:center;gap:7px;padding:calc(8px + var(--safe-t)) 10px 4px;z-index:5}
.lesson-top .round-btn{width:44px;height:44px;flex-basis:44px}
.lesson-prog{flex:1;min-width:0;padding:5px 12px 7px;border-radius:18px;border:2px solid #fff;background:linear-gradient(#fffdf2,#fbeec6);box-shadow:0 3px 0 var(--cream-sd),0 7px 12px rgba(60,40,10,.22)}
.lp-name{display:block;font-weight:900;font-size:13.5px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px}
.lp-row{display:flex;align-items:center;gap:8px}.lp-count{font-size:12.5px;font-weight:900;color:var(--ink2);flex:0 0 auto}
.lesson-steps{display:flex;gap:4px;flex:1}
.ls{flex:1;height:10px;border-radius:5px;background:#e8d8b0;box-shadow:inset 0 1px 2px rgba(100,70,20,.3);transition:background .3s}
.ls.done{background:linear-gradient(#8ee88a,#3dbb52);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.ls.cur{background:linear-gradient(#a6d4ff,#2f8cf0);box-shadow:0 0 0 2px rgba(47,140,240,.25);animation:curPulse 1.6s ease-in-out infinite}
@keyframes curPulse{50%{box-shadow:0 0 0 4px rgba(47,140,240,.18)}}
.xp-pill{display:flex;align-items:center;gap:3px;height:40px;padding:0 10px 0 7px;border-radius:20px;border:2px solid #fff;background:linear-gradient(#fffdf2,#fbeec6);box-shadow:0 3px 0 var(--cream-sd),0 7px 12px rgba(60,40,10,.22);flex:0 0 auto}
.xp-pill .ic{width:24px;height:24px;color:#ffb800;filter:drop-shadow(0 1px 0 #c88a00)}.xp-pill b{font-size:16px}.xp-pill.dim{opacity:.75}.xp-pill.bump{animation:pop .4s}
.fly-star{position:absolute;width:30px;height:30px;margin:-15px;z-index:90;color:#ffb800;animation:flyStar .62s cubic-bezier(.5,-0.3,.6,1) forwards;filter:drop-shadow(0 2px 3px rgba(150,90,0,.5))}.fly-star .ic,.fly-star svg{width:100%;height:100%}
@keyframes flyStar{0%{transform:translate(0,0) scale(.6)}30%{transform:translate(calc(var(--tx)*.25),calc(var(--ty)*.4 - 60px)) scale(1.5) rotate(90deg)}100%{transform:translate(var(--tx),var(--ty)) scale(.7) rotate(300deg)}}
/* сцена с Яшей */
.stage{position:relative;flex:1 1 0;min-height:112px;z-index:1;container-type:size}

#lesson-yasha{position:absolute;left:4px;bottom:-12px;height:min(calc(100% + 8px),236px);width:auto;z-index:2}
#lesson-yasha img{height:100%;width:auto;filter:drop-shadow(0 6px 4px rgba(20,60,20,.35))}
#lesson-yasha::after{content:'';position:absolute;left:18%;right:18%;bottom:4px;height:12px;border-radius:50%;background:rgba(20,70,20,.3);z-index:-1}
.stage-bubble{position:absolute;left:138px;right:12px;bottom:min(56%,166px);max-width:250px;font-size:15px;min-height:46px;z-index:3}
.stage-bubble::before{left:-10px;bottom:10px}
.diff-badge{position:absolute;right:12px;top:4px;display:flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:15px;border:2px solid #fff;background:linear-gradient(#fffdf2,#fbeec6);box-shadow:0 3px 0 var(--cream-sd);font-weight:900;font-size:12.5px;color:var(--ink);z-index:3}
.diff-bars{display:inline-flex;align-items:flex-end;gap:2px;height:16px}.diff-bars i{width:4px;border-radius:2px;background:#dcc89a}
.diff-badge.d1 .diff-bars i.on{background:#3dbb52}.diff-badge.d2 .diff-bars i.on{background:#f0a21c}.diff-badge.d3 .diff-bars i.on{background:#e5483d}
.stage-bird{position:absolute;right:14px;bottom:6px;width:54px;height:46px;border:0;background:none;padding:0;z-index:2;touch-action:manipulation}
.stage-bird svg{width:100%;height:100%;display:block;filter:drop-shadow(0 3px 2px rgba(0,0,0,.25))}.stage-bird .wing{transform-box:fill-box;transform-origin:30% 100%;animation:flap 1.2s ease-in-out infinite}
.stage-bird.cheer svg{animation:birdHop .45s ease-out 3}@keyframes birdHop{50%{transform:translateY(-14px) rotate(-8deg)}}
.combo{position:absolute;left:50%;top:-50px;z-index:8;display:none;align-items:center;gap:6px;padding:4px 12px 4px 4px;border-radius:20px;background:linear-gradient(#fff3a6,#ffcb3d);border:2px solid #fff;box-shadow:0 3px 0 #c88a00,0 8px 14px rgba(120,70,0,.3);font-weight:900;color:#8a4a00;transform:translateX(-50%)}
.combo b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#ff7a1a;color:#fff;font-size:17px;border:2px solid #fff}
.combo.show{display:flex;animation:comboIn 2.4s ease-out forwards}
@keyframes comboIn{0%{transform:translateX(-50%) scale(.3);opacity:0}12%{transform:translateX(-50%) scale(1.15);opacity:1}20%{transform:translateX(-50%) scale(1)}80%{opacity:1}100%{opacity:0;transform:translateX(-50%) translateY(-10px)}}
/* доска задания */
.task-panel{position:relative;z-index:2;flex:0 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;margin:0 10px;padding:10px 12px 14px;border-radius:24px;
 background:linear-gradient(#fffaf0,#fff2d3) padding-box,repeating-linear-gradient(90deg,#b77a3d 0 9px,#a56a33 9px 15px,#b9803f 15px 26px) border-box;border:7px solid transparent;
 box-shadow:inset 0 0 0 2px #e8c88a,0 0 0 2px #6a4021,0 12px 22px rgba(30,40,10,.38);-webkit-overflow-scrolling:touch}
.task-panel.enter{animation:boardIn .38s cubic-bezier(.2,.9,.3,1.15)}@keyframes boardIn{from{transform:translateY(24px) scale(.97);opacity:.2}to{transform:none;opacity:1}}
.task-panel.win{box-shadow:inset 0 0 0 2px #e8c88a,0 0 0 2px #6a4021,0 0 0 6px rgba(71,191,85,.55),0 12px 22px rgba(30,40,10,.38)}
.board-plank{display:flex;justify-content:center;margin:-2px 0 8px}
.board-plank span{position:relative;color:#fff3d6;font-weight:900;font-size:15px;padding:6px 26px;border-radius:12px;background:repeating-linear-gradient(92deg,rgba(0,0,0,.06) 0 2px,transparent 2px 11px),linear-gradient(#c98d4d,#a56a33 55%,#94592a);border:2px solid #7a4a22;box-shadow:inset 0 2px 0 rgba(255,235,190,.45),0 3px 0 #5e3a1c;text-shadow:0 2px 0 rgba(70,35,8,.55);white-space:nowrap}
.board-plank span::before,.board-plank span::after{content:'';position:absolute;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:radial-gradient(#ecdcae,#8a6a3a)}.board-plank span::before{left:8px}.board-plank span::after{right:8px}
.panel-tags{display:none}
.task-title{margin:0 0 4px;font-size:21px;line-height:1.18;font-weight:900;color:var(--ink);text-align:center}
.task-instruction{margin:0 0 10px;font-size:13.5px;line-height:1.3;color:var(--ink2);font-weight:700;text-align:center}
.mat{background:linear-gradient(#fffdf5,#fff6dc);border:3px solid #e0c48a;border-radius:20px;padding:10px;box-shadow:inset 0 3px 8px rgba(120,80,30,.14);margin-bottom:12px;touch-action:pan-y}
.lesson-actions{display:flex;gap:10px;padding:10px 12px calc(10px + var(--safe-b));z-index:3}
.lesson-actions .btn-cream{flex:0 0 auto;min-width:0;padding:0 16px;font-size:16px}.lesson-actions .btn-green{flex:1}.lesson-actions .btn .ic{width:24px;height:24px}
.lesson-actions .btn-cream:disabled{opacity:.6}
.answers{display:grid;gap:10px;grid-template-columns:1fr 1fr}.answers.c3{grid-template-columns:repeat(3,1fr)}
.answer{position:relative;min-height:58px;padding:6px 8px;border:0;border-radius:24px 28px 22px 26px;font-weight:900;font-size:26px;color:#4a3a28;
 background:radial-gradient(ellipse at 45% 25%,#fbf8f1,#e3dccd 62%,#cbbfa8);box-shadow:inset 0 3px 0 rgba(255,255,255,.8),inset 0 -5px 0 rgba(110,90,60,.16),0 5px 0 #978a72,0 10px 12px rgba(40,30,10,.22);transition:transform .08s;touch-action:manipulation;line-height:1.1}
.answer::after{content:'';position:absolute;left:12%;right:12%;bottom:-8px;height:12px;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 12'%3E%3Cpath d='M2 12 5 3 8 12M10 12l3-9 2 9M44 12l3-8 3 8M50 12l3-10 3 10' fill='%234aa94c'/%3E%3Ccircle cx='20' cy='9' r='2.6' fill='%23ff6b81'/%3E%3Ccircle cx='39' cy='9' r='2.4' fill='%23fff'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.answer:active{transform:translateY(3px);box-shadow:inset 0 3px 0 rgba(255,255,255,.7),0 2px 0 #978a72}
.answer.textual{font-size:16px}
.answer.sel{background:radial-gradient(ellipse at 45% 25%,#eef7ff,#b9dcfd 70%,#8cc3f5);box-shadow:0 0 0 3px var(--blue),0 4px 0 var(--blue-d)}
.answer.ok{background:radial-gradient(ellipse at 45% 25%,#f0fbec,#b5e6a9 70%,#8fd47f);box-shadow:0 0 0 3px var(--green),0 4px 0 var(--green-d);animation:pop .4s}
.answer.bad{background:radial-gradient(ellipse at 45% 25%,#fff0ee,#ffc2b9 70%,#f59b8f);box-shadow:0 0 0 3px var(--red),0 4px 0 #a8281f;animation:shake .45s}
.feedback{display:flex;gap:10px;align-items:flex-start;margin-top:12px;padding:10px 12px;border-radius:16px;font-size:14px;line-height:1.3;animation:popIn .3s}
.feedback b{display:block}.feedback .why{font-weight:700;margin-top:3px;opacity:.9}
.fb-ic{width:30px;height:30px;flex:0 0 30px;border-radius:50%;display:grid;place-items:center;color:#fff}.fb-ic .ic{width:18px;height:18px}
.feedback.good{background:#e3f8df;color:#1f6b2a;border:2px solid #9ad98f}.feedback.good .fb-ic{background:var(--green)}
.feedback.info{background:#fff0d0;color:#7a4a12;border:2px solid #f0c978}.feedback.info .fb-ic{background:#f0a21c}
@keyframes popIn{0%{transform:scale(.85);opacity:0}70%{transform:scale(1.05)}100%{transform:scale(1);opacity:1}}
.pop-in{animation:popIn .32s ease-out}
.readout{text-align:center;margin-top:8px;font-weight:800;font-size:14px;color:var(--ink2)}.readout b{font-size:19px;color:var(--blue-ink)}.readout b.okc{color:#1f8a2e}.tiny-note{display:block}
.eq{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}.eq>b{font-size:26px;color:var(--ink2)}
.piece{min-width:52px;height:54px;padding:0 10px;border-radius:15px;display:inline-grid;place-items:center;font-weight:900;font-size:25px;background:#fff;border:3px solid #e0c48a;color:var(--ink);box-shadow:0 3px 0 #d8c08a}
.piece.blank{border-style:dashed;color:#b08a50;background:#fff8e4}.piece.filled{background:#d9f5d3;border:3px solid var(--green);color:#1f6b2a;box-shadow:0 3px 0 #2b8f3a}
.piece.big{min-width:66px;height:70px;font-size:34px}.piece.sign.filled{background:#dcecff;border-color:var(--blue);color:var(--blue-ink);box-shadow:0 3px 0 var(--blue-d)}
.piece.wrong{position:relative;background:#ffe1dd;border-color:var(--red);color:#c43c32;box-shadow:0 3px 0 #a8281f}.piece.wrong i{position:absolute;right:-8px;top:-9px;width:22px;height:22px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;border:2px solid #fff}.piece.wrong i .ic{width:12px;height:12px}
.seq{display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:nowrap}.seq .piece{flex:0 1 56px;min-width:0;padding:0 2px}.seq-dot{flex:0 0 6px;width:6px;height:6px;border-radius:50%;background:#e0c48a}
.cmp{display:flex;align-items:center;justify-content:center;gap:14px}.cmp-bars{margin-top:12px;display:grid;gap:5px}.cmp-bars i{display:block;height:12px;border-radius:6px;background:linear-gradient(#63b8ff,#2f8cf0)}.cmp-bars i.b{background:linear-gradient(#ffd96a,#f0a21c)}
.oops{display:flex;align-items:center;gap:10px;justify-content:center;margin-top:12px;font-weight:800;color:var(--ink2);font-size:14px}
.yasha-ic{width:42px;height:42px;border-radius:50%;overflow:hidden;background:#cfeaff;border:3px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.2);flex:0 0 42px}.yasha-ic img{width:100%;height:100%;object-fit:cover;display:block}.yasha-ic.lg{width:72px;height:72px;flex-basis:72px;margin:0 auto 8px}
/* объекты (счёт) */
.obj-grid{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.obj{position:relative;width:50px;height:58px;padding:4px;border:0;border-radius:14px;background:linear-gradient(#fffefa,#f6e7c2);box-shadow:inset 0 2px 0 #fff,0 3px 0 #d8c08a;touch-action:manipulation}
.obj img{width:100%;height:100%;object-fit:contain;display:block}.obj-grid.sm .obj{width:42px;height:50px}
.obj.on{background:linear-gradient(#e2f6da,#c3eab6);box-shadow:0 0 0 3px var(--green),0 3px 0 var(--green-d)}
.obj-n{position:absolute;right:-5px;top:-7px;min-width:22px;height:22px;padding:0 4px;border-radius:11px;background:var(--blue);color:#fff;font-size:13px;font-weight:900;display:grid;place-items:center;border:2px solid #fff;box-shadow:0 2px 0 var(--blue-d)}
/* логика: фишки */
.logic{display:grid;gap:10px}.lg-row{display:flex;align-items:center;gap:8px}.lg-lab{flex:0 0 54px;font-size:12px;font-weight:900;color:var(--ink2)}.lg-chips{display:flex;flex-wrap:wrap;align-items:center;gap:3px;flex:1}
.chip{display:inline-block;width:20px;height:20px;border-radius:50%}.chip.red{background:radial-gradient(circle at 35% 30%,#ff9a8a,#e5483d 60%,#b3261e);box-shadow:0 2px 0 #8a1c15}
.chip.blue.ghost{border:2.5px dashed var(--blue);background:rgba(47,140,240,.1)}.chip.blue.ghost.extra{border-color:#f0a21c;background:rgba(255,203,61,.3)}
.lg-plus{font-weight:900;color:var(--ink2);margin:0 3px}.lg-legend{display:flex;gap:14px;justify-content:center;font-size:12px;font-weight:800;color:var(--ink2)}.lg-legend span{display:flex;align-items:center;gap:5px}.lg-legend .chip{width:16px;height:16px}
/* фигуры */
.shape-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.shape-btn{position:relative;aspect-ratio:1.15;border:0;border-radius:16px;background:linear-gradient(#fffefa,#f6e7c2);box-shadow:inset 0 2px 0 #fff,0 3px 0 #d8c08a;display:grid;place-items:center;padding:6px;touch-action:manipulation}
.shape-svg{width:62%;height:auto;filter:drop-shadow(0 2px 1px rgba(0,0,0,.25))}
.shape-btn.sel{background:linear-gradient(#e2f6da,#c3eab6);box-shadow:0 0 0 3px var(--green),0 3px 0 var(--green-d)}
.sel-mark{position:absolute;right:5px;top:5px;width:22px;height:22px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;border:2px solid #fff}.sel-mark .ic{width:12px;height:12px}
/* порядок */
.sort-dir{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;font-weight:900;color:var(--ink2);margin-bottom:8px}.sort-dir .ic{width:18px;height:18px;color:var(--blue)}
.sort-slots{display:flex;gap:8px;justify-content:center}
.slot{width:64px;height:64px;border-radius:17px;border:3px dashed #c8a96a;background:#fff8e4;font-weight:900;font-size:26px;color:#c8a96a;padding:0;transition:transform .12s,background .12s}
.slot.full{border:3px solid var(--green);background:#d9f5d3;color:#1f6b2a;box-shadow:0 3px 0 var(--green-d)}.slot.hover{background:#fff1b8;border-color:#f0a21c;transform:scale(1.07)}
.sort-pool{display:flex;gap:10px;justify-content:center;margin-top:14px}
.chipnum{width:62px;height:62px;border-radius:50%;border:0;font-weight:900;font-size:25px;color:var(--ink);background:radial-gradient(circle at 35% 28%,#fff0a8,#ffcb3d 70%);box-shadow:inset 0 -3px 0 rgba(160,90,0,.25),0 4px 0 #c88a00,0 8px 10px rgba(80,50,0,.2);cursor:grab;touch-action:none}
.chipnum.dragging{opacity:.35}.chipnum.gone{opacity:.25;box-shadow:none;background:none;border:3px dashed #c8a96a;color:transparent}
.mini-actions{display:flex;justify-content:center;margin-top:10px}
.btn-mini{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 14px;border:0;border-radius:14px;font-weight:900;font-size:13.5px;color:var(--ink);background:linear-gradient(#fffdf2,#fbeec6);box-shadow:0 3px 0 var(--cream-sd);touch-action:manipulation}.btn-mini:disabled{opacity:.45}.btn-mini .ic{width:18px;height:18px}
.btn-mini.go{min-width:44px;min-height:44px;border-radius:50%;padding:0;justify-content:center;background:linear-gradient(#76e070,#3dbb52);color:#fff;box-shadow:0 3px 0 var(--green-d)}
/* часть и целое */
.pw{display:flex;flex-direction:column;align-items:center}.pw-c{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;font-size:30px;font-weight:900;background:radial-gradient(circle at 35% 28%,#fff0a8,#ffcb3d 70%);box-shadow:0 4px 0 #c88a00;color:var(--ink)}
.pw-c.small{width:58px;height:58px;font-size:26px;background:radial-gradient(circle at 35% 28%,#d9edff,#8ec5fb 75%);box-shadow:0 4px 0 var(--blue-d)}.pw-c.blank{background:#fff8e4;border:3px dashed #c8a96a;box-shadow:none;color:#c8a96a}.pw-c.filled{background:radial-gradient(circle at 35% 28%,#e2f6da,#8fdc84 75%);box-shadow:0 4px 0 var(--green-d);border:0}
.pw-top,.pw-bot>div{display:flex;flex-direction:column;align-items:center;gap:3px}.pw em,.pw-top em{font-style:normal;font-size:12px;font-weight:800;color:var(--ink2)}.pw-lines{width:70%;height:26px}.pw-bot{display:flex;justify-content:space-between;gap:10px;width:100%}
.pw-side{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px}
.pw-basket,.pw-table{width:100%;min-height:64px;display:flex;flex-wrap:wrap;justify-content:center;align-content:flex-end;padding:6px 6px 8px}
.pw-basket{border-radius:6px 6px 24px 24px;background:repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0 3px,transparent 3px 12px),linear-gradient(#e3b073,#c58d4c);border:3px solid var(--wood-d);box-shadow:inset 0 4px 8px rgba(0,0,0,.2)}
.pw-table{border-radius:12px;background:linear-gradient(#e7c48e,#d1a565);border:3px solid #a8743a;box-shadow:inset 0 -6px 0 rgba(120,70,20,.25),0 4px 0 #8a5a2b;align-content:center}
.pw-table.show .pw-ap{animation:popIn .35s both}.pw-cover{font-size:30px;font-weight:900;color:#fff8e4;text-shadow:0 2px 0 rgba(90,50,10,.4)}
.pw-ap img{width:26px;height:27px;object-fit:contain;display:block;margin:-2px -1px}
/* мост / доски */
.bridge-row{display:flex;flex-wrap:wrap;gap:3px;justify-content:center;min-height:30px;align-items:center;margin-bottom:10px}
.plank-ic{display:inline-block;width:26px;height:17px;border-radius:4px;background:linear-gradient(#e0ab63,#b97b3a);border:1.5px solid #7a4d26;box-shadow:inset 0 2px 0 rgba(255,235,190,.5)}.plank-ic.new{background:linear-gradient(#ffe08a,#f0b84a);box-shadow:0 0 0 2px var(--gold)}
.big-plate{padding:6px 16px;border-radius:10px;background:linear-gradient(#e0ab63,#b97b3a);border:2px solid #7a4d26;font-weight:900;color:#fff3d6;text-shadow:0 2px 0 #5e3a1c}
.bridge-src{display:flex;align-items:center;gap:10px;margin:6px 0 10px;justify-content:center}.hint-txt{font-size:12.5px;font-weight:800;color:var(--ink2);max-width:120px;line-height:1.2}
.pile{position:relative;min-width:92px;min-height:66px;border-radius:16px;background:#f3e2b4;border:3px dashed #c8a96a;cursor:grab;touch-action:none;display:flex;gap:3px;align-items:center;justify-content:center;padding:6px 8px;flex-wrap:wrap;color:var(--ink)}
.pile:disabled{opacity:.5;cursor:default}.pile.dragging{opacity:.4}.pile b{font-size:20px;margin-left:4px}.pile em{font-size:11.5px;font-weight:800;font-style:normal;color:var(--ink2);flex-basis:100%;text-align:center;line-height:1}
.pile.apple img{width:34px;height:36px;object-fit:contain;margin-left:-8px}.pile.apple img:first-child{margin-left:0}
/* неизвестное: корзина */
.basket{margin:10px 0;padding:8px;min-height:60px;border-radius:6px 6px 24px 24px;background:repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0 3px,transparent 3px 14px),linear-gradient(#e3b073,#c58d4c);border:3px solid var(--wood-d);box-shadow:inset 0 4px 8px rgba(0,0,0,.2);transition:transform .12s}.basket.hover{transform:scale(1.03);box-shadow:inset 0 4px 8px rgba(0,0,0,.2),0 0 0 4px var(--gold)}
.bk-items{display:flex;flex-wrap:wrap;gap:1px;justify-content:center}.bk-i img{width:28px;height:30px;object-fit:contain;display:block}.bk-i.new img{filter:drop-shadow(0 0 4px #ffe36a)}
.adder{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:10px}
.ctl{width:54px;height:54px;border-radius:50%;border:0;display:grid;place-items:center;color:#fff;background:linear-gradient(#63b8ff,#2f8cf0);box-shadow:inset 0 2px 0 rgba(255,255,255,.5),0 4px 0 var(--blue-d),0 8px 10px rgba(20,60,120,.25);touch-action:manipulation}.ctl .ic{width:28px;height:28px}.ctl:active{transform:translateY(3px);box-shadow:0 1px 0 var(--blue-d)}.ctl.big{width:66px;height:66px}
.ctl.ten{width:48px;height:48px;font-size:15px;font-weight:900;background:linear-gradient(#ffd96a,#f0a21c);box-shadow:inset 0 2px 0 rgba(255,255,255,.5),0 4px 0 #b36a00;color:#5a3000}.adder:has(.ten){gap:7px}
.ctr{min-width:58px;text-align:center;font-size:38px;font-weight:900;color:var(--blue-ink);line-height:1}
/* рамка десятка */
.tenframe{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;padding:9px;border-radius:18px;background:repeating-linear-gradient(92deg,rgba(0,0,0,.06) 0 2px,transparent 2px 12px),linear-gradient(#c98d4d,#a56a33);border:3px solid var(--wood-d);box-shadow:inset 0 3px 6px rgba(0,0,0,.25)}
.tcell{aspect-ratio:1;border-radius:13px;border:0;padding:3px;display:grid;place-items:center;background:#fff6dc;box-shadow:inset 0 2px 5px rgba(120,80,30,.3);transition:transform .12s,background .12s;touch-action:manipulation}
.tcell.empty{border:2.5px dashed #c9a76a;background:#fff2cc}.tcell.hover{background:#fff1b8;transform:scale(1.08)}.tcell img{width:92%;height:92%;object-fit:contain}.tcell.added img{filter:drop-shadow(0 0 5px #ffcb3d)}
/* числовая прямая */
.nl-wrap{overflow-x:auto;overflow-y:hidden;padding:46px 0 8px;scrollbar-width:none;margin:0 -4px}.nl-wrap::-webkit-scrollbar{display:none}
.nl-track{display:flex;gap:7px;width:max-content;padding:0 14px}
.stone{position:relative;flex:0 0 46px;height:38px;border-radius:13px 13px 17px 17px;display:grid;place-items:center;font-weight:900;font-size:17px;color:#46555f;background:linear-gradient(#d9dfe3,#aab4bb);box-shadow:inset 0 2px 0 rgba(255,255,255,.65),0 4px 0 #7d8b97}
.stone.start{outline:3px dashed rgba(47,140,240,.55);outline-offset:2px}.stone.on{background:linear-gradient(#ffe590,#ffcb3d);color:var(--ink);box-shadow:inset 0 2px 0 rgba(255,255,255,.7),0 4px 0 #c88a00}
.hopper{position:absolute;left:50%;bottom:100%;width:42px;height:42px;margin:0 0 3px -21px;border-radius:50%;overflow:hidden;border:3px solid #fff;background:#cfeaff;box-shadow:0 4px 6px rgba(0,0,0,.3)}.hopper img{width:100%;height:100%;object-fit:cover;display:block}.hopper.hop{animation:hopN .45s ease-out}
@keyframes hopN{0%{transform:translateY(8px) scale(.9)}50%{transform:translateY(-14px)}100%{transform:none}}
.nl-ctl{display:flex;align-items:center;justify-content:space-between;margin-top:6px}.nl-info{text-align:center;font-size:12px;font-weight:800;color:var(--ink2);line-height:1.1}.nl-info .ctr{font-size:42px}
/* разряды */
.pv{display:grid;grid-template-columns:1fr 1fr;gap:10px}.pv-col{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.pv-src{width:100%;height:84px;border-radius:16px;background:#f3e2b4;border:3px dashed #c8a96a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:grab;touch-action:none;color:var(--ink)}.pv-src.dragging{opacity:.4}
.pv-src img{height:52px;width:auto;display:block}.pv-src em{font-size:12px;font-weight:900;font-style:normal;color:var(--ink2)}
.pv-zone{width:100%;min-height:90px;border-radius:16px;background:#fff8e4;border:3px solid #e0c48a;padding:6px;transition:.12s;display:grid;place-items:center}.pv-zone.hover{background:#fff1b8;border-color:#f0a21c}
.pv-items{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;align-items:flex-end}.pv-i{border:0;background:none;padding:0;touch-action:manipulation}.pv-i img{display:block;height:42px;width:auto}.pv-i.stick svg{height:36px;width:auto;display:block}.pv-src svg{height:50px;width:auto;display:block}.pv-empty{font-size:12px;font-weight:800;color:#c8a96a}
.pv-n{font-size:32px;font-weight:900;color:var(--blue-ink);line-height:1}.pv-total{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:10px;font-weight:800;color:var(--ink2)}.pv-total b{font-size:30px;font-style:normal}.pv-total b i{font-style:normal;color:var(--blue-ink)}.pv-total b i.d2{color:#d9740d}.pv-total small{font-size:12px;font-weight:800}
/* сюжет */
.tok-grid{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:12px 0 4px}.tok{position:relative;width:46px;height:52px;padding:4px;border:0;border-radius:13px;background:linear-gradient(#fffefa,#f6e7c2);box-shadow:inset 0 2px 0 #fff,0 3px 0 #d8c08a;touch-action:manipulation}.tok.sm{width:31px;height:35px;padding:2px;border-radius:10px}.tok-grid{gap:5px}
.tok img,.tok .bookic,.obj .bookic{width:100%;height:100%;object-fit:contain;display:block;transition:.2s}.tok.taken .bookic{opacity:.28;filter:grayscale(1)}.tok.taken img{opacity:.28;filter:grayscale(1)}.tok-x{position:absolute;inset:0;display:grid;place-items:center;color:var(--red)}.tok-x .ic{width:22px;height:22px}
.step-chip{margin-top:10px;text-align:center;padding:7px 10px;border-radius:12px;background:#dcecff;color:var(--blue-ink);font-weight:900;font-size:13.5px}
/* измерение */
.ruler{display:flex;gap:0;padding:8px 8px 26px;border:3px solid var(--wood-d);border-radius:12px;background:linear-gradient(#f9e3a4,#f0cf7b)}
.rl-seg{position:relative;min-width:0}.rl-cells{display:flex}.cm{flex:1;min-width:0;height:38px;padding:0;border:0;border-right:1.5px solid rgba(90,53,23,.55);position:relative;font-size:11px;font-weight:900;color:#fff;touch-action:manipulation}
.cm.a{background:#bfe3ff}.cm.b{background:#ffe3a0}.cm.on{background:var(--green)}.rl-seg:first-child .cm:first-child{border-left:1.5px solid rgba(90,53,23,.55)}.cm span{position:absolute;inset:0;display:grid;place-items:center}
.rl-lab{position:absolute;left:0;right:0;bottom:-22px;text-align:center;font-weight:900;font-size:13px}.rl-lab.a{color:var(--blue-ink)}.rl-lab.b{color:#b05a00}
/* перетаскивание */
.drag-ghost{position:fixed;left:0;top:0;z-index:100;pointer-events:none;width:58px;height:58px;will-change:transform}.drag-ghost img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 6px rgba(0,0,0,.35));transform:scale(1.15) rotate(-6deg)}
.drag-ghost span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;font-weight:900;font-size:26px;background:radial-gradient(circle at 35% 28%,#fff0a8,#ffcb3d 70%);box-shadow:0 8px 10px rgba(0,0,0,.3)}
/* эффекты */
.fx-layer{position:absolute;inset:0;pointer-events:none;z-index:80;overflow:hidden}
.fx-p img,.fx-p .ic{width:24px;height:24px;display:block}.fx-p{position:absolute;width:24px;height:24px;margin:-12px;animation:fxp .9s ease-out forwards}@keyframes fxp{0%{transform:translate(0,0) scale(.4) rotate(0);opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(1.1) rotate(var(--r));opacity:0}}
.confetti{position:absolute;top:-14px;width:var(--w);height:calc(var(--w)*1.6);border-radius:2px;animation:conf var(--d) linear forwards}@keyframes conf{0%{transform:translate(0,0) rotate(0)}100%{transform:translate(var(--x),105vh) rotate(720deg)}}

/* ======================= НАГРАДА ======================= */
#view-reward{background:#bfe8ff}
.reward-bg{position:absolute;inset:0;overflow:hidden}.reward-bg img{width:100%;height:100%;object-fit:cover;filter:blur(6px) saturate(1.2);transform:scale(1.2)}.reward-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(rgba(150,215,255,.4),rgba(255,247,225,.55))}
.reward-wrap{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;padding:calc(18px + var(--safe-t)) 14px calc(14px + var(--safe-b));overflow-y:auto;gap:0}
.reward-plank{font-size:22px;min-width:240px;padding:12px 30px}
.reward-yasha{height:178px;margin:10px 0 -22px;z-index:2}.reward-yasha img{height:100%;width:auto}.reward-yasha .yasha-wrap{height:100%}
.reward-card{width:100%;background:linear-gradient(#fffaf0,#fff2d3);border:5px solid var(--wood);outline:2px solid var(--wood-d);border-radius:26px;padding:26px 14px 14px;text-align:center;box-shadow:0 12px 24px rgba(40,30,10,.3)}
.reward-lesson{font-size:19px;font-weight:900;line-height:1.15}.reward-stars{display:flex;justify-content:center;gap:6px;margin:8px 0 4px;min-height:54px}.rs{width:54px;height:54px;color:#d9c28e;transform:scale(.3);opacity:0;animation:starIn .5s var(--d) forwards}.rs .ic{width:100%;height:100%;filter:drop-shadow(0 3px 0 rgba(0,0,0,.18))}.rs.on{color:#ffb800}
@keyframes starIn{60%{transform:scale(1.25) rotate(8deg)}100%{transform:scale(1);opacity:1}}
.reward-details{margin:4px 0 10px;font-weight:700;color:var(--ink2);line-height:1.3;font-size:14px}.reward-chips{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.rchip{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:16px;background:#fff;border:2px solid #f0dca4;font-weight:900;color:var(--ink)}.rchip img{width:20px;height:24px;object-fit:contain}.rchip .ic{width:24px;height:24px}.rchip .ic{color:#ff7a1a}.rchip.muted{color:var(--ink2);font-weight:800}
.ach-new{display:flex;align-items:center;gap:10px;text-align:left;padding:9px 12px;margin-bottom:8px;border-radius:16px;background:linear-gradient(#fff6c8,#ffe48a);border:2px solid #f0b21c;animation:popIn .5s}.ach-new .ic{width:34px;height:34px;color:#c88a00}.ach-new small{display:block;font-size:11.5px;font-weight:800;color:#8a5a00}.ach-new b{font-size:15px}
.reward-btns{display:grid;gap:10px;margin-top:6px}

/* ======================= СТРАНИЦЫ ======================= */
.page{background:linear-gradient(#bfe8ff,#e3f5cf 45%,#fff3d4)}
.page-top{display:flex;align-items:center;justify-content:center;gap:10px;padding:calc(10px + var(--safe-t)) 12px 6px}.page-plank{flex:1;max-width:300px;font-size:17px;padding:9px 22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.page-scroll{flex:1;min-height:0;overflow-y:auto;padding:8px 12px 100px;-webkit-overflow-scrolling:touch}
.page-hero{display:flex;align-items:flex-end;gap:12px;margin-bottom:14px}.page-hero .bubble{flex:1;margin-bottom:18px}.page-hero .yasha-wrap.small{width:84px;flex-basis:84px}
.empty{text-align:center}.empty h3{margin:4px 0}.empty p{color:var(--ink2);margin:0 0 12px}
.skill-list{display:grid;gap:8px}.skill-row{display:flex;align-items:center;gap:10px;background:#fff;border-radius:16px;padding:10px 12px;box-shadow:0 3px 0 #e2cb94}.skill-row.ro{box-shadow:none;border:2px solid #f1e2bb}
.sk-main{flex:1;min-width:0;display:grid;gap:5px}.sk-main b{font-size:15px}.sk-main small{font-size:12px;color:var(--ink2);font-weight:700}.sk-main small em{color:#b05a00;font-style:normal;font-weight:900}.sk-main small em.up{color:#1f8a2e}.sk-main small em.down{color:#c43c32}
.level-card{display:flex;align-items:center;gap:14px}.lv-badge{width:64px;height:64px;flex:0 0 64px;border-radius:50%;display:grid;place-items:center;font-size:30px;font-weight:900;color:#fff;background:radial-gradient(circle at 35% 28%,#ffe590,#f0a21c 75%);border:4px solid #fff;box-shadow:0 4px 0 #b36a00;text-shadow:0 2px 0 rgba(120,60,0,.5)}
.lv-info{flex:1;display:grid;gap:6px}.lv-info small{font-size:12px;color:var(--ink2);font-weight:700}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:6px}.stat{background:linear-gradient(#fffaf0,#fff3d6);border-radius:18px;border:3px solid #fff;box-shadow:0 3px 0 #d8c08a;padding:10px 4px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}.stat img,.stat>.ic{width:30px;height:30px;object-fit:contain}.stat .flame .ic{width:30px;height:30px}.stat b{font-size:22px}.stat small{font-size:11.5px;color:var(--ink2);font-weight:800}
.ach-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ach{background:#f3ead2;border-radius:18px;padding:12px 10px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;border:2px solid #e8dab4;color:#8f8062}.ach b{font-size:14px;line-height:1.1}.ach small{font-size:11.5px;font-weight:700;line-height:1.15}.ach .meter{width:100%;height:8px}
.ach-ic{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#e0d6bd;color:#fff}.ach-ic .ic{width:24px;height:24px}
.ach.got{background:linear-gradient(#fffaf0,#fff0c4);border-color:#f0c64a;color:var(--ink);box-shadow:0 3px 0 #d8b04a}.ach.got .ach-ic{background:radial-gradient(circle at 35% 28%,#ffe590,#f0a21c 75%);box-shadow:0 3px 0 #b36a00}
.find-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.fd{background:#f3ead2;border-radius:16px;padding:10px 6px;text-align:center;border:2px dashed #d9c8a0}.fd svg{width:42px;height:42px;opacity:.25;filter:grayscale(1)}.fd small{display:block;font-size:11px;font-weight:800;color:#9a8a6a;line-height:1.1;margin-top:3px}.fd.got{background:linear-gradient(#fffaf0,#fff0c4);border:2px solid #f0c64a}.fd.got svg{opacity:1;filter:none}.fd.got small{color:var(--ink)}
/* родители */
.gate-card{text-align:center;padding:20px 16px}.gate-card p{margin:0 0 10px;color:var(--ink2);line-height:1.35}.adult-q{font-size:36px;font-weight:900;margin:8px 0}.adult-in{width:140px;height:58px;text-align:center;font-size:30px;font-weight:900;border:3px solid #e0c48a;border-radius:16px;background:#fff;color:var(--ink);margin-bottom:6px}
.gate-msg{min-height:20px;color:#c43c32;font-weight:800;font-size:14px;margin-bottom:6px}.pin-dots{display:flex;justify-content:center;gap:14px;margin:12px 0 4px}.pin-dots i{width:20px;height:20px;border-radius:50%;border:3px solid #c8a96a;background:#fff8e4}.pin-dots i.on{background:var(--blue);border-color:var(--blue-d)}
.keypad{display:grid;grid-template-columns:repeat(3,76px);gap:10px;justify-content:center;margin:8px 0}.keypad button{height:62px;border:0;border-radius:20px;font-size:28px;font-weight:900;color:var(--ink);background:linear-gradient(#fffefa,#fbeec8);box-shadow:0 4px 0 var(--cream-sd);touch-action:manipulation}.keypad button:active{transform:translateY(3px);box-shadow:0 1px 0 var(--cream-sd)}.keypad .alt{background:none;box-shadow:none;color:var(--ink2)}.keypad button:disabled{visibility:hidden}
.link{background:none;border:0;color:var(--blue-ink);font-weight:800;text-decoration:underline;font-size:14px;padding:8px;min-height:44px}
.parent-scroll .card{margin-bottom:12px}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:8px}.metric{background:#fff;border-radius:16px;padding:10px;text-align:center;border:2px solid #f1e2bb}.metric b{display:block;font-size:26px;color:var(--blue-ink)}.metric b small{font-size:14px;color:var(--ink2)}.metric span{font-size:12px;font-weight:800;color:var(--ink2);line-height:1.1;display:block}
.bars{display:flex;gap:6px;align-items:flex-end;height:120px}.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;height:100%}.bar-wrap{flex:1;width:100%;display:flex;align-items:flex-end;background:#f3ead2;border-radius:8px;overflow:hidden}.bar-wrap i{display:block;width:100%;border-radius:8px 8px 0 0;background:linear-gradient(#7ee07a,#3dbb52);min-height:3px}.bar-wrap i.zero{background:#e0d6bd}.bar-col b{font-size:12px;height:16px}.bar-col small{font-size:11px;font-weight:800;color:var(--ink2)}
.rec{display:flex;flex-direction:column;gap:8px;padding:10px 0;border-bottom:2px dashed #e6d3a4}.rec:last-of-type{border:0}.rec p{margin:3px 0 0;font-size:13px;color:var(--ink2);line-height:1.3}.due{margin-top:8px;padding:9px 12px;border-radius:14px;background:#fff0d0;color:#7a4a12;font-size:13px}
.hist-row{display:grid;grid-template-columns:64px 1fr auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid #f1e2bb;font-size:13.5px}.hist-row span:first-child{color:var(--ink2);font-weight:800;font-size:12px}.stars-s{display:flex;color:#d9c28e}.stars-s .on{color:#ffb800}.stars-s .ic{width:15px;height:15px}
.parent-scroll .btn.wide{margin-bottom:10px}.parent-scroll .btn.wide:last-of-type{margin-bottom:0}

/* ======================= АДАПТАЦИЯ ======================= */
@media (max-width:420px){.av-text{display:none}.av-lv{display:grid}.hud-avatar{padding:0 4px}}
@media (max-width:380px){
.pill{padding:0 9px 0 6px;font-size:15px}.hud{gap:5px;padding-left:8px;padding-right:8px}.task-title{font-size:19px}.answer{font-size:22px}.piece{min-width:46px;height:50px;font-size:22px}
 .keypad{grid-template-columns:repeat(3,70px)}.station{width:104px}.st-sign b{font-size:11px}}
@media (max-height:700px){
 .stage{min-height:96px}.stage-bubble{left:96px;font-size:13px;padding:7px 11px;min-height:38px}#lesson-yasha{height:min(calc(100% + 8px),170px)}.diff-badge{display:none}
 .task-title{font-size:18px}.task-instruction{font-size:12.5px;margin-bottom:7px}.mat{padding:8px;margin-bottom:9px}.answer{min-height:50px;font-size:21px}.lesson-top{padding-top:calc(5px + var(--safe-t))}.lesson-steps{padding-top:2px}
 .btn{min-height:50px}.reward-yasha{height:140px}.reward-stars{min-height:44px}.rs{width:44px;height:44px}.obj{width:44px;height:50px}.slot,.chipnum{width:56px;height:56px}.piece.big{height:62px}
 .play-cta{min-height:56px;bottom:calc(80px + var(--safe-b))}.cta-main{font-size:19px}.navbtn{min-height:50px}.bottomnav{bottom:calc(6px + var(--safe-b))}}
body.no-motion *,body.no-motion *::before,body.no-motion *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
body.no-motion .view.active{animation:none}
img:not([src]){display:none}
/* облачко Яши не должно наезжать на значок сложности при невысокой сцене */
@container (max-height:236px){.stage .stage-bubble{bottom:auto;top:40px}}
@container (max-height:150px){.stage .diff-badge{display:none}.stage .stage-bubble{top:4px}}
@media (max-height:700px){.answer{min-height:48px;font-size:22px;border-radius:20px 24px 18px 22px}.answers{gap:8px}.board-plank{margin-bottom:5px}.board-plank span{font-size:14px;padding:5px 22px}.task-panel{padding:8px 10px 12px}}
.more-cue{position:sticky;bottom:-14px;height:0;pointer-events:none}
.more-cue::before{content:'';position:absolute;left:0;right:0;bottom:0;height:46px;background:linear-gradient(rgba(255,242,211,0),#fff2d3 80%);opacity:0;transition:opacity .2s}
.more-cue::after{content:'';position:absolute;left:50%;bottom:6px;width:30px;height:30px;margin-left:-15px;border-radius:50%;background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%23fff' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat;box-shadow:0 3px 0 var(--blue-d);opacity:0;transition:opacity .2s}
.task-panel.can-scroll .more-cue::before,.task-panel.can-scroll .more-cue::after{opacity:1}.task-panel.can-scroll .more-cue::after{animation:cueBob 1.2s ease-in-out infinite}
@keyframes cueBob{50%{transform:translateY(4px)}}
/* карточка-история главы */
.story-card{text-align:center}.story-card h2{margin:2px 0 8px;font-size:23px}.story-card p{margin:0 0 16px;font-size:15.5px;line-height:1.4;font-weight:700;color:var(--ink2)}
.story-art{position:relative;height:190px;margin:-4px -4px 12px;border-radius:22px;overflow:hidden;border:4px solid #fff;box-shadow:0 0 0 3px var(--wood),0 8px 16px rgba(40,30,10,.3)}
.story-art .scene-svg{position:absolute;inset:0;width:100%;height:100%}.sheet-close{z-index:5}
.story-yasha{position:absolute;left:10px;bottom:-6px;height:150px;filter:drop-shadow(0 5px 4px rgba(0,0,0,.3));animation:wave 1.1s ease-in-out 2}
.story-ch{display:inline-block;padding:3px 12px;border-radius:12px;background:#dcecff;color:var(--blue-ink);font-weight:900;font-size:12.5px}
.scene-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;display:block;max-width:none}
.story-art .scene-art{inset:0!important;width:100%!important;height:100%!important;left:0!important;top:0!important}.story-art .scene-art{object-position:50% 32%}

/* ===== станции на рисованной карте: табличка над полянкой + значок на полянке ===== */
.world .station{width:176px;transform:translate(-50%,calc(-100% + 26px));gap:3px;z-index:5}
.world .station .st-sign{order:0;margin:0;min-width:0;max-width:176px;flex-direction:row;gap:6px;padding:5px 10px 6px 5px;border-radius:12px;
 background:repeating-linear-gradient(92deg,rgba(0,0,0,.05) 0 2px,transparent 2px 10px),linear-gradient(#fff6dc,#f0d9a2);border:2.5px solid #8a5a2b;box-shadow:0 3px 0 #6a4021,0 7px 10px rgba(30,30,10,.35)}
.world .station .st-sign b{font-size:12.5px;text-align:left}
.world .station .st-num{position:static;width:26px;height:26px;flex:0 0 26px;font-size:14px;border-width:2px;box-shadow:0 2px 0 rgba(0,0,0,.25)}
.world .station .st-pips,.world .station .st-stars{order:1;padding:2px 6px;border-radius:8px;background:rgba(255,248,225,.92);box-shadow:0 2px 0 rgba(90,60,20,.3)}
.world .station .st-badge{position:static;order:2;width:52px;height:52px;border-width:3px;margin-top:2px;box-shadow:0 4px 0 rgba(0,0,0,.28),0 8px 12px rgba(0,0,0,.25)}
.world .station .st-badge .ic{width:26px;height:26px}
.world .station.open .st-badge{background:linear-gradient(#63b8ff,#2f8cf0)}.world .station.done .st-badge{background:linear-gradient(#7ee07a,#3dbb52)}.world .station.locked .st-badge{background:linear-gradient(#b9c3cc,#8e9aa4)}
.world .station.locked .st-sign{filter:grayscale(.8);opacity:.9}
.world .station .st-glow{top:auto;bottom:-36px;width:130px;height:130px;margin-left:-65px}
.world .station .st-now{top:-16px;bottom:auto;left:auto;right:2px;transform:none;animation:bobY 1.6s ease-in-out infinite;z-index:4}
@keyframes bobY{50%{transform:translateY(-4px)}}
.world .station:active .st-badge{transform:translateY(3px)}
.world .station.shake{animation:shakeW .45s}@keyframes shakeW{20%{transform:translate(calc(-50% - 6px),calc(-100% + 26px))}40%{transform:translate(calc(-50% + 6px),calc(-100% + 26px))}60%{transform:translate(calc(-50% - 3px),calc(-100% + 26px))}}
.world .map-yasha{width:min(84px,21vw);z-index:8;transform:translate(-50%,-100%)}.world .map-y-btn{width:100%}

/* ======================= v3.2: гардероб, пазлы, новые механики ======================= */
.y-acc-wrap{position:absolute;inset:0;pointer-events:none}
.y-acc{position:absolute;display:block}.y-acc svg{display:block;width:100%;height:auto;filter:drop-shadow(0 2px 1px rgba(40,20,0,.28))}
/* весы */
.scales{position:relative;height:178px;margin:2px auto 0;max-width:330px}
.sc-beam{position:absolute;left:23%;right:23%;top:30px;height:10px;border-radius:5px;background:linear-gradient(#d39a58,#8a5a2b);box-shadow:0 2px 0 #5e3a1c;transform:rotate(var(--ang));transform-origin:50% 50%;transition:transform .5s cubic-bezier(.3,1.5,.5,1);z-index:2}
.sc-beam::after{content:'';position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px;border-radius:50%;background:radial-gradient(#ffe590,#c88a00);box-shadow:0 1px 0 #7a4a00}
.sc-arm{position:absolute;left:-2px;top:4px;width:0}.sc-arm.r{left:auto;right:-2px}
.sc-pan{position:absolute;top:0;left:-58px;width:116px;transform:rotate(calc(-1 * var(--ang)));transform-origin:50% 0;transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.sc-pan::before{content:'';position:absolute;left:12px;right:12px;top:0;height:70px;border:2px solid #8a6a3a;border-bottom:0;border-radius:50% 50% 0 0/100% 100% 0 0;clip-path:polygon(50% 0,0 100%,100% 100%);background:none}
.sc-items{position:absolute;left:6px;right:6px;top:22px;height:52px;display:flex;flex-wrap:wrap-reverse;align-content:flex-start;justify-content:center;gap:0}
.sc-ap img{width:22px;height:23px;object-fit:contain;display:block;margin:-1px}.sc-ap.new img{filter:drop-shadow(0 0 3px #ffcb3d)}
.sc-dish{position:absolute;left:0;right:0;top:72px;height:14px;border-radius:0 0 60px 60px;background:linear-gradient(#e0b070,#a8743a);border:2px solid #7a4d26}
.sc-post{position:absolute;left:50%;top:36px;width:12px;margin-left:-6px;height:118px;background:linear-gradient(90deg,#a8743a,#d39a58,#a8743a);border-radius:4px}
.sc-base{position:absolute;left:50%;bottom:6px;width:120px;margin-left:-60px;height:18px;border-radius:9px 9px 4px 4px;background:linear-gradient(#d39a58,#8a5a2b);box-shadow:0 3px 0 #5e3a1c}
.sc-arm[data-drop].hover .sc-dish{box-shadow:0 0 0 4px var(--gold)}
.scales.level .sc-beam::after{background:radial-gradient(#b8f5a8,#3dbb52)}
/* ярмарка: монетки */
.shop{display:flex;gap:10px;align-items:stretch}
.shop-item{flex:0 0 96px;position:relative;border-radius:16px;background:linear-gradient(#fffefa,#f6e7c2);box-shadow:inset 0 2px 0 #fff,0 3px 0 #d8c08a;display:grid;place-items:center;padding:8px 6px 26px}
.shop-item img,.shop-item .bookic{width:62px;height:62px;object-fit:contain}
.tag-price{position:absolute;left:8px;right:8px;bottom:6px;display:flex;align-items:baseline;justify-content:center;gap:3px;border-radius:10px;background:#e5483d;color:#fff;font-weight:900;font-size:18px;box-shadow:0 2px 0 #a8281f}.tag-price small{font-size:10.5px}
.purse{flex:1;min-height:104px;border-radius:18px 18px 30px 30px;border:3px dashed #c8a96a;background:#fff8e4;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:5px;padding:8px;transition:.15s}
.purse em{font-size:12.5px;font-weight:800;color:#b08a50;font-style:normal;text-align:center}.purse.hover{background:#fff1b8;border-color:#f0a21c}.purse.ok{border:3px solid var(--green);background:#e3f8df}.purse.over{border-color:var(--red);background:#ffe9e5}
.coin{width:40px;height:40px;border-radius:50%;border:0;padding:0;font-weight:900;font-size:16px;color:#6a4000;display:grid;place-items:center;touch-action:none;
 background:radial-gradient(circle at 35% 30%,#fff3b0,#ffcb3d 55%,#d99a10);box-shadow:inset 0 0 0 3px rgba(160,100,0,.35),0 3px 0 #a87000}
.coin.c1,.coin.c2{background:radial-gradient(circle at 35% 30%,#ffe2c4,#e8a066 55%,#b8682a);color:#5a2a00;box-shadow:inset 0 0 0 3px rgba(120,60,0,.3),0 3px 0 #8a4a1a}
.coin.c10{background:radial-gradient(circle at 35% 30%,#ffffff,#d6dde4 55%,#9aa8b6);color:#33424f;box-shadow:inset 0 0 0 3px rgba(80,90,100,.3),0 3px 0 #6f7d8a}
.coin.big{width:58px;height:58px;font-size:22px;cursor:grab}.coin-tray{display:flex;justify-content:center;gap:12px;margin-top:12px}.coin.dragging{opacity:.4}
/* узоры из фигур */
.sp-row{display:flex;justify-content:center;gap:3px;flex-wrap:nowrap}.sp-cell{flex:0 1 44px;aspect-ratio:1;border-radius:12px;background:#fff;border:2px solid #e0c48a;display:grid;place-items:center;font-weight:900;color:#b08a50;font-size:22px}
.sp-cell .shape-svg{width:84%}.sp-cell.blank{border-style:dashed;background:#fff8e4}.sp-cell.filled{border:2px solid var(--blue);background:#dcecff}
.answer.shape-ans{min-height:64px}.answer.shape-ans .shape-svg{width:46px}
/* тренировка */
.train-card{display:flex;align-items:center;gap:10px;width:100%;margin-bottom:12px;padding:10px 12px 10px 6px;border:0;border-radius:22px;text-align:left;color:#fff;
 background:radial-gradient(circle at 15% 20%,#ffd36a,transparent 40%),linear-gradient(135deg,#ff9a3c,#e5483d);box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 5px 0 #a8281f,0 10px 16px rgba(120,30,10,.3)}
.tc-art{flex:0 0 74px;height:86px;display:grid;place-items:end center}.tc-art img{height:96px;margin-top:-14px;filter:drop-shadow(0 3px 3px rgba(0,0,0,.3))}
.tc-text{flex:1;display:grid;gap:3px}.tc-text b{font-size:20px;text-shadow:0 2px 0 rgba(0,0,0,.2)}.tc-text small{font-size:12.5px;font-weight:800;line-height:1.25}.tc-text em{font-style:normal;font-size:11.5px;font-weight:900;background:rgba(255,255,255,.22);border-radius:8px;padding:2px 8px;justify-self:start}
.tc-go{width:44px;height:44px;border-radius:50%;background:#fff;color:#e5483d;display:grid;place-items:center;flex:0 0 44px;box-shadow:0 3px 0 rgba(0,0,0,.2)}.tc-go .ic{width:22px;height:22px}
/* кусочек пазла на экране награды */
.piece-new{display:flex;align-items:center;gap:12px;width:100%;margin-bottom:8px;padding:10px 12px;border:0;border-radius:18px;text-align:left;background:linear-gradient(#e6f3ff,#c6e2ff);box-shadow:0 0 0 2px #7bb8f5,0 4px 0 #4a8ad0;animation:popIn .5s .6s both;color:var(--ink)}
.pn-tile{flex:0 0 56px;height:56px;border-radius:10px;box-shadow:0 0 0 3px #fff,0 3px 6px rgba(0,0,0,.3);transform:rotate(-6deg);animation:pieceFly .9s .5s both}
@keyframes pieceFly{0%{transform:translateY(-120px) rotate(-40deg) scale(.4);opacity:0}70%{transform:translateY(6px) rotate(4deg) scale(1.1);opacity:1}100%{transform:rotate(-6deg)}}
.piece-new small{display:block;font-size:12px;font-weight:900;color:var(--blue-ink)}.piece-new b{font-size:14.5px}.piece-new>div{flex:1}.pn-go{width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center}.pn-go .ic{width:18px;height:18px}
/* пазлы */
.pz-tabs{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-bottom:12px}
.pz-tab{position:relative;padding:4px 2px 5px;border:0;border-radius:14px;background:#fff8e6;box-shadow:0 3px 0 #e2cb94;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--ink)}
.pz-tab span{width:100%;aspect-ratio:1;border-radius:10px;background-size:cover;background-position:center;border:2px solid #fff}.pz-tab b{font-size:11.5px;display:flex}.pz-tab b .ic{width:15px;height:15px;color:var(--green-d)}
.pz-tab.on{background:#dcecff;box-shadow:0 0 0 3px var(--blue),0 3px 0 var(--blue-d)}.pz-tab.locked{opacity:.45;filter:grayscale(1)}
.pz-dot{position:absolute;right:-4px;top:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#e5483d;color:#fff;font-style:normal;font-weight:900;font-size:12px;display:grid;place-items:center;border:2px solid #fff;animation:pulseS 1.2s infinite}
.pz-card{padding:12px}.pz-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}.pz-head b{font-size:16px}.pz-head small{font-weight:800;color:var(--ink2)}
.pz-board{position:relative;max-width:min(100%,290px);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:0;aspect-ratio:1;border-radius:14px;overflow:hidden;border:5px solid var(--wood);box-shadow:0 0 0 2px var(--wood-d),inset 0 0 0 2px #e8c88a;background:#f3e6c4}
.pz-ghost-img{position:absolute;inset:0;background:center/cover;opacity:.16;filter:grayscale(.6);pointer-events:none}
.pz-cell{position:relative;border:1px dashed rgba(138,90,43,.45);background:none;padding:0;display:grid;place-items:center;color:rgba(138,90,43,.55);font-weight:900;font-size:18px}
.pz-cell.hover{background:rgba(255,220,90,.45)}.pz-cell.full{border:0}
.pz-piece{display:block;border-radius:6px}.pz-piece.in{position:absolute;inset:0;border-radius:0}
.pz-board.done{box-shadow:0 0 0 2px var(--wood-d),0 0 0 7px rgba(255,203,61,.6),0 0 30px rgba(255,203,61,.8)}
.pz-reward{display:flex;align-items:center;gap:10px;margin-top:10px}.pz-rw{width:58px;height:46px;display:grid;place-items:center;background:#fff;border-radius:12px;box-shadow:0 2px 0 #e2cb94}.pz-rw svg{width:46px;max-height:40px}
.pz-reward small{display:block;font-size:11.5px;font-weight:800;color:var(--ink2)}.pz-reward b{font-size:14px}
.pz-tray-lab{margin:10px 0 2px;font-size:12.5px;font-weight:800;color:var(--ink2);text-align:center}.pz-tray{display:flex;gap:12px;overflow-x:auto;padding:10px 6px 12px;scrollbar-width:none;justify-content:safe center}.pz-tray::-webkit-scrollbar{display:none}.pz-tray .pz-piece{flex:0 0 76px;width:76px}
#view-puzzle,#view-puzzle *{-webkit-user-select:none;user-select:none}#view-puzzle .page-hero .yasha-wrap.small{width:64px;flex-basis:64px}#view-puzzle .page-hero{margin-bottom:8px}
.pz-piece.loose{aspect-ratio:1;border:0;padding:0;border-radius:8px;box-shadow:0 0 0 3px #fff,0 5px 0 #c8a96a,0 8px 12px rgba(80,50,10,.3);transform:rotate(var(--rot));touch-action:none;cursor:grab;transition:transform .15s}
.pz-piece.loose.picked{transform:rotate(0) scale(1.08);box-shadow:0 0 0 4px var(--blue),0 5px 0 var(--blue-d),0 10px 16px rgba(20,60,120,.35)}.pz-piece.loose.dragging{opacity:.35}
.pz-ghost{width:92px;height:92px;border-radius:8px;box-shadow:0 0 0 3px #fff,0 12px 18px rgba(0,0,0,.35)}
.pz-done{text-align:center}.pz-done h2{margin:6px 0}.pz-done p{color:var(--ink2);font-weight:700;margin:0 0 14px}
.pz-done-art{width:150px;margin:0 auto;padding:16px;border-radius:50%;aspect-ratio:1;display:grid;place-items:center;background:radial-gradient(#fff6c8,#ffe08a);box-shadow:0 0 0 6px #fff,0 0 30px rgba(255,203,61,.8);animation:popIn .5s}
.pz-done-art svg{width:100%}
/* гардероб */
.ward-stage{position:relative;height:250px;margin:-4px -12px 10px;border-radius:0 0 28px 28px;overflow:hidden;background:#bfe8ff center 38%/cover}
.ward-stage::after{content:'';position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(transparent,rgba(255,243,212,.6))}
#ward-yasha{position:absolute;left:10px;bottom:-6px;height:228px;width:auto;z-index:2}#ward-yasha>img{height:100%;width:auto}
.ward-bubble{position:absolute;left:150px;right:12px;top:20px;z-index:3;font-size:14.5px}
.ward-gems{position:absolute;right:12px;bottom:12px;z-index:3;display:flex;align-items:center;gap:5px;padding:4px 12px 4px 6px;border-radius:18px;background:linear-gradient(#fffdf2,#fbeec6);border:2px solid #fff;box-shadow:0 3px 0 var(--cream-sd);font-weight:900;font-size:18px}.ward-gems img{width:22px;height:26px;object-fit:contain}
.ward-tabs{display:flex;gap:8px;margin-bottom:10px}.ward-tabs button{flex:1;min-height:44px;border:0;border-radius:14px;font-weight:900;font-size:15px;background:#fff8e6;color:var(--ink2);box-shadow:0 3px 0 #e2cb94}.ward-tabs button.on{background:var(--blue);color:#fff;box-shadow:0 3px 0 var(--blue-d)}
.ward-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:12px}
.ward-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px 8px;border:0;border-radius:16px;background:linear-gradient(#fffaf0,#fff0cc);box-shadow:0 3px 0 #e2cb94;color:var(--ink)}
.wi-art{width:100%;height:58px;display:grid;place-items:center}.wi-art svg{max-width:78%;max-height:56px}
.ward-item b{font-size:11.5px;line-height:1.1;text-align:center;min-height:25px}
.wt{font-style:normal;font-size:12px;font-weight:900;display:flex;align-items:center;gap:3px;padding:2px 8px;border-radius:9px;background:#dcecff;color:var(--blue-ink)}.wt img{width:14px;height:17px;object-fit:contain}.wt .ic{width:13px;height:13px}
.wt.on{background:var(--green);color:#fff}.wt.price{background:#fff;box-shadow:0 0 0 2px #f0c64a}.wt.price.no{opacity:.6}.wt.lock{background:#efe6cf;color:#8f8062;font-size:10.5px}
.ward-item.on{box-shadow:0 0 0 3px var(--green),0 3px 0 var(--green-d);background:linear-gradient(#f0fbec,#d6f2cb)}.ward-item.locked .wi-art{filter:saturate(.5);opacity:.75}
/* загадка */
.riddle-head{display:flex;gap:12px;align-items:center;margin:0 40px 14px 0}.riddle-head .yasha-ic.lg{margin:0;flex:0 0 64px;width:64px;height:64px}.riddle-head small{font-weight:900;color:var(--blue-ink)}.riddle-head h2{margin:2px 0 0;font-size:18px;line-height:1.25}
.riddle .answers{margin-bottom:8px}.riddle .muted{margin-top:10px}
/* навигация из пяти пунктов */
.navbtn{font-size:11px}.navbtn .ic{width:25px;height:25px}

/* ---------- одноэкранный урок ---------- */
#view-lesson .stage{flex:1 1 0;min-height:58px}
#view-lesson .task-panel{flex:0 0 auto;overflow:hidden}
.task-panel.tight{padding:6px 10px 8px}
.task-panel.tight .board-plank{margin-bottom:4px}.task-panel.tight .board-plank span{font-size:13px;padding:4px 20px}
.task-panel.tight .task-title{font-size:18px;margin-bottom:2px}.task-panel.tight .task-instruction{font-size:12.5px;margin-bottom:6px}
.task-panel.tight .mat{padding:7px;margin-bottom:8px}.task-panel.tight .answers{gap:8px}
.task-panel.tight .answer{min-height:48px;font-size:22px}
.task-panel.tight .feedback{margin-top:6px;padding:7px 10px;font-size:13px}.task-panel.tight .feedback .why{margin-top:1px}
.feedback{line-height:1.25}.feedback .fb-ic{width:26px;height:26px;flex-basis:26px}
.task-panel.has-fb .task-instruction{display:none}
.task-panel.tight .shape-btn{aspect-ratio:1.55;padding:3px}.task-panel.tight .shape-svg{width:auto;height:78%}
.y-acc img{display:block;width:100%;height:auto;filter:drop-shadow(0 2px 1px rgba(40,20,0,.25))}
.wi-art img{max-width:80%;max-height:56px;object-fit:contain}.pz-rw img{max-width:46px;max-height:40px;object-fit:contain}.pz-done-art img{width:100%;object-fit:contain}
.map-chest img,.chest-img{display:block;width:100%;height:auto;filter:drop-shadow(0 4px 3px rgba(40,30,10,.35))}
.map-chest.ready img{filter:drop-shadow(0 0 10px #ffe36a)}
.bookic{object-fit:contain}.stick-img{display:block}
/* в шапке Яша чуть меньше, чтобы шапка не уходила за край и не закрывала надписи */
#lesson-yasha.has-hat{height:min(calc((100% + 8px)*.78),186px)}
.reward-yasha .yasha-wrap.has-hat{height:76%;margin-top:40px}
#ward-yasha.has-hat{height:188px}
.page-hero .yasha-wrap.small.has-hat{margin-top:16px}
.y-acc-wrap img,.y-acc img{width:100%!important;height:auto!important;max-width:none!important}
.reward-yasha.has-hat{height:142px;margin-top:46px}
/* ======================= курс 1 класса: предметные модели ======================= */
.objsvg{width:100%;height:100%;display:block}
.vo{display:inline-grid;place-items:center;width:34px;height:34px}.vo img,.vo svg,.vo .bookic{width:100%;height:100%;object-fit:contain}.vo.empty{visibility:hidden}
.v-shapes{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.v-shapes span{display:grid;place-items:center;aspect-ratio:1.2;border-radius:12px;background:#fff;box-shadow:0 2px 0 #e2cb94}.v-shapes .shape-svg{width:58%}
.v-basket{margin:0 auto;max-width:260px;min-height:92px;padding:10px 10px 14px;border-radius:8px 8px 40px 40px;display:grid;place-items:center;background:repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0 3px,transparent 3px 12px),linear-gradient(#e3b073,#c58d4c);border:3px solid var(--wood-d);box-shadow:inset 0 5px 10px rgba(0,0,0,.22)}
.vb-in{display:flex;flex-wrap:wrap;justify-content:center;gap:2px}.vb-in em{font-style:normal;font-weight:900;color:#fff3d6;text-shadow:0 2px 0 rgba(0,0,0,.25)}
.v-groups{display:grid;gap:6px;justify-content:center}.vg-row{display:grid;grid-template-columns:repeat(var(--n),minmax(0,34px));gap:4px;padding:5px 8px;border-radius:14px;background:#fff;box-shadow:0 2px 0 #e2cb94}
.v-row{display:flex;justify-content:center;gap:4px}.vr-c{display:flex;flex-direction:column;align-items:center;width:62px}.vr-c img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(0,0,0,.2))}.vr-c b{font-size:12px;line-height:1.1;margin-top:2px}
.v-lr{display:flex;justify-content:space-between;gap:6px;margin-top:6px;font-size:12px;font-weight:800;color:var(--ink2)}.v-lr span{display:flex;align-items:center;gap:3px}.v-lr .ic{width:15px;height:15px}
.v-path{display:flex;gap:4px;justify-content:center;flex-wrap:nowrap}.vp{flex:0 1 34px;min-width:0;height:38px;border-radius:11px 11px 14px 14px;display:grid;place-items:center;font-weight:900;font-size:16px;color:#46555f;background:linear-gradient(#d9dfe3,#aab4bb);box-shadow:0 3px 0 #7d8b97}
.vp.on{background:linear-gradient(#ffe590,#ffcb3d);color:var(--ink);box-shadow:0 3px 0 #c88a00}
.v-eq{text-align:center;font-size:34px;font-weight:900;color:var(--ink);letter-spacing:1px;padding:6px 0}.v-eq.sm{font-size:24px;padding:4px 0 0}
.v-eq .box{display:inline-grid;place-items:center;min-width:46px;height:48px;border:3px dashed #c8a96a;border-radius:12px;background:#fff8e4;color:#b08a50;font-style:normal;vertical-align:middle}
.v-note{display:flex;align-items:center;gap:10px;justify-content:center}.vn-paper{padding:10px 16px;border-radius:6px;background:repeating-linear-gradient(#fff 0 22px,#cfe3ff 22px 23px);border:2px solid #c8d8ec;font-size:28px;font-weight:900;transform:rotate(-2deg);box-shadow:0 3px 6px rgba(0,0,0,.15)}.vn-paper.small{font-size:14px;line-height:1.35;max-width:220px;transform:none}
.v-combine{display:flex;align-items:center;justify-content:center;gap:8px}.v-combine>b{font-size:28px;color:var(--ink2)}
.vc-tray{display:flex;flex-wrap:wrap;justify-content:center;gap:2px;max-width:132px;min-height:50px;padding:8px;border-radius:16px;background:linear-gradient(#e7c48e,#d1a565);border:3px solid #a8743a;box-shadow:inset 0 -5px 0 rgba(120,70,20,.25)}.vc-tray .vo{width:28px;height:28px}
.v-bundles{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:2px;min-height:70px}.v-bundles img{height:68px;width:62px;aspect-ratio:200/220}.v-bundles img.st{height:60px;width:12px;aspect-ratio:45/220}.vb-sp{width:12px}
.v-tens2{display:flex;gap:10px;justify-content:center}.tf{display:grid;grid-template-columns:repeat(5,24px);gap:4px;padding:6px;border-radius:10px;background:#a56a33;border:2px solid #6a4021}
.tf i{width:24px;height:24px;border-radius:50%;background:#fff6dc;box-shadow:inset 0 2px 3px rgba(0,0,0,.2)}.tf i.a,.dot.a{background:radial-gradient(circle at 35% 30%,#ff9a8a,#e5483d)}.tf i.b,.dot.b{background:radial-gradient(circle at 35% 30%,#fff3a6,#f0b21c)}
.dot{display:inline-block;width:14px;height:14px;border-radius:50%;margin-right:4px}
.v-big{display:grid;place-items:center}.bigshape{width:128px;height:128px}
.v-line{display:grid;place-items:center}.linesvg{width:100%;max-width:300px;height:auto}
.v-lines3{display:grid;gap:4px}.v-lines3>div{display:flex;align-items:center;gap:8px}.v-lines3 b{width:28px;height:28px;flex:0 0 28px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center}.v-lines3 .linesvg{height:44px}
.v-sym{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.v-sym>div{display:flex;flex-direction:column;align-items:center;background:#fff;border-radius:14px;padding:6px;box-shadow:0 2px 0 #e2cb94}.v-sym svg{width:76px;height:76px}.v-sym b{width:26px;height:26px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;margin-top:2px}
.v-ruler{position:relative;height:84px;margin:4px 6px 0}.vr-rib{position:absolute;left:0;top:10px;height:22px;border-radius:4px 10px 10px 4px;background:linear-gradient(#ff8fb1,#e5487a);box-shadow:0 2px 0 #a8285a}
.vr-scale{position:absolute;left:0;right:0;top:40px;height:34px;border-radius:6px;background:linear-gradient(#ffe7a6,#f3cf6e);border:2px solid #c99a2e}.vr-scale i{position:absolute;top:0;width:2px;height:12px;background:#7a5a10;margin-left:-1px}.vr-scale em{position:absolute;top:13px;left:50%;transform:translateX(-50%);font-style:normal;font-size:11px;font-weight:900;color:#5a3a00}
.v-ribbons{display:grid;gap:8px}.vrb{display:flex;align-items:center;gap:2px}.vrb em{font-style:normal;font-weight:900;width:20px;color:var(--ink2)}.vrb i{display:block;height:22px;border:2px solid #fff;border-radius:5px}.vrb i.a{background:#ff8fb1}.vrb i.b{background:#7cc0ff}
.v-dm{display:flex;gap:3px;padding:6px;border-radius:8px;background:linear-gradient(#ffe7a6,#f3cf6e);border:2px solid #c99a2e}.dmseg{flex:1;display:flex;position:relative;height:46px;border-right:3px solid #7a5a10;align-items:flex-end}.dmseg i{flex:1;height:12px;border-right:1px solid #7a5a10}.dmseg b{position:absolute;top:2px;left:0;right:0;text-align:center;font-size:13px}
.v-bal{position:relative;height:130px;max-width:300px;margin:0 auto}.vb-beam{position:absolute;left:12%;right:12%;top:26px;height:9px;border-radius:5px;background:linear-gradient(#d39a58,#8a5a2b);transition:transform .4s}
.vb-pan{position:absolute;top:6px;width:96px;margin-left:-48px;height:66px;display:flex;align-items:flex-end;justify-content:center;border-bottom:10px solid #a8743a;border-radius:0 0 40px 40px;transform-origin:50% 0}.vb-pan.l{left:0}.vb-pan.r{left:100%}
.kgs{display:flex;flex-wrap:wrap-reverse;justify-content:center;gap:2px;padding-bottom:2px}.kg{width:18px;height:18px;border-radius:4px 4px 6px 6px;background:linear-gradient(#8e9aa4,#56636d)}
.vb-post{position:absolute;left:50%;top:28px;bottom:6px;width:10px;margin-left:-5px;background:#8a5a2b;border-radius:4px}.vb-post::after{content:'';position:absolute;left:-36px;right:-36px;bottom:-6px;height:12px;border-radius:6px;background:#8a5a2b}
.v-jars{display:flex;justify-content:center;gap:28px}.vj{display:flex;flex-direction:column;align-items:center}.vj svg{width:70px;height:92px}.vj span{display:flex;flex-wrap:wrap;justify-content:center;max-width:90px;gap:2px}.vj b{font-size:12px}
.cup{display:inline-block;width:12px;height:12px;border-radius:2px 2px 5px 5px;background:#2f8cf0}
.v-clock{display:grid;place-items:center}.v-clock svg{width:150px;height:150px}
.v-week{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.v-week span{text-align:center;padding:8px 0;border-radius:10px;background:#fff;font-weight:900;box-shadow:0 2px 0 #e2cb94}.v-week span.on{background:var(--blue);color:#fff;box-shadow:0 2px 0 var(--blue-d)}
.v-stmts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.stmt{position:relative;min-height:56px;border:0;border-radius:16px;font-weight:900;font-size:21px;background:linear-gradient(#fffefa,#f6e7c2);box-shadow:inset 0 2px 0 #fff,0 3px 0 #d8c08a;color:var(--ink)}
.stmt.sel{background:linear-gradient(#e2f6da,#c3eab6);box-shadow:0 0 0 3px var(--green),0 3px 0 var(--green-d)}
.ext{font-style:normal;margin-left:6px;font-size:10.5px;font-weight:900;padding:1px 6px;border-radius:8px;background:#efe3ff;color:#6b3fb5;vertical-align:middle}
.ext-badge{display:inline-block;margin:2px 0 4px;font-size:11.5px;font-weight:900;padding:2px 8px;border-radius:8px;background:#efe3ff;color:#6b3fb5}
.answer.textual{font-size:15px;line-height:1.15}
.answers.c1{grid-template-columns:1fr}.answers.c1 .answer{min-height:48px}
.answer.textual{font-size:17px}
.v-basket .vo{width:42px;height:42px}.v-groups .vo{width:30px;height:30px}
/* 12 станций на карте: компактные таблички */
.world.many .station{width:142px}.world.many .station .st-sign{max-width:142px;padding:3px 8px 4px 4px}.world.many .station .st-sign b{font-size:11px}
.world.many .station .st-num{width:22px;height:22px;flex-basis:22px;font-size:12px}.world.many .station .st-badge{width:44px;height:44px}.world.many .station .st-badge .ic{width:22px;height:22px}
.world.many .station .st-pips i{width:5px;height:5px}
/* 12 станций: значок на тропе, табличка сбоку (в сторону центра карты) — станции занимают меньше высоты */
.world.many .station{display:grid;grid-template-columns:44px auto;grid-template-rows:auto auto;column-gap:5px;row-gap:2px;align-items:center;justify-items:start;width:auto;transform:translate(-22px,-50%)}
.world.many .station .st-badge{grid-column:1;grid-row:1/3;margin:0}
.world.many .station .st-sign{grid-column:2;grid-row:1;order:initial;max-width:128px}
.world.many .station .st-pips,.world.many .station .st-stars{grid-column:2;grid-row:2;order:initial}
.world.many .station.flipside{grid-template-columns:auto 44px;justify-items:end;transform:translate(calc(-100% + 22px),-50%)}
.world.many .station.flipside .st-badge{grid-column:2}.world.many .station.flipside .st-sign,.world.many .station.flipside .st-pips,.world.many .station.flipside .st-stars{grid-column:1}
.world.many .station .st-glow{display:none}.world.many .station.now .st-badge{animation:pulseS 1.4s ease-in-out infinite;box-shadow:0 0 0 5px rgba(255,220,90,.75),0 4px 0 rgba(0,0,0,.28)}
.world.many .station .st-now{top:-18px;right:auto;left:30px;bottom:auto}.world.many .station.flipside .st-now{left:auto;right:30px}
.world.many .station.shake{animation:none}

/* v4.1 — Яша в вещи: готовый рисунок поверх места основного спрайта (ноги на одной линии) */
.y-dressed{position:absolute;bottom:0;display:block;pointer-events:none}
.y-dressed img{display:block;width:100%!important;height:100%!important;max-width:none!important}
.yasha-wrap.dressed>img{visibility:hidden}

/* ===== v5: рисованные предметы, иконки и фоны (art/source/v5) ===== */
/* корзина «Сколько в корзине?»: предметы лежат горкой над краем корзины */
.v-basket{position:relative;max-width:300px;width:86%;aspect-ratio:520/250;min-height:0;padding:0 15% 21%;border:0;border-radius:0;box-shadow:none;
 background:var(--img-basket) center bottom/100% auto no-repeat;display:flex;align-items:flex-end;justify-content:center}
.v-basket .vb-in{gap:0 1px;margin-bottom:-4%;max-height:100%;align-content:flex-end}
.v-basket .vo{width:36px;height:36px}.v-basket.full .vo{width:28px;height:28px}
.v-basket .vb-in em{color:#7a4a22;text-shadow:none;font-size:15px;margin-bottom:12%}
/* часть и целое: корзина и стол */
.pw-basket,.pw-table{border:0;border-radius:0;box-shadow:none;background-color:transparent;min-height:0;aspect-ratio:2.1/1;align-content:flex-end}
.pw-basket{background:var(--img-basket) center bottom/100% auto no-repeat;padding:0 14% 22%}
.pw-table{background:var(--img-table) center bottom/100% auto no-repeat;padding:0 12% 33%;align-content:flex-end}
.pw-table .pw-cover{margin-bottom:6%}
.pw-ap{width:24px;height:24px}.pw-ap img,.pw-ap svg{width:100%;height:100%}
/* поднос в «Сколько спрятано?» */
.basket{border:0;border-radius:0;box-shadow:none;background:var(--img-tray) center/100% 100% no-repeat;padding:6% 10% 9%;min-height:58px}
.basket.hover{box-shadow:none;transform:scale(1.03);filter:drop-shadow(0 0 6px var(--gold))}
/* камни числовой дорожки */
.vp,.stone{background:var(--img-stone) center/100% 100% no-repeat;box-shadow:none;border-radius:0;color:#3b4650;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.vp{height:34px;flex-basis:40px}.stone{flex-basis:50px;height:40px}
.vp.on,.stone.on{background:var(--img-stone) center/100% 100% no-repeat;box-shadow:none;filter:drop-shadow(0 0 5px #ffcb3d) drop-shadow(0 0 2px #ffcb3d);color:#a35b00}
/* рамки «через десяток»: настоящие фишки */
.tf i.a,.dot.a{background:var(--img-chipr) center/92% no-repeat;box-shadow:none}
.tf i.b,.dot.b{background:var(--img-chipy) center/92% no-repeat;box-shadow:none}
/* линейка: деревянная основа под делениями */
.v-ruler .vr-scale{background:var(--img-ruler) center/calc(100% + 18px) 100% no-repeat}
.dmseg{background:var(--img-ruler) center/100% 100% no-repeat;border-color:transparent}
/* весы из трёх слоёв */
.v-bal2{position:relative;width:min(240px,64%);margin:0 auto}
.v-bal2>img{position:absolute;inset:0;width:100%;height:100%}
.vb2-beam{transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.vb2-pan{position:absolute;width:28%;transform:translateX(-50%);transition:left .5s,top .5s}
.vb2-pan>img{display:block;width:100%}
.vb2-w{position:absolute;left:8%;right:8%;bottom:16%;display:flex;flex-wrap:wrap-reverse;justify-content:center;gap:0}
.vb2-w img{width:34%}
/* кувшины и кружки */
.v-jars2{display:flex;justify-content:center;gap:18px}
.vj2{display:flex;flex-direction:column;align-items:center;gap:2px;width:44%}
.vj2-jug{width:68%;max-width:110px}
.vj2-mugs{display:flex;flex-wrap:wrap;justify-content:center;gap:1px;max-width:150px}
.vj2-mugs img{width:22px}
.vj2 b{font-size:13px;color:var(--ink2)}
/* часы */
.v-clock2{position:relative;width:min(170px,46%);margin:0 auto;aspect-ratio:1}
.v-clock2>img,.v-clock2>svg{position:absolute;inset:0;width:100%;height:100%}
.v-clock2 text{font-family:inherit}
/* симметрия */
.sym-pic{position:relative;display:block;width:76%;margin:0 auto;aspect-ratio:1}
.sym-pic img{width:100%;height:100%;object-fit:contain}
.sym-axis{position:absolute;left:50%;top:2%;bottom:2%;border-left:2px dashed rgba(47,140,240,.55)}
/* фигуры — деревянные игрушки */
.shape-pic{object-fit:contain;filter:drop-shadow(0 2px 1px rgba(0,0,0,.22))}
.shape-pic.rect,.shape-pic.oval{width:74%}
/* иконки */
img.ic-pic{width:1.35em;height:1.35em;object-fit:contain;vertical-align:middle;filter:none}
.navbtn img.ic-pic{width:30px;height:30px;margin-bottom:-2px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.18))}
.navbtn:not(.on) img.ic-pic{filter:saturate(.75) opacity(.9)}
.round-btn img.ic-pic{width:26px;height:26px}
.ach-ic img{width:100%;height:100%;object-fit:contain}
.ach:not(.got) .ach-ic img{filter:grayscale(1) opacity(.45)}
.ach-new-ic{width:44px;height:44px;flex:0 0 44px;object-fit:contain}
/* деревянные таблички заголовков */
.page-plank{background:none;border:0;box-shadow:none;border-style:solid;border-width:0 16px;border-image:var(--img-sign) 0 64 fill / 0 30px / 0 14px stretch;padding:9px 4px 11px;max-width:320px;font-size:16px}
.page-plank::before,.page-plank::after{display:none}
/* фоны экранов */
#view-practice{background:var(--img-practice) center top/cover no-repeat}
#view-collection{background:var(--img-room) center top/cover no-repeat}
/* деревянные фигуры сжимаются вместе с клеткой (у картинки свой размер 220px — не даём ей распирать доску) */
.shape-pic{max-width:100%;max-height:100%;min-height:0}
.task-panel.tight .shape-pic{width:auto;height:72%;max-width:76%}
.task-panel.tight .shape-pic.rect,.task-panel.tight .shape-pic.oval{height:auto;width:70%}

/* выбор языка в настройках */
.lang-pick{margin:12px 0 4px}.lang-lab{display:flex;align-items:center;gap:6px;font-size:15px;color:var(--ink);margin-bottom:6px}.lang-lab .ic{width:20px;height:20px}
.lang-list{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.lang-btn{padding:9px 4px;border-radius:12px;border:2px solid #e3d3b5;background:#fffaf0;font:inherit;font-weight:800;font-size:14px;color:var(--ink)}
.lang-btn.on{border-color:var(--blue);background:#e7f2ff;color:var(--blue-ink)}

/* ===== ВКонтакте: мини-приложение =====
   В мобильных клиентах ВК справа сверху поверх приложения лежат кнопки «меню / закрыть» (~88×32 px):
   правые кнопки шапки карты и урока сдвигаем левее, чтобы их не перекрывало. */
html.vk-overlay{--vk-cap:96px}
html.vk-overlay .hud{padding-right:calc(10px + var(--vk-cap))}
/* шестерёнка карты — под кнопками ВК, у правого края (счётчики остаются в верхней строке) */
html.vk-overlay .hud .round-btn{position:absolute;right:10px;top:calc(var(--safe-t) + 54px);margin-left:0;pointer-events:auto}
html.vk-overlay .lesson-top{padding-right:calc(10px + var(--vk-cap))}
@media (max-width:420px){html.vk-overlay .lesson-top .xp-pill{display:none}}

/* ===== Широкое окно: компьютер, vk.com, планшет боком (html.wide — 03_layout.js) ===== */
html.wide .app{max-width:none}
/* карта: колонка по центру, по бокам — та же карта, размытая */
html.wide #view-home::before{content:'';position:absolute;inset:-40px;background:var(--img-map) center 70%/cover no-repeat;filter:blur(14px) saturate(1.15) brightness(1.04);z-index:0}
html.wide #view-home .map-scroll{left:50%;right:auto;width:min(560px,max(420px,48vw));transform:translateX(-50%);box-shadow:0 0 0 4px rgba(255,255,255,.55),0 20px 60px rgba(20,60,30,.45);z-index:1}
html.wide .play-cta{left:50%;right:auto;width:min(520px,max(390px,44vw));transform:translateX(-50%)}
html.wide .play-cta:active{transform:translateX(-50%) translateY(3px)}
html.wide .bottomnav{left:50%;right:auto;width:min(560px,max(420px,48vw));transform:translateX(-50%);box-sizing:border-box}
html.wide .map-bubble{max-width:420px}
/* урок: сцена с Яшей слева, задание справа */
html.wide #view-lesson.active{display:grid;grid-template-columns:max(300px,38%) 1fr;grid-template-rows:auto 1fr auto;background:linear-gradient(#cdeeff,#e9f8ff 55%,#d4efc4)}
html.wide .lesson-bg{right:auto;width:max(300px,38%);box-shadow:4px 0 0 #fff,10px 0 26px rgba(30,60,30,.25)}
html.wide #view-lesson .lesson-top{grid-column:1/-1;grid-row:1}
html.wide #view-lesson .stage{grid-column:1;grid-row:2/4;min-height:0}
html.wide #view-lesson .task-panel{grid-column:2;grid-row:2;align-self:center;justify-self:center;width:min(calc(100% - 48px),640px);margin:12px 24px;box-sizing:border-box}
html.wide #view-lesson .lesson-actions{grid-column:2;grid-row:3;justify-self:center;width:min(calc(100% - 48px),640px);box-sizing:border-box;padding-inline:0}
html.wide #lesson-yasha{left:6%;height:min(58%,340px)}
html.wide .stage-bubble{left:16px;right:16px;bottom:calc(min(58%,340px) + 6px);max-width:none}
html.wide .stage-bubble::before{left:22%;bottom:-10px}
html.wide .combo{top:12px}
/* страницы, награда, шторки — по центру */
html.wide .view.page .page-scroll{padding-inline:max(12px,calc((100% - 680px)/2))}
html.wide .reward-wrap{width:min(100%,560px);margin:0 auto;box-sizing:border-box}
html.wide .sheet{left:max(0px,calc((100% - 600px)/2));right:max(0px,calc((100% - 600px)/2));border-radius:30px 30px 0 0}
/* в низком широком окне (ноутбук с панелями браузера) поле задания не шире, чем позволяет высота: квадратные доски не вылезают */
html.wide #lesson-mat,html.wide #lesson-options{max-width:min(100%,calc(100dvh - 210px));margin-left:auto;margin-right:auto}
/* большой экран (Full HD и выше): Яша крупнее, задание шире */
@media (min-height:860px){
 html.wide #lesson-yasha{height:min(56%,540px)}
 html.wide .stage-bubble{bottom:calc(min(56%,540px) + 6px);font-size:18px;padding:14px 18px}
 html.wide #view-lesson .task-panel,html.wide #view-lesson .lesson-actions{width:min(calc(100% - 48px),780px)}
 html.wide .task-title{font-size:26px}html.wide .task-instruction{font-size:16px}
 html.wide .lesson-actions .btn{min-height:64px;font-size:20px}
}
