.dashboard{min-height:100vh;background:var(--color-white);padding-top:calc(var(--space-24) + env(safe-area-inset-top,0px));box-sizing:border-box;max-width:var(--max-width);margin:0 auto}.btn-icon-inline{height:var(--icon-size-24);width:auto;display:inline-block;margin-left:var(--space-8);vertical-align:middle}.content{padding:var(--space-24) var(--space-24)}.dashboard-tagline{display:block;height:37px;width:auto;margin:0 auto var(--space-16)}.start-practice-btn{margin:0 auto var(--space-32)}.level-section{margin-bottom:var(--space-32)}.unlock-message{font-size:var(--font-size-16);color:var(--color-grey-mid);margin-bottom:var(--space-8)}.level-title{font-size:var(--font-size-24);font-weight:var(--font-weight-bold);margin-bottom:var(--space-16)}.level-title.grey{color:var(--color-grey-mid)}.skill-row{margin-bottom:var(--space-24)}.skill-name{font-size:var(--font-size-16);font-family:var(--font-text);margin-bottom:var(--space-8)}.skill-name.grey{color:var(--color-grey-mid)}.progress-container{display:flex;align-items:center;gap:var(--space-16)}.progress-bar{flex:1;height:var(--space-8);background:var(--color-grey-lightest);border-radius:var(--radius-4);overflow:hidden}.progress-bar.grey{background:var(--color-grey-light)}.progress-fill{height:100%;background:var(--color-black);border-radius:var(--radius-4);transition:width .3s ease}.percentage{font-size:var(--font-size-16);min-width:40px;text-align:right}.celebration-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;cursor:pointer;opacity:1;transition:opacity .2s ease-out;background:var(--color-yellow-mid);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}.celebration-overlay.fade-out{opacity:0}.flicker-container{position:relative;width:47vw;max-width:200px;aspect-ratio:1 / 1}.flicker-frame{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain}@keyframes frame1-anim{0%,49.9%{opacity:1}50%,to{opacity:0}}@keyframes frame2-anim{0%,49.9%{opacity:0}50%,to{opacity:1}}.flicker-frame-1{animation:frame1-anim .4s linear infinite}.flicker-frame-2{animation:frame2-anim .4s linear infinite}.celebration-message{text-align:center;margin:0;font-size:var(--font-size-36);font-weight:var(--font-weight-bold);font-family:var(--font-heading);color:var(--color-black)}.celebration-subtitle{text-align:center;margin:-8px 0 0;font-size:var(--font-size-20);font-weight:var(--font-weight-bold);color:var(--color-black)}.onboarding-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-white);z-index:200;overflow-y:auto;display:flex;justify-content:center;align-items:flex-start}.onboarding-modal{width:100%;max-width:390px;padding:calc(var(--space-24) + env(safe-area-inset-top,0px)) var(--space-24) calc(var(--space-40) + env(safe-area-inset-bottom,0px));box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;position:relative}.onboarding-close{position:absolute;top:calc(var(--space-24) + env(safe-area-inset-top,0px));right:var(--space-24);background:none;border:none;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}.onboarding-close-icon{width:32px;height:32px}.onboarding-logo{height:40px;width:auto;margin-bottom:var(--space-24)}.onboarding-tagline{height:37px;width:auto;margin-bottom:var(--space-24)}.onboarding-step{display:flex;gap:var(--space-16);margin-bottom:var(--space-24);width:100%}.onboarding-step-number{font-size:var(--font-size-36);font-weight:var(--font-weight-bold);line-height:1;flex-shrink:0}.onboarding-step-body{flex:1;min-width:0}.onboarding-step-text{font-size:var(--font-size-16);margin:0 0 var(--space-16);padding-top:4px}.onboarding-btn-icon-inline{height:var(--icon-size-24);width:auto;margin-left:var(--space-8)}.confetti-container{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:201;overflow:hidden}.confetti-piece{position:absolute;top:-40px;animation:confetti-fall linear infinite}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:0}5%{opacity:1}88%{opacity:1}to{transform:translateY(110vh) rotate(var(--end-rot));opacity:0}}.session-complete-modal{min-height:100dvh;align-items:flex-start}.session-complete-katakat{position:relative;width:130px;height:122px;margin-top:var(--space-40);margin-bottom:var(--space-16)}.session-katakat-frame{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}@keyframes sc-katakat-1{0%,49.9%{opacity:1}50%,to{opacity:0}}@keyframes sc-katakat-2{0%,49.9%{opacity:0}50%,to{opacity:1}}.session-katakat-frame-1{animation:sc-katakat-1 .4s linear infinite}.session-katakat-frame-2{animation:sc-katakat-2 .4s linear infinite}.session-complete-label{font-size:var(--font-size-14);font-weight:var(--font-weight-bold);margin:0 0 var(--space-8)}.session-complete-heading{margin:0;line-height:1.2}.session-complete-cta{margin-top:auto}.session-complete-btn-icon{height:var(--icon-size-24);width:auto;margin-left:var(--space-8)}.problem-screen{min-height:100dvh;background:var(--color-white);padding-top:calc(var(--space-24) + env(safe-area-inset-top,0px));box-sizing:border-box;max-width:var(--max-width);margin:0 auto;position:relative}.session-progress-bar{position:fixed;top:0;left:0;right:0;height:4px;z-index:100}.session-progress-fill{height:100%;background:var(--color-yellow-mid);transition:width .3s ease}.header{height:var(--header-height);display:flex;justify-content:space-between;align-items:center;padding:0 var(--space-24);background:var(--color-white)}.logo{display:flex;align-items:center;gap:var(--space-8)}.logo-img{height:40px;width:auto}.nav{display:flex;align-items:center;gap:var(--space-0);font-size:var(--font-size-14)}.hamburger-icon{width:var(--icon-size-24);height:auto}.problem-content{padding:var(--space-16) var(--space-24);display:flex;flex-direction:column;align-items:center;position:relative;min-height:calc(100dvh - var(--header-height) - var(--space-40))}.equation-display{font-family:var(--font-math);font-size:var(--font-size-24);text-align:center;margin:var(--space-32) 0 var(--space-16);line-height:1.4;white-space:pre-line}.answer-row{display:flex;gap:var(--space-8);width:100%}.feedback{margin-top:var(--space-16);width:100%;display:flex;flex-direction:column}.feedback-text{font-size:var(--font-size-16);margin-bottom:var(--space-8)}.toggle-btn{background:none;border:none;text-decoration:underline;font-size:var(--font-size-16);cursor:pointer;padding:0;margin-bottom:var(--space-16);display:inline-flex;align-items:center;gap:0}.hint-toggle{align-self:flex-end}.steps-toggle{align-self:flex-start;margin-top:var(--space-16)}.steps-toggle-right{align-self:flex-end}.toggle-icon{width:var(--icon-size-24);height:var(--icon-size-24)}.hint-text{font-size:var(--font-size-16);margin-bottom:var(--space-24);white-space:pre-line}.steps{font-size:var(--font-size-16);line-height:1.6;margin:0 0 var(--space-16)}.step{margin-bottom:8px}.step-math{font-family:var(--font-math)}.skip-btn{position:fixed;bottom:calc(var(--space-24) + env(safe-area-inset-bottom,0px));left:var(--space-24);z-index:100}.keyboard-hint{display:none}@media (min-width: 480px){.skip-btn{left:calc(50vw - 216px)}.keyboard-hint{display:block;position:fixed;bottom:calc(var(--space-24) + env(safe-area-inset-bottom,0px));left:50%;transform:translate(-50%);font-size:var(--font-size-14);color:var(--color-grey-mid);pointer-events:none;white-space:nowrap}}.reset-btn{display:block;margin:var(--space-24) auto 0;background:none;border:none;font-size:var(--font-size-14);color:var(--color-grey-mid);cursor:pointer;opacity:.5;padding:var(--space-8)}.App{min-height:100vh}.btn-icon{height:var(--icon-size-24);width:auto}.btn-icon-inline{height:var(--icon-size-24);width:auto;display:inline-block;margin-left:var(--space-0);vertical-align:middle}.answer-input{flex:1;min-width:0;height:var(--input-height);border:1px solid var(--color-grey-light);border-radius:var(--radius-4);padding:0 var(--space-16);font-size:var(--font-size-16)}.answer-input:focus{outline:none;border-color:var(--color-yellow-mid);-webkit-appearance:none}.answer-input.error{border-color:var(--color-wrong-light)}.answer-input.error:focus{border-color:var(--color-wrong-light)}.answer-input:focus::placeholder{color:transparent}.answer-input:disabled,.answer-input:read-only{background:var(--color-grey-lightest)}.answer-input.no-click{pointer-events:none}.answer-input:read-only:focus{border-color:var(--color-grey-light)}.answer-button{width:var(--button-height);padding:0}.answer-button.grey{background:var(--color-grey-lightest)}.cta-btn{padding:0 var(--space-16);height:var(--button-height);background:var(--color-yellow-mid);border:none;border-radius:var(--radius-4);font-size:var(--font-size-16);font-weight:var(--font-weight-regular);color:var(--color-black);cursor:pointer;display:flex;align-items:center;justify-content:center;white-space:nowrap;transition:transform .1s}.cta-btn:active{transform:scale(.95)}.secondary-btn{padding:var(--space-8) var(--space-16);background:var(--color-white);border:1px solid var(--color-grey-light);border-radius:var(--radius-4);font-size:var(--font-size-16);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.secondary-btn:active{background:var(--color-grey-lightest)}:root{--color-white: #FFFFFF;--color-grey-lightest: #F2F2F2;--color-grey-light: #CCCCCC;--color-grey-mid: #757575;--color-black: #000000;--color-yellow-mid: #FFEE00;--color-wrong-light: #FB5D4F;--space-0: 0px;--space-8: 8px;--space-16: 16px;--space-24: 24px;--space-32: 32px;--space-40: 40px;--font-size-14: 14px;--font-size-16: 16px;--font-size-20: 20px;--font-size-24: 24px;--font-size-36: 36px;--font-weight-regular: 400;--font-weight-bold: 700;--radius-4: 4px;--icon-size-24: 24px;--header-height: 40px;--input-height: 48px;--button-height: 48px;--max-width: 480px;--font-text: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-math: "New Century Schoolbook", "Century Schoolbook", serif;--font-heading: "Titillium Web", sans-serif}*{margin:0;padding:0;box-sizing:border-box;color:inherit;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;overflow-x:hidden}body{font-family:var(--font-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--color-white);color:var(--color-black)}#root{min-height:100vh;width:100%}h1{font-family:var(--font-heading);font-size:var(--font-size-36);font-weight:var(--font-weight-bold)}h2{font-family:var(--font-heading);font-size:var(--font-size-24);font-weight:var(--font-weight-bold)}h3{font-family:var(--font-heading);font-size:var(--font-size-20);font-weight:var(--font-weight-bold)}