:root{--bg: #fff8e7;--ink: #2b2b3a;--muted: #6b6b80;--mint: #2fbf8f;--mint-soft: #dff7ee;--sky: #3b9be8;--sky-soft: #e3f1fd;--grape: #8a63d2;--grape-soft: #efe8fb;--sun: #ffb627;--sun-soft: #fff0cc;--white: #ffffff;font-family:"Baloo 2",Trebuchet MS,system-ui,sans-serif;color:var(--ink);background:var(--bg)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg)}button{font-family:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.5}.screen{max-width:560px;margin:0 auto;padding:20px 16px 32px}.picker{text-align:center;padding-top:48px}.picker h1{font-size:40px;margin:8px 0 0}.subtitle{font-size:20px;color:var(--muted);margin:4px 0 28px}.levels{display:grid;gap:14px}.level-card{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border:none;border-radius:22px;font-size:22px;font-weight:700;color:var(--white);box-shadow:0 6px #0000001f;transition:transform .1s}.level-card:active{transform:translateY(3px);box-shadow:0 3px #0000001f}.level-card .sample{font-size:28px}.mint{background:var(--mint)}.sky{background:var(--sky)}.grape{background:var(--grape)}.error{color:#c0392b;font-size:18px}.pip-avatar{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;border-radius:50%;background:var(--sun-soft);font-size:24px}.pip-avatar.big{width:110px;height:110px;font-size:64px;animation:bob 2.4s ease-in-out infinite}.topbar{display:flex;align-items:center;gap:12px;margin-bottom:14px}.back{border:none;background:var(--white);width:44px;height:44px;border-radius:14px;font-size:22px}.badge{padding:4px 14px;border-radius:999px;color:var(--white);font-weight:700;font-size:16px}.stars{margin-left:auto;font-size:22px;font-weight:700;background:var(--white);padding:4px 14px;border-radius:999px}.problem{position:relative;overflow:hidden;text-align:center;background:var(--white);border:4px solid var(--sky);border-radius:26px;padding:22px 12px;margin-bottom:14px;transition:background .3s,border-color .3s}.problem.solved{border-color:var(--mint);background:var(--mint-soft)}.problem-text{font-size:56px;font-weight:700;letter-spacing:2px}.chat{background:var(--white);border-radius:22px;padding:14px;height:260px;overflow-y:auto;margin-bottom:12px}.row{display:flex;align-items:flex-end;gap:8px;margin:8px 0}.row.kid{justify-content:flex-end}.bubble{max-width:78%;padding:10px 16px;border-radius:20px;font-size:19px;line-height:1.35;animation:pop .2s ease-out}.pip .bubble{background:var(--sky-soft);border-bottom-left-radius:6px}.kid .bubble{background:var(--sun-soft);border-bottom-right-radius:6px}.typing{display:flex;gap:5px;padding:16px}.typing span{width:8px;height:8px;border-radius:50%;background:var(--sky);animation:blink 1s infinite}.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}.next{width:100%;margin-bottom:12px;padding:14px;border:none;border-radius:18px;background:var(--mint);color:var(--white);font-size:22px;font-weight:700;box-shadow:0 5px #0000001f}.answer{display:flex;gap:8px;margin-bottom:12px}.answer input{flex:1;min-width:0;font-family:inherit;font-size:22px;padding:12px 16px;border:3px solid #e4dccb;border-radius:16px;background:var(--white)}.answer input:focus{outline:none;border-color:var(--sky)}.answer button{padding:0 22px;border:none;border-radius:16px;background:var(--sky);color:var(--white);font-size:20px;font-weight:700}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.key{height:58px;border:none;border-radius:16px;background:var(--white);font-size:28px;font-weight:700;color:var(--ink);box-shadow:0 4px #e4dccb}.key:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px #e4dccb}.key.erase{background:var(--sun-soft)}.key.go{background:var(--mint);color:var(--white);box-shadow:0 4px #23966f}.mode-toggle{display:inline-flex;background:var(--white);border-radius:999px;padding:4px;margin:14px 0 4px;box-shadow:0 3px #e4dccb}.mode-toggle button{border:none;background:transparent;padding:8px 18px;border-radius:999px;font-size:18px;font-weight:700;color:var(--muted)}.mode-toggle button.active{background:var(--sky);color:var(--white)}.progress{height:10px;background:var(--white);border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:var(--mint);transition:width .3s}.progress-text{text-align:center;color:var(--muted);font-size:16px;margin:6px 0 12px}.flashcard{perspective:1000px;height:230px;margin-bottom:14px}.flashcard-inner{position:relative;width:100%;height:100%;transition:transform .5s;transform-style:preserve-3d}.flashcard.flipped .flashcard-inner{transform:rotateY(180deg)}.card-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:4px solid var(--sky);border-radius:26px;background:var(--white)}.card-back{transform:rotateY(180deg)}.card-back.right{border-color:var(--mint);background:var(--mint-soft)}.card-back.wrong{border-color:var(--sun);background:var(--sun-soft)}.card-text{font-size:52px;font-weight:700;letter-spacing:2px}.card-note{font-size:20px;color:var(--muted)}.card-emoji{font-size:40px}.summary{text-align:center;background:var(--white);border-radius:26px;padding:28px 16px 16px}.summary-score{font-size:64px;font-weight:700;color:var(--mint)}.summary-text{font-size:22px;margin:4px 0 20px}.next.secondary{background:var(--sky)}.confetti{position:absolute;inset:0;pointer-events:none}.confetti span{--x: 0%;--c: 0;--d: 0s;position:absolute;top:-10px;left:var(--x);width:10px;height:14px;border-radius:3px;background:hsl(calc(var(--c) * 90 + 20) 85% 60%);animation:fall 1.4s ease-in var(--d) forwards}@keyframes pop{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@keyframes blink{0%,to{opacity:.3}50%{opacity:1}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes fall{to{transform:translateY(180px) rotate(360deg);opacity:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.level-card .level-text{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left}.level-card .name{font-size:1.6rem}.level-card .level-stars{font-size:.9rem;line-height:1}.level-card .level-desc{font-size:.95rem;font-weight:600;opacity:.9}.level-card .level-tile{background:#fff;color:#2b2b2b;border-radius:12px;padding:8px 14px;font-size:1.3rem;font-weight:800;box-shadow:0 2px #0000001a}