.hero{padding-top:45px;padding-bottom:44px;align-items:center}
.hero h1{margin-bottom:20px}.hero .intro{margin-bottom:22px}
.hero .steps{margin:0 0 24px}.hero .steps li{margin:17px 0}
.flow-figure{margin:22px 0 0;max-width:520px}
.flow-figure [data-scene]{width:100%}
.flow-figure figcaption{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:13px}
.flow-figure figcaption a{text-decoration:none;border-bottom:1px solid currentColor;padding:3px 0}
.flow-toggle{background:none;border:1px solid var(--soft);font:12px Plex,monospace;color:var(--ink);padding:7px 10px}
.flow-toggle:hover{border-color:var(--ink)}
.story-section{padding:48px 0 58px;border-top:1px solid var(--soft);scroll-margin-top:24px}
.story-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:25px}
.story-heading h2{font:29px/1.35 Pixel;max-width:560px;margin-bottom:0}
.story-heading .eyebrow{margin-bottom:14px}.story-heading>p{font-size:14px;max-width:280px;margin:0}
.story-player{border:1px solid color-mix(in srgb,var(--ink) 28%,transparent);position:relative;background:var(--paper)}
.story-player [data-scene]{padding:15px 0 0;max-width:1120px;margin:auto}
.scene-svg{width:100%;height:auto;display:block;color:var(--ink);overflow:visible}
.scene-svg text{fill:currentColor;font-family:Plex,monospace}.scene-label{font-size:14px;letter-spacing:.6px}
.scene-note{font-size:12px;opacity:.72}.scene-brand{font-family:Pixel!important;font-size:25px;letter-spacing:3px}
.scene-tag{font-family:Pixel!important;font-size:13px;letter-spacing:1px}
.scene-small{font-size:12px;letter-spacing:.3px;opacity:.8}
.scene-box{fill:var(--paper);stroke:currentColor;stroke-width:1.5}
.scene-icon{fill:none;stroke:currentColor;stroke-width:1.6}
.scene-wire{fill:none;stroke:var(--accent);stroke-width:1.5;stroke-dasharray:2 6;opacity:.7}
.scene-signal,.scene-fill,.scene-empty-dot{fill:var(--accent)}
.scene-track{fill:var(--soft)}.scene-divider{stroke:var(--paper);stroke-width:3}
.scene-spark{fill:none;stroke:var(--accent);stroke-width:3}
.scene-mobile .scene-label{font-size:17px}.scene-mobile .scene-note{font-size:15px}.scene-mobile .scene-brand{font-size:24px}
.story-caption{display:flex;gap:19px;padding:19px 27px;border-top:1px solid var(--soft);align-items:center;min-height:66px;font-size:14px}
.story-caption [data-story-step]{font-family:Pixel;color:var(--accent);font-size:17px;white-space:nowrap}
.story-controls{display:flex;align-items:center;gap:1px;margin:0 27px 20px;background:var(--ink);color:var(--paper);width:max-content;max-width:calc(100% - 54px)}
.story-controls button{font:13px Plex,monospace;border:0;background:var(--ink);color:var(--paper);padding:12px 17px;min-height:43px}
.story-controls button:hover{background:color-mix(in srgb,var(--ink) 83%,var(--accent))}
.story-controls button+button{border-left:1px solid color-mix(in srgb,var(--paper) 25%,transparent)}
.story-clock{font-size:12px;letter-spacing:.4px;padding:0 15px;white-space:nowrap;font-variant-numeric:tabular-nums}
.story-timeline{padding:0 27px 20px}.story-timeline input{display:block;width:100%;height:12px;margin:0;accent-color:var(--ink);cursor:pointer}
.story-note{margin:12px 0 0;font-size:12px;opacity:.65}
[data-story-playing=false] .scene-signal{opacity:0}
@media(max-width:750px){.hero{padding:32px 0;gap:30px}.hero .steps{display:none}.hero .intro{margin-bottom:12px}.flow-figure{margin-top:15px}.flow-figure figcaption{font-size:12px}.flow-toggle{font-size:11px}.story-section{padding:30px 0 38px}.story-heading{display:block;margin-bottom:20px}.story-heading h2{font-size:24px}.story-heading>p{margin-top:14px;max-width:none}.story-player [data-scene]{padding-top:5px}.story-caption{padding:15px;gap:11px;min-height:87px;font-size:13px}.story-caption [data-story-step]{font-size:15px}.story-controls{margin:0 15px 15px;max-width:calc(100% - 30px)}.story-controls button{padding:10px 13px}.story-clock{padding:0 10px;font-size:11px}.story-timeline{padding:0 15px 15px}.story-note{font-size:11px}.scene-mini .scene-small{font-size:13px}}