.learningAnimation{border:1px solid var(--line);background:var(--sheet);width:100%;min-width:0;color:var(--ink);border-radius:24px;padding:clamp(22px,4vw,42px);overflow:hidden}.learningAnimationHeader{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.learningAnimationEyebrow,.learningAnimationStageKicker,.learningAnimationSamplesLabel{color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin:0;font-size:12px;font-weight:750}.learningAnimationHeader h2{letter-spacing:-.04em;max-width:16em;margin:10px 0;font-size:clamp(27px,4vw,44px);line-height:1.08}.learningAnimationNote,.learningAnimationMotionNote{color:var(--muted);margin:0;font-size:14px;line-height:1.55}.learningAnimationCounter{background:var(--peach);min-width:58px;color:var(--on-peach);font-family:var(--mono);text-align:center;border-radius:10px;flex:none;padding:9px 12px;font-size:14px;font-weight:750}.learningAnimationSamples{background:var(--surface);border-radius:15px;margin-top:28px;padding:17px}.learningAnimationSampleButtons{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:11px;display:grid}.learningAnimationSampleButtons button,.learningAnimationButton{border:1px solid var(--line);cursor:pointer;min-width:0;font:inherit;border-radius:10px;transition:border-color .18s,background-color .18s,color .18s,transform .18s}.learningAnimationSampleButtons button{background:var(--sheet);color:var(--ink);text-align:left;gap:6px;padding:12px 14px;display:grid}.learningAnimationSampleButtons button:hover:not(:disabled),.learningAnimationButton:hover:not(:disabled){border-color:var(--violet);transform:translateY(-1px)}.learningAnimationSampleButtons button.is-selected{background:var(--peach);color:var(--on-peach);border-color:#0000}.learningAnimationSampleButtons button span{overflow-wrap:anywhere;font-family:var(--serif);font-size:16px;line-height:1.45}.learningAnimationSampleButtons button small{overflow-wrap:anywhere;color:var(--muted);font-size:12px;line-height:1.45}.learningAnimationSampleButtons button.is-selected small{color:var(--on-peach)}.learningAnimationDiagram{color:var(--line);margin:25px 0 8px}.learningAnimationDiagram svg{width:100%;height:60px;overflow:visible}.learningAnimationDiagramLine{fill:none;stroke:var(--line);stroke-width:3px;stroke-dasharray:7 11;animation:2s linear infinite paused learningAnimationFlow}.learningAnimation.is-playing .learningAnimationDiagramLine{animation-play-state:running}.learningAnimationDiagram circle{fill:var(--sheet);stroke:var(--line);stroke-width:3px;transform-box:fill-box;transform-origin:50%;transition:fill .25s,stroke .25s,transform .25s}.learningAnimationDiagram circle.is-complete{fill:var(--peach);stroke:var(--peach);transform:scale(1.15)}.learningAnimationStages{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.learningAnimationStages li{min-width:0;color:var(--muted);gap:8px;font-size:12px;line-height:1.35;display:grid}.learningAnimationStages li>span{background:var(--surface);width:28px;height:28px;color:var(--muted);font-family:var(--mono);border-radius:50%;place-items:center;font-size:11px;font-weight:700;display:grid}.learningAnimationStages li strong{overflow-wrap:anywhere;font-weight:650}.learningAnimationStages li.is-current{color:var(--ink)}.learningAnimationStages li.is-current>span,.learningAnimationStages li.is-complete>span{background:var(--peach);color:var(--on-peach)}.learningAnimationAnnouncement{color:var(--muted);font-family:var(--mono);margin:22px 0 0;font-size:12px}.learningAnimationStage{border:1px solid var(--line);background:var(--surface);border-radius:17px;min-width:0;margin-top:10px}.learningAnimationStagePanel{min-width:0;padding:clamp(20px,4vw,30px);animation:.35s both learningAnimationEnter}.learningAnimationStageKicker{margin-bottom:9px}.learningAnimationStageCopy h3{letter-spacing:-.03em;margin:0 0 10px;font-size:clamp(21px,3vw,28px);line-height:1.15}.learningAnimationStageCopy>p:not(.learningAnimationStageKicker):not(.learningAnimationConclusion){max-width:62em;color:var(--muted);margin:0;font-size:15px;line-height:1.6}.learningAnimationStageCopy strong{color:var(--ink);font-weight:750}.learningAnimationExamplePair,.learningAnimationAttempt,.learningAnimationRule,.learningAnimationTestCard{border:1px solid var(--line);background:var(--sheet);border-radius:13px;margin-top:21px;padding:17px}.learningAnimationExamplePair{background:0 0;border:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0;display:grid}.learningAnimationMiniCard{border:1px solid var(--line);background:var(--sheet);border-radius:12px;min-width:0;padding:15px}.learningAnimationMiniCard.is-highlighted{border-color:color-mix(in srgb, var(--violet) 35%, var(--line));background:var(--mark)}.learningAnimationMiniCard>span,.learningAnimationVersionLabel,.learningAnimationQuestion{color:var(--muted);font-family:var(--mono);letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px;font-size:11px;font-weight:700;display:block}.learningAnimationMiniCard p,.learningAnimationAttempt>p,.learningAnimationTestCard>p,.learningAnimationRule>p{overflow-wrap:anywhere;color:var(--ink);font-family:var(--serif);margin:0;font-size:clamp(16px,2vw,20px);line-height:1.5}.learningAnimationAnswerLine{border-top:1px dashed var(--line);color:var(--muted);justify-content:space-between;align-items:center;gap:16px;margin-top:18px;padding-top:13px;font-size:13px;display:flex}.learningAnimationAnswerLine strong{background:var(--peach);width:29px;height:29px;color:var(--on-peach);font-family:var(--mono);border-radius:50%;place-items:center;display:grid}.learningAnimationCompare{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;margin-top:21px;display:grid}.learningAnimationVersion{border:1px solid var(--line);background:var(--sheet);border-radius:12px;min-width:0;padding:15px}.learningAnimationVersionOld{background:color-mix(in srgb, var(--surface) 75%, var(--peach))}.learningAnimationVersionNew{border-color:color-mix(in srgb, var(--violet) 35%, var(--line));background:var(--mark)}.learningAnimationVersion p{overflow-wrap:anywhere;color:var(--ink);font-family:var(--serif);margin:0;font-size:clamp(16px,2vw,20px);line-height:1.5}.learningAnimationVersion del{color:var(--soft-ink);-webkit-text-decoration-color:var(--violet);text-decoration-color:var(--violet);text-decoration-thickness:2px}.learningAnimationVersion ins{color:var(--ink);font-weight:700;text-decoration:none}.learningAnimationCompareArrow{color:var(--violet);font-size:25px;line-height:1}.learningAnimationRule{border-left:4px solid var(--violet);gap:8px;display:grid}.learningAnimationRule>strong{font-family:var(--serif);font-size:clamp(18px,2.5vw,24px)}.learningAnimationRule>p{color:var(--muted);font-size:16px}.learningAnimationAdjustment{border-left:4px solid var(--violet);background:var(--sheet);border-radius:13px;margin-top:21px;padding:17px}.learningAnimationProcessFlow{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;min-width:0;display:flex}.learningAnimationProcessFlow span{background:var(--mark);min-width:0;max-width:100%;color:var(--ink);text-align:center;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:700;line-height:1.35}.learningAnimationProcessFlow i{color:var(--violet);flex:none;font-size:18px;font-style:normal;line-height:1}.learningAnimationAdjustment>p{color:var(--muted);margin:14px 0 0;font-size:13px;line-height:1.55}.learningAnimation.is-playing .learningAnimationProcessFlow span{animation:.7s both learningAnimationStep}.learningAnimation.is-playing .learningAnimationProcessFlow span:nth-of-type(2){animation-delay:.1s}.learningAnimation.is-playing .learningAnimationProcessFlow span:nth-of-type(3){animation-delay:.2s}.learningAnimation.is-playing .learningAnimationProcessFlow span:nth-of-type(4){animation-delay:.3s}.learningAnimationTestCard{border-color:var(--violet);background:var(--mark)}.learningAnimationQuestion{color:var(--soft-ink);font-family:var(--sans);letter-spacing:0;text-transform:none;margin:16px 0 0;font-size:13px;font-weight:600}.learningAnimationConclusion{border-top:1px solid var(--line);max-width:62em;color:var(--muted);margin:20px 0 0;padding-top:16px;font-size:14px;line-height:1.6}.learningAnimationControls{flex-wrap:wrap;gap:9px;margin-top:16px;display:flex}.learningAnimationButton{background:var(--sheet);color:var(--ink);padding:10px 14px;font-size:14px;font-weight:700}.learningAnimationButtonPrimary{background:var(--ink);color:var(--sheet);border-color:#0000}.learningAnimationButtonReset{color:var(--muted);margin-left:auto}.learningAnimationButton:disabled{cursor:not-allowed;opacity:.45;transform:none}.learningAnimation button:focus-visible{outline:3px solid var(--violet);outline-offset:3px}.learningAnimationMotionNote{margin-top:15px;font-size:12px}@keyframes learningAnimationFlow{to{stroke-dashoffset:-36px}}@keyframes learningAnimationEnter{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes learningAnimationStep{0%{opacity:.55;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@media (max-width:700px){.learningAnimationStages{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:14px}.learningAnimationButtonReset{margin-left:0}}@media (max-width:560px){.learningAnimationHeader{display:block}.learningAnimationCounter{margin-top:16px;display:inline-block}.learningAnimationSampleButtons,.learningAnimationExamplePair,.learningAnimationCompare{grid-template-columns:minmax(0,1fr)}.learningAnimationCompareArrow{justify-self:center;transform:rotate(90deg)}}@media (max-width:390px){.learningAnimation{border-radius:18px;padding:19px 15px}.learningAnimationStages{grid-template-columns:repeat(2,minmax(0,1fr))}.learningAnimationControls{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.learningAnimationButton{width:100%;padding-inline:8px}.learningAnimationButtonReset{grid-column:1/-1}.learningAnimationProcessFlow{flex-direction:column;align-items:stretch}.learningAnimationProcessFlow i{align-self:center;transform:rotate(90deg)}}@media (prefers-reduced-motion:reduce){.learningAnimation *,.learningAnimation :before,.learningAnimation :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}