:root{font-family:Trebuchet MS,Avenir Next,sans-serif;color:#20304d;background:radial-gradient(circle at top,rgba(255,244,186,.92),transparent 34%),linear-gradient(180deg,#f8fbff,#e4f4ff 58%,#d5f0e2);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button{font:inherit;border:none;cursor:pointer}#root{min-height:100vh}.page-shell{position:relative;min-height:100vh;overflow:hidden;padding:32px 16px}.sun,.cloud{position:absolute;pointer-events:none}.sun{top:24px;right:10%;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,#ffe98a,#ffd860 60%,#ffd86000 70%)}.cloud{width:180px;height:60px;background:#ffffffa6;border-radius:999px;filter:blur(2px)}.cloud-left{top:90px;left:-20px}.cloud-right{top:150px;right:-30px}.app-card{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:28px;border-radius:32px;background:#ffffffd1;box-shadow:0 24px 70px #2c5b872e;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hero-panel{display:flex;justify-content:space-between;gap:24px;align-items:start;margin-bottom:24px}.eyebrow{margin:0 0 8px;color:#267a52;font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{max-width:none;white-space:nowrap;margin-bottom:12px;font-size:clamp(1.2rem,2vw,2.1rem);line-height:1.08}.intro,.welcome-copy{max-width:46ch;font-size:1.05rem;line-height:1.6}.status-strip,.summary-grid,.difficulty-grid,.mode-grid{display:grid;gap:12px}.status-strip{grid-template-columns:repeat(3,minmax(110px,1fr));min-width:min(100%,340px)}.summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.summary-grid-wide{grid-template-columns:repeat(4,minmax(0,1fr))}.difficulty-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin:24px 0}.mode-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 24px}.learning-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.welcome-section-label{margin:8px 0 10px;color:#267a52;font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.status-pill,.mini-card,.mascot-card,.game-panel,.summary-tile,.difficulty-card,.mode-card{border:1px solid rgba(60,110,168,.12);border-radius:24px;background:#ffffffc7}.status-pill,.summary-tile{padding:14px 16px}.status-pill span,.summary-tile span,.difficulty-card small,.mode-card span{display:block;font-size:.8rem;color:#52708a}.status-pill strong,.summary-tile strong{display:block;margin-top:4px;font-size:1.4rem}.board-grid{display:grid;grid-template-columns:1.5fr .9fr;gap:20px}.game-panel{position:relative;overflow:hidden;padding:28px}.sparkle-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.sparkle{position:absolute;font-size:1.5rem;color:#f0b400;opacity:0;animation:sparkle-rise .9s ease-out forwards}.sparkle-one{top:18%;left:12%}.sparkle-two{top:24%;right:14%;animation-delay:80ms}.sparkle-three{bottom:20%;left:18%;animation-delay:.14s}.sparkle-four{bottom:18%;right:20%;animation-delay:.22s}.celebration-correct{animation:panel-bounce .5s ease}.celebration-finish{animation:panel-glow 1.2s ease}.task-header,.actions-row,.badges-wrap,.task-topline,.welcome-actions{display:flex;flex-wrap:wrap;gap:12px}.task-header,.task-topline{justify-content:space-between}.task-meta-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:14px}.task-meta-pill,.task-meta-progress{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:6px 10px;border-radius:999px;font-size:.82rem;font-weight:700;background:#eef4ff;color:#345789}.task-meta-pill{min-width:28px}.task-meta-progress{margin-left:auto;background:#e8f5ea;color:#206044}.task-header{margin-bottom:12px}.task-topline{margin-bottom:18px;align-items:center}.task-kind,.task-operation,.badge-chip,.difficulty-chip{display:inline-flex;align-items:center;padding:8px 14px;border-radius:999px;font-size:.92rem}.task-kind{background:#e8f5ea;color:#206044}.task-operation,.difficulty-chip{background:#eef4ff;color:#345789}.helper-copy{color:#4f6783;font-size:.95rem}.task-prompt{margin-bottom:24px;font-size:clamp(2rem,5vw,3.6rem);line-height:1.12}.column-problem,.visual-task{margin-bottom:24px}.numberline-card,.bond-card{border-radius:22px;padding:18px;background:linear-gradient(180deg,#fffef8,#f8fbff);border:1px solid rgba(60,110,168,.12)}.numberline-track{display:grid;grid-template-columns:repeat(auto-fit,minmax(28px,1fr));gap:4px;align-items:end}.numberline-tick{display:grid;justify-items:center;gap:8px}.numberline-dot{width:12px;height:12px;border-radius:999px;background:#bfd4e7;box-shadow:0 0 0 6px #bfd4e729}.numberline-tick.active .numberline-dot{background:#229b62;box-shadow:0 0 0 6px #229b6229}.numberline-tick.in-jump .numberline-dot{background:#ffd85a}.numberline-label{font-size:.9rem;font-weight:700;color:#345789}.numberline-caption{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;color:#4f6783;font-size:.95rem}.bond-card{display:grid;justify-items:center;gap:14px}.bond-whole,.bond-part{width:88px;height:88px;display:grid;place-items:center;border-radius:999px;font-size:2rem;font-weight:700}.bond-whole{background:#90d2ff38;color:#345789}.bond-branch{width:2px;height:26px;background:#89a6c3;position:relative}.bond-branch:after{content:"";position:absolute;left:-78px;top:14px;width:158px;height:2px;background:#89a6c3}.bond-parts{display:flex;gap:48px}.bond-part{background:#ffd68547;color:#7a4c19}.column-grid{display:grid;grid-template-columns:38px auto;grid-template-rows:26px 48px 48px 10px 48px;gap:6px 10px;width:fit-content;min-width:220px;padding:18px 20px;border-radius:22px;background:linear-gradient(180deg,#fffef8,#f8fbff)}.paper-grid{background-image:linear-gradient(to right,rgba(49,80,111,.08) 1px,transparent 1px),linear-gradient(to bottom,rgba(49,80,111,.08) 1px,transparent 1px),linear-gradient(180deg,#fffef8,#f8fbff);background-size:38px 38px,38px 38px,100% 100%}.column-hint-spacer,.column-operator-spacer{min-height:1px}.column-hint-row,.column-number-row{display:grid;grid-auto-flow:column;grid-auto-columns:38px;justify-content:end}.column-hint-cell{min-height:20px;display:grid;place-items:center;font-size:.9rem;font-weight:700;color:transparent}.column-hint-cell.visible{color:#fff}.column-hint-cell.visible.carry{color:#31506f;background:#90d2ff61;border-radius:999px;width:24px;height:24px;justify-self:center}.column-hint-cell.visible.borrow{color:#7a4c19;background:#ffd685ad;border-radius:999px;min-width:24px;height:24px;padding:0 6px;justify-self:center}.column-digit-cell{min-height:48px;display:grid;place-items:center;position:relative;font-family:Courier New,monospace;font-size:clamp(2rem,5vw,3rem);font-weight:700;color:#20304d}.column-digit-cell.ones{background:#ffd68529;border-radius:14px}.column-digit-cell.tens{background:#90d2ff24;border-radius:14px}.column-digit-cell.accent{color:#31506f}.result-cell{border:2px dashed rgba(49,80,111,.28);border-radius:14px;color:#175136;background:#ecfff38f}.column-operator{display:grid;place-items:center;grid-row:3;align-self:center;min-height:48px;padding-top:0;font-size:2.4rem;font-weight:700;color:#20304d}.column-line{height:5px;align-self:center;border-radius:999px;background:#20304d}.column-steps{display:grid;gap:6px;margin-top:14px;padding:14px 16px;border-radius:16px;background:#ffffffd1;border:1px solid rgba(60,110,168,.12);color:#4f6783;font-size:.95rem;line-height:1.45}.answer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.answer-button,.primary-button,.secondary-button,.difficulty-card,.mode-card{border-radius:20px;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease}.answer-button{min-height:86px;padding:16px;background:linear-gradient(180deg,#fff7df,#ffeeba);color:#6d4d00;font-size:clamp(1.4rem,4vw,2rem);font-weight:700;box-shadow:inset 0 -4px #b187112e}.answer-button.active,.difficulty-card.active,.mode-card.active{transform:translateY(-2px);box-shadow:0 14px 28px #4879ba29}.answer-button.active{background:linear-gradient(180deg,#ffe68a,#ffd85a)}.answer-button.review-correct{background:linear-gradient(180deg,#e9fff1,#c8f4d7);color:#175136;box-shadow:inset 0 -4px #17513626}.answer-button.review-wrong{background:linear-gradient(180deg,#fff1eb,#ffd6ca);color:#8c4330;box-shadow:inset 0 -4px #8c433024}.difficulty-card{display:grid;gap:8px;padding:18px;text-align:left}.difficulty-card strong{font-size:1.1rem}.mode-card{display:grid;gap:8px;padding:18px;text-align:left;background:linear-gradient(180deg,#fffef6,#f3f9ff)}.mode-card strong{font-size:1.05rem}.difficulty-card.active{border-color:#20604466;background:linear-gradient(180deg,#f3fff7,#eef8ff)}.mode-card.active{border-color:#3457895c;background:linear-gradient(180deg,#eef7ff,#f5fffa)}.actions-row{margin:22px 0 16px}.primary-button,.secondary-button,.danger-button,.text-button,.toggle-button{padding:14px 20px;font-weight:700}.primary-button{background:linear-gradient(180deg,#3cb67a,#229b62);color:#fff;box-shadow:0 10px 22px #229b6242}.primary-button:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}.secondary-button{background:#edf6ff;color:#31506f}.danger-button{background:linear-gradient(180deg,#ffb2a2,#ea745a);color:#fff;box-shadow:0 10px 22px #d35c4140}.text-button{padding:0;color:#2e6996;background:transparent;text-align:left}.parent-fab{position:fixed;right:18px;bottom:18px;z-index:15;width:46px;height:46px;display:grid;place-items:center;border-radius:999px;background:#ffffffeb;color:#31506f;box-shadow:0 12px 28px #1f3f622e;border:1px solid rgba(60,110,168,.14);font-size:1.1rem}.home-fab{position:fixed;left:18px;bottom:18px;z-index:15;width:46px;height:46px;display:grid;place-items:center;border-radius:999px;background:#ffffffeb;color:#31506f;box-shadow:0 12px 28px #1f3f622e;border:1px solid rgba(60,110,168,.14);font-size:1.15rem}.home-fab:hover,.parent-fab:hover{transform:translateY(-1px)}.toggle-button{min-width:112px;padding:10px 16px;border-radius:999px;background:#edf6ff;color:#31506f}.toggle-button.active{background:linear-gradient(180deg,#3cb67a,#229b62);color:#fff}.hint-box,.feedback-box,.finish-card,.welcome-card{padding:18px;border-radius:20px}.hint-box{background:#f1f9ff;color:#31506f}.feedback-box{display:grid;gap:6px;margin-top:16px;border:1px solid transparent}.feedback-box.success{background:#ecfff3;color:#175136}.feedback-box.error{background:linear-gradient(180deg,#fff8ef,#fff1e5);color:#8c4330;border-color:#d691524d;box-shadow:0 12px 24px #d6915214}.feedback-box strong+span{margin-top:2px}.feedback-next-tip{color:#7a5b25;font-weight:700}.learning-summary{display:grid;gap:8px;margin:18px 0;padding:16px 18px;border-radius:18px;background:linear-gradient(180deg,#f8fbff,#eefbf2);border:1px solid rgba(60,110,168,.12)}.learning-summary h3,.learning-summary p{margin:0}.side-panel{display:grid;gap:16px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:16px;background:#12213659;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.parent-panel{width:min(920px,100%);padding:24px;border-radius:28px;background:#fffdfb;box-shadow:0 30px 80px #1f3f623d}.panel-header,.toggle-row,.dashboard-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.parent-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}.parent-note{margin-top:12px;color:#6b7c8d;font-size:.95rem}.mascot-card,.mini-card{padding:20px}.mascot-card{background:linear-gradient(180deg,#f5fbff,#ecfff6)}.mascot-face{display:grid;grid-template-columns:repeat(2,14px);justify-content:center;gap:22px;width:140px;height:140px;margin:0 auto 18px;padding-top:34px;border-radius:38% 38% 44% 44%;background:linear-gradient(180deg,#8fd7a6,#64bf81);box-shadow:inset 0 -10px #08542b26}.eye{width:14px;height:18px;border-radius:999px;background:#1c5636}.smile{grid-column:1 / -1;justify-self:center;width:46px;height:24px;border-bottom:6px solid #1c5636;border-radius:0 0 80px 80px}.badge-chip{background:#fff4d4;color:#805f00}.badge-chip.muted{background:#f3f5f8;color:#607286}.finish-card,.welcome-card{display:grid;gap:16px}.finish-card{background:linear-gradient(180deg,#fffdf1,#eefcf1)}.welcome-card{background:linear-gradient(180deg,#fffdf7,#f0fbff)}@keyframes sparkle-rise{0%{opacity:0;transform:translateY(20px) scale(.7) rotate(0)}20%{opacity:1}to{opacity:0;transform:translateY(-28px) scale(1.2) rotate(16deg)}}@keyframes panel-bounce{0%{transform:scale(1)}35%{transform:scale(1.015)}to{transform:scale(1)}}@keyframes panel-glow{0%{box-shadow:0 0 #fccd3f00}35%{box-shadow:0 0 0 10px #fccd3f2e}to{box-shadow:0 0 #fccd3f00}}@media(max-width:900px){.hero-panel,.board-grid,.difficulty-grid,.summary-grid,.summary-grid-wide,.mode-grid,.learning-grid,.parent-grid{grid-template-columns:1fr;display:grid}.status-strip{min-width:0}}@media(max-width:640px){.page-shell{padding:8px}.app-card{padding:14px;border-radius:20px}h1{white-space:normal}.parent-fab{right:12px;bottom:12px}.home-fab{left:12px;bottom:12px}.answer-grid{gap:10px}.answer-grid.answer-grid-compact{grid-template-columns:1fr}.answer-grid.answer-grid-quad{grid-template-columns:repeat(2,minmax(0,1fr))}.task-header,.task-topline,.panel-header,.toggle-row,.dashboard-actions{justify-content:flex-start;align-items:stretch;flex-direction:column}.task-prompt{font-size:1.9rem;margin-bottom:14px}.answer-button{min-height:68px;padding:12px;font-size:1.55rem}.actions-row{margin:12px 0 10px;gap:10px}.primary-button,.secondary-button,.danger-button,.toggle-button{padding:12px 16px}.column-grid{min-width:0;width:100%;padding:12px 10px;gap:4px 8px}.numberline-card,.bond-card{padding:12px}.numberline-track{grid-template-columns:repeat(auto-fit,minmax(22px,1fr))}.numberline-caption{gap:6px;font-size:.82rem}.bond-whole,.bond-part{width:64px;height:64px;font-size:1.55rem}.bond-parts{gap:26px}.bond-branch:after{left:-46px;width:94px}.column-number-row,.column-hint-row{grid-auto-columns:32px}.column-digit-cell{min-height:40px;font-size:1.65rem}.column-operator{min-height:40px;font-size:2rem}.column-steps,.hint-box,.feedback-box{padding:12px}.app-card.gameplay-active{padding:10px}.app-card.gameplay-active .hero-panel{position:sticky;top:0;z-index:6;margin:0 -10px 10px;padding:8px 10px 10px;background:#fffffff0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(60,110,168,.1);gap:8px}.app-card.gameplay-active .hero-panel .eyebrow{display:none}.app-card.gameplay-active .hero-panel h1{margin:0;font-size:1rem;line-height:1.1}.app-card.gameplay-active .status-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;min-width:0}.app-card.gameplay-active .status-pill{padding:6px 8px;border-radius:16px}.app-card.gameplay-active .status-pill span{font-size:.68rem}.app-card.gameplay-active .status-pill strong{margin-top:2px;font-size:.95rem;line-height:1.1}.app-card.gameplay-active .board-grid{display:block}.app-card.gameplay-active .game-panel{padding:12px 12px 88px;border-radius:18px}.app-card.gameplay-active .task-header{margin-bottom:8px;gap:8px}.task-meta-row{margin-bottom:10px;gap:6px}.task-meta-pill,.task-meta-progress{min-height:24px;padding:4px 8px;font-size:.74rem}.app-card.gameplay-active .task-kind,.app-card.gameplay-active .task-operation,.app-card.gameplay-active .difficulty-chip{padding:6px 10px;font-size:.8rem}.app-card.gameplay-active .task-topline{margin-bottom:10px;gap:6px}.app-card.gameplay-active .helper-copy{display:none}.app-card.gameplay-active .column-problem{margin-bottom:14px}.app-card.gameplay-active .side-panel{display:none}.app-card.gameplay-active .actions-row{position:sticky;bottom:6px;z-index:7;margin:12px -4px 0;padding:8px;background:#fffffff2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(60,110,168,.1);border-radius:18px}.app-card.gameplay-active .actions-row>*{flex:1 1 0}.app-card.gameplay-active .feedback-box,.app-card.gameplay-active .hint-box{margin-top:10px}}