:root{--ink:#163b40;--muted:#577075;--teal:#086b68;--mint:#def2eb;--paper:#f5f7f4;--line:#d9e4df;--gold:#ffd56b;--orange:#b35828}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:ui-rounded,"Avenir Next",Avenir,system-ui,sans-serif;font-size:16px;line-height:1.55}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #bd691e;outline-offset:4px}header{max-width:1200px;margin:auto;padding:24px 34px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line)}#brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none;margin-right:auto;line-height:1.25}#brand b{display:block}.brand-icon{background:var(--teal);color:white;font-size:28px;width:48px;height:48px;border-radius:15px;display:grid;place-items:center}.stars{background:#fff0c3;border:1px solid #e8ce7e;border-radius:30px;padding:7px 15px;font-weight:800;white-space:nowrap}main{max-width:1132px;margin:38px auto;padding:0 24px;min-height:65vh}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2rem,4.2vw,3.3rem);line-height:1.12;letter-spacing:-1.5px;margin-bottom:17px}h2{font-size:1.6rem;line-height:1.3}h3{font-size:1.2rem;line-height:1.3}p{color:var(--muted)}.eyebrow{text-transform:uppercase;font-size:.78rem;font-weight:800;letter-spacing:2px;color:var(--teal);margin-bottom:14px}.welcome{display:grid;grid-template-columns:1.35fr 1fr;gap:35px;align-items:center;margin-bottom:36px}.intro{max-width:570px}.intro p{font-size:1.1rem;max-width:470px}.primary,.secondary,.quiet{border:0;border-radius:12px;padding:12px 20px;font-weight:750;min-height:46px}.primary{background:var(--teal);color:white;box-shadow:0 3px 0 #064b48}.primary:hover{background:#075653}.secondary{background:#edf4ef;color:var(--teal);border:1px solid #c5d9cf}.quiet{background:transparent;color:var(--muted);padding:8px 10px}.quiet:hover{background:#e5ede8}.progress-card{background:var(--mint);border:1px solid #bcded2;border-radius:25px;padding:26px;position:relative;overflow:hidden}.progress-card .big{font-size:2.5rem;font-weight:800;line-height:1.2}.progress-card p{margin:6px 0 18px}.progress-track{height:9px;border-radius:10px;background:#c8dfd4;overflow:hidden}.progress-track i{display:block;background:var(--teal);height:100%;border-radius:10px;transition:width .3s}.mini-steps{display:flex;gap:8px;margin-top:20px}.mini-steps span{flex:1;min-height:37px;display:grid;place-items:center;background:#ffffff85;border-radius:8px;font-size:20px}.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.section-heading p{font-size:.88rem}.topics{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.topic{background:white;border:1px solid var(--line);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:12px;transition:transform .2s,box-shadow .2s}.topic:hover{transform:translateY(-3px);box-shadow:0 12px 25px #143d3610}.topic-top{display:flex;justify-content:space-between;align-items:center}.topic-symbol{height:47px;min-width:47px;border-radius:13px;background:var(--tint);color:var(--color);display:grid;place-items:center;font-size:23px;font-weight:800}.topic-number{font-size:.78rem;color:var(--muted);letter-spacing:1px}.topic h3{margin:2px 0 0}.topic p{font-size:.9rem;margin:0;min-height:45px}.levels{display:flex;gap:7px;margin-top:auto}.level{flex:1;background:white;border:1px solid #cbd8d1;border-radius:9px;min-height:43px;font-size:.85rem;font-weight:700;color:var(--ink)}.level.done{background:var(--mint);border-color:#74b59e}.level:hover{border-color:var(--teal);background:#edf8f2}.topic small{color:var(--muted);font-size:.8rem}.bottom-note{margin-top:26px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}details{border:1px solid var(--line);background:white;border-radius:14px;padding:15px 19px}summary{cursor:pointer;font-weight:700}details p{margin:12px 0 0;font-size:.92rem}.exercise-shell{max-width:830px;margin:auto}.exercise-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.crumb{font-size:.86rem;color:var(--muted)}.round-dots{display:flex;gap:7px}.round-dots span{width:28px;height:7px;background:#dce5df;border-radius:8px}.round-dots .done{background:var(--teal)}.round-dots .current{background:#d39230}.exercise{background:white;border:1px solid var(--line);border-radius:25px;padding:32px}.exercise h1{font-size:1.8rem;letter-spacing:-.6px;line-height:1.35;margin:10px 0}.instruction{font-size:1.06rem;margin-bottom:24px}.activity{background:#f5f8f5;border:1px solid #e2eae3;border-radius:17px;padding:26px;margin:22px 0;min-height:165px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18px}.fraction{display:inline-flex;vertical-align:middle;flex-direction:column;text-align:center;line-height:1.2;min-width:25px;margin:0 5px;font-weight:750}.fraction>span:first-child{border-bottom:2px solid currentColor;padding:0 5px 3px}.fraction>span:last-child{padding:3px 5px 0}.equation{display:flex;align-items:center;justify-content:center;gap:13px;flex-wrap:wrap;font-size:1.65rem}.fraction-input{display:inline-flex;flex-direction:column;gap:5px}.fraction-input input{width:75px;min-height:48px;text-align:center;border:2px solid #abc7ba;border-radius:9px;background:white;color:var(--ink);font-weight:750}.fraction-input input:first-child{border-bottom:3px solid var(--teal)}input.scalar{width:88px;min-height:50px;text-align:center;border:2px solid #abc7ba;border-radius:9px;font-weight:750;font-size:1.3rem}.grid{display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:4px;width:100%;max-width:450px}.cell{height:46px;border:2px solid #95b9aa;border-radius:5px;background:#fff;min-width:0;color:var(--teal);font-weight:800;padding:0}.cell.selected{background:var(--teal);border-color:var(--teal);color:white}.grid.static .cell{height:32px;border-width:1px}.grid-label{font-size:.85rem;margin:0;color:var(--muted)}.grid-pair{width:100%;max-width:450px;display:grid;gap:10px}.feedback{border-radius:13px;padding:16px 18px;margin:18px 0;color:var(--ink);background:#fff1d3;border:1px solid #e8c890}.feedback.success{background:#e2f3e9;border-color:#abd1b9}.feedback:empty{display:none}.feedback strong{display:block;margin-bottom:3px}.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.tip{border-left:3px solid #d7b467;padding:10px 16px;margin:15px 0;background:#fff9e9;border-radius:0 10px 10px 0}.choices{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.choice{background:white;border:2px solid #c9d8cf;padding:14px 19px;border-radius:13px;color:var(--ink);min-height:54px}.choice.selected{border-color:var(--teal);background:var(--mint)}.line-wrap{width:100%;overflow-x:auto;padding:8px 4px 15px}.numberline{width:100%;min-width:260px;display:block;height:145px;touch-action:pan-y}.numberline .tick{stroke:#49675f;stroke-width:1.5}.numberline text{font-family:inherit;font-size:16px;fill:var(--ink)}.line-controls{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}.line-controls button{border:1px solid #b2cbbc;border-radius:10px;background:white;color:var(--teal);font-size:1.4rem;width:48px;height:45px}.line-controls output{font-size:1rem;min-width:120px;text-align:center}.line-help{font-size:.85rem;margin:0;text-align:center}.success-view{text-align:center;max-width:640px;margin:30px auto;background:white;border:1px solid var(--line);border-radius:26px;padding:38px}.badge{width:92px;height:92px;display:grid;place-items:center;margin:0 auto 24px;font-size:43px;background:#fff0bd;border-radius:28px;transform:rotate(-5deg)}.success-view .actions{justify-content:center}.learned{padding:20px;background:var(--mint);border-radius:15px;margin:25px 0;text-align:left}.learned p{margin:0}.confetti{position:fixed;top:-20px;pointer-events:none;width:9px;height:14px;animation:fall 1.8s ease-in forwards;z-index:10}@keyframes fall{to{transform:translateY(95vh) rotate(430deg);opacity:0}}footer{max-width:1132px;margin:40px auto 24px;padding:0 24px;text-align:center;color:var(--muted);font-size:.8rem}footer span{display:block;margin-top:4px}.storage-warning{color:#a54520!important}.saved-label{font-size:.8rem;color:var(--muted)}@media(max-width:760px){header{padding:17px 20px;gap:9px}header .quiet{font-size:.8rem;padding:5px}main{margin-top:25px;padding:0 18px}.welcome{grid-template-columns:1fr;gap:22px}.progress-card{padding:20px}.mini-steps{display:none}.progress-card .big{font-size:1.7rem}.topics{grid-template-columns:repeat(2,1fr)}.topic{padding:18px}.exercise{padding:23px}.section-heading{align-items:start}.section-heading p{max-width:135px;text-align:right}}@media(max-width:480px){#brand{font-size:.85rem}.brand-icon{width:38px;height:38px;font-size:24px}.stars{font-size:.85rem;padding:5px 10px}header .quiet{max-width:85px}.topics{grid-template-columns:1fr}.topic p{min-height:0}.topic{gap:10px}.welcome{margin-bottom:28px}.exercise{padding:20px 15px}.activity{padding:19px 12px}.exercise h1{font-size:1.5rem}.equation{gap:8px;font-size:1.4rem}.exercise-head{flex-wrap:wrap}.cell{height:44px}.success-view{padding:28px 20px}.section-heading h2{font-size:1.35rem}.section-heading p{font-size:.8rem}.grid{gap:3px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:480px){.numberline text{font-size:32px}}
