:root{--ink:#f5f3f3;--muted:#bcb5b7;--green:#ff858e;--pale:#353035;--cream:#111113;--line:#3e363a;--orange:#ff8a94}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible+span{outline:3px solid #ffb7bd;outline-offset:5px}header{max-width:1192px;margin:auto;height:104px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;color:var(--ink);text-decoration:none;font-size:29px;font-weight:800;letter-spacing:-1px}.brand-icon{color:var(--green);background:#362126;border-radius:12px;padding:6px 10px;margin-right:11px;font-size:25px;transform:rotate(-8deg)}.brand-dot{color:var(--orange)}.header-note{font-size:13px;color:var(--muted)}.free-tag{font-size:12px;background:#292326;padding:10px 14px;border-radius:30px}.free-tag span{color:var(--orange);margin-left:9px}main{max-width:1040px;margin:auto;padding:0 28px}.intro{text-align:center;padding:47px 0 33px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:var(--green)}h1{font-size:49px;letter-spacing:-2px;line-height:1.13;margin:17px 0}.intro h1 span{color:var(--green)}.intro>p:last-child{font-size:15px;color:var(--muted);line-height:1.7;margin:19px 0 0}.workspace{display:grid;grid-template-columns:1fr 1.12fr;border:1px solid #443239;border-radius:23px;overflow:hidden;box-shadow:0 8px 25px #00000040}.game-story{background:#23191d;padding:31px 37px;position:relative;display:flex;flex-direction:column}.lesson-tag{font-size:10px;font-weight:bold;letter-spacing:1.7px;color:#ff9ba3}.math-art{height:144px;display:flex;align-items:center;gap:14px;justify-content:center;position:relative}.art-number{font-size:60px;font-weight:bold;color:#ff858e;transform:rotate(-9deg)}.art-number.coral{color:#f3ecee;transform:rotate(8deg)}.art-minus,.art-equals{font-size:30px;color:#bcb1b5}.art-answer{font-size:58px;font-weight:bold;background:#b82235;color:#ffffff;border:1px solid #d54a5a;border-radius:19px;padding:0 15px;transform:rotate(8deg);position:relative}.spark{font-size:33px;position:absolute;right:-21px;top:-22px;color:#ff9ba3}.game-story h2{font-size:26px;letter-spacing:-.8px;margin:6px 0 12px}.game-story>p{font-size:17px;color:#c6b9be;line-height:1.6;margin:0}.story-bottom{margin-top:auto;padding-top:32px;display:flex;align-items:center;gap:13px}.story-bottom p{font-size:12px;line-height:1.6;color:#c6b9be}.little-icon{border:1px solid #665057;border-radius:50%;width:34px;height:34px;display:grid;place-items:center;font-size:24px}.settings{background:#1c1c20;padding:28px 35px}.card-top{display:flex;justify-content:space-between;align-items:center}.step-label{font-size:9px;letter-spacing:1.6px;font-weight:bold;color:#beb1b6}.small-sun{color:#ff858e;font-size:24px}.settings h2{font-size:25px;letter-spacing:-.7px;margin:8px 0}.muted{font-size:13px;color:var(--muted);line-height:1.6;margin:0}fieldset{border:0;margin:23px 0 0;padding:0;min-width:0}legend{font-size:13px;font-weight:bold;margin-bottom:8px}.field-help{font-size:11px;color:var(--muted);margin:0 0 11px}.choices{display:flex;gap:9px}.choices label{flex:1;position:relative}.choices input{position:absolute;opacity:0;width:100%;height:100%;margin:0}.choices span{display:flex;min-height:48px;border:1px solid #55444b;border-radius:9px;align-items:center;justify-content:center;font-size:17px;font-weight:600;background:#1c1c20;cursor:pointer}.choices input:checked+span{background:#3d2229;border:2px solid var(--green);color:var(--green)}.question-choices span{font-size:14px}.primary{border:0;border-radius:10px;background:var(--green);color:white;min-height:52px;padding:14px 24px;font-weight:bold;font-size:15px}.primary:hover{background:#a61d2e}.primary:disabled{opacity:.5;cursor:default}.start{width:100%;margin-top:25px;display:flex;align-items:center;justify-content:center;gap:24px}.pace-note{text-align:center;color:var(--muted);font-size:10px;margin:12px 0 0}.values{display:flex;justify-content:center;gap:46px;margin:27px 0 45px;font-size:11px;color:#bcb5b7}.values b{color:#ff858e;font-size:15px;margin-right:8px}footer{border-top:1px solid var(--line);max-width:1136px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;color:#bcb5b7;font-size:10px;padding:25px 5px}.footer-brand{font-size:16px;font-weight:bold;color:#e2d8dc}footer p{margin:0}.play-heading{display:flex;justify-content:space-between;align-items:center;margin:30px auto 15px;max-width:700px;font-size:12px;color:var(--muted)}.text-button{border:0;background:none;color:var(--green);min-height:46px;padding:10px;font-weight:bold}.practice-card{max-width:700px;margin:0 auto 45px;border:1px solid var(--line);border-radius:22px;background:#1c1c20;padding:28px;text-align:center}.progress-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.progress-heading h1{font-size:19px;letter-spacing:-.5px;margin:0}.progress-heading span{font-size:12px;color:var(--muted)}progress{width:100%;height:7px;appearance:none;border:0;background:var(--pale);margin:18px 0;border-radius:10px}progress::-webkit-progress-bar{background:var(--pale);border-radius:10px}progress::-webkit-progress-value{background:var(--green);border-radius:10px}.instruction{font-size:14px;color:var(--muted)}.equation{display:flex;align-items:center;justify-content:center;gap:12px;font-size:clamp(35px,7vw,58px);font-weight:bold;letter-spacing:-1px}.equation output{min-width:90px;border:2px solid #c45d69;border-radius:12px;padding:10px;color:var(--green);background:#302126}#feedback{min-height:24px;font-size:14px;line-height:1.5;margin:20px 0;color:var(--green)}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;max-width:310px;margin:0 auto 15px}.keypad button{min-height:54px;border:1px solid #57484e;background:#2a272c;border-radius:10px;color:var(--ink);font-size:23px;font-weight:bold}.keypad button:hover{background:#423038}#check{width:310px;max-width:100%}.keyboard-note{font-size:10px;color:var(--muted)}#hint{background:#2d2025;border:1px solid #68434c;border-radius:14px;padding:16px;margin:10px 0 22px;text-align:left}#hint h2{font-size:16px;margin:0 0 8px}#hint p{font-size:13px;line-height:1.5}.line-window{overflow-x:auto;padding:18px 12px 10px;border-radius:8px;background:#1c1c20}.number-line{display:flex;min-width:max-content;padding:20px 5px 8px;flex-direction:row}.tick{width:43px;flex:none;border-top:3px solid #b29aa3;position:relative;text-align:center;padding-top:12px;font-size:13px}.tick:before{content:'';position:absolute;width:2px;height:10px;left:50%;top:-6px;background:#b29aa3}.tick.visited{border-color:var(--green);color:var(--green);font-weight:bold}.tick.current:after{content:'▼';position:absolute;top:-28px;left:15px;color:var(--orange);font-size:19px}.hint-buttons{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px}.hint-buttons button{border:1px solid #8a626c;background:#1c1c20;border-radius:8px;min-height:44px;padding:10px 15px;color:var(--green);font-weight:bold}.hint-buttons button:disabled{opacity:.5}#hop-status{flex:1;font-size:12px}.results-intro{text-align:center;padding:35px 0 20px}.results-intro h1{font-size:35px}.results-intro>p:last-child{color:var(--muted);font-size:14px}.result-flower{font-size:48px;color:#ff858e}.summary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.stat{text-align:center;border:1px solid var(--line);border-radius:14px;padding:25px 10px;background:#29272c}.stat:nth-child(2){background:#38262d}.stat:nth-child(3){background:#43232d}.stat strong{display:block;font-size:36px;margin-bottom:8px}.stat span{font-size:13px}.review-card{background:#1c1c20;border:1px solid var(--line);border-radius:16px;padding:25px;margin-top:22px}.review-card h2{font-size:21px;margin:0 0 8px}.review-row{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:15px 0;border-bottom:1px solid var(--line);font-size:14px}.review-row small{display:block;margin-top:5px;color:var(--muted)}.badge{font-size:11px;border-radius:15px;background:#23191d;padding:8px 11px}.badge.missed{background:#43232d}.badge.guided{background:#38262d}.result-actions{display:flex;justify-content:center;gap:15px;margin:25px 0 40px}[hidden]{display:none!important}@media(max-width:650px){header{height:80px;padding:0 20px}.brand{font-size:24px}.header-note{display:none}main{padding:0 18px}.intro{padding-top:30px}.intro h1{font-size:39px}.intro>p:last-child{font-size:14px}.workspace{grid-template-columns:1fr}.game-story{padding:22px 25px;display:grid;grid-template-columns:1fr 110px}.lesson-tag{grid-column:1}.math-art{grid-column:2;grid-row:1/4;height:auto;gap:5px;align-self:center}.art-number{font-size:29px}.art-minus,.art-equals{font-size:17px}.art-answer{font-size:29px;padding:2px 7px;border-radius:9px}.spark{font-size:20px;right:-10px;top:-15px}.game-story h2{font-size:21px;margin-top:12px;max-width:220px}.game-story>p{font-size:13px}.story-bottom{display:none}.settings{padding:24px}.values{gap:12px;flex-wrap:wrap;font-size:10px;margin:23px 0 30px}.values b{margin-right:3px}footer{padding:20px;gap:12px;flex-wrap:wrap}footer>span:last-child{display:none}.practice-card{padding:20px 14px}.progress-heading h1{font-size:16px}.progress-heading span{font-size:11px}.equation{gap:8px}.equation output{min-width:75px}.summary{gap:7px}.stat{padding:20px 7px}.stat span{font-size:11px}.stat strong{font-size:30px}.results-intro h1{font-size:29px}.review-card{padding:20px 15px}.result-actions{flex-direction:column}.desktop{display:none}}

.parent-settings{border-top:1px solid var(--line);margin-top:22px;padding-top:8px}.parent-settings summary{cursor:pointer;min-height:44px;align-content:center;color:var(--muted);font-size:12px}.parent-settings summary:focus-visible{outline:3px solid #ffb7bd;outline-offset:3px}.parent-settings fieldset{margin-top:10px}.difficulty-help{margin-top:12px;line-height:1.7}.parent-note{font-size:11px;line-height:1.5;color:var(--muted);margin-bottom:0}

a.text-button{display:inline-flex;align-items:center;text-decoration:none}

/* Red and black theme: strong action contrast on dark surfaces. */
:root{color-scheme:dark}.primary{background:#c3273b}.primary:hover{background:#a61d2e}progress::-moz-progress-bar{background:var(--green);border-radius:10px}

/* Keep the answer area in the layout when feedback replaces the keypad. */
.practice-card{position:relative}
#answer-controls[hidden]{display:block!important;visibility:hidden;pointer-events:none}
#feedback{min-height:42px}
#next{position:absolute;bottom:65px;left:50%;transform:translateX(-50%);width:310px;max-width:calc(100% - 28px)}
