.journey-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(350px,440px);grid-template-areas:"intro animation" "steps animation";gap:24px 55px;align-items:start;padding-top:42px}
.journey-layout .learn-hero{grid-area:intro;padding:0}
.journey-layout .learn-hero h1{font-size:clamp(36px,3.8vw,50px);margin:22px 0}
.journey-layout .learn-lead{font-size:17px;max-width:640px;color:var(--muted)}
.journey-layout .timeline{grid-area:steps;width:100%;margin:5px 0 48px}
.journey-layout .timeline-step{gap:22px;padding:28px 0 36px}
.journey-layout .timeline-step h2{font-size:29px}
.journey-layout .timeline-step p{font-size:14px;line-height:1.75}
.journey-aside{grid-area:animation;position:sticky;top:98px;align-self:start;min-width:0}
.journey-card{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:20px 20px 14px;overflow:hidden}
.journey-heading{display:flex;justify-content:space-between;gap:10px;color:var(--muted);align-items:center}
.journey-heading>.mono{font-size:11px}
.journey-drawing{display:block;width:100%;height:auto;max-height:280px;color:var(--ink);margin:10px auto 0}
.sketch-scene{opacity:0;transform:translateY(6px);transition:opacity 220ms cubic-bezier(.23,1,.32,1),transform 220ms cubic-bezier(.23,1,.32,1);pointer-events:none}
.sketch-scene.selected{opacity:1;transform:translateY(0)}
.journey-card[data-instant=true] .sketch-scene{transition:none}
.sketch-paper{fill:var(--paper);stroke:var(--line);stroke-width:1.6}
.sketch-line,.sketch-accent,.sketch-muted{fill:none;stroke:currentColor;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.sketch-muted{stroke:var(--muted);stroke-width:1.5;opacity:.55}
.sketch-accent{stroke:var(--accent);stroke-width:2.5}
.sketch-dot{fill:var(--accent)}
.sketch-protected{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1.5}
.sketch-small{font:11px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;fill:var(--muted)}
.sketch-mono{font:16px ui-monospace,monospace;fill:var(--ink)}
.sketch-value{font:32px Georgia,serif;fill:var(--green)}
.sketch-model-one{fill:var(--green)}.sketch-model-two{fill:var(--accent)}
.sketch-bar-label{font:12px ui-monospace,monospace;fill:var(--surface)}
.sketch-wells circle{fill:var(--accent-soft);stroke:var(--green);stroke-width:2}
.journey-card.playing .selected .sketch-float{animation:sketch-float 6.5s cubic-bezier(.77,0,.175,1) infinite}
@keyframes sketch-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.journey-caption{min-height:122px;padding:14px 0 10px;border-top:1px solid var(--line);margin-top:10px}
.journey-caption h2{font-size:25px;letter-spacing:-.025em;line-height:1.2;margin:9px 0}
.journey-caption p{font-size:12px;line-height:1.6;color:var(--muted);margin:6px 0}
.journey-controls{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:8px}
.journey-controls button{background:var(--paper);color:var(--muted);border:1px solid var(--line);border-radius:5px;min-height:36px;font-size:11px;padding:6px 10px}
.journey-dots{display:flex;gap:5px}.journey-dots button{padding:5px;width:27px}
.journey-dots button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.journey-meter{height:2px;background:var(--line);margin:15px 0 8px;overflow:hidden}
.journey-meter i{height:2px;background:var(--green);display:block;transform-origin:left;transform:scaleX(0)}
.journey-card.playing .journey-meter i{animation:journey-progress 6.5s linear}
@keyframes journey-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.journey-footnote{font-size:10px;line-height:1.6;color:var(--muted);margin:7px 0 0}
@media(max-width:1100px){.journey-layout{gap:24px 28px;grid-template-columns:minmax(0,1fr) 365px}.journey-drawing{max-height:250px}.journey-card{padding:16px}}
@media(max-width:850px){.journey-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"intro" "animation" "steps";padding-top:35px;gap:24px}.journey-aside{position:static;max-width:560px;width:100%;margin:0 auto}.journey-layout .learn-hero h1{font-size:clamp(33px,5.4vw,45px)}.journey-card{padding:18px}.journey-drawing{max-height:250px}.journey-layout .timeline-step{gap:18px}.journey-caption{min-height:110px}.journey-dots button{min-width:28px;min-height:36px}}
@media(max-width:420px){.journey-layout .timeline-step{grid-template-columns:34px 1fr;gap:12px}.journey-layout .timeline:before{left:16px}.journey-card{padding:14px}.journey-controls{gap:7px}.journey-controls button{padding:5px 7px}.journey-dots{gap:3px}.journey-dots button{min-width:25px;width:25px}.journey-caption h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){.sketch-scene{transform:none;transition:none}.journey-card.playing .selected .sketch-float,.journey-card.playing .journey-meter i{animation:none}}