/* Isolated, privacy-first 1:1 Math Studio learning hub. No remote fonts/assets. */
.learning-page{--study-ink:#1e2b3f;--study-green:#35445a;--study-dim:#62736f;background:#f1f3f6;color:var(--study-ink)}
.learning-page .wrap{width:min(1100px,calc(100% - 36px))}
.learning-page button{cursor:pointer}
.learning-header{position:sticky;top:0;z-index:20;background:#f7f8faed;backdrop-filter:blur(12px);border-bottom:1px solid #d4d8e0;box-shadow:none}
.learning-nav{display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:76px}
.learning-brand{display:flex;align-items:center;gap:11px;font-size:13px;letter-spacing:.08em;color:#1b293f;white-space:nowrap}
.learning-brand>span{display:grid;place-items:center;width:36px;height:36px;background:#243246;color:#fff;border-radius:5px;font-size:23px}
.learning-nav nav{display:flex;gap:24px;align-items:center;min-width:0;overflow-x:auto;white-space:nowrap;scrollbar-width:thin}
.learning-nav nav a{display:inline-flex!important;color:#434e5e;font-size:12px;font-weight:750;flex-shrink:0}
.learning-nav nav a:hover{color:#35445a;text-decoration:underline;text-underline-offset:5px}
.lang-switch{background:transparent;border:1px solid #bcc3ce;color:#293548;padding:8px 12px;border-radius:5px;font-weight:750;font-size:12px}
.learning-overline{font-size:11px;letter-spacing:.17em;font-weight:850;color:#245dc6;margin:0 0 18px}
.learning-hero{padding:clamp(60px,8vw,112px) 0 85px;background:radial-gradient(circle at 86% 20%,#dde1e7 0%,transparent 45%),#eaecf1}
.learning-hero-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:clamp(35px,5vw,72px)}
.learning-hero h1{font-size:clamp(37px,4.8vw,61px);line-height:1.29;letter-spacing:-.054em;margin:0 0 24px;max-width:700px;color:#1e2c40}
.learning-lead{font-size:16px;line-height:1.9;color:#4f5b6e;max-width:570px}
.learning-hero-actions{display:flex;align-items:center;gap:18px;margin-top:31px;flex-wrap:wrap}
.learning-hero-actions .primary{border-radius:6px;background:#28374d;padding:14px 23px}
.learning-secondary{font-size:13px;font-weight:800;color:#344256;text-decoration:underline;text-underline-offset:5px}
.learning-hero-art{background:#1b2a40;padding:36px;color:#f7f8f9;border-radius:8px;min-width:0;box-shadow:0 25px 65px #1b2a4023}
.art-header{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.16em;color:#b9c1cd}
.art-header span:last-child{font-size:23px;line-height:1}
.art-math{font:clamp(24px,3.5vw,42px) Georgia,serif;text-align:center;margin:66px 0 54px;color:#c7d2e2;white-space:nowrap}
.art-rule{height:1px;background:#5e6c82}
.art-steps{display:flex;justify-content:space-between;gap:4px;font-size:10px;letter-spacing:.12em;color:#b8c2d1;margin:23px 0}
.learning-hero-art>p{font:italic 23px Georgia,serif;margin:40px 0 8px;color:#e3e9f2}
.learning-hero-art>small{font-size:9px;letter-spacing:.13em;color:#adb6c3}
.learning-section{padding:90px 0;scroll-margin-top:100px}
.learning-section-heading{display:flex;align-items:end;justify-content:space-between;gap:25px}
.learning-section h2{font-size:clamp(27px,3.5vw,43px);line-height:1.3;letter-spacing:-.04em;color:#1b2a40;margin:0 0 14px}
.learning-section-heading p:not(.learning-overline),.learning-lead-small{color:#62736f;line-height:1.82;max-width:750px;font-size:14px;margin:0}
.challenge-section{background:#fcfcfd}
.level-picker{display:flex;flex-wrap:wrap;gap:9px;margin:29px 0 22px}
.level-picker button{padding:12px 18px;border-radius:6px;border:1px solid #d3d8df;background:#fff;color:#424f62;font-weight:750;font-size:13px;min-height:44px}
.level-picker button[aria-pressed=true]{color:#fff;background:#293951;border-color:#293951}
.challenge-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr);gap:20px;align-items:stretch}
.challenge-card{min-width:0;background:#f8f9fa;border:1px solid #d2d7df;border-radius:9px;padding:clamp(22px,3.6vw,39px);box-shadow:0 8px 35px #1f29390a}
.challenge-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#526177;font-size:11px;font-weight:850;letter-spacing:.08em}
.challenge-indicator{color:#7b8f83;font-weight:650;letter-spacing:0}
.challenge-card h3{font-size:clamp(23px,3vw,31px);line-height:1.45;letter-spacing:-.034em;margin:18px 0}
.challenge-question{font-size:17px;line-height:1.85;color:#3e495a;margin:0 0 26px;word-break:keep-all}
.answer-options{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.answer-option{min-height:57px;border:1px solid #cad0d9;background:#fff;border-radius:6px;color:#2b3647;text-align:left;padding:14px 17px;font-weight:750;line-height:1.6}
.answer-option:hover{border-color:#3e5270;background:#f4f5f7}
.answer-option[aria-pressed=true]{border:2px solid #314564;background:#eaedf1;color:#1c2d47;padding:13px 16px}
.feedback{margin:14px 0 0;min-height:24px;font-size:13px;line-height:1.7;color:#59667a}
.feedback.correct{color:#245dc6;font-weight:750}
.feedback.incorrect{color:#496691}
.challenge-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.hint-button,.solution-button{border:1px solid #b9c1cc;border-radius:5px;background:#f6f7f9;color:#35445b;padding:12px 15px;font-size:12px;font-weight:800;min-height:44px}
.solution-button{background:#2b3a50;color:#fff;border-color:#2b3a50}
.hint-button:disabled{opacity:.55;cursor:default}
.hints{display:grid;gap:9px;margin-top:17px}
.hint-line{margin:0;background:#eaecf1;border-left:3px solid #6f8099;padding:12px 14px;font-size:13px;line-height:1.75;color:#3a485c}
.solution-box{background:#e9ecf0;border:1px solid #ccd2da;padding:22px;margin-top:20px;border-radius:7px}
.solution-box[hidden]{display:none}
.solution-brow{font-size:10px;letter-spacing:.16em;color:#55647a;font-weight:850}
.step-line{font-size:14px;line-height:1.9;color:#3d4654;margin:13px 0}
.reflection{border-top:1px solid #c8ced7;margin-top:20px;padding-top:17px}
.reflection strong{font-size:13px;color:#27374e}.reflection p{font-size:14px;line-height:1.75;color:#4a5566;margin:10px 0 0}
.learning-privacy-note{border-top:1px solid #dadee4;margin:26px 0 0;padding-top:16px;font-size:11px;line-height:1.7;color:#788985}
.challenge-aside{background:linear-gradient(155deg,#1e2b3f,#28364c);color:#fff;border-radius:8px;padding:30px 26px;min-width:0;display:flex;flex-direction:column}
.aside-kicker{font-size:10px;letter-spacing:.16em;font-weight:850;color:#a1acbc;margin:0}
.challenge-aside h3{font:italic clamp(23px,2.8vw,29px) Georgia,serif;line-height:1.4;margin:42px 0 28px;letter-spacing:-.02em}
.challenge-aside ol{padding:0;list-style:none;margin:0}
.challenge-aside li{border-top:1px solid #616f8566;padding:16px 0;display:flex;align-items:center;gap:16px}
.challenge-aside li span{font:italic 14px Georgia,serif;color:#9cb3d5}
.challenge-aside li p{margin:0;font-size:13px;color:#d3d8e0}
.challenge-aside-bottom{font-size:10px;letter-spacing:.12em;color:#aeb8c7;border-top:1px solid #616f8566;padding-top:18px;margin-top:auto}
.insights-section{background:#eceef1}
.insight-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:33px}
.insight-card{background:#fff;border:1px solid #d8dce3;border-radius:7px;padding:26px;min-width:0}
.insight-tag{font-size:11px;color:#485c79;font-weight:850;letter-spacing:.05em}
.insight-card h3{font-size:19px;line-height:1.6;color:#263245;letter-spacing:-.025em;margin:18px 0 12px}
.insight-summary{font-size:13px;line-height:1.8;color:#59677c}
.insight-card details{border-top:1px solid #e0e4e9;margin-top:21px;padding-top:15px}
.insight-card summary{cursor:pointer;color:#3a4c66;font-size:13px;font-weight:800;line-height:1.6}
.insight-paragraph{font-size:13px;color:#4e5a6c;line-height:1.9;margin:13px 0}
.insight-question{border-left:3px solid #7b8ba2;background:#f0f2f6;padding:11px 12px;font-size:12px;line-height:1.8;color:#364357}
.library-section{background:#f7f8fa}
.learning-library-heading{display:flex;gap:16px;align-items:end;justify-content:space-between}
.library-stat{font-size:11px;color:#5c6a7e;border:1px solid #d2d7de;padding:8px 11px;border-radius:6px;white-space:nowrap}
.library-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:32px}
.library-item{text-align:left;display:flex;flex-direction:column;gap:13px;border:1px solid #d5d9e0;background:#fff;border-radius:7px;padding:20px;min-height:169px}
.library-item:hover,.library-item:focus-visible{border-color:#3b4c66;box-shadow:0 8px 23px #222a3516}
.library-item.selected{background:#eff1f5;border-color:#627490}
.library-item small{font-size:10px;font-weight:700;color:#617086}
.library-item strong{font-size:16px;line-height:1.5;color:#253144}
.library-item span{font-size:11px;color:#445268;margin-top:auto;font-weight:800}
.learning-bottom{background:#1b293e;color:#fff;padding:66px 0}
.learning-bottom-inner{display:flex;align-items:center;justify-content:space-between;gap:25px}
.learning-bottom .learning-overline{color:#b1bac8}
.learning-bottom h2{font:italic 31px Georgia,serif;margin:0 0 17px}
.learning-bottom p:not(.learning-overline){color:#c2c9d3;font-size:13px;line-height:1.8;max-width:710px}
.learning-return{background:#dde2e9;color:#2c3747;padding:15px 20px;border-radius:5px;white-space:nowrap;font-size:12px;font-weight:800}
.learning-return:hover{background:#fff}
.learning-footer{background:#131e2e;color:#b1bac7;padding:22px 0}
.learning-footer .wrap{display:flex;gap:16px;justify-content:space-between;font-size:11px}
.learning-page :focus-visible{outline:3px solid #5377ac;outline-offset:3px}
@media(max-width:920px){.learning-nav{flex-wrap:wrap;row-gap:0;padding:12px 0}.learning-nav nav{order:3;flex:0 0 100%;padding:10px 0 6px}.learning-hero-layout{grid-template-columns:1fr}.learning-hero-art{max-width:650px}.challenge-layout{grid-template-columns:1fr}.challenge-aside{display:none}.insight-cards{grid-template-columns:1fr 1fr}.library-list{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.learning-nav{gap:6px}.learning-nav nav{gap:19px}.learning-nav nav a{font-size:11px}.learning-hero{padding:55px 0 62px}.learning-hero h1{font-size:clamp(33px,8vw,43px)}.learning-lead{font-size:14px}.learning-hero-art{padding:25px}.art-math{font-size:29px;margin:45px 0}.art-steps{font-size:8px}.learning-section{padding:58px 0;scroll-margin-top:120px}.level-picker{gap:7px}.level-picker button{flex:1;min-width:0;padding:10px 5px;font-size:11px}.challenge-card{padding:22px}.challenge-question{font-size:15px}.answer-options{grid-template-columns:1fr}.answer-option{min-height:47px}.insight-cards,.library-list{grid-template-columns:1fr}.learning-library-heading{flex-direction:column;align-items:start}.library-stat{white-space:normal}.learning-bottom-inner{flex-direction:column;align-items:start}.learning-return{display:inline-flex}.learning-footer .wrap{flex-wrap:wrap}.challenge-actions button{width:100%}}
@media(prefers-reduced-motion:reduce){.learning-page html{scroll-behavior:auto}}


/* Blue/navy study-hub identity; answer state colors remain meaningful. */
.learning-page .learning-header{background:#fbfcffef}
.learning-page .learning-hero{background:radial-gradient(circle at 85% 12%,#e9f0fb 0%,transparent 46%),#f2f6fc}
.learning-page .learning-hero-actions .primary{background:var(--ms-blue)}
.learning-page .learning-hero-actions .primary:hover{background:var(--ms-blue-hover)}
.learning-page .learning-brand>span{background:var(--ms-blue)}
.learning-page .level-picker button[aria-pressed=true]{background:var(--ms-blue);border-color:var(--ms-blue);color:#fff}
.learning-page .feedback.correct{color:#167049}
.learning-page .feedback.incorrect{color:#9c5d29}
.learning-page .learning-footer{background:var(--ms-navy)}

.learning-page{--study-green:var(--ms-blue);--study-ink:var(--ms-navy);--study-dim:var(--ms-muted)}