.lesson-visual{max-width:960px;margin:0 auto 56px;color:var(--text-mid)}.lesson-visual *{box-sizing:border-box}.lesson-visual-heading{max-width:760px;margin:0 auto 24px}.lesson-visual-eyebrow{color:var(--purple-600);font:700 11px/1.5 var(--font-mono),monospace;letter-spacing:.09em}.lesson-visual-heading h2{color:var(--text-strong);font-family:var(--font-fraunces);font-size:clamp(23px,3vw,30px);line-height:1.25;margin:10px 0 12px}.lesson-visual p{font-size:16px;line-height:1.75;margin:0}.lesson-visual-workbench{border:1px solid var(--border);border-radius:18px;overflow:hidden;background:var(--card-bg);box-shadow:0 12px 36px color-mix(in srgb,var(--purple-600) 5%,transparent)}.lesson-visual-stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--border);border-bottom:1px solid var(--border)}.lesson-visual button{font:inherit;cursor:pointer}.lesson-visual-stages button{display:flex;align-items:center;gap:10px;padding:16px;min-width:0;text-align:left;border:0;background:var(--card-bg);color:var(--text-mid);font-size:14px;font-weight:600;overflow-wrap:anywhere}.lesson-visual-stages button.is-current{background:color-mix(in srgb,var(--purple-600) 9%,var(--card-bg));color:var(--purple-600);box-shadow:inset 0 -3px var(--purple-600)}.lesson-visual-number{flex-shrink:0;display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--border);border-radius:8px;font:12px var(--font-mono),monospace}.lesson-visual-body{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr);min-height:285px}.lesson-visual-illustration{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;background:color-mix(in srgb,var(--purple-600) 4%,var(--card-bg));border-right:1px solid var(--border);min-width:0}.lesson-visual-illustration svg{width:100%;max-width:360px;font:12px var(--font-mono),monospace}.lesson-visual-caption{color:var(--text-soft);text-align:center;font-size:11px}.concept-block{transition:fill .2s,stroke .2s;fill:var(--card-bg);stroke:var(--border);stroke-width:1.5px}.concept-block.is-selected{fill:color-mix(in srgb,var(--purple-600) 12%,var(--card-bg));stroke:var(--purple-600);stroke-width:2px}.lesson-visual-detail{padding:28px;min-width:0;animation:lesson-visual-enter .22s ease-out}.lesson-visual-detail h3{color:var(--text-strong);font-family:var(--font-fraunces);font-size:22px;margin:8px 0 10px}.lesson-visual-example{margin-top:18px;border:1px solid var(--border);border-radius:10px;padding:13px 15px;background:var(--surface-2)}.lesson-visual-example span{display:block;color:var(--text-soft);font:700 9px/1.5 var(--font-mono),monospace;letter-spacing:.09em;margin-bottom:7px}.lesson-visual-example code{color:var(--text-strong);font:13px/1.7 var(--font-mono),monospace;overflow-wrap:anywhere;white-space:pre-wrap}.lesson-visual-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center;border-top:1px solid var(--border);padding:12px 16px}.lesson-visual-controls button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;min-width:40px;border:1px solid var(--border);border-radius:8px;background:var(--card-bg);color:var(--text-mid);font-size:12px;padding:8px 10px}.lesson-visual-controls button[aria-pressed=true]{color:var(--purple-600);background:color-mix(in srgb,var(--purple-600) 8%,var(--card-bg))}.lesson-visual-controls .lesson-visual-reset{margin-left:auto}.lesson-visual a:focus-visible,.lesson-visual button:focus-visible,.lesson-visual summary:focus-visible{outline:2px solid var(--purple-600);outline-offset:-3px}.lesson-visual-takeaways{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;width:100%;max-width:760px;margin:16px auto 0}.lesson-visual-check,.lesson-visual-takeaways aside{min-width:0;padding:20px;border:1px solid var(--border);border-radius:12px;background:var(--card-bg)}.lesson-visual-takeaways p{margin-top:8px;font-size:14px;line-height:1.75}.lesson-visual-takeaways summary{cursor:pointer;display:flex;align-items:center;gap:8px;color:var(--text-strong);font-size:14px;font-weight:650;min-height:28px}.lesson-visual-takeaways summary:after{content:"+";margin-left:auto;color:var(--purple-600)}.lesson-visual-takeaways details[open] summary:after{content:"−"}.lesson-visual-takeaways .lesson-visual-question{font-weight:650;color:var(--text-strong)}.lesson-visual-source{display:block;width:100%;max-width:760px;margin:12px auto 0;color:var(--purple-600);font-size:12px;text-underline-offset:3px}@keyframes lesson-visual-enter{0%{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (max-width:640px){.lesson-visual{margin-bottom:40px}.lesson-visual-stages button{flex-direction:column;align-items:flex-start;gap:6px;padding:12px 10px;font-size:12px}.lesson-visual-body,.lesson-visual-takeaways{grid-template-columns:minmax(0,1fr)}.lesson-visual-illustration{border-right:0;border-bottom:1px solid var(--border);padding:18px;gap:8px}.lesson-visual-illustration svg{max-width:270px}.lesson-visual-detail{padding:20px}.lesson-visual-check,.lesson-visual-takeaways aside{padding:16px}}@media (prefers-reduced-motion:reduce){.lesson-visual-detail{animation:none}.concept-block{transition:none}}.lesson-visual-check details{margin-top:12px;border-top:1px solid var(--border);padding-top:10px}.lesson-interaction-artifacts,.lesson-interaction-content{min-width:0}.lesson-interaction-artifacts{display:flex;flex-direction:column;gap:16px}.lesson-interaction-explanation{max-width:760px;margin:20px auto 0;border:1px solid var(--border);border-radius:12px;background:var(--card-bg);overflow:hidden}.lesson-interaction-explanation summary{cursor:pointer;padding:14px 18px;min-height:48px;color:var(--purple-600);font-size:14px;font-weight:600}.lesson-interaction-explanation summary:focus-visible{outline:2px solid var(--purple-600);outline-offset:-3px}.lesson-interaction-explanation>div{display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--border);padding:18px;font-size:16px;line-height:1.8;color:var(--text-mid)}.lesson-interaction-explanation p{margin:0}.lesson-interaction-explanation ol,.lesson-interaction-explanation ul{padding-left:24px}