#stroop-course{--paper:oklch(98% .009 88);--ink:oklch(26% .024 65);--muted:oklch(44% .022 65);--line:oklch(82% .018 80);--honey:oklch(84% .12 84);--green:oklch(35% .047 162);--blue:oklch(45% .17 263);--cream:oklch(95% .035 87);background:var(--paper);color:var(--ink);font:16px/1.55 'Hanken Grotesk',system-ui,sans-serif}
#stroop-course,#stroop-course *{box-sizing:border-box}#stroop-course [hidden]{display:none!important}#stroop-course .course-main{max-width:1240px;margin:auto;padding:36px 40px 48px}#stroop-course h2,#stroop-course h3{font-family:'Spectral',Georgia,serif;color:var(--ink);font-weight:500;text-wrap:balance}#stroop-course h2{font-size:34px;line-height:1.18;margin:0 0 22px}#stroop-course h3{font-size:25px;line-height:1.3;margin:24px 0 12px}#stroop-course p{max-width:72ch;margin:0 0 18px}#stroop-course .chapter-copy>p,#stroop-course .takeaway p,#stroop-course .explainer p,#stroop-course .faq p,#stroop-course #results p,#stroop-course #task-setup p{font-size:var(--body-size,18px);line-height:var(--body-lh,1.65);color:var(--body-ink,var(--ink))}#stroop-course a{color:var(--green);text-underline-offset:3px}#stroop-course button,#stroop-course select,#stroop-course textarea{font:inherit;font-size:16px;color:var(--ink)}#stroop-course button,#stroop-course summary,#stroop-course select{min-height:44px;touch-action:manipulation}#stroop-course button{border:1px solid var(--line);padding:12px 16px;border-radius:7px;background:var(--paper);cursor:pointer;text-align:left;line-height:1.4}#stroop-course button:hover:not(:disabled){border-color:var(--green);background:var(--cream)}#stroop-course button:disabled{cursor:default;opacity:.65}#stroop-course button.primary{background:var(--honey);border-color:var(--honey);font-weight:700;box-shadow:0 3px 0 oklch(65% .09 80)}#stroop-course button.secondary{background:transparent}#stroop-course :is(button,a,summary,select,textarea):focus-visible{outline:3px solid var(--blue);outline-offset:4px}#stroop-course .explainer{max-width:820px;margin:0 auto 48px}#stroop-course .examples{padding:20px 24px;background:var(--cream);margin:24px 0;border-radius:8px}#stroop-course .examples h3{margin-top:0}#stroop-course .examples p{margin:0}#stroop-course .mission{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:24px;border-top:1px solid var(--line)}#stroop-course .mission strong{font-size:18px;font-variant-numeric:tabular-nums}#stroop-course #save-note,#stroop-course .small{font-size:14px!important;color:var(--muted);margin-top:8px}#stroop-course .passport{margin:12px 0 28px}#stroop-course summary{cursor:pointer;padding:12px 0;font-weight:600}#stroop-course #stamps{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:0;list-style:none}#stroop-course #stamps li{border:1px dashed var(--line);border-radius:8px;text-align:center;padding:14px 10px;font-size:13px}#stroop-course #stamps li>*{display:block}#stroop-course #stamps li>span:first-child{font-size:26px}#stroop-course #stamps li.earned{background:var(--honey);border-style:solid}#stroop-course .passport p{font-size:14px;color:var(--muted)}#stroop-course .chapter-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:24px 0}#stroop-course .chapter-nav button{display:flex;gap:9px;align-items:center;border-radius:0;border:0;border-bottom:2px solid var(--line);font-size:14px;padding:12px 4px}#stroop-course .chapter-nav span{font-weight:700}#stroop-course .chapter-nav [aria-current]{border-color:var(--green);color:var(--green);font-weight:700}#stroop-course .chapter-panel{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:start;gap:36px;padding-top:12px}#stroop-course figure{margin:0;position:sticky;top:100px;background:var(--cream);border-radius:10px;overflow:hidden}#stroop-course figure img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}#stroop-course figcaption{padding:17px 20px;font-size:15px;color:var(--muted)}#stroop-course .chapter-copy{min-width:0}#stroop-course .eyebrow{display:block;font-family:'Hanken Grotesk',system-ui,sans-serif;font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--green);margin-bottom:12px}#stroop-course .takeaway{padding:1px 0 4px;border-block:1px solid var(--line);margin:26px 0}#stroop-course .check{padding:0;border:0;margin:32px 0;min-width:0}#stroop-course .check legend{padding:0;font-weight:600;font-size:20px;line-height:1.45;max-width:100%;margin-bottom:16px}#stroop-course .choices{display:grid;gap:10px}#stroop-course .choices button{width:100%}#stroop-course .choices button.correct{background:oklch(92% .035 153);border-color:var(--green);opacity:1}#stroop-course .feedback:not(:empty){padding:15px;background:var(--cream);border-radius:7px;margin-top:14px}#stroop-course .passed .feedback{background:oklch(92% .035 153)}#stroop-course .chapter-end{padding:22px 0;border-top:1px solid var(--line)}#stroop-course .gate-note{font-size:14px;color:var(--muted);margin-top:12px}#stroop-course label{display:block;font-weight:600;margin:16px 0 8px}#stroop-course select,#stroop-course textarea{width:100%;max-width:100%;border:1px solid var(--line);padding:12px;background:var(--paper);border-radius:6px}#stroop-course textarea{resize:vertical;min-height:120px}#stroop-course .actions{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}#stroop-course .swatches{display:flex;gap:24px;margin:24px 0;flex-wrap:wrap}#stroop-course .swatches span{display:flex;align-items:center;gap:8px}#stroop-course .swatches i{display:inline-block;width:24px;height:24px;border-radius:50%;background:currentColor}#stroop-course .red{color:#b32332}#stroop-course .blue{color:#2454c1}#stroop-course .green{color:#18763b}#stroop-course #task{border:1px solid var(--line);background:var(--cream);padding:20px;border-radius:10px;margin:20px 0}#stroop-course #task h3{margin-top:0}#stroop-course .task-rule{font-size:15px}#stroop-course .stimulus{display:grid;place-items:center;min-height:145px;background:var(--paper);font:700 52px/1.2 'Hanken Grotesk',system-ui,sans-serif;letter-spacing:2px;border-radius:7px;margin:22px 0}#stroop-course .response-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}#stroop-course .response-buttons button{padding:14px 4px;text-align:center;font-size:16px}#stroop-course #task-feedback{min-height:54px;margin:14px 0;font-size:15px}#stroop-course #task-status:not(:empty){margin:20px 0;padding:16px;background:var(--cream);border-radius:7px}#stroop-course #task-rest{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}#stroop-course #results{border-block:1px solid var(--line);padding:12px 0;margin:24px 0}#stroop-course table{border-collapse:collapse;width:100%;font-size:15px}#stroop-course caption{text-align:left;margin-bottom:12px;font-size:14px;color:var(--muted)}#stroop-course th,#stroop-course td{text-align:left;padding:12px 6px;border-bottom:1px solid var(--line);vertical-align:top;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}#stroop-course .result-gap{margin-top:20px}#stroop-course .reset-confirm,#stroop-course #completion{background:var(--cream);padding:20px;border-radius:8px;margin:20px 0}#stroop-course .course-progress{margin:40px 0 56px;border-top:1px solid var(--line);padding-top:14px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;font-size:14px}#stroop-course .course-progress label{margin:0}#stroop-course progress{accent-color:var(--green);flex:1;min-width:100px;max-width:100%;height:10px}#stroop-course .faq{max-width:820px;margin:auto}#stroop-course .faq details{border-bottom:1px solid var(--line);padding:8px 0}#stroop-course #lesson,#stroop-course h2{scroll-margin-top:100px}#stroop-course :is(#lesson,h2,#results,#completion):focus{outline:none}
@media(max-width:800px){#stroop-course .course-main{padding:28px 20px 40px}#stroop-course .chapter-panel{grid-template-columns:1fr;gap:26px}#stroop-course figure{position:static}#stroop-course .chapter-nav{gap:5px}#stroop-course .chapter-nav button{flex-direction:column;text-align:center;font-size:12px;gap:5px}#stroop-course #stamps{grid-template-columns:repeat(3,minmax(0,1fr))}#stroop-course .mission{align-items:flex-start}#stroop-course .mission button{flex-shrink:0;max-width:120px}#stroop-course h2{font-size:30px}#stroop-course h3{font-size:24px}#stroop-course .explainer{margin-bottom:32px}}
@media(max-width:390px){#stroop-course .course-main{padding-inline:16px}#stroop-course .examples{padding:16px}#stroop-course #task{padding:12px}#stroop-course .stimulus{font-size:44px}#stroop-course table{font-size:14px}#stroop-course th,#stroop-course td{padding-inline:3px}#stroop-course .course-progress{gap:12px}#stroop-course .mission{gap:12px}#stroop-course .mission strong{font-size:16px}}
@media(prefers-reduced-motion:reduce){#stroop-course,#stroop-course *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
