/* Thinkly v11 — bright, friendly practice screens (all grades; extra playful for Pre-K–Grade 2) */
:root{--kid-font:'Fredoka','Nunito','Trebuchet MS',Arial,sans-serif;--kid-body:'Nunito','Trebuchet MS',Arial,sans-serif;--kid-blue:#2f9bd6;--kid-green:#5dae1a;--kid-sky:#8fd0f4}
body.practising{font-family:var(--kid-body);background:linear-gradient(180deg,#8fd0f4 0,#bfe6fa 240px,#d9f1e6 100%) fixed!important}
body.practising h1,body.practising h2,body.practising h3,body.practising .pill,body.practising .primary,body.practising .question-number{font-family:var(--kid-font)}
body.practising .practice-bread{color:#245f80;font-weight:700;font-size:14px}
body.practising .practice-heading h1{font-family:var(--kid-font);font-size:26px;font-weight:600;color:#17445c}
body.practising .pill{background:#fff;color:#2a7fae;font-size:13px;padding:6px 13px;font-weight:600;box-shadow:0 2px 0 #cfe6f2}
body.practising .practice-layout{border-radius:26px;padding:28px 32px;box-shadow:0 8px 0 #a9d6ec,0 18px 30px #2b6d9122;border:3px solid #fff}
body.practising .practice-tools{gap:10px 14px;border-bottom:2px dashed #dbeaf2;padding-bottom:16px}
body.practising .practice-tools button{background:#eef8fd;color:#1f7db0;border-radius:999px;padding:8px 16px;font:600 14px var(--kid-font);transition:.15s}
body.practising .practice-tools button:hover{background:#d9effb;transform:translateY(-2px)}
body.practising .question{padding:26px 4px}
body.practising .question-number{color:#6aa5c3;font-size:12px;letter-spacing:1.5px;font-weight:600}
body.practising .question h2{font-family:var(--kid-font);font-weight:500;font-size:clamp(26px,3.2vw,36px);line-height:1.35;color:#1d3a4d;margin:8px 0 22px}
body.practising .question h2 strong,body.practising .question h2 b{color:#e0561f;font-weight:600}
body.practising .diagram{background:#fbfeff;border:2px solid #e1f0f8;border-radius:22px;padding:14px;max-width:640px}
body.practising .diagram svg{max-height:340px}
body.practising .answers,body.practising .pk-answers{gap:16px;max-width:760px}
body.practising .answer,body.practising .pk-answer{background:#fff;border:3px solid #cde8f6;border-radius:20px;box-shadow:0 5px 0 #cde8f6;font-family:var(--kid-font);font-size:24px;font-weight:500;color:#1d3a4d;min-height:76px;padding:14px 18px;display:flex;align-items:center;justify-content:center;transition:transform .12s,box-shadow .12s,border-color .12s}
body.practising .answer:hover:not(:disabled),body.practising .pk-answer:hover{transform:translateY(-3px);box-shadow:0 8px 0 #b6dcf0;border-color:#7cc3ea}
body.practising .answer:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px 0 #b6dcf0}
body.practising .answer.selected{background:#e6f6ff;border:3px solid #2f9bd6;box-shadow:0 5px 0 #2f9bd6;padding:14px 18px;color:#0f5f8c}
body.practising .answer svg{max-width:100%;height:auto;max-height:150px}
body.practising .answer-input{border:3px solid #9ccfe8;border-radius:16px;font:600 30px var(--kid-font);min-height:60px;width:170px;text-align:center;color:#1d3a4d}
body.practising .answer-input:focus{border-color:#2f9bd6;box-shadow:0 0 0 5px #2f9bd630}
body.practising .primary{background:#5dae1a;border-radius:16px;box-shadow:0 5px 0 #3f8710;font-size:20px;font-weight:600;padding:12px 38px;transition:.12s}
body.practising .primary:hover{background:#67bb1f;transform:translateY(-2px)}
body.practising .primary:active{transform:translateY(4px);box-shadow:0 1px 0 #3f8710}
body.practising .hint{background:#fff8dc;border:2px solid #f1dc8a;border-radius:16px;font-size:16px}
body.practising .success-feedback strong{font-family:var(--kid-font);font-weight:600}
body.practising .success-check{background:#e6f7cf;box-shadow:0 0 0 10px #f1fbe2;animation:kid-pop .45s ease-out}
body.practising .feedback.wrong{border-radius:20px;border-top-width:6px}
body.practising .practice-stat{border-radius:16px;overflow:hidden}
body.practising .practice-stat>small{font-family:var(--kid-font);font-size:13px;letter-spacing:.3px}
body.practising .related{border-radius:20px;background:#eef8fd}
body.practising .pk-sequence-item{background:#fff;border-radius:16px}
/* Early years: remove clutter, bigger art and type */
body.early .learning-stage,body.early .learning-scaffold{display:none}
body.early .question h2{font-size:clamp(30px,3.8vw,42px)}
body.early .diagram svg{max-height:380px}
body.early .answer,body.early .pk-answer{min-height:96px}
body.early .answer svg{max-height:190px}
body.early .practice-layout{padding:32px 36px}
@keyframes kid-pop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}
@media(max-width:760px){body.practising .practice-layout{padding:18px 14px;border-radius:20px}body.practising .answer{font-size:20px;min-height:68px}}
@media(prefers-reduced-motion:reduce){body.practising *{transition:none!important;animation:none!important}}
/* specificity boosters */
body.practising .question h2{font-size:clamp(28px,3.4vw,40px)!important;font-family:var(--kid-font)!important;color:#1d3a4d!important;font-weight:500!important}
body.practising .answers .answer,body.practising .pk-answers .answer{min-height:150px!important;border-radius:22px!important}
body.practising .answers .answer svg,body.practising .pk-answers .answer svg{width:100%!important;max-height:220px!important;height:auto!important}
body.practising .answers .answer>*{max-width:100%}
body.practising .practice-tools button{font-size:15px!important}
body.practising .listen-button{border-radius:999px;font-family:var(--kid-font);font-size:16px;background:#e6f6ff;color:#1f7db0;border:2px solid #b9e0f4}