/* =====================================================================
   LRL Player · Pre-primary screens (engine/lrl-kids.js)
   Big type (Andika, made for beginning readers), big taps, soft motion.
   ===================================================================== */
:root { --kid: "Andika", "DM Sans", "Segoe UI", system-ui, sans-serif; --gold: #FFD84D; }
.scr.kid { padding: 22px 36px; font-family: var(--kid); }
.kid button { font-family: var(--kid); cursor: pointer; }

/* ---------- layout ---------- */
.kgrid { display: flex; gap: 28px; align-items: flex-start; height: 100%; }
.kpanel { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 16px; height: 100%; }
.kpanel.center { align-items: stretch; }
.kcol { display: flex; flex-direction: column; gap: 18px; height: 100%; }
.khead { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.kh { font-family: var(--kid); font-weight: 700; font-size: 44px; color: var(--navy); margin: 0; line-height: 1.1; }
.khbn { font-family: var(--bangla); font-size: 21px; color: var(--muted); line-height: 1.5; }
.tiny { font-size: 17px; color: var(--muted); }
.kbtn { border: 2px solid var(--line); background: #fff; color: var(--navy); border-radius: 999px; padding: 10px 20px; font-size: 20px; font-weight: 700; box-shadow: 0 4px 0 var(--line); transition: transform .12s; }
.kbtn:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--line); }
.kbtn.primary { background: var(--amber); border-color: var(--amber); color: #fff; box-shadow: 0 4px 0 #B85F25; }
.kbtn.on { background: var(--amber-soft); border-color: var(--amber-2); }
.kbig { border: 0; background: var(--amber); color: #fff; font-size: 32px; font-weight: 700; padding: 18px 40px; border-radius: 999px; box-shadow: 0 7px 0 #B85F25; transition: transform .12s; }
.kbig:active { transform: translateY(5px); box-shadow: 0 2px 0 #B85F25; }
.kbig:disabled { opacity: .5; }
.kbig.pulse, .kbtn.pulse { animation: kpulse 1.2s ease-in-out 3; }

/* ---------- character faces ---------- */
.kface { position: relative; display: inline-flex; align-items: flex-end; justify-content: center; border-radius: 50%; overflow: hidden; flex: none;
  background: radial-gradient(circle at 50% 40%, #FFF6EC, #FCE0C8); border: 4px solid #fff; box-shadow: 0 6px 16px rgba(27,43,75,.18); }
.kface img { height: 94%; width: auto; max-width: 100%; object-fit: contain; display: block; transform-origin: 50% 100%; }
.kface.sm { width: 76px; height: 76px; }
.kface.chat { width: 70px; height: 70px; }
.kface.big { width: 220px; height: 220px; border-width: 7px; }
.kface.cover { width: 130px; height: 130px; animation: kin .7s cubic-bezier(.3,1.5,.5,1) both; }
.kface.talking img { animation: ktalk .32s ease-in-out infinite alternate; }
.kface.hop { animation: khop .7s cubic-bezier(.3,1.6,.5,1); }
.kface.shake { animation: kshake .5s ease; }
@keyframes ktalk { from { transform: translateY(0) rotate(-1.5deg) scaleY(1); } to { transform: translateY(-4px) rotate(1.5deg) scaleY(1.03); } }

/* guide bubble */
.kguide { display: flex; align-items: center; gap: 14px; background: #fff; border-radius: 24px; padding: 10px 18px 10px 10px; box-shadow: var(--shadow); cursor: pointer; border: 3px solid #FFE2C7; }
.kguide .en { font-size: 26px; font-weight: 700; color: var(--navy); line-height: 1.25; }
.kguide .bn { font-size: 18px; color: var(--muted); }
.kguide .ear { margin-left: auto; font-size: 26px; }
.kguide.pulse { animation: kpop .45s cubic-bezier(.3,1.6,.5,1); }

/* ---------- the living scene ---------- */
.kscene { position: relative; flex: none; border-radius: 28px; overflow: hidden; box-shadow: 0 14px 34px rgba(27,43,75,.22); border: 6px solid #fff; box-sizing: content-box; touch-action: manipulation; }
.kscene .base { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.kscene .spr { position: absolute; display: block; pointer-events: none; }
.a-kite  { transform-origin: 8% 96%; animation: kite 3.4s ease-in-out infinite; }
.a-swing { transform-origin: 30% 0%; animation: swing 2.8s ease-in-out infinite; }
.a-dog   { transform-origin: 50% 100%; animation: dog 0.9s ease-in-out infinite; }
.a-duck  { transform-origin: 50% 80%; animation: duck 2.4s ease-in-out infinite; }
.a-kite.react  { animation: kiteBig 1.5s ease-in-out; }
.a-swing.react { animation: swingBig 1.5s ease-in-out; }
.a-dog.react   { animation: dogJump 1.1s cubic-bezier(.3,1.4,.5,1); }
.a-duck.react  { animation: duckBig .5s ease-in-out 3; }
@keyframes kite { 0%,100% { transform: rotate(-3deg) translate(0,0); } 50% { transform: rotate(4deg) translate(3px,-4px); } }
@keyframes kiteBig { 0%,100% { transform: none; } 30% { transform: rotate(-10deg) translate(-6px,-10px); } 65% { transform: rotate(9deg) translate(6px,-14px); } }
@keyframes swing { 0%,100% { transform: rotate(-5deg); } 50% { transform: rotate(5deg); } }
@keyframes swingBig { 0%,100% { transform: rotate(0); } 25% { transform: rotate(-13deg); } 75% { transform: rotate(13deg); } }
@keyframes dog { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-3px) rotate(-1.5deg); } }
@keyframes dogJump { 0%,100% { transform: none; } 40% { transform: translateY(-34px) rotate(-8deg); } 70% { transform: translateY(0) scaleY(.92); } }
@keyframes duck { 0%,100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(2px) rotate(3deg); } }
@keyframes duckBig { 0%,100% { transform: none; } 50% { transform: translateY(-8px) rotate(-8deg); } }

.kscene .fly { position: absolute; font-size: 26px; pointer-events: none; z-index: 2; filter: drop-shadow(0 2px 2px rgba(0,0,0,.2)); }
.kscene .fly.f1 { animation: fly1 22s linear infinite; }
.kscene .fly.f2 { animation: fly2 29s linear infinite; animation-delay: -9s; font-size: 20px; }
@keyframes fly1 { 0% { left: -6%; top: 40%; } 25% { top: 30%; } 50% { left: 50%; top: 42%; } 75% { top: 33%; } 100% { left: 106%; top: 38%; } }
@keyframes fly2 { 0% { left: 106%; top: 62%; transform: scaleX(-1); } 50% { left: 55%; top: 55%; transform: scaleX(-1); } 100% { left: -6%; top: 64%; transform: scaleX(-1); } }

/* magnifier: the object lifted out of the picture */
.kscene .lens { position: absolute; z-index: 4; pointer-events: none; opacity: 0; filter: drop-shadow(0 12px 18px rgba(0,0,0,.35)); }
.kscene .lens .in { position: absolute; inset: -6%; clip-path: ellipse(50% 50% at 50% 50%); background-repeat: no-repeat; outline: 0; }
.kscene .lens.show { animation: lens 2.8s cubic-bezier(.3,1.4,.5,1) both; }
@keyframes lens { 0% { opacity: 0; transform: scale(.9); } 15% { opacity: 1; transform: scale(1.16); } 30% { transform: scale(1.1); } 85% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(1); } }

/* spotlight */
.kscene .shade { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none; opacity: 0; transition: opacity .35s; }
.kscene .shade.on { opacity: 1; }
.kscene .shade.soft { opacity: .5; }
.kscene .shade .hole, .kscene .shade .ring { transition: cx .45s cubic-bezier(.3,1.2,.5,1), cy .45s cubic-bezier(.3,1.2,.5,1), rx .45s, ry .45s; }
.kscene .shade .ring { fill: none; stroke: var(--gold); stroke-width: 5; stroke-dasharray: 14 10; animation: ringSpin 6s linear infinite; }
@keyframes ringSpin { to { stroke-dashoffset: -240; } }
.kscene .hits { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 6; }
.kscene .hits ellipse { fill: transparent; pointer-events: all; cursor: pointer; }

/* word label over the object */
.kscene .ktag { position: absolute; z-index: 7; transform: translate(-50%, -100%); background: #fff; border-radius: 999px; padding: 6px 18px; box-shadow: 0 8px 20px rgba(0,0,0,.25);
  display: flex; flex-direction: column; align-items: center; opacity: 0; pointer-events: none; border: 3px solid var(--gold); }
.kscene .ktag .w { font-size: 28px; font-weight: 700; color: var(--navy); white-space: nowrap; }
.kscene .ktag .bn { font-size: 16px; color: var(--muted); line-height: 1.3; }
.kscene .ktag.show { animation: tag 3s cubic-bezier(.3,1.5,.5,1) both; }
@keyframes tag { 0% { opacity: 0; transform: translate(-50%, -60%) scale(.5); } 12% { opacity: 1; transform: translate(-50%, -100%) scale(1.08); } 20% { transform: translate(-50%, -100%) scale(1); } 88% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, -100%); } }

/* sparkles */
.spark { position: absolute; z-index: 9; font-size: 26px; pointer-events: none; transform: translate(-50%, -50%); animation: spark 1.1s ease-out both; }
@keyframes spark { 0% { opacity: 0; transform: translate(-50%,-50%) scale(.4); } 20% { opacity: 1; } 100% { opacity: 0; transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1.1) rotate(40deg); } }

/* ---------- cover ---------- */
.kcover { display: flex; gap: 46px; align-items: center; height: 100%; }
.kcover .side { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.kcover .kicker { font-family: var(--mono); font-size: 15px; letter-spacing: .14em; text-transform: uppercase; color: var(--amber); }
.kcover .ttl { font-size: 92px; font-weight: 700; color: var(--navy); line-height: 1; }
.kcover .ttl-bn { font-family: var(--bangla); font-size: 34px; color: var(--muted); }
.kcover .faces { display: flex; gap: 14px; margin: 10px 0 18px; }

/* ---------- explore ---------- */
.kcount { font-size: 26px; font-weight: 700; color: var(--green); background: var(--green-soft); border-radius: 999px; padding: 6px 18px; }
.kcount.hop, .kdots.hop { animation: kpop .45s cubic-bezier(.3,1.6,.5,1); }
.kwords { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.kcard { position: relative; background: #fff; border: 4px solid transparent; border-radius: 20px; padding: 10px 6px 8px; box-shadow: var(--shadow); display: flex; flex-direction: column; align-items: center; gap: 2px;
  animation: kin .5s cubic-bezier(.3,1.5,.5,1) both; transition: border-color .2s, transform .2s; }
.kcard .pic { height: 88px; width: 100%; display: flex; align-items: center; justify-content: center; }
.kcard .pic img { max-height: 88px; max-width: 100%; }
.kcard .pic .svgpic svg { height: 84px; }
.kcard .wd { font-size: 21px; font-weight: 700; color: var(--navy); line-height: 1.1; text-align: center; }
.kcard .bn { font-size: 15px; color: var(--muted); line-height: 1.4; }
.kcard .num { position: absolute; left: 6px; top: 6px; width: 24px; height: 24px; border-radius: 50%; background: var(--cream); color: var(--muted); font-size: 14px; font-weight: 700; display: grid; place-items: center; }
.kcard.seen { border-color: #9CC7AF; }
.kcard.seen .num { background: var(--green); color: #fff; }
.kcard.now { border-color: var(--gold); transform: translateY(-4px) scale(1.04); box-shadow: 0 12px 26px rgba(27,43,75,.2); }
.kcard.hop { animation: khop .6s cubic-bezier(.3,1.6,.5,1); }
.svgpic { display: inline-flex; }
.svgpic svg { display: block; }

/* ---------- find ---------- */
.kdots { display: flex; gap: 8px; }
.kdots span { width: 30px; height: 30px; border-radius: 50%; background: var(--line); display: grid; place-items: center; font-size: 18px; transition: background .3s; }
.kdots span.on { background: var(--gold); animation: kpop .5s cubic-bezier(.3,1.6,.5,1); }
.kdots span.on::after { content: "⭐"; }
.kfind { flex: 1; background: #fff; border-radius: 28px; box-shadow: var(--shadow); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; padding: 20px; }
.kfindpic { height: 200px; display: flex; align-items: center; justify-content: center; }
.kfindpic img { max-height: 200px; max-width: 360px; }
.kfindpic .svgpic svg { height: 200px; }
.kfindpic.kbump { animation: kpop .6s cubic-bezier(.3,1.6,.5,1); }
.kfindsay { font-size: 50px; font-weight: 700; color: var(--navy); }
.kfindsay b { color: var(--amber); }

/* ---------- talk ---------- */
.kleft { display: flex; flex-direction: column; gap: 14px; }
.krules { display: flex; gap: 12px; justify-content: center; }
.rule-key { font-size: 20px; font-weight: 700; padding: 6px 16px; border-radius: 999px; background: #fff; box-shadow: var(--shadow); color: var(--navy); }
.rule-key.r-kind { border: 3px solid #F3A46B; } .rule-key.r-where { border: 3px solid #7BB5DA; }
.kchat { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding: 6px 8px 14px 4px; scroll-behavior: smooth; }
.crow { display: flex; align-items: center; gap: 12px; cursor: pointer; animation: kin .45s cubic-bezier(.3,1.4,.5,1) both; transition: opacity .3s; }
.crow.right { flex-direction: row-reverse; }
.cbub { position: relative; border-radius: 24px; padding: 8px 20px 10px; font-size: 26px; line-height: 1.35; color: var(--navy); border: 3px solid; max-width: 640px; transition: transform .25s, box-shadow .25s; }
.cbub .nm { font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.cbub.who-sam  { background: #E3F2FD; border-color: #8CC3EE; }
.cbub.who-rina { background: #FFF1E0; border-color: #F8C27F; }
.cbub.who-dad  { background: #EEE8F8; border-color: #B39DDB; }
.cbub .rule { position: absolute; top: -12px; right: -12px; width: 36px; height: 36px; border-radius: 50%; background: #fff; display: grid; place-items: center; font-size: 20px; box-shadow: 0 3px 8px rgba(0,0,0,.18); }
.cbub .rule.r-kind { border: 3px solid #F3A46B; } .cbub .rule.r-where { border: 3px solid #7BB5DA; }
.crow > * { transition: opacity .3s; }
.kchat:has(.crow.now) .crow:not(.now) > * { opacity: .45; }
.crow.now .cbub { transform: scale(1.03); box-shadow: 0 10px 26px rgba(27,43,75,.18); }
.kid .w.now { background: var(--gold); color: var(--navy) !important; box-shadow: 0 2px 0 #D9B12C; }

/* ---------- ask kindly ---------- */
.krule { display: flex; align-items: center; gap: 14px; background: #fff; border-radius: 999px; padding: 10px 24px; box-shadow: var(--shadow); font-size: 26px; font-weight: 700; }
.krule .x { color: var(--red); text-decoration: line-through; text-decoration-thickness: 3px; }
.krule .ok { color: var(--green); }
.krule .arrow { color: var(--amber); }
.kmorph, .ksay { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 0 10px; position: relative; }
.kmorph .who, .ksay .who { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.kmorph .nm, .ksay .nm { font-size: 26px; font-weight: 700; color: var(--navy); }
.kmorph .mid, .ksay .mid { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 24px; }
.facewrap { position: relative; }
.mood { position: absolute; right: -14px; top: -10px; font-size: 64px; filter: drop-shadow(0 4px 6px rgba(0,0,0,.2)); }
.mood.kbump { animation: kpop .6s cubic-bezier(.3,1.6,.5,1); }
.ksent { background: #fff; border-radius: 30px; padding: 22px 36px; box-shadow: var(--shadow); font-size: 56px; font-weight: 700; color: var(--navy); text-align: center; line-height: 1.25; }
.ksent.small { font-size: 50px; }
.ksent.kbump { animation: kpop .5s cubic-bezier(.3,1.6,.5,1); }
.ksent > span { display: inline-block; transition: opacity .4s, transform .4s; }
.ksent .front { margin-right: .25em; }
.ksent .out { opacity: 0; transform: translateY(-40px) scale(.5) rotate(-12deg); }
.ksent .kind { color: var(--green); background: var(--green-soft); border-radius: 16px; padding: 0 10px; }
.ksent .kq { color: var(--green); }
.ksent .in { animation: kpop .6s cubic-bezier(.3,1.6,.5,1); }
.kthing img { height: 150px; }
.kthing.go img { animation: swingBig 1.4s ease-in-out 2; transform-origin: 50% 0; }
.cloud { position: absolute; left: -40px; top: -70px; z-index: 2; background: #fff; border-radius: 50%; width: 130px; height: 110px; display: grid; place-items: center; box-shadow: var(--shadow); }
.cloud::after { content: ""; position: absolute; right: 18px; bottom: -14px; width: 22px; height: 22px; border-radius: 50%; background: #fff; box-shadow: var(--shadow); }
.cloud img { max-width: 96px; max-height: 80px; }
.cloud.kbump { animation: kpop .6s cubic-bezier(.3,1.6,.5,1); }
.kmorph .q { font-size: 30px; font-weight: 700; color: var(--muted); }
.kopts { display: flex; flex-direction: column; gap: 18px; width: 100%; max-width: 700px; }
.kopt { display: flex; align-items: center; gap: 16px; text-align: left; background: #fff; border: 4px solid var(--line); border-radius: 26px; padding: 18px 26px; font-size: 36px; font-weight: 700; color: var(--navy);
  box-shadow: 0 6px 0 var(--line); animation: kin .5s cubic-bezier(.3,1.5,.5,1) both; transition: border-color .2s, background .2s; }
.kopt .ear { font-size: 28px; }
.kopt.picked { border-color: var(--amber-2); }
.kopt.kind { border-color: var(--green); background: var(--green-soft); box-shadow: 0 6px 0 #9CC7AF; }

/* ---------- say it ---------- */
.ktabs { display: flex; gap: 10px; }
.ktab { width: 52px; height: 52px; border-radius: 50%; border: 3px solid var(--line); background: #fff; font-size: 24px; font-weight: 700; color: var(--navy); }
.ktab.on { background: var(--amber); border-color: var(--amber); color: #fff; }
.krow { display: flex; gap: 28px; }
.kround { width: 160px; height: 160px; border-radius: 50%; border: 0; color: #fff; font-size: 22px; font-weight: 700; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; box-shadow: 0 8px 0 rgba(0,0,0,.18); transition: transform .12s; }
.kround:active { transform: translateY(5px); }
.kround .i { font-size: 56px; line-height: 1; }
.kround.listen { background: #3D7EA6; }
.kround.rec { background: #D9534F; }
.kround.rec.on { animation: recPulse 1s ease-in-out infinite; }
.kround.mine { background: var(--green); }
.kround:disabled { opacity: .35; cursor: default; }
.kround.pulse { animation: kpulse 1s ease-in-out 3; }
@keyframes recPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(217,83,79,.55), 0 8px 0 rgba(0,0,0,.18); } 50% { box-shadow: 0 0 0 22px rgba(217,83,79,0), 0 8px 0 rgba(0,0,0,.18); } }
.kmsg { font-size: 24px; color: var(--muted); font-weight: 700; display: flex; align-items: center; gap: 14px; }

/* ---------- where is the dog? ---------- */
.kfield { position: relative; flex: none; border-radius: 28px; overflow: hidden; box-shadow: 0 14px 34px rgba(27,43,75,.22); border: 6px solid #fff; touch-action: none; }
.kfield .sky { position: absolute; inset: 0 0 40% 0; background: linear-gradient(#A9DCFB, #E3F5FF); }
.kfield .grass { position: absolute; left: -10%; right: -10%; top: 46%; bottom: 0; background: linear-gradient(#9CD86C, #78BF4D); border-radius: 50% 50% 0 0 / 60px 60px 0 0; }
.cloudpuff { position: absolute; width: 140px; height: 46px; background: #fff; border-radius: 999px; opacity: .9; animation: drift 40s linear infinite; }
.cloudpuff::before { content: ""; position: absolute; left: 30px; top: -26px; width: 70px; height: 60px; border-radius: 50%; background: #fff; }
.cloudpuff.c1 { top: 60px; left: 380px; } .cloudpuff.c2 { top: 130px; left: 760px; transform: scale(.7); animation-duration: 55s; }
@keyframes drift { 0% { margin-left: 0; } 50% { margin-left: 120px; } 100% { margin-left: 0; } }
.kfield .thing { position: absolute; display: flex; align-items: flex-end; justify-content: center; pointer-events: none; transition: filter .2s; }
.kfield .thing img, .kfield .thing .svgpic, .kfield .thing svg { width: 100%; height: 100%; object-fit: contain; }
.kfield .thing.target { animation: target 1.6s ease-in-out infinite; }
.kfield .thing.near { filter: drop-shadow(0 0 14px var(--gold)) drop-shadow(0 0 4px var(--gold)); }
@keyframes target { 0%,100% { filter: drop-shadow(0 0 0 rgba(255,216,77,0)); } 50% { filter: drop-shadow(0 0 12px rgba(255,200,40,.95)); } }
.kdog { position: absolute; z-index: 5; cursor: grab; touch-action: none; transition: transform .15s; filter: drop-shadow(0 6px 6px rgba(0,0,0,.2)); }
.kdog img { width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.kdog:hover { transform: scale(1.05) rotate(-2deg); }
.kdog.drag { cursor: grabbing; transform: scale(1.14) rotate(-5deg); filter: drop-shadow(0 18px 14px rgba(0,0,0,.25)); transition: none; }
.kdog.land { animation: land .5s cubic-bezier(.3,1.6,.5,1); }
@keyframes land { 0% { transform: scale(1.14); } 40% { transform: scale(1.1, .86); } 100% { transform: none; } }
.kprompt { font-size: 36px; font-weight: 700; color: var(--navy); line-height: 1.25; background: #fff; border-radius: 24px; padding: 16px 22px; box-shadow: var(--shadow); }
.kprompt b { color: var(--amber); }
.kprompt.kbump { animation: kpop .5s cubic-bezier(.3,1.6,.5,1); }
.kwhere-rule { background: #fff; border-radius: 24px; padding: 16px 20px; box-shadow: var(--shadow); border: 3px solid #7BB5DA; display: flex; flex-direction: column; gap: 12px; }
.kwhere-rule .lbl { font-size: 20px; font-weight: 700; color: #3D7EA6; }
.kframe { font-size: 34px; font-weight: 700; color: var(--navy); line-height: 1.6; }
.kframe.kbump { animation: kpop .5s cubic-bezier(.3,1.6,.5,1); }
.kframe .slot { display: inline-block; min-width: 80px; text-align: center; border-bottom: 4px dashed #C9C2B6; color: #C9C2B6; padding: 0 6px; }
.kframe .slot.fill { color: var(--amber); border-color: var(--amber-2); background: var(--amber-soft); border-radius: 10px 10px 0 0; }
.kpreps { display: flex; gap: 10px; }
.kpreps span { font-size: 22px; font-weight: 700; padding: 6px 16px; border-radius: 999px; background: var(--cream); color: var(--muted); border: 2px solid var(--line); transition: all .2s; }
.kpreps span.on { background: var(--amber); color: #fff; border-color: var(--amber); transform: scale(1.08); }

/* ---------- shared motion ---------- */
@keyframes kin { from { opacity: 0; transform: translateY(24px) scale(.9); } to { opacity: 1; transform: none; } }
@keyframes kpop { 0% { transform: scale(.8); } 60% { transform: scale(1.08); } 100% { transform: none; } }
@keyframes khop { 0%,100% { transform: none; } 40% { transform: translateY(-22px); } 70% { transform: translateY(0) scaleY(.94); } }
@keyframes kshake { 0%,100% { transform: none; } 25% { transform: rotate(-6deg); } 50% { transform: rotate(5deg); } 75% { transform: rotate(-3deg); } }
@keyframes kpulse { 0%,100% { transform: none; } 50% { transform: scale(1.07); } }
@media (prefers-reduced-motion: reduce) {
  .kscene .spr, .kscene .fly, .cloudpuff, .kscene .shade .ring { animation: none !important; }
}