:root{
  --bg:#ffffff; --card:#fff; --ink:#15372c; --muted:#425d52; --line:#bdd1c6;
  --accent:#cf3610; --accent-ink:#fff; --green:#127a42; --red:#b3261e; --gold:#ffd028; --teal:#008a6e;
  --r:14px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 system-ui,-apple-system,"Segoe UI","Noto Sans Hebrew","Arial Hebrew",Arial,sans-serif;min-height:100dvh}
.top{position:sticky;top:0;z-index:5;background:var(--ink);color:#fff;display:flex;align-items:center;gap:10px;padding:10px 14px;padding-top:max(10px,env(safe-area-inset-top));flex-wrap:wrap}
.brand{font-weight:800;font-size:18px;letter-spacing:.2px;flex:1}
.icon-btn{background:none;border:1px solid #ffffff55;color:#fff;border-radius:999px;padding:4px 12px;font:inherit;font-size:16px;cursor:pointer}
.bar{flex-basis:100%;height:6px;background:#ffffff26;border-radius:6px;overflow:hidden}
.bar i{display:block;height:100%;width:0;background:var(--gold);transition:width .4s}
main{max-width:680px;margin:0 auto;padding:18px 16px 120px;outline:none}
h1{font-size:28px;line-height:1.25;margin:6px 0 10px}
h2{font-size:23px;line-height:1.3;margin:6px 0 10px}
h3{font-size:18px;margin:18px 0 6px}
p{margin:0 0 12px}
.lead{font-size:18px;color:var(--muted)}
.card{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:16px;margin:14px 0}
.card.key{border-color:var(--ink);box-shadow:4px 4px 0 var(--ink)}
.formula{font-size:22px;font-weight:700;text-align:center;direction:rtl;padding:6px 0}
.formula b{color:var(--accent)}
.tag{display:inline-block;background:var(--ink);color:#fff;border-radius:6px;padding:0 8px;font-size:16px;font-weight:700;margin-inline-end:6px}
.fig{display:block;width:100%;max-width:420px;margin:10px auto;height:auto}
.fig text{font-family:inherit;font-size:19px;font-weight:700;fill:var(--ink)}
.path{display:grid;gap:12px;margin-top:14px}
.sec{display:flex;align-items:center;gap:14px;background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:14px;cursor:pointer;text-align:start;font:inherit;color:inherit;width:100%;position:relative}
.sec:active{transform:translateY(1px)}
.sec .num{flex:none;width:44px;height:44px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:800;font-size:20px}
.sec.done .num{background:var(--green)}
.sec .t{font-weight:800;font-size:18px;line-height:1.3}
.sec .s{color:var(--muted);font-size:16px}
.sec .mini{height:5px;background:var(--line);border-radius:5px;margin-top:6px;overflow:hidden}
.sec .mini i{display:block;height:100%;background:var(--green)}
.sec .body{flex:1}
.btn{background:var(--accent);color:var(--accent-ink);border:2px solid var(--accent);border-radius:12px;padding:10px 20px;font:inherit;font-weight:700;font-size:17px;cursor:pointer;min-height:46px}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.small{padding:6px 14px;min-height:40px;font-size:16px}
.btn[disabled]{opacity:.4;cursor:default}
.nav{position:fixed;bottom:0;inset-inline:0;background:var(--card);border-top:1.5px solid var(--ink);display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;padding-bottom:max(10px,env(safe-area-inset-bottom));z-index:6}
.dots{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;flex:1}
.dots i{width:9px;height:9px;border-radius:50%;background:var(--line)}
.dots i.on{background:var(--ink)}
.dots i.cur{background:var(--accent);transform:scale(1.35)}
.q .prompt{font-size:18px;font-weight:600;margin-bottom:8px}
.fields{display:grid;gap:10px;margin:10px 0}
.field{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.field label{font-weight:700;min-width:84px}
.field input{width:110px;font:inherit;font-size:20px;font-weight:700;padding:8px 10px;border:2px solid var(--ink);border-radius:10px;text-align:center;direction:ltr;background:#fff;color:var(--ink)}
.field input:focus{outline:3px solid var(--gold);outline-offset:1px}
.field input.ok{border-color:var(--green);background:#e6f4ec}
.field input.bad{border-color:var(--red);background:#fbe9e7}
.field .u{color:var(--muted)}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.fb{margin-top:10px;padding:10px 12px;border-radius:10px;font-weight:600;display:none}
.fb.show{display:block}
.fb.ok{background:#e6f4ec;color:#14532d;border:1.5px solid var(--green)}
.fb.bad{background:#fbe9e7;color:#7a1b15;border:1.5px solid var(--red)}
.tip{background:#fff4d6;border:1.5px dashed #c8921a;border-radius:10px;padding:10px 12px;margin-top:10px}
.sol{margin-top:10px;border-top:2px solid var(--ink);padding-top:8px}
.sol ol{margin:6px 0;padding-inline-start:22px}
.sol li{margin:6px 0}
.choices{display:grid;gap:8px;margin:10px 0}
.choice{display:block;width:100%;text-align:start;background:#fff;border:2px solid var(--ink);border-radius:10px;padding:10px 12px;font:inherit;font-weight:600;cursor:pointer;color:var(--ink)}
.choice.ok{border-color:var(--green);background:#e6f4ec}
.choice.bad{border-color:var(--red);background:#fbe9e7}
.status{float:inline-end;font-size:16px;font-weight:800;color:var(--green)}
.lab .ctl{display:grid;gap:8px;margin:8px 0}
.lab .ctl label{display:flex;align-items:center;gap:10px;font-weight:700}
.lab input[type=range]{flex:1;accent-color:var(--accent);height:32px}
.lab .num{min-width:2ch;text-align:center;font-weight:800;font-size:20px}
.readout{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.readout div{background:#fff;border:2px solid var(--ink);border-radius:10px;text-align:center;padding:6px;font-weight:700}
.readout b{display:block;font-size:24px}
.seg{display:flex;gap:0;border:2px solid var(--ink);border-radius:10px;overflow:hidden;margin:8px 0}
.seg button{flex:1;border:0;background:#fff;font:inherit;font-weight:700;padding:8px;cursor:pointer;color:var(--ink)}
.seg button.on{background:var(--ink);color:#fff}
.hero{background:var(--ink);color:#fff;border-radius:var(--r);padding:20px 18px;margin-bottom:6px}
.hero h1{margin:0 0 6px}
.hero p{margin:0;color:#fff}
.hero svg{display:block;margin:12px auto 0;max-width:260px;width:100%}
.celebrate{text-align:center}
.celebrate .big{font-size:52px}
@media (min-width:700px){body{font-size:18px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
/* Compact bottom navigation for narrow screens. */
@media (max-width:520px){.dots{display:none}.nav{justify-content:space-between}.nav .btn{padding-inline:14px;font-size:16px}}

/* Solid, high-energy accents, without gradients. */
.score{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:16px}
.score b{background:var(--gold);color:var(--ink);padding:3px 10px;border-radius:8px;white-space:nowrap}
.score span#scoreLevel{font-size:16px}.score-guide{border:2px solid var(--green);border-inline-start:8px solid var(--green)}
.score-guide p{margin:6px 0 0}.score-total{font-size:28px;color:var(--green)}
.sec:nth-child(3n+1){border-inline-start:7px solid var(--accent)}
.sec:nth-child(3n+2){border-inline-start:7px solid var(--green)}
.sec:nth-child(3n){border-inline-start:7px solid var(--gold)}
.hero{background:#006d51}.sec .num{background:#006d51}.sec:nth-child(3n+1) .num{background:var(--accent)}
.tip{background:#fff;border:2px solid #a36600;border-inline-start:7px solid var(--gold)}
@media(max-width:440px){.top{gap:6px}.brand{font-size:18px}.score{gap:6px;flex-basis:auto}.score #scoreLevel{display:none}.top .icon-btn{padding-inline:8px}.seg button{font-size:16px;padding:8px 4px}}
[hidden]{display:none!important}
.math{display:inline-block;unicode-bidi:isolate;font-size:1.1em;font-weight:700}
.diagram{display:block;width:100%;max-width:330px;height:auto;margin:12px auto;direction:ltr;overflow:visible}
.diagram text{font-family:Arial,sans-serif;fill:var(--ink)}
.lab>label{display:flex;align-items:center;gap:10px;margin:10px 0;flex-wrap:wrap}.lab>label input{flex:1;min-width:130px}
@media(max-width:440px){.brand{font-size:17px}.field input{width:105px}}

.math{margin-inline:4px}
.study-goal{border-inline-start:5px solid var(--green);padding-inline-start:10px;font-size:16px}
.test-input{display:block;width:130px;max-width:100%;font:inherit;font-size:20px;border:2px solid var(--ink);padding:8px;border-radius:10px;margin:8px 0;background:#fff;color:var(--ink)}
.path h2{margin-top:20px}.practice-items h3{margin-top:0}
.q,#practiceResult{scroll-margin-top:90px}
/* A calm workbook on small screens, a real workspace on larger ones. */
@font-face{font-family:Heebo;src:url('fonts/heebo-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Heebo;src:url('fonts/heebo-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Heebo;src:url('fonts/heebo-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Heebo;src:url('fonts/heebo-700.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Heebo;src:url('fonts/heebo-800.ttf') format('truetype');font-weight:800;font-display:swap}
:root{--bg:#f7f6f0;--ink:#163e35;--muted:#52655f;--line:#d5dfd8;--accent:#bd3b1e;--green:#147451;--gold:#f5ca46;--r:16px}
body{font-family:Heebo,Arial,sans-serif;line-height:1.7}
h1,h2,h3,.brand{letter-spacing:-.3px}h1{font-weight:800}h2,h3{font-weight:700}
.top{padding-inline:20px;box-shadow:0 2px 8px #163e3512}.card{border-width:1px}.card.key{box-shadow:none;border:1px solid var(--line);border-inline-start:5px solid var(--green)}
.btn{border-radius:10px;transition:transform .15s,background .15s}.btn:hover{filter:brightness(.96)}.btn:active{transform:translateY(2px)}.btn.ghost{border-width:1.5px}.choice{border-width:1.5px}
.hero{background:#164d40;position:relative;overflow:hidden;padding:24px}.hero h1{font-size:32px}.hero p{max-width:48ch}.hero svg{margin-inline:0}
.side-nav{display:none}.topic-group{min-width:0}.topic-group h2{display:flex;gap:12px;align-items:center;font-size:21px}.topic-group h2>span{display:grid;place-items:center;background:var(--gold);border-radius:8px;width:32px;height:32px;flex:none;font-size:18px}.topic-links{display:grid;gap:10px}.path{gap:20px}.path h2{margin-top:0}.sec{border-width:1px;box-shadow:0 2px 0 #163e3507}.sec .num{border-radius:10px;width:38px;height:38px;font-size:18px}.sec:hover{border-color:var(--green)}
.lesson-study,.lesson-practice{min-width:0}.lesson-grid>.lesson-study>.card:first-child,.lesson-grid>.lesson-practice>.card:first-child{margin-top:14px}.lesson-study .card.key{background:#eef4ee}.study-goal{font-size:17px}.lesson-view>.btn{margin-bottom:8px}.q{position:relative}.q .prompt{line-height:1.65}.q .row{gap:8px}.q .row .btn{padding:8px 14px}.q .row .btn.ghost{font-size:16px}.practice-items .card{position:relative}.practice-items h3{font-size:18px}.test-feedback .fb{font-size:16px}
.success-burst{position:absolute;top:35%;left:50%;width:1px;height:1px;pointer-events:none;z-index:3}.success-burst i{position:absolute;width:7px;height:10px;border-radius:2px;background:var(--gold);animation:success-scatter .8s ease-out forwards}.success-burst i:nth-child(2n){background:var(--green)}.success-burst i:nth-child(3n){background:var(--accent)}.success-pop{animation:success-pop .45s ease-out}
@keyframes success-pop{0%{box-shadow:0 0 0 0 #14745155}45%{box-shadow:0 0 0 7px #14745122}100%{box-shadow:0 0 0 12px #14745100}}
@keyframes success-scatter{0%{opacity:0;transform:translate(0,0) scale(.4)}20%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--spin))}}
@media(min-width:700px){main{max-width:none;padding:28px 28px 110px}.workspace{max-width:1440px;margin:auto}.home-view{display:grid;grid-template-columns:1.1fr 1fr;gap:18px 28px}.home-view .hero{grid-column:1/-1;display:grid;grid-template-columns:1fr 250px;gap:0 28px;padding:32px}.hero h1{grid-column:1;font-size:38px}.hero p{grid-column:1}.hero svg{grid-column:2;grid-row:1/3;align-self:center;margin:0}.home-view .quick-actions,.home-view>.lead,.home-view>.path{grid-column:1/-1}.home-view>.card{margin:0}.home-view>.card.key{grid-column:2;grid-row:4/6}.home-view>.score-guide{grid-column:1;align-self:start}.home-view>.path{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.topic-group:nth-child(3){grid-row:span 2}.practice-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}.practice-items>.card{margin:0}.practice-view>p{max-width:70ch}.lesson-practice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}.lesson-practice>.card{margin:0}.lesson-grid{margin-top:16px}.lesson-study .diagram,.lesson-study .fig{margin-inline:0}.lesson-study{margin-bottom:22px}.nav{padding-inline:28px}.only-study .lesson-study{max-width:850px}}
@media(min-width:1100px){.workspace{display:grid;grid-template-columns:220px minmax(0,1fr);gap:0}.side-nav{display:flex;flex-direction:column;gap:4px;position:sticky;top:88px;align-self:start;padding:24px 18px 40px;border-inline-end:1px solid var(--line);height:calc(100dvh - 88px);overflow:auto}.side-label{font-size:14px;color:var(--muted);font-weight:700;margin-bottom:8px}.side-nav a{display:block;text-decoration:none;color:var(--ink);font-size:15px;font-weight:600;padding:10px 12px;border-radius:8px}.side-nav a small{display:block;font-size:12px;font-weight:400;color:var(--muted)}.side-nav a:hover{background:#e8eee8}.side-nav a.active{background:var(--ink);color:#fff}.side-nav a.active small{color:#d7e8df}.side-nav .test-link{border:1px solid var(--accent);margin-top:12px;color:var(--accent)}main{padding:28px 32px 110px}.lesson-grid{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(320px,1.1fr);gap:26px;align-items:start}.lesson-study{position:sticky;top:94px;margin:0}.lesson-grid .lesson-study>.card:first-child{margin-top:0}.lesson-practice{grid-template-columns:1fr}.only-study{display:block}.only-study .lesson-study{position:static}.nav{inset-inline-start:220px;padding-inline:32px}.top{padding-inline:32px}.brand{font-size:21px}.practice-items{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.success-burst{display:none}}
#practiceResult{position:relative}
/* Sky, white and pink. Dark text keeps the light palette readable. */
:root{--bg:#fcfdff;--card:#fff;--ink:#183d60;--muted:#50647a;--line:#ceddea;--accent:#1474a6;--accent-ink:#fff;--green:#1474a6;--gold:#f4b4d1;--teal:#1474a6;--pink:#a52665}
.top{background:#d7f0fd;color:var(--ink);box-shadow:0 2px 8px #183d6010;border-bottom:1px solid #bbdef2}.top .icon-btn{color:var(--ink);border-color:#527c97}.bar{background:#b5d7eb}.bar i{background:var(--accent)}.score b{background:#f9d7e7;color:var(--ink)}
h1,h2,h3{color:var(--ink)}.hero{background:#d7f0fd;color:var(--ink);border:1px solid #bbdef2}.hero p{color:var(--ink)}.hero svg polygon{fill:#f2a8c9;stroke:#a52665}.hero svg g{stroke:#183d60}.tag{background:#176b94;color:#fff}.sec .num,.sec:nth-child(3n+1) .num{background:#d7f0fd;color:var(--ink)}.sec:nth-child(3n+1){border-inline-start-color:#53a8d4}.sec:nth-child(3n+2){border-inline-start-color:#e891bb}.sec:nth-child(3n){border-inline-start-color:#81c9ec}.sec.done .num{background:#1474a6;color:#fff}.topic-group h2>span{background:#f9d7e7;color:var(--ink)}
.lesson-study .card.key{background:#f0f9fe}.tip{background:#fff5fa;border-color:#a52665;border-inline-start-color:#ec9dc3}.field input:focus,.test-input:focus,.choice:focus-visible,.btn:focus-visible,.sec:focus-visible,.side-nav a:focus-visible{outline:3px solid #a52665;outline-offset:3px}
.fb.ok{background:#e7f5fd;color:#174c70;border-color:#1474a6}.field input.ok,.choice.ok{background:#e7f5fd;border-color:#1474a6}.fb.bad{background:#fff0f4;color:#8b1944;border-color:#ae285a}.field input.bad,.choice.bad{background:#fff0f4;border-color:#ae285a}
#quickPractice,#openPractice,#practiceSubmit,.side-nav .test-link{background:#a52665;color:#fff;border-color:#a52665}.practice-view h1{color:#a52665}.practice-items .card{border-top:4px solid #edafd0}.side-nav a.active{background:#1474a6;color:#fff}.side-nav a.active small{color:#fff}.side-nav a:hover:not(.active){background:#e8f5fd}.side-nav a.test-link:hover{background:#8f2058}.side-nav{border-color:#d8e6f1}.success-burst i{background:#e88dbb}.success-burst i:nth-child(2n){background:#53a8d4}.success-burst i:nth-child(3n){background:#a52665}
@keyframes success-pop{0%{box-shadow:0 0 0 0 #1474a655}45%{box-shadow:0 0 0 7px #1474a622}100%{box-shadow:0 0 0 12px #1474a600}}

/* Progress dashboard */
.dashboard-link{text-decoration:none;background:#a52665;color:#fff;border-color:#a52665}.dashboard-top{font-size:14px;padding:7px 10px;background:#a52665;min-height:40px}.dashboard-view{width:100%}.dashboard-note{font-size:15px;color:var(--muted);max-width:75ch}.dashboard-stats,.dashboard-topics,.dashboard-errors{display:grid;gap:14px}.dashboard-stats .card,.dashboard-topics .card,.dashboard-errors .card{margin:0;min-width:0}.dashboard-stats{grid-template-columns:repeat(2,minmax(0,1fr));margin:22px 0 30px}.dashboard-stats strong{display:block;font-size:27px;line-height:1.3;margin:12px 0;color:#a52665;overflow-wrap:anywhere}.dashboard-stats small{font-size:15px;font-weight:400}.dashboard-stats a{display:block;color:var(--ink);margin-top:8px}.dashboard-topics{margin-bottom:28px}.dashboard-topics h3{margin-top:0}.dashboard-topics progress{width:100%;height:14px;accent-color:#1474a6;margin-bottom:12px}.dashboard-topics .sub-progress{font-size:15px;margin:2px 0}.dashboard-topics .btn{display:inline-block;margin-top:12px;text-decoration:none}.dashboard-errors .tag{font-size:14px}.dashboard-errors p{margin-top:12px}.dashboard-errors small{display:block;margin-bottom:12px;color:var(--muted)}.dashboard-errors .btn{display:inline-block;text-decoration:none}.retry-target{outline:3px solid #a52665;outline-offset:3px}.practice-items .card,[data-draw]{scroll-margin-top:140px}.practice-retry{border-top:2px solid var(--line);padding-top:15px;margin-top:16px}.dashboard-view h2{margin-top:24px}
@media(max-width:440px){.top .brand{font-size:16px;flex-basis:calc(100% - 95px)}.top #homeBtn:not([hidden])+.brand{flex-basis:auto}.top .dashboard-top{margin-inline-start:auto}.q{scroll-margin-top:140px}.dashboard-stats .card{padding:13px}.dashboard-stats strong{font-size:24px}.dashboard-topics .btn,.dashboard-errors .btn{min-height:44px}}
@media(min-width:700px){.dashboard-topics,.dashboard-errors{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.dashboard-stats strong{font-size:26px}}

.dashboard-stats strong[dir="ltr"]{text-align:right}.dashboard-stats strong small{display:inline}.dashboard-topics progress{appearance:none;border:0;border-radius:8px;background:#deedf6;overflow:hidden}.dashboard-topics progress::-webkit-progress-bar{background:#deedf6;border-radius:8px}.dashboard-topics progress::-webkit-progress-value{background:#1474a6;border-radius:8px}.dashboard-topics progress::-moz-progress-bar{background:#1474a6;border-radius:8px}
/* Four main subjects, then their own parts. */
.home-view>.path{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;grid-column:1/-1}.subject-tile{display:flex;flex-direction:column;justify-content:space-between;gap:12px;min-height:245px;padding:24px;border:2px solid #bbdef2;border-radius:20px;background:#f0f9fe;color:var(--ink);text-decoration:none}.subject-tile:nth-child(even){border-color:#efb7d0;background:#fff5fa}.subject-tile h2{font-size:24px;margin:0}.subject-tile p{margin:0}.subject-number{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#d7f0fd;font-weight:800;font-size:22px}.subject-tile strong{font-size:21px}.subject-tile progress,.subtopic-card progress{width:100%;height:10px;accent-color:#1474a6}.subject-tile:hover,.subtopic-card:hover{border-color:#a52665}.subject-tile:focus-visible,.subtopic-card:focus-visible{outline:3px solid #a52665;outline-offset:3px}.subtopic-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.subtopic-list>h2{grid-column:1/-1;margin:16px 0 0}.subtopic-card{display:block;text-decoration:none;color:var(--ink);border:1px solid #bbdef2;border-inline-start:6px solid #81c9ec;border-radius:14px;padding:20px;background:white}.subtopic-card h3{margin:0 0 10px}.subtopic-card p{margin:6px 0}.subtopic-card strong{display:block;margin:8px 0}.subtopic-card>span{display:block;margin-top:10px}.diagram-pair{display:flex;flex-wrap:wrap;gap:4px;direction:ltr;justify-content:center}.diagram-pair>div{flex:1 1 100px;min-width:0;text-align:center}.diagram-pair .diagram{max-width:160px;margin:0}.construct-angle{padding:12px;background:#f0f9fe;border-radius:12px}.construct-angle input{width:100%;min-height:44px;accent-color:#1474a6}.construct-angle output{display:block;text-align:center;direction:ltr;font-weight:700}.click-grid{cursor:crosshair}.worked-example{direction:rtl}.subject-view{max-width:1100px}.score b{max-width:170px}.score-level{max-width:180px}@media(max-width:520px){.home-view>.path,.subtopic-list{grid-template-columns:1fr}.subject-tile{min-height:230px}.subject-tile h2{font-size:24px}}
.home-view>.path{grid-row:auto}.home-view>.card.key{grid-row:auto}.home-view>.score-guide{grid-row:auto}.subject-tile{aspect-ratio:1;min-height:0}.subject-tile progress,.subtopic-card progress{appearance:none;border:0;border-radius:8px;background:#deedf6;overflow:hidden}.subject-tile progress::-webkit-progress-bar,.subtopic-card progress::-webkit-progress-bar{background:#deedf6}.subject-tile progress::-webkit-progress-value,.subtopic-card progress::-webkit-progress-value{background:#1474a6}.subject-tile progress::-moz-progress-bar,.subtopic-card progress::-moz-progress-bar{background:#1474a6}@media(max-width:520px){.subject-tile{min-height:270px;aspect-ratio:auto}}
/* Geometry assembles into a five-second, instantly skippable welcome. */
.intro-open{overflow:hidden}.math-intro{position:fixed;inset:0;z-index:2000;background:#d7f0fd;display:grid;place-items:center;overflow:hidden;padding:22px;color:#183d60}.intro-stage{text-align:center;width:min(100%,520px)}.intro-stage h1{font-size:clamp(30px,6vw,46px);margin:18px 0 8px}.intro-stage p{font-size:18px;line-height:1.7;margin:0 0 20px}.intro-orbit{position:relative;width:280px;height:280px;max-width:100%;margin:auto}.intro-piece{position:absolute;width:80px;height:80px;display:grid;place-items:center;border:3px solid #183d60;border-radius:20px;background:#fff;font-size:30px;font-weight:800;animation:intro-assemble 4.9s cubic-bezier(.4,0,.2,1) both;direction:ltr}.piece-grid{left:12px;top:12px;--dx:70px;--dy:70px;--turn:120deg}.piece-angle{right:12px;top:12px;background:#f4b4d1;--dx:-70px;--dy:70px;--turn:-100deg;animation-delay:.08s}.piece-area{left:12px;bottom:12px;background:#f4b4d1;--dx:70px;--dy:-70px;--turn:-140deg;animation-delay:.16s}.piece-number{right:12px;bottom:12px;--dx:-70px;--dy:-70px;--turn:110deg;animation-delay:.24s}.intro-core{position:absolute;inset:95px;display:grid;place-items:center;background:#1474a6;color:white;border-radius:50%;font-size:38px;font-weight:800;animation:intro-core 4.8s ease both}.intro-time{width:150px;height:5px;background:#fff;border-radius:5px;overflow:hidden;margin:22px auto}.intro-time i{display:block;height:100%;background:#a52665;transform-origin:right;animation:intro-timer 5s linear both}.intro-skip{min-height:48px;position:relative}.intro-skip:focus-visible{outline:3px solid #183d60;outline-offset:5px}
@keyframes intro-assemble{0%{transform:translate(var(--dx),var(--dy)) rotate(var(--turn)) scale(.15)}22%{transform:translate(0,0) rotate(-6deg) scale(1)}38%{transform:translate(0,0) rotate(6deg)}57%{transform:translate(calc(var(--dx)*.22),calc(var(--dy)*.22)) rotate(-10deg)}76%{transform:translate(0,0) rotate(0) scale(1)}92%,100%{transform:translate(calc(var(--dx)*.72),calc(var(--dy)*.72)) rotate(0) scale(.7)}}
@keyframes intro-core{0%,15%{transform:scale(.1);opacity:0}30%,80%{transform:scale(1);opacity:1}95%,100%{transform:scale(.8);opacity:1}}
@keyframes intro-timer{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media(prefers-reduced-motion:reduce){.math-intro{display:none}.intro-piece,.intro-core,.intro-time i{animation:none!important}}
.completion-credits{position:fixed;z-index:1500;bottom:calc(80px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(360px,calc(100vw - 32px));background:#fff;border:3px solid #a52665;border-radius:24px;padding:18px;text-align:center;box-shadow:0 8px 32px #183d6033;overflow:hidden;animation:credits-land .55s cubic-bezier(.2,.7,.25,1)}.completion-credits h2{font-size:24px;margin:4px 0}.completion-credits>p{font-size:15px;line-height:1.5;margin:5px 0}.credits-badge{font-size:34px;color:#a52665;line-height:1}.credits-window{height:150px;overflow:hidden;background:#f0f9fe;border-radius:14px;margin:12px 0}.credits-roll{padding:8px 10px;animation:credits-roll 5.3s ease-in-out both}.credits-roll p{font-size:17px;line-height:1.7;margin:8px 0}.credits-roll p:first-child{font-weight:800;color:#a52665}.credits-particle{position:absolute;pointer-events:none;width:11px;height:11px;background:#f4b4d1;border:2px solid #1474a6;left:50%;top:45%;animation:credits-scatter 1.15s ease-out both}.credits-particle:nth-of-type(even){border-radius:50%;background:#d7f0fd}
@keyframes credits-land{0%{transform:translateX(-50%) scale(.7) rotate(-6deg)}70%{transform:translateX(-50%) scale(1.02) rotate(2deg)}100%{transform:translateX(-50%) scale(1)}}
@keyframes credits-roll{0%,15%{transform:translateY(0)}85%,100%{transform:translateY(-88px)}}
@keyframes credits-scatter{0%{transform:translate(0,0) scale(.3);opacity:1}100%{transform:translate(var(--dx),var(--dy)) rotate(var(--r));opacity:0}}
@media(prefers-reduced-motion:reduce){.completion-credits,.credits-roll,.credits-particle{animation:none!important}.credits-window{height:auto}.credits-roll{transform:none}}
@media(max-height:600px){.intro-orbit{width:180px;height:180px}.intro-piece{width:50px;height:50px;font-size:22px}.intro-core{inset:60px;font-size:28px}.intro-stage h1{margin-top:8px}.intro-stage p{font-size:15px;margin-bottom:8px}.intro-time{margin:10px auto}.completion-credits{bottom:70px;max-height:calc(100vh - 100px);overflow:auto}}

/* input help and validation */
.inhints{margin:8px 0 4px}.inhints p,.inhint{margin:4px 0;font-size:16px;line-height:1.5;color:#3b4f63}
.inhint{margin:2px 0 8px}
.fb ul{margin:6px 0 0;padding-inline-start:22px}.fb li{margin:3px 0}
.help-full{font-size:17px;line-height:1.6}.help-full p{margin:8px 0}.help-full ol,.help-full ul{margin:6px 0;padding-inline-start:24px}.help-full li{margin:4px 0}
.card.invalid{border:2px solid #ae285a;background:#fff8fa}
.test-input[aria-invalid="true"],.field input[aria-invalid="true"]{border-color:#ae285a;background:#fff0f4}
.bad-links{margin-top:8px;display:flex;flex-wrap:wrap;gap:10px}.bad-links a{font-weight:700;text-decoration:underline;padding:6px 4px}
.ex-solution,.ex-rule,.ex-sample,.ex-warn{display:block;margin-top:6px;line-height:1.55}
.test-feedback .fb{font-weight:500;font-size:16px}
