/* NUMI workspace: restrained product UI across dashboard and exercises. */
:root{--saas-bg:#f7f8fb;--saas-surface:#fff;--saas-ink:#20233c;--saas-muted:#667085;--saas-line:#e6e8ef;--saas-accent:#5148a3;--saas-soft:#f0effb;--saas-green:#13856f}
body.dashboard,body.worksheet-page{font-family:Inter,system-ui,sans-serif;color:var(--saas-ink);background:var(--saas-bg)}
body.dashboard{--ink:var(--saas-ink);--nav:var(--saas-ink);--muted:var(--saas-muted);--cream:var(--saas-bg);--lav:var(--saas-soft);--line:var(--saas-line);--shadow:0 1px 3px #1a24420a,0 8px 22px #1a244205}
.dashboard .app{grid-template-columns:212px minmax(0,1fr)}
.dashboard .side{background:#fff;color:var(--saas-ink);border-right:1px solid var(--saas-line);padding:25px 14px 18px}
.dashboard .brand{font-size:31px;letter-spacing:-1.5px;margin:9px 13px 40px;color:var(--saas-accent)}
.dashboard .brand i{display:none}
.dashboard .nav{gap:5px}.dashboard .nav button,.dashboard .parent-link{color:#5d6478;border-radius:10px;padding:13px 14px;font-size:14px;font-weight:700}
.dashboard .nav button.active{background:var(--saas-soft);color:var(--saas-accent)}
.dashboard .nav button:hover,.dashboard .parent-link:hover{background:#f6f6fb;color:var(--saas-accent)}
.dashboard .parent-link{border-top:1px solid var(--saas-line)}
.dashboard main{max-width:1450px;padding:35px 34px 60px}
.dashboard .top{margin-bottom:30px}.dashboard .top h1{font-size:32px;letter-spacing:-.9px;font-weight:800}.dashboard .top p{font-size:15px;font-weight:500;margin-top:6px}
.dashboard .avatar{width:42px;height:42px;background:#eeeafb;color:var(--saas-accent);box-shadow:none;font-size:18px}
.dashboard .lang{background:#fff;border:1px solid var(--saas-line);border-radius:10px;padding:9px 13px;font-size:13px;font-weight:700}
.dashboard .card,.dashboard .question-card,.dashboard .pad-card,.dashboard .explore-card{border-radius:16px;box-shadow:var(--shadow);border:1px solid var(--saas-line)}
.dashboard .overview,.dashboard .middle{grid-template-columns:minmax(0,1.9fr) minmax(270px,1fr);gap:16px}
.dashboard .hero{min-height:285px;background:#fff}.dashboard .hero:after{background:linear-gradient(90deg,#fff 0%,#fff 41%,#ffffffdd 58%,transparent 83%)}
.dashboard .hero-art{width:47%;height:100%;right:0;bottom:0;opacity:.76;filter:none}
.dashboard .hero-copy{max-width:65%;padding:32px 35px}.dashboard .eyebrow{background:var(--saas-soft);color:var(--saas-accent);font-size:11px;border-radius:7px;padding:7px 10px;letter-spacing:.5px}
.dashboard .hero h2{font-size:clamp(29px,3.1vw,42px);line-height:1.1;letter-spacing:-1.1px;margin:14px 0 10px;font-weight:800}.dashboard .hero p{font-size:15px;color:var(--saas-muted);font-weight:500;margin-bottom:24px}
.dashboard .progress-label{font-size:13px;color:var(--saas-muted);font-weight:600}.dashboard .progress{height:8px;width:260px;background:#ebedf3;margin:9px 0 20px}.dashboard .progress>span{background:var(--saas-accent)}
.dashboard .primary{border-radius:10px;background:var(--saas-accent);font-size:14px;font-weight:700;padding:12px 17px;box-shadow:none}.dashboard .primary:hover{background:#3e358e;transform:none}
.dashboard .island{min-height:285px;background:#fff;padding:25px}.dashboard .island h2{font-size:19px;font-weight:750}.dashboard .island img{width:70%;height:66%;left:30%;top:19%;opacity:.68}.dashboard .island p{font-size:13px;color:var(--saas-muted);font-weight:500;max-width:150px}
.dashboard .middle{margin-top:28px}.dashboard .section-title{font-size:19px;letter-spacing:-.35px;font-weight:750;margin-bottom:14px}
.dashboard .mission-grid{gap:10px}.dashboard .mission{height:118px;background:#fff;border:1px solid var(--saas-line);border-radius:14px;box-shadow:none;padding:17px 14px}.dashboard .mission:hover,.dashboard .topic:hover{transform:none;box-shadow:0 6px 20px #1a244210;border-color:#c8c4eb}
.dashboard .mission img{height:66px;width:44%;left:-7%;bottom:2%;opacity:.7;filter:none}.dashboard .mission strong,.dashboard .mission span,.dashboard .mission b{margin-left:33%}.dashboard .mission strong{font-size:15px;font-weight:700}.dashboard .mission span{font-size:12px;font-weight:500;color:var(--saas-muted)}.dashboard .mission b{font-size:17px;margin-top:4px;color:var(--saas-accent)}
.dashboard .puzzle{min-height:118px;padding:17px 19px}.dashboard .puzzle h3{font-size:16px;font-weight:700;margin-bottom:8px}.dashboard .puzzle .sequence{transform:scale(.7);transform-origin:left center;width:140%;margin:-7px 0 -8px}.dashboard .puzzle button{font-size:13px;font-weight:700;background:var(--saas-soft);color:var(--saas-accent);padding:8px}
.dashboard .worlds{margin-top:29px}.dashboard .topic-grid{gap:11px}.dashboard .topic{height:129px;background:#fff!important;border:1px solid var(--saas-line);border-radius:14px;box-shadow:none}.dashboard .topic img{height:82px;opacity:.8}.dashboard .topic span{font-size:13px;font-weight:700}
.dashboard .banner,.dashboard .journey{background:#fff;border:1px solid var(--saas-line);border-radius:16px}.dashboard .subhead h2{font-size:26px}.dashboard .subhead p{font-size:15px;font-weight:500}
.dashboard .explore-card{min-height:180px}.dashboard .explore-card img{height:100px}.dashboard .explore-card h3{font-size:18px}.dashboard .explore-card p{font-size:13px}
.dashboard .practice{border:1px solid var(--saas-line);box-shadow:var(--shadow);border-radius:16px}.dashboard .practice .question-card,.dashboard .practice .pad-card{border:0}.dashboard .practice .question-card{border-right:1px solid var(--saas-line)}.dashboard .answers .answer{background:#fff;border:1px solid var(--saas-line);border-radius:10px;font-size:17px}.dashboard .answers .answer.selected{border-color:var(--saas-accent);background:var(--saas-soft)}.dashboard .pad-tools button{font-size:13px;border-radius:8px;background:var(--saas-soft)}.dashboard .pad-tools button.active{background:#dcefe9}
/* The hundred-question worksheet uses the same restrained product language. */
.worksheet-page{--ink:var(--saas-ink);--muted:var(--saas-muted);--cream:var(--saas-bg);--line:var(--saas-line);--purple:var(--saas-soft);--mint:#e4f4ed}
.worksheet-page .masthead{background:#fff;color:var(--saas-ink);border-bottom:1px solid var(--saas-line);padding-top:12px;padding-bottom:12px}.worksheet-page .masthead .brand{color:var(--saas-accent);font-size:27px}.worksheet-page .back{color:#5d6478;font-size:13px}
.worksheet-page .wrap{max-width:1250px;padding-top:36px}.worksheet-page .intro{margin-bottom:30px}.worksheet-page .eyebrow{background:var(--saas-soft);color:var(--saas-accent);border-radius:7px;font-size:11px;letter-spacing:.5px;text-transform:uppercase}.worksheet-page .intro h1{font-size:clamp(29px,3vw,39px);letter-spacing:-1px;font-weight:750}.worksheet-page .intro p{font-size:14px;color:var(--saas-muted)}.worksheet-page .progress{background:#fff;border:1px solid var(--saas-line);box-shadow:none;border-radius:10px;color:var(--saas-accent);font-size:13px}
.worksheet-page .worksheet{border:1px solid var(--saas-line);box-shadow:0 1px 3px #1a24420a;border-radius:15px;margin-bottom:18px}.worksheet-page .worksheet .question{border-right:1px solid var(--saas-line);padding:26px 28px}.worksheet-page .number{background:var(--saas-soft);color:var(--saas-accent);border-radius:7px;font-size:12px}.worksheet-page .meta{font-size:12px;color:var(--saas-muted)}.worksheet-page .question h2{font-size:clamp(19px,2vw,24px);font-weight:700;letter-spacing:-.25px;margin-top:22px}
.worksheet-page .options{gap:9px}.worksheet-page .option{background:#fff;border:1px solid #dfe2eb;border-radius:10px;font-size:16px;font-weight:650;min-height:54px}.worksheet-page .option:hover{border-color:#aea9d9;background:#fafaff}.worksheet-page .option.selected{border-color:var(--saas-accent);background:var(--saas-soft)}.worksheet-page .letter{background:#f0f1f6;border-radius:6px;color:#5c6075;font-size:12px}
.worksheet-page .check,.worksheet-page .hint-button{border-radius:9px;font-size:13px;font-weight:700}.worksheet-page .check{background:var(--saas-accent)}.worksheet-page .hint-button{background:var(--saas-soft);color:var(--saas-accent)}.worksheet-page .feedback,.worksheet-page .hint,.worksheet-page .explanation{font-size:13px;border-radius:8px}
.worksheet-page .working{padding:22px 26px}.worksheet-page .workhead h3{font-size:16px;font-weight:700}.worksheet-page .tools button{background:#f3f4f8;color:#4a4d61;border-radius:7px;min-height:38px;font-size:12px;font-weight:650;padding:8px 10px}.worksheet-page .tools button.active{background:var(--saas-soft);color:var(--saas-accent)}.worksheet-page .scratch{background:#fff;border:1px solid var(--saas-line);border-radius:10px}.worksheet-page .worknote{color:#8890a0;font-size:12px;font-weight:500}
@media(max-width:1050px){.dashboard .app{grid-template-columns:172px minmax(0,1fr)}.dashboard main{padding:25px 22px 45px}.dashboard .nav button{font-size:13px}.dashboard .hero-copy{max-width:66%}}
@media(max-width:760px){.dashboard .app{display:block;padding-bottom:68px}.dashboard .side{background:#fff;border-right:0;border-top:1px solid var(--saas-line);height:68px;padding:4px 6px}.dashboard .nav button{font-size:10px;padding:6px 4px}.dashboard .nav button.active{background:var(--saas-soft)}.dashboard main{padding:20px 16px 82px}.dashboard .top{margin-bottom:20px}.dashboard .top h1{font-size:26px}.dashboard .overview,.dashboard .middle{grid-template-columns:1fr}.dashboard .hero{min-height:268px}.dashboard .hero-copy{max-width:68%;padding:23px}.dashboard .hero-art{width:48%}.dashboard .island{min-height:180px}.dashboard .island img{width:53%;height:90%;left:45%;top:5%}.dashboard .mission-grid{gap:7px}.dashboard .mission{height:118px;padding:12px 8px}.dashboard .mission img{opacity:.42}.dashboard .mission strong,.dashboard .mission span,.dashboard .mission b{margin-left:14%}.dashboard .puzzle{min-height:110px}.dashboard .topic-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard .practice .question-card{border-right:0;border-bottom:1px solid var(--saas-line)}.worksheet-page .worksheet .question{border-right:0;border-bottom:1px solid var(--saas-line)}}
@media(max-width:430px){.dashboard .hero-copy{max-width:76%}.dashboard .hero-art{opacity:.3}.dashboard .mission strong{font-size:13px}.dashboard .mission span{font-size:11px}.dashboard .topic{height:115px}.dashboard .topic img{height:73px}.worksheet-page .worksheet .question,.worksheet-page .working{padding:19px}.worksheet-page .intro{gap:13px}}
/* Compact, evenly spaced pattern card. */
.dashboard .puzzle{height:164px;min-height:164px;display:flex;flex-direction:column;justify-content:space-between}
.dashboard .puzzle h3{margin:0}
.dashboard .puzzle .sequence{transform:none;width:100%;margin:12px 0;gap:7px;justify-content:space-between;flex:1}
.dashboard .puzzle .circle{width:26px;height:26px;flex:none}
.dashboard .puzzle .triangle{border-left-width:14px;border-right-width:14px;border-bottom-width:27px;flex:none}
.dashboard .puzzle .unknown{width:32px;height:32px;font-size:18px;flex:none;border-radius:7px}
.dashboard .puzzle button{min-height:36px;margin:0;border-radius:9px;flex:none}
.dashboard .mission{height:164px}
@media(max-width:760px){.dashboard .puzzle{height:160px;min-height:160px}.dashboard .mission{height:126px}}

.dashboard .kangaroo-entry{display:flex;align-items:center;gap:15px;max-width:720px;margin-top:16px;padding:16px 19px;border:1px solid #dcd9ee;border-radius:14px;background:#fff;color:var(--saas-ink);text-decoration:none;box-shadow:0 1px 3px #1a24420a}.dashboard .kangaroo-entry:hover{border-color:#5148a3;background:#fbfaff}.dashboard .kangaroo-entry-mark{display:grid;place-items:center;flex:none;width:43px;height:43px;border-radius:11px;background:#ece9fa;color:#5148a3;font-weight:800;font-size:20px}.dashboard .kangaroo-entry strong,.dashboard .kangaroo-entry small{display:block}.dashboard .kangaroo-entry strong{font-size:15px}.dashboard .kangaroo-entry small{margin-top:5px;color:#667085;font-size:12px}.dashboard .kangaroo-entry>span:last-child{margin-left:auto;color:#5148a3;font-size:22px}

/* One consistent question + writing grid for KSSR and Kangaroo worksheets. */
.worksheet-page .worksheet{grid-template-columns:minmax(0,42fr) minmax(0,58fr)}
.worksheet-page .worksheet .question,.worksheet-page .worksheet .working{min-width:0}
.worksheet-page .worksheet .working{display:flex;flex-direction:column}
.worksheet-page .worksheet .scratch{width:100%;min-height:310px;flex:1}
.worksheet-page .mast-actions{display:flex;align-items:center;gap:12px}
.worksheet-page .language-toggle{border:1px solid var(--saas-line);background:#fff;color:var(--saas-accent);border-radius:8px;padding:9px 12px;font-weight:700;font-size:13px}
.worksheet-page .language-toggle:hover{background:var(--saas-soft)}
@media(max-width:720px){.worksheet-page .worksheet{grid-template-columns:minmax(0,1fr)}.worksheet-page .worksheet .scratch{min-height:280px}}
