@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#18254d;background:#f3f5fb;font-synthesis:none;--blue:#273cb7;--ink:#18254d;--muted:#65708c;--line:#e0e5f0;--yellow:#ffcf4a;--green:#177b65}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.5}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #f2b700;outline-offset:4px}button{border:0;background:none;color:inherit}h1,h2,h3,p{margin:0}h1,h2,h3,.brand,.big-number{font-family:'Outfit',sans-serif}h1{font-size:clamp(2rem,4vw,3rem);letter-spacing:-.035em;line-height:1.1}h2{font-size:1.7rem;letter-spacing:-.025em}h3{font-size:1.25rem}p{line-height:1.65}small,.muted{color:var(--muted)}small{font-size:.875rem}.shell{max-width:1240px;margin:auto;padding:0 38px 40px}.topbar{height:98px;display:flex;align-items:center;gap:32px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;font-size:1.65rem;font-weight:700;letter-spacing:-.04em;margin-right:auto}.brand img{width:38px;height:38px}.nav{display:flex;gap:8px}.nav button{padding:12px 17px;border-radius:12px;color:var(--muted);font-weight:600}.nav button.active{background:#e6eafb;color:var(--blue)}.pill{display:inline-flex;gap:8px;align-items:center;padding:8px 13px;border-radius:30px;background:#fff;border:1px solid var(--line);font-size:.875rem;font-weight:600}.intro{display:flex;justify-content:space-between;gap:24px;align-items:center;margin:34px 0 26px}.eyebrow{font-size:.8rem;letter-spacing:.14em;font-weight:700;text-transform:uppercase;color:var(--blue);margin-bottom:10px}.intro p{margin-top:10px;color:var(--muted)}.hero{display:grid;grid-template-columns:1.35fr 1fr;background:var(--blue);color:white;border-radius:26px;overflow:hidden;min-height:270px}.hero-copy{padding:34px 38px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:15px}.hero .eyebrow{color:#d2dafe;margin:0}.hero h2{font-size:2.15rem;max-width:380px}.hero p{color:#e0e5ff;max-width:410px}.primary,.secondary,.yellow{border-radius:13px;padding:15px 22px;min-height:50px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:9px}.primary{background:var(--blue);color:white}.yellow{background:var(--yellow);color:#263154}.secondary{background:white;border:1px solid var(--line)}.ghost{padding:12px;color:var(--blue);font-weight:600}.hero-art{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;padding:24px;background:radial-gradient(ellipse at center,#5164d2 0,transparent 70%)}.place-card{width:100px;height:153px;border-radius:15px;background:#fff;color:var(--ink);box-shadow:0 9px 0 #182775;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;transform:rotate(-7deg)}.place-card:nth-child(2){transform:rotate(4deg) translateY(-15px);background:#ffcf4a}.place-card:nth-child(3){transform:rotate(10deg)}.place-card strong{font-family:Outfit;font-size:3.8rem;line-height:1}.place-card span{font-size:.875rem}.section-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:32px 0 18px}.path{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.skill-card{text-align:left;border-radius:20px;background:white;border:1px solid var(--line);padding:22px;min-height:195px;transition:transform .15s,box-shadow .15s}.skill-card:hover{transform:translateY(-3px);box-shadow:0 8px 22px #263a7310}.skill-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.skill-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:12px;font-size:1.3rem;font-weight:700;background:#edf0ff;color:var(--blue)}.skill-card:nth-child(3n+2) .skill-icon{background:#e1f4ee;color:#177b65}.skill-card:nth-child(3n) .skill-icon{background:#fff2ce;color:#906300}.skill-card p{font-size:.9rem;color:var(--muted);margin:7px 0 16px}.track{height:6px;background:#edf0f7;border-radius:20px;overflow:hidden}.track>span{display:block;height:100%;background:var(--blue);border-radius:20px}.bottom-note{margin:28px 0;display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.9rem}.practice-head{display:flex;align-items:center;gap:22px;margin:25px 0}.practice-head .track{flex:1}.practice-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}.paper{background:white;border:1px solid var(--line);border-radius:24px;padding:32px}.question-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;gap:12px}.question-meta .eyebrow{margin:0}.question{font-size:1.65rem;line-height:1.45;letter-spacing:-.02em;font-weight:600}.instruction{font-size:.95rem;color:var(--muted);margin-top:12px}.options{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:26px 0}.option{display:flex;align-items:center;text-align:left;gap:15px;padding:22px;border:2px solid var(--line);border-radius:15px;font-size:1.45rem;font-weight:600;min-height:78px}.option.selected{border-color:var(--blue);background:#edf0ff}.check-box{width:26px;height:26px;border:2px solid #bfc7dd;border-radius:7px;display:grid;place-items:center;font-size:1rem;flex-shrink:0}.selected .check-box{background:var(--blue);border-color:var(--blue);color:white}.answer-area{margin:26px 0}.answer-input{border:2px solid #cbd3e6;border-radius:13px;background:#fafbff;width:100%;padding:17px;font-size:1.4rem;min-height:62px}.field-label{display:block;font-weight:600;margin:12px 0 8px}.answer-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.answer-fields .answer-input{min-width:0}.segmented{display:flex;gap:6px;padding:5px;background:#f0f2f8;border-radius:12px;width:fit-content;margin:17px 0}.segmented button{padding:10px 16px;border-radius:8px;font-size:.95rem}.segmented button.active{background:white;box-shadow:0 2px 6px #19244b10;color:var(--blue);font-weight:700}.coach{padding:25px;border-radius:24px;background:#e9edf9;border:1px solid #dce2f5;position:sticky;top:20px}.coach-icon{width:45px;height:45px;display:grid;place-items:center;background:var(--yellow);border-radius:15px;margin-bottom:16px;color:#5b4b1e;font-size:1.4rem}.coach h3{font-size:1.4rem}.coach p{font-size:.95rem;margin:12px 0 18px}.coach button{width:100%;margin-top:10px}.coach textarea{width:100%;min-height:78px;border:1px solid #cbd3e6;border-radius:12px;padding:12px;resize:vertical;margin-top:16px;font-size:1rem}.coach-note{font-size:.8rem;color:var(--muted);margin-top:16px;line-height:1.6}.hint{padding:16px;background:white;border-radius:14px;margin-top:18px;line-height:1.65}.hint-label{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--blue);margin-bottom:7px}.actions{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid var(--line);padding-top:22px;margin-top:25px}.feedback{padding:17px;border-radius:14px;margin:20px 0 0;background:#fff4d9;color:#715200;line-height:1.55}.feedback.correct{background:#e4f6ed;color:#146b52}.feedback.error{background:#fff0ee;color:#9a3e31}.canvas-wrap{border:2px solid #cbd3e6;border-radius:16px;overflow:hidden;background:white;position:relative}.drawing{display:block;width:100%;height:260px;touch-action:none;background-image:radial-gradient(#d9dfed 1px,transparent 1px);background-size:20px 20px}.canvas-toolbar{display:flex;gap:5px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding:8px;background:#f8f9fd}.canvas-toolbar button{padding:9px 12px;min-height:44px;border-radius:8px;font-size:.875rem}.canvas-toolbar button.active{background:#e2e8ff;color:var(--blue);font-weight:700}.canvas-actions{display:flex;justify-content:space-between;padding:8px 12px;align-items:center;border-top:1px solid var(--line);font-size:.85rem}.count-confirm{padding:12px;background:#f1f4ff;border-radius:12px;margin-top:14px}.lesson{max-width:800px;margin:30px auto}.lesson h1{margin-bottom:20px}.lesson p{margin:15px 0}.lesson-demo{display:flex;justify-content:center;gap:18px;padding:30px 12px;background:#f4f6fd;border-radius:18px;margin:24px 0}.pv-column{text-align:center;min-width:95px}.pv-column strong{display:block;font:700 3rem Outfit;color:var(--blue)}.pv-column span{color:var(--muted);font-size:.875rem}.equation{font:600 2rem Outfit;text-align:center;padding:24px 0;color:var(--blue)}.block-board{display:flex;gap:22px;align-items:flex-start;flex-wrap:wrap;padding:18px 0}.block-group{display:flex;gap:5px;flex-wrap:wrap;max-width:230px}.block{border:1.5px solid #3b53bb;background:#dce5ff;display:inline-block}.block.hundred{width:55px;height:55px;background-image:linear-gradient(#90a3df 1px,transparent 1px),linear-gradient(90deg,#90a3df 1px,transparent 1px);background-size:5.4px 5.4px}.block.ten{width:8px;height:55px;background-image:linear-gradient(#90a3df 1px,transparent 1px);background-size:100% 5.4px}.block.one{width:8px;height:8px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:24px 0}.stat{padding:25px;background:white;border:1px solid var(--line);border-radius:18px}.stat strong{display:block;font:600 2.5rem Outfit;color:var(--blue);margin-bottom:8px}.history{background:white;border-radius:20px;border:1px solid var(--line);padding:25px}.history-row{display:flex;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid var(--line)}.history-row:last-child{border:0}.login{max-width:480px;margin:9vh auto;padding:36px}.login .brand{margin-bottom:35px}.login h1{font-size:2.5rem;margin-bottom:15px}.login p{color:var(--muted);margin-bottom:22px}.login .primary{width:100%;margin-top:20px}.loading{padding:15vh 25px;text-align:center;color:var(--muted)}.empty{text-align:center;padding:42px}.summary{max-width:720px;margin:35px auto;text-align:center}.summary h1{margin:22px 0}.summary .actions{justify-content:center;flex-wrap:wrap}.summary-mark{width:80px;height:80px;background:#ffcf4a;border-radius:25px;margin:auto;display:grid;place-items:center;font-size:2.5rem}.test-config{display:flex;gap:12px;flex-wrap:wrap;align-items:end;margin:22px 0}.test-config select{border:1px solid var(--line);background:white;border-radius:10px;padding:13px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.badge{font-size:.8rem;color:var(--green);font-weight:600}.notice{padding:12px 16px;background:#fff4d9;border-radius:12px;margin:16px 0}.print-link{color:var(--blue)}@media(max-width:1000px){.shell{padding:0 24px 30px}.practice-grid{grid-template-columns:minmax(0,1fr) 260px;gap:16px}.paper{padding:25px}.coach{padding:20px}.hero-art{gap:10px}.place-card{width:85px}.question{font-size:1.5rem}}@media(max-width:900px){.topbar{height:auto;min-height:85px;flex-wrap:wrap;gap:12px;padding:18px 0}.brand{font-size:1.4rem}.nav{order:3;width:100%;justify-content:space-between}.nav button{padding:10px}.topbar>.pill{font-size:.75rem}.shell{padding:0 16px 30px}.intro{margin:25px 0}.intro>.pill{display:none}.hero{grid-template-columns:1fr}.hero-copy{padding:28px}.hero-art{display:none}.hero h2{font-size:1.8rem}.path{grid-template-columns:1fr 1fr;gap:12px}.skill-card{padding:18px}.practice-grid{grid-template-columns:1fr}.coach{position:static}.paper{padding:22px}.question{font-size:1.45rem}.option{padding:16px;font-size:1.3rem;gap:10px}.practice-head{gap:12px}.stats{gap:10px}.stat{padding:17px}.stat strong{font-size:2rem}.answer-fields{gap:8px}.answer-fields .answer-input{padding:12px;font-size:1.2rem}.login{margin:6vh 16px}.coach button{width:auto}.coach .secondary{margin-right:8px}.drawing{height:240px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}@media print{.topbar,.coach,.actions,button{display:none!important}.shell{padding:0}.paper{border:none}.practice-grid{display:block}}
