/* Light HELDER identity: white, indigo actions and restrained cool accents. */
:root{
  --helder-ink:#142b4b;--helder-accent:#4f46e5;--helder-accent-hover:#4338ca;
  --helder-surface:#ffffff;--helder-border:#e5e8f0;--helder-muted:#626c87;
  --navy:#142b4b;--text:#142b4b;--blue:#4f46e5;--blue2:#4338ca;
  --blue-dark:#4338ca;--blue-soft:#ededff;--soft:#f5f6fb;
  --line:#e5e8f0;--bg:#ffffff;--mint:#ffffff;--muted:#626c87;
  --shadow-soft:0 5px 20px #142b4b06;--shadow:0 12px 30px #142b4b0c;
  color:var(--helder-ink);background:var(--bg)
}
body{background:var(--bg);color:var(--helder-ink)}
button,input,select,textarea{font-family:var(--helder-font)}
:where(a,button,input,textarea,select,summary):focus-visible{outline:3px solid #4f46e5;outline-offset:4px}
button:disabled{cursor:default}
.helder-dashboard .site-header,.unit-header,.exam-header{background:#4f46e5}
.helder-dashboard .small,.helder-dashboard .chapter-meta,.helder-dashboard .train-topic-status{font-size:.875rem}
.helder-dashboard .wrap{max-width:1240px;margin-top:32px}
.helder-dashboard .header-shell{max-width:1200px}
.helder-dashboard .section-kicker{color:var(--helder-accent);font-size:.8125rem;letter-spacing:.08em}
.helder-dashboard .card{box-shadow:none}
.helder-dashboard .page-panel{box-shadow:none}
#trainStart,#explain .page-panel-learn,#exam .page-panel-exam{background:transparent;border:0;padding:0}
.helder-dashboard .page-intro{align-items:center;background:var(--helder-surface);border:1px solid var(--helder-border);padding:26px 28px;border-radius:24px;margin-bottom:28px;gap:20px}
.helder-dashboard .page-intro>div:last-child{min-width:0}
.helder-dashboard .page-intro h1{font-size:clamp(1.625rem,3vw,2rem);letter-spacing:-.025em;margin:0 0 7px}
.helder-dashboard .page-intro p{font-size:1rem;line-height:1.6;max-width:70ch;margin:0;color:var(--helder-muted)}
.helder-dashboard .page-intro .page-icon{width:54px;height:54px;border-radius:16px;background:#fff;color:var(--helder-accent)}
#trainStart .train-choice-layout{grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);gap:26px}
#trainStart .train-topics h2{font-size:1.25rem;margin-bottom:16px}
#trainStart .chapter-pick{background:var(--helder-surface);border:1px solid var(--helder-border);border-radius:18px;padding:18px 20px;gap:16px}
#trainStart .chapter-pick:hover{background:#f7f8fc;border-color:#abb3d3}
#trainStart .chapter-topic-icon,#homeChapters .chapter-topic-icon{background:#fff;border:1px solid #e5e8f0;width:48px;height:48px;flex-basis:48px;border-radius:14px}
#trainStart .train-topic-action{color:var(--helder-accent);font-size:.9375rem}
#trainStart .train-topic-status{color:var(--helder-muted)}
#trainStart .train-suggestion{background:#fff;border:1px solid var(--line);padding:24px;border-radius:20px}
#trainStart .suggestion-label{color:var(--helder-accent)}
#trainStart .suggestion-objective{border-color:#abb3d3}
#trainStart .train-suggestion button{border-radius:12px;box-shadow:none}
#trainStart .chapter-pick:focus-visible{outline-color:#4f46e5}
.keuzes-topic-picks{background:#fff;border-color:var(--helder-border);padding:20px;border-radius:18px}
.keuzes-topic-link{background:#f8f9fd;border-color:#e5e8f0}
.keuzes-topic-link:hover{background:var(--helder-surface);border-color:#abb3d3}
#explain .learn-search{max-width:680px;margin:0 0 22px}
#explain .learn-search label{font-size:.9375rem}
#explain .learn-search input{padding:14px 17px;border-color:#cbd1e2;border-radius:12px}
#explain .learn-chapter{border:1px solid var(--helder-border);border-radius:20px;box-shadow:none}
#explain button.learn-chapter-head{background:var(--helder-surface);padding:22px;color:var(--helder-ink)}
#explain button.learn-chapter-head:hover{background:#f7f8fc}
#explain .learn-topic-icon{background:#fff;border:1px solid #e5e8f0;width:48px;flex-basis:48px;height:48px}
#explain .learn-topic-copy strong{font-size:1.125rem}
#explain .learn-topic-copy>span,#explain .learn-goal-status{font-size:.875rem;color:var(--helder-muted)}
#explain .learn-goals{background:#fff;padding:0 22px 10px}
#explain .learn-goal:hover{background:#f8f9fd}
#explain .learn-chevron{color:var(--helder-accent)}
#explain .learn-back{border-radius:12px;border-color:#cbd1e2;color:var(--helder-accent);min-height:46px}
#explain .lesson-reader .lesson-objective{padding:22px 24px;background:var(--helder-surface);border:1px solid var(--helder-border);border-left:4px solid #4f46e5;border-radius:16px}
#explain .lesson-reader .lesson-objective h3{font-size:1rem;margin:0 0 8px;color:var(--helder-accent)}
#explain .lesson-reader .lesson-objective p{margin:0;line-height:1.65}
#explain .ce-lessons{border-color:var(--line);box-shadow:none}
#explain .ce-lessons .button{display:inline-flex;padding:11px 17px;border-radius:12px;background:var(--helder-accent);color:#fff;text-decoration:none;font-weight:750;margin-top:8px}
#exam>.card{padding:0;background:transparent;border:0;box-shadow:none;margin:0 0 30px}
#exam>.card>h2{font-size:1.25rem;margin-bottom:16px}
#exam .exam-simple-card,#exam .exam-other .option-card{background:var(--helder-surface);border:1px solid var(--helder-border);border-radius:20px;padding:24px;box-shadow:none}
#exam .exam-simple-card:hover{border-color:#abb3d3}
#exam .exam-simple-card h3{font-size:1.25rem;margin-bottom:8px}
#exam .exam-simple-card p,#exam .option-card p{font-size:1rem;line-height:1.6;color:var(--helder-muted)}
#exam .exam-other{gap:18px}
#exam .exam-other .option-card{display:flex;flex-direction:column;align-items:flex-start}
#exam .exam-other .option-card p{flex:1}
#exam .exam-other .option-card button{width:auto;white-space:normal;min-height:46px;border-radius:12px}
#exam .exam-other .option-card h3{font-size:1.125rem}
#rekenhulp>.card:first-child{background:var(--helder-surface);border-color:var(--helder-border);border-radius:24px;padding:28px}
#rekenhulp>.card:first-child h1{font-size:clamp(1.625rem,3vw,2rem);margin:9px 0 14px}
#rekenhulp>.card:first-child p{font-size:1rem;line-height:1.65;max-width:74ch}
#rekenhulp>.card:first-child .button-link{background:var(--helder-accent)!important;border-radius:12px!important;margin-top:5px}
#rekenhulp .step-card{background:#f8f9fd;border-color:#e5e8f0;border-radius:14px}
#rekenhulp .step-no{background:var(--helder-surface);color:var(--helder-accent)}
#rekenhulp .coach{background:#fff;border-color:var(--line)}
.helder-dashboard .main-choice{min-height:0;border-radius:22px;background:var(--helder-surface);border-color:var(--helder-border);box-shadow:none}
.helder-dashboard .main-choice:hover{transform:none;border-color:#abb3d3;box-shadow:var(--shadow-soft)}
.helder-dashboard .choice-art{height:105px;margin-bottom:10px;background:transparent}
.helder-dashboard .choice-art svg{height:74px;width:100px;stroke:var(--helder-accent)}
.helder-dashboard .choice-label{font-size:.8125rem;color:var(--helder-accent)}
.helder-dashboard .main-choice h3{font-size:1.125rem;line-height:1.4}
.helder-dashboard .main-choice p{font-size:1rem;line-height:1.6;min-height:0;color:var(--helder-muted)}
.helder-dashboard .choice-link{font-size:1rem;color:var(--helder-accent)}
#progress .card{border-radius:22px}
#progress .grid>div>.card:first-child{background:var(--helder-surface);border-color:var(--helder-border)}
/* White working surfaces keep source materials, answers and feedback distinct. */
.helder-practice main,.helder-math main,.helder-exam main{max-width:1240px}
.helder-practice a,.helder-math a,.helder-exam main a{color:var(--helder-accent)}
.helder-practice .unit-header a{color:#fff}
.helder-practice .unit-header nav a[aria-current]{color:var(--helder-ink)}
.helder-practice button.primary,.helder-practice .button.primary,.helder-math button.primary,.helder-math .button-link.primary,.helder-exam main button:not(.secondary),.helder-exam main .button:not(.secondary){background:var(--helder-accent);border-color:var(--helder-accent);color:#fff;border-radius:12px}
.helder-practice button.primary:hover,.helder-practice .button.primary:hover,.helder-math button.primary:hover,.helder-exam main button:not(.secondary):hover{background:var(--helder-accent-hover);border-color:var(--helder-accent-hover)}
.helder-practice button:not(.primary):hover,.helder-math button:not(.primary):hover{background:#f5f6fb;border-color:#abb3d3}
.helder-practice .unit-intro{padding:34px;background:var(--helder-surface);border-color:var(--helder-border);gap:34px}
.helder-practice .unit-intro h1{font-size:clamp(1.75rem,3.3vw,2.5rem)}
.helder-practice .unit-goal{background:#fff;border-color:#4f46e5;border-radius:0 14px 14px 0}
.helder-practice .unit-guide{background:#fff;border:1px solid #e5e8f0;padding:26px}
.helder-practice .unit-source,.helder-practice .unit-work{border-color:var(--line);box-shadow:none}
.helder-practice .unit-question-nav button[aria-current]{background:#4f46e5;color:#fff;border-color:#4f46e5}
.helder-practice .back-link{color:var(--helder-accent)}
.helder-math .site-header{max-width:none;background:#4f46e5;color:#fff;padding:22px max(24px,calc((100vw - 1192px)/2));min-height:82px}
.helder-math .site-header a{color:#fff}
.helder-math .site-header>a:last-child{font-size:1rem;border:1px solid #71839e;padding:8px 14px;border-radius:12px;text-decoration:none}
.helder-math main{padding-top:28px}
.helder-math .kicker,.helder-math .hint summary{color:var(--helder-accent)}
.helder-math .route-grid{gap:20px}
.helder-math .route-card{background:var(--helder-surface);border-color:var(--helder-border);border-radius:22px;padding:24px}
.helder-math .route-card h2{font-size:1.25rem}
.helder-math .route-card p,.helder-math .route-status{color:var(--helder-muted)}
.helder-math .route-card button{background:var(--helder-accent);border-color:var(--helder-accent);color:#fff;border-radius:12px}
.helder-math .route-card button:hover{background:var(--helder-accent-hover)}
.helder-math .aim{background:var(--helder-surface);border-left:4px solid #4f46e5;border-radius:0 14px 14px 0;padding:18px 22px}
.helder-math .work-card,.helder-math .summary-box{border-color:var(--line);border-radius:22px}
.helder-math .source{background:#f7f8fc;border-color:#abb3d3}
.helder-math .stage-tabs button[aria-current=step]{background:#4f46e5;color:#fff;border-color:#4f46e5}
.helder-math .question-navigation button[aria-current=page]{background:var(--helder-surface);border-color:var(--helder-accent)}
.helder-math progress,.helder-math input{accent-color:var(--helder-accent)}
.helder-exam #root>.card:first-child:not(:has(.review)){border-color:var(--helder-border)}
.helder-exam .card{border-radius:22px;border-color:var(--line);padding:26px}
.helder-exam .tag{color:var(--helder-accent)}
.helder-exam .notice{background:var(--helder-surface);border:1px solid var(--helder-border);padding:18px;border-radius:14px;line-height:1.65}
.helder-exam .rubric{border-color:#4f46e5}
/* Keep the existing blue = answered legend true. */
.helder-exam main .palette button{background:#fff;color:var(--helder-ink);border-color:#b7c5d8;border-radius:10px}
.helder-exam main .palette button.done{background:#dbeafe;color:#142b4b}
.helder-exam main .palette button.current{outline:3px solid #4f46e5;outline-offset:1px}
.helder-account>header{background:#4f46e5;max-width:none;min-height:82px;padding:20px max(24px,calc((100vw - 1192px)/2))}
.helder-account .brand{color:white;display:flex;align-items:center;gap:10px;font-size:25px}
.helder-account .brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:white;color:#4f46e5;font-size:23px}
.helder-account main{border-color:var(--line);border-radius:24px;padding:32px;margin-top:40px;box-shadow:0 10px 30px #142b4b08}
.helder-account h1{font-size:1.75rem;margin-bottom:24px}
.helder-account h2{font-size:1.25rem}
.helder-account label{font-size:1rem}
.helder-account input{border-color:#cbd1e2;border-radius:12px;padding:12px 14px}
.helder-account button,.helder-account .button{background:var(--helder-accent);border-radius:12px;min-height:48px}
.helder-account button:hover,.helder-account .button:hover{background:var(--helder-accent-hover)}
.helder-account #forms nav{display:flex;gap:10px;padding:0 0 20px;border-bottom:1px solid var(--line)}
.helder-account #forms nav button{background:var(--helder-surface);color:#4f46e5;border:1px solid var(--helder-border);flex:1}
.helder-account #forms nav button:hover{background:#f5f6fb}
.helder-account #submit{width:100%;margin-top:18px}
.helder-account .text-button{background:transparent;color:var(--helder-accent)}
.helder-account .text-button:hover{background:transparent;text-decoration:underline}
.helder-account .guest-entry{border-top:1px solid var(--line);padding-top:22px;margin-top:24px}
.helder-account .guest-entry .button{background:var(--helder-surface);color:#4f46e5;border:1px solid var(--helder-border)}
.helder-account .guest-entry .small{font-size:.875rem;line-height:1.65;margin-bottom:0}
.helder-account #status{background:var(--helder-surface);border-radius:12px}
#account-bar{background:#f5f6fb;color:#526071}
#account-bar a,#account-gate a{color:var(--helder-accent)}
#account-gate{background:var(--bg)}
#account-gate section{border:1px solid var(--line);border-radius:24px;box-shadow:0 10px 30px #142b4b08}
#account-gate button{background:var(--helder-accent);border-radius:12px}
@media(max-width:900px){#trainStart .train-choice-layout{grid-template-columns:1fr;gap:24px}.helder-dashboard .page-intro{padding:24px}.helder-practice .unit-intro{gap:24px}}
@media(max-width:650px){
  .helder-dashboard .wrap{margin-top:22px;padding-left:16px;padding-right:16px}
  .helder-dashboard .page-intro{padding:22px 20px;gap:14px;align-items:flex-start;border-radius:20px;margin-bottom:24px}
  .helder-dashboard .page-intro .page-icon{width:42px;height:42px;border-radius:12px}
  .helder-dashboard .page-intro h1{font-size:1.5rem}
  #trainStart .chapter-pick{padding:16px;gap:12px}
  #trainStart .chapter-topic-icon{width:42px;height:42px;flex-basis:42px}
  #explain button.learn-chapter-head{padding:18px}
  #exam .exam-simple-card,#exam .exam-other .option-card{padding:22px}
  #rekenhulp>.card:first-child{padding:24px}
  .helder-practice .unit-intro,.helder-practice .unit-guide,.helder-exam .card{padding:22px}
  .helder-math .site-header{padding:16px;gap:14px;flex-wrap:wrap}
  .helder-math .site-header>a:last-child{font-size:.875rem}
  .helder-account main{margin:22px 16px;padding:26px 22px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.helder-dashboard .main-choice{transition:none}}

.helder-practice .unit-header-inner{max-width:1240px;min-height:82px;padding:18px 24px;gap:30px}
.helder-practice .unit-brand{font-size:25px;gap:10px}
.helder-practice .unit-brand>span{width:38px;height:38px;font-size:23px;border-radius:12px}
.helder-math .brand{display:flex;align-items:center;gap:10px;font-size:25px;white-space:nowrap}
.helder-math .brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#fff;color:#4f46e5;font-size:23px}
@media(max-width:650px){.helder-practice .unit-header-inner{padding:16px;gap:18px}.helder-practice .unit-header nav{flex-wrap:wrap}}

/* Neutral support panels; correct/incorrect feedback remains unchanged. */
.helder-dashboard .page-intro .page-icon{background:#ededff}
#trainStart .chapter-topic-icon,#homeChapters .chapter-topic-icon,#explain .learn-topic-icon{background:#fff}
#trainStart .chapter-pick:hover,#explain button.learn-chapter-head:hover{background:#f8f9fd}
.helder-dashboard .profile-avatar,.helder-dashboard .recommend-icon{background:#f5f6fb;color:#4f46e5}
.helder-dashboard .lesson-reader .lesson-example,.helder-dashboard .lesson-reader .lesson-terms{border-color:#e5e8f0}
.helder-practice .unit-source{background:#fff}
.helder-practice .unit-guide,.helder-practice .unit-review{background:#f7f8fc}
.helder-practice .unit-goal{background:#f7f8fc;border-left-color:#4f46e5}
.helder-practice .unit-goal strong,.helder-practice .eyebrow{color:#4f46e5}
.helder-practice .guide-mark,.helder-practice .calculation-badge{background:#ededff;color:#4f46e5}
.helder-practice .result-counts>div,.helder-practice .extra-practice,.helder-practice .extra-overview,.helder-practice .result-next,.helder-practice .check-invite{background:#f7f8fc;border-color:#e5e8f0}
.helder-practice .result-next .primary,.helder-practice .result-buttons .primary{background:#4f46e5;border-color:#4f46e5}
.helder-practice .result-next .primary:hover,.helder-practice .result-buttons .primary:hover{background:#4338ca;border-color:#4338ca}
.helder-practice .check-review-status{border-color:#4f46e5}
.helder-practice progress{accent-color:#4f46e5;background:#e9ebf3}
.helder-practice progress::-webkit-progress-bar{background:#e9ebf3}
.helder-practice progress::-webkit-progress-value{background:#4f46e5}
.helder-practice progress::-moz-progress-bar{background:#4f46e5}
.helder-practice .source-document,.helder-practice .source-chart,.helder-practice .source-process{border-color:#e5e8f0}
.helder-practice .source-document h3{color:#4f46e5;border-color:#abb3d3}
.helder-practice .source-chain li,.helder-practice .source-comparison li{background:#f7f8fc;border-color:#abb3d3}
.helder-practice .source-chain li:before,.helder-practice .source-chain li:after{color:#4f46e5}
.helder-practice .chart-bar{background:#4f46e5}
.helder-practice .chart-track{background:#f0f2f8;border-color:#8d99a5}
.helder-math .aim,.helder-exam .notice{background:#f7f8fc}
.helder-account #forms nav button,.helder-account .guest-entry .button{background:#fff}
.helder-account #status{background:#f5f6fb}
#legacy-progress-notice{background:#f7f8fc;border-color:#e5e8f0;color:#142b4b}
#legacy-progress-notice button{color:#4f46e5;border-color:#cbd1e2}
#legacy-progress-notice button:focus-visible{outline-color:#4f46e5}
.helder-dashboard .shape-two{background:#e4e8ec}
.helder-dashboard .shape-one{background:linear-gradient(145deg,#879caf,#b5c2cc)}
.helder-dashboard .fc-icon,.helder-dashboard .fc-b .fc-icon{background:#ededff;color:#4f46e5}

/* Light navigation, shared by dashboard, practice, maths, exam and account. */
.helder-dashboard .site-header,.helder-practice .unit-header,.helder-exam .exam-header,.helder-math .site-header,.helder-account>header{background:#fff;color:#142b4b;border-bottom:1px solid #e5e8f0;box-shadow:none}
.helder-dashboard .brand,.helder-practice .unit-header .unit-brand,.helder-exam .exam-header .exam-brand,.helder-math .site-header .brand,.helder-account>header .brand{color:#142b4b}
.helder-dashboard .brand-mark,.helder-practice .unit-brand>span,.helder-exam .exam-header .exam-brand-mark,.helder-math .brand-mark,.helder-account .brand-mark{background:#4f46e5;color:#fff;box-shadow:none}
.helder-dashboard .brand-word>span,.helder-exam .exam-brand-word>span{color:#4f46e5}
.helder-dashboard .top-nav .tab,.helder-practice .unit-header nav a{background:transparent;color:#626c87;box-shadow:none}
.helder-dashboard .top-nav .tab:hover,.helder-practice .unit-header nav a:hover{background:#f5f6fb;color:#4f46e5}
.helder-dashboard .top-nav .tab.active,.helder-practice .unit-header nav a[aria-current]{background:#ededff;color:#4f46e5;box-shadow:none}
.helder-dashboard .subject-chip{color:#626c87;border:1px solid #e5e8f0;background:#fff}
.helder-dashboard .subject-chip b{color:#4f46e5}
.helder-dashboard .profile-chip{border:1px solid #e5e8f0;box-shadow:none}
.helder-dashboard .profile-avatar{background:#ededff;color:#4f46e5}
.helder-practice .unit-subject,.helder-exam .exam-header .exam-subject{color:#626c87}
.helder-math .site-header>a:last-child,.helder-exam .exam-header .exam-home{color:#4f46e5;border-color:#d9dcf4;background:#fff}
.helder-math .site-header>a:last-child:hover,.helder-exam .exam-header .exam-home:hover{background:#ededff}
.helder-dashboard .page-intro{background:#fff;border-color:#e5e8f0}
.helder-dashboard .page-intro .page-icon{background:#ededff;color:#4f46e5}
#explain .learn-search input{background:#f7f8fc;border-color:#e5e8f0}
#exam .exam-other .option-card,.helder-dashboard .main-choice{background:#eef9ff;border-color:#e4f2fa}
.helder-dashboard .main-choice .choice-art{background:transparent}
.helder-dashboard .main-choice:hover{border-color:#c4c8f6}
#trainStart .chapter-pick:hover,#explain button.learn-chapter-head:hover{background:#f7f8ff;border-color:#c4c8f6}
.helder-practice .unit-question-nav button[aria-current],.helder-math .stage-tabs button[aria-current=step]{background:#ededff;border-color:#d8d8fb;color:#4f46e5}
.helder-practice .unit-question-nav button[aria-current]>span{color:#4f46e5}
.helder-math .question-navigation button[aria-current=page]{background:#ededff;border-color:#c4c8f6}
.helder-account #forms nav button{background:#f5f6fb;color:#4f46e5;border-color:#e5e8f0}
.helder-account #forms nav button:hover{background:#ededff}
#account-bar{background:#f7f8fc;color:#626c87}