:root{--wrap-max:1060px}body{font:400 17px/1.7 var(--font-body)}a{color:var(--indigo);text-underline-offset:3px}article{padding-block:56px}.col{max-width:680px;margin:0 auto}.eyebrow{font:500 12px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);flex-wrap:wrap;gap:10px;display:flex}h1{font:800 clamp(38px, 6vw, 60px)/1.05 var(--font-display);letter-spacing:-.02em;text-wrap:balance;margin:16px 0 18px}.title-ink{isolation:isolate;display:inline-block;position:relative}.title-ink canvas{z-index:-1;opacity:.3;pointer-events:none;width:calc(100% + 18px);height:.45em;position:absolute;bottom:-.05em;left:-8px}.dek{color:var(--muted);text-wrap:pretty;margin:0 0 28px;font-size:20px;line-height:1.55}.toc{border:1px solid var(--rule);background:var(--surface);counter-reset:toc;font:400 14px/1.5 var(--font-mono);border-radius:14px;gap:6px;margin:0 0 8px;padding:16px 18px;list-style:none;display:grid}.toc li{counter-increment:toc;gap:10px;display:flex}.toc li:before{content:counter(toc, decimal-leading-zero);color:var(--muted)}.toc a{color:var(--ink);text-decoration:none}.toc a:hover{color:var(--indigo);text-decoration:underline}h2{font:700 clamp(26px, 3.4vw, 34px)/1.15 var(--font-display);text-wrap:balance;margin:72px 0 6px;scroll-margin-top:80px}h2 .num{font:500 12px/1 var(--font-mono);letter-spacing:.1em;color:var(--indigo);margin-bottom:12px;display:block}p{text-wrap:pretty;margin:14px 0}code{font:400 .86em/1 var(--font-mono);background:var(--code-bg);border-radius:5px;padding:2px 5px}pre{background:var(--code-bg);font:400 13px/1.65 var(--font-mono);border-radius:12px;margin:18px 0;padding:16px 18px;overflow-x:auto}pre code{font-size:inherit;background:0 0;padding:0}.tk-c{color:var(--c-com);font-style:italic}.tk-s{color:var(--c-str)}.tk-k{color:var(--c-kw);font-weight:500}ul.plain{padding-left:20px}ul.plain li{margin:6px 0}.demo{border:1.5px solid var(--ink);background:var(--surface);border-radius:22px;max-width:900px;margin:28px auto;overflow:hidden}.demo-stage{background:var(--paper);border-bottom:1px solid var(--rule);position:relative}.demo-bar{flex-wrap:wrap;align-items:center;gap:14px 22px;padding:16px 18px;display:flex}.demo figcaption,.demo .cap{font:400 12.5px/1.5 var(--font-mono);color:var(--muted);padding:0 18px 16px}.ctl{min-width:150px;font:500 12px/1 var(--font-mono);color:var(--muted);flex:150px;gap:6px;display:grid}.ctl span{justify-content:space-between;gap:8px;display:flex}.ctl output{color:var(--ink);font-variant-numeric:tabular-nums}input[type=range]{-webkit-appearance:none;appearance:none;cursor:pointer;background:0 0;width:100%;height:22px}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(var(--indigo), var(--indigo)) 0 / var(--fill,50%) 100% no-repeat, var(--rule);border-radius:4px;height:4px}input[type=range]::-moz-range-track{background:var(--rule);border-radius:4px;height:4px}input[type=range]::-moz-range-progress{background:var(--indigo);border-radius:4px;height:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--brush);border:2px solid var(--surface);border-radius:50%/45% 45% 55% 55%;width:18px;height:18px;margin-top:-7px;box-shadow:0 1px 3px #0000004d}input[type=range]::-moz-range-thumb{background:var(--brush);border:2px solid var(--surface);border-radius:50%;width:16px;height:16px}.btn{font:500 12.5px/1 var(--font-mono);border:1px solid var(--rule);background:var(--paper);color:var(--ink);cursor:pointer;border-radius:9px;align-items:center;gap:6px;padding:9px 12px;display:inline-flex}.btn:hover{border-color:var(--ink)}.btn.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}.btn[aria-pressed=true]{background:var(--indigo-soft);color:var(--indigo);border-color:#0000}.seg{border:1px solid var(--rule);border-radius:9px;display:inline-flex;overflow:hidden}.seg button{font:500 12px/1 var(--font-mono);background:var(--paper);color:var(--muted);cursor:pointer;border:0;padding:8px 10px}.seg button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.readout{font:400 12.5px/1.5 var(--font-mono);color:var(--muted)}.readout b{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:500}#brushStage{height:360px}#brushStage canvas{width:100%;height:100%;position:absolute;inset:0}.scrolly-wrap{grid-template-columns:minmax(0,1fr) minmax(0,260px);display:grid}.scrolly{overscroll-behavior:contain;scrollbar-width:thin;height:340px;position:relative;overflow-y:auto}.scrolly .track{height:1180px;position:relative}.scrolly .spine{background:var(--ink);opacity:.8;width:2px;margin-left:-1px;position:absolute;top:0;bottom:120px;left:60px}.scrolly canvas{width:40px;position:absolute;top:0;left:40px}.scrolly .dot{border:2px solid var(--ink);background:var(--paper);border-radius:50%;width:16px;height:16px;margin:-8px 0 0 -8px;transition:background .3s,box-shadow .3s;position:absolute;left:60px}.scrolly .dot.inked{background:var(--brush);border-color:var(--brush)}.scrolly .dot.active{box-shadow:0 0 0 5px color-mix(in srgb, var(--ink) 14%, transparent)}.scrolly .lbl{font:600 15px/1.3 var(--font-display);position:absolute;left:92px;transform:translateY(-50%)}.scrolly .lbl small{font:400 11.5px/1.3 var(--font-mono);color:var(--muted);display:block}.scrolly .tipline{z-index:3;pointer-events:none;height:0;position:sticky;top:0}.scrolly .tipline i{border-top:1.5px dashed var(--indigo);position:absolute;left:0;right:0}.scrolly .tipline span{font:500 11px/1 var(--font-mono);color:var(--indigo);background:var(--paper);border-radius:4px;padding:2px 4px;position:absolute;right:10px;transform:translateY(-120%)}.scrolly .maskviz{border:1.5px dashed var(--indigo);pointer-events:none;background:linear-gradient(transparent, color-mix(in srgb, var(--indigo) 25%, transparent));border-radius:8px;width:52px;position:absolute;left:34px}.side{border-left:1px solid var(--rule);align-content:start;gap:14px;padding:18px;display:grid}.side .big{font:700 28px/1 var(--font-display);font-variant-numeric:tabular-nums}.map-wrap{grid-template-columns:300px minmax(0,1fr);align-items:center;display:grid}#mapSvg{border:1.5px solid var(--ink);background:var(--surface);border-radius:16px;width:100%;max-width:300px;height:auto;margin:18px auto;display:block}#mapSvg .grid{fill:none;stroke:var(--rule)}#mapSvg .land{fill:var(--land);stroke:var(--muted);stroke-width:.6px;stroke-linejoin:round}#mapSvg .river{fill:none;stroke:var(--river);stroke-width:1.3px;stroke-linecap:round;stroke-linejoin:round}#mapSvg .pts circle{fill:var(--indigo)}#mapSvg .pin path{fill:var(--indigo);stroke:var(--surface)}.bytes{gap:6px;padding:18px;display:grid}.meter{background:var(--paper);border:1px solid var(--rule);border-radius:99px;height:10px;overflow:hidden}.meter i{background:var(--indigo);border-radius:99px;height:100%;transition:width .2s;display:block}#play{touch-action:none;background-image:radial-gradient(var(--rule) 1px, transparent 1px);background-size:18px 18px;height:300px;position:relative;overflow:hidden}#chip{font:600 13px/1 var(--font-mono);border:1.5px solid var(--ink);background:var(--surface);color:var(--ink);cursor:grab;user-select:none;touch-action:none;border-radius:99px;padding:10px 14px;position:absolute;top:60%;left:50%;transform:translate(-50%,-50%)}#chip:active{cursor:grabbing}#play .pop{z-index:5;pointer-events:none;background:var(--ink);max-width:min(240px,100% - 16px);color:var(--paper);border-radius:10px;padding:8px 12px 9px;position:absolute;box-shadow:0 10px 28px -12px #00000080}#play .pop b{font:600 13px/1.3 var(--font-body);display:block}#play .pop span{font:400 11.5px/1.45 var(--font-mono);opacity:.72;margin-top:2px;display:block}#play .pop:after{content:"";left:var(--ax,50%);background:var(--ink);border-radius:2px;width:9px;height:9px;position:absolute;bottom:-4px;transform:translate(-50%)rotate(45deg)}#play .pop.below:after{top:-4px;bottom:auto}#play .pop:before{content:"";background:var(--indigo);opacity:1;border-radius:50% 50% 50% 0;width:5px;height:5px;position:absolute;top:10px;right:10px;transform:rotate(-45deg)}.guide{pointer-events:none;z-index:4;position:absolute}.guide.v{border-left:1.5px dashed var(--indigo);width:0}.guide.h{border-top:1.5px dashed var(--indigo);height:0;left:0;right:0}.guide em{font:500 10.5px/1 var(--font-mono);color:var(--indigo);background:var(--paper);white-space:nowrap;border-radius:4px;padding:2px 4px;font-style:normal;position:absolute}#flightSvg{width:100%;height:220px;display:block}#flightSvg .track{fill:none;stroke:var(--muted);stroke-width:1.3px;stroke-dasharray:1 7;stroke-linecap:round}#flightSvg .trail{fill:none;stroke:var(--brush);stroke-width:2.4px;stroke-linecap:round}#flightSvg .end{fill:var(--paper);stroke:var(--ink);stroke-width:1.6px}#flightSvg .plane{fill:var(--surface);stroke:var(--ink);stroke-width:1.3px;stroke-linejoin:round}#flightSvg .tan{stroke:var(--indigo);stroke-width:1.2px;stroke-dasharray:3 3}#flightSvg text{font:500 11px/1 var(--font-mono);fill:var(--muted);letter-spacing:.06em}.ease-plot{flex:none;width:120px;height:80px}.ease-plot path{fill:none;stroke:var(--indigo);stroke-width:2px}.ease-plot .axis{stroke:var(--rule);stroke-width:1px}.ease-plot circle{fill:var(--brush)}.stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:22px 0;display:grid}.stat{border:1px solid var(--rule);background:var(--surface);border-radius:14px;padding:14px 16px}.stat b{font:700 28px/1.1 var(--font-display);font-variant-numeric:tabular-nums;display:block}.stat span{font:400 12px/1.4 var(--font-mono);color:var(--muted)}.end-note{border-top:1px dashed var(--rule);font:400 14px/1.6 var(--font-mono);color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:16px;margin-top:56px;padding-top:22px;display:flex}@media (width<=760px){body{font-size:16px}.scrolly-wrap,.map-wrap{grid-template-columns:minmax(0,1fr)}.side{border-left:0;border-top:1px solid var(--rule)}.stats{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}#brushStage{height:300px}.demo{border-radius:18px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}.prose>*{max-width:680px;margin-left:auto;margin-right:auto}.prose>.demo{max-width:900px}.sea-stage{height:250px;overflow:hidden}.sea-stage .wave,.sea-stage canvas{width:100%;height:100%;position:absolute;inset:0}#seaWash{opacity:var(--wash-depth,.85)}.mon-stage{height:240px;overflow:hidden}.mon-stage i{outline:2px dashed var(--paper);outline-offset:-1px;box-shadow:0 0 0 999px color-mix(in srgb, var(--paper) 50%, transparent);position:absolute}.mon-seg{flex-wrap:wrap;flex:100%}.mon-seg button{flex:auto}.rp-stage{padding:clamp(14px,3vw,28px)}.rp-card{border:1px solid var(--rule);background:var(--surface);border-radius:16px;padding:30px clamp(18px,3vw,28px);overflow:hidden}.rp-card p{max-width:34em;margin:0;font-size:16px;line-height:1.6}.read-bar{z-index:19;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + 59px);pointer-events:none;height:3px;position:fixed}.read-bar i{background:var(--indigo);transform-origin:0;height:100%;display:block;transform:scaleX(0)}.rail{z-index:18;right:max(14px, env(safe-area-inset-right,0px));bottom:max(14px, env(safe-area-inset-bottom,0px));opacity:0;visibility:hidden;transition:opacity .35s,transform .35s,visibility 0s .35s;position:fixed;transform:translateY(6px)}.rail.on{opacity:1;visibility:visible;transition:opacity .35s,transform .35s,visibility;transform:none}.rail-ring{border:1px solid var(--rule);background:var(--surface);width:58px;height:58px;color:var(--ink);font:500 11px/1 var(--font-mono);font-variant-numeric:tabular-nums;cursor:pointer;border-radius:50%;place-items:center;padding:0;transition:transform .2s;display:grid;position:relative;box-shadow:0 8px 22px -10px #00000080}.rail-ring:not(:disabled):active{transform:scale(.95)}.rail-ring canvas{pointer-events:none;width:calc(100% + 6px);height:calc(100% + 6px);inset:-3px}.rail-ring .ring-track{opacity:.22}.rail-ring .ring-fill{-webkit-mask-image:linear-gradient(#0000,#0000);mask-image:linear-gradient(#0000,#0000)}.rail-ring.done{color:var(--indigo)}.rail-panel{border:1px solid var(--rule);background:var(--surface);visibility:hidden;clip-path:circle(0 at calc(100% - 29px) calc(100% + 39px));border-radius:20px;grid-template-columns:11px minmax(0,1fr);column-gap:12px;width:min(290px,100vw - 28px);max-height:calc(100dvh - 170px);padding:16px 18px;transition:clip-path .28s cubic-bezier(.4,0,.6,1),visibility 0s .28s;display:grid;position:absolute;bottom:68px;right:0;overflow-y:auto;box-shadow:0 14px 34px -14px #00000080}.rail.open .rail-panel{visibility:visible;clip-path:circle(150% at calc(100% - 29px) calc(100% + 39px));transition:clip-path .42s cubic-bezier(.2,.7,.3,1),visibility}.rail-track{background:var(--rule);border-radius:2px;width:2px;margin-left:4.5px;position:relative}.rail-track i{background:var(--indigo);border-radius:2px;width:100%;height:0;position:absolute;top:0;left:0}.rail ol{font:400 13.5px/1.4 var(--font-mono);gap:2px;margin:0;padding:0;list-style:none;display:grid}.rail li{position:relative}.rail li:before{content:"";border:1.5px solid var(--rule);background:var(--surface);border-radius:50%;width:7px;height:7px;transition:background .25s,border-color .25s;position:absolute;top:11px;left:-23px}.rail li.reached:before{background:var(--indigo);border-color:var(--indigo)}.rail a{color:var(--muted);padding:7px 0;text-decoration:none;transition:color .2s;display:block}.rail a:hover{color:var(--indigo)}.rail a[aria-current]{color:var(--ink);font-weight:500}.ring-badge{border:1px solid var(--rule);background:var(--surface);width:22px;height:22px;color:var(--indigo);border-radius:50%;place-items:center;display:grid;position:absolute;top:-4px;left:-4px;box-shadow:0 2px 6px -2px #0006}.ring-badge svg{width:12px;height:12px}.ring-badge path{transition:opacity .2s}.i-close,.rail.open .i-list{opacity:0}.rail.open .i-close{opacity:1}.ring-hint{border:1px solid var(--rule);background:var(--surface);color:var(--ink);font:500 12.5px/1 var(--font-mono);white-space:nowrap;opacity:0;transform-origin:100%;pointer-events:none;border-radius:99px;padding:9px 12px;transition:opacity .3s,transform .3s;position:absolute;top:50%;right:calc(100% + 10px);transform:translate(10px)scale(.92);box-shadow:0 8px 22px -10px #00000080}.rail-ring.hint .ring-hint{opacity:1;transition:opacity .35s .45s,transform .45s cubic-bezier(.3,1.3,.5,1) .45s;transform:none}.rail-ring.hint{animation:.7s .45s ring-nudge}@keyframes ring-nudge{35%{scale:1.1}70%{scale:.97}}@media (width>=1240px) and (height>=620px){.read-bar{display:none}.rail{z-index:10;flex-direction:column;gap:14px;width:clamp(146px,50vw - 478px,206px);display:flex;inset:96px auto auto max(14px,50vw - 684px);transform:translate(-6px)}.ring-hint,.ring-badge{display:none}.rail-ring{box-shadow:none;cursor:default;color:var(--muted);background:0 0;border:0;order:2}.rail-panel{width:auto;max-height:none;box-shadow:none;visibility:inherit;clip-path:none;background:0 0;border:0;border-radius:0;padding:0;transition:none;position:static;overflow:visible}.rail ol{gap:4px;font-size:12px}.rail li:before{background:var(--paper);top:6px}.rail a{padding:2px 0}}@media (prefers-reduced-motion:reduce){.rail-ring.hint{animation:none}.rail,.rail.on,.rail-ring,.ring-hint,.rail-ring.hint .ring-hint,.ring-badge path,.rail-panel,.rail.open .rail-panel,.rail li:before,.rail a{transition:none}}