@layer reset,base,layout,components,writing,reader,type,motion,print;@layer reader{.fig{margin-block:2.4em;padding-block:1rem 0;border-top:var(--hair) solid var(--ink-3)}.piece-text>figure.fig.wide{--figure: min(56rem, 100cqi);inline-size:var(--figure);margin-inline:calc((100% - var(--figure)) / 2)}.image-hero>figure.fig{inline-size:min(56rem,100%);margin:0 auto}:is(.entry,.card) .fig-thumb{display:block;overflow:hidden;filter:none;background:var(--paper)}.fig-thumb svg{display:block;inline-size:100%;block-size:100%}.card .fig-thumb svg{block-size:auto}.fig figcaption{margin-top:.9rem;color:var(--ink-2);text-align:center;text-wrap:balance}.fig :is(ol,ul){margin:0;padding:0;list-style:none}.fig li,.fig li+li{margin:0}:where(.fig) button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;border-radius:var(--radius)}:where(.fig) :is(button,input):focus-visible{outline:var(--hair) solid var(--accent);outline-offset:3px}.fig-play{color:var(--accent-ink)}.fig-play:hover{color:var(--accent)}.fig-pill{padding:.55rem .95rem;border:var(--hair) solid var(--accent);border-radius:2rem;color:var(--accent-ink)}.fig-pill:hover{background:color-mix(in oklab,var(--accent) 10%,transparent)}.fig-pill:disabled{border-color:var(--line);color:var(--ink-3);cursor:default;background:none}.fig-views{display:inline-flex;gap:.2rem;padding:.2rem;border:var(--hair) solid var(--line);border-radius:2rem}.fig-views button{padding:.4rem .9rem;border-radius:2rem;color:var(--ink-2);transition:background-color .2s ease,color .2s ease}.fig-views button:hover{color:var(--ink)}.fig-views [aria-pressed=true]{background:var(--ink);color:var(--paper)}.switch{display:inline-flex;align-items:center;gap:.6rem;color:var(--ink-2);cursor:pointer}.switch input{appearance:none;inline-size:2.4rem;block-size:1.35rem;margin:0;border-radius:1rem;background:var(--line);position:relative;cursor:pointer;transition:background-color .2s ease}.switch input:after{content:"";position:absolute;inset:.18rem auto .18rem .18rem;inline-size:1rem;border-radius:50%;background:var(--paper);transition:translate .22s cubic-bezier(.2,.7,.2,1)}.switch input:checked{background:var(--accent)}.switch input:checked:after{translate:1.05rem 0}.fig-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.6rem 1.4rem;margin-top:.6rem}.fig-controls input[type=range]{inline-size:100%;accent-color:var(--accent)}.fig-numbers{margin-top:.8rem;color:var(--ink-2)}.fig-numbers summary{cursor:pointer}.fig-numbers table{margin-top:.6rem;inline-size:auto}.fig-small{color:var(--ink-2)}.fig-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1.5rem}.fig-read{flex:1 1 18rem;min-block-size:3em;margin:0;color:var(--ink)}.fig-key{display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;color:var(--ink-2)}.fig-key li{display:inline-flex;align-items:center;gap:.4rem;cursor:default}.fig-key i{inline-size:.8rem;block-size:.8rem;border-radius:2px}.fig .plot{display:block;inline-size:100%;block-size:auto;margin-top:.4rem;overflow:visible;touch-action:pan-y}.fig .plot .grid{stroke:var(--line);stroke-width:1}.fig .plot .axis{stroke:var(--ink-3);stroke-width:1.2}.fig .plot :is(.tick,.axis-label){fill:var(--ink-2)}.fig .plot .cursor{stroke:var(--ink-3);stroke-dasharray:2 3;opacity:0}.fig.pointing .plot .cursor{opacity:1}.fig[data-pick] [data-pick-of]{opacity:.22;transition:opacity .2s ease}.fig[data-pick="0"] [data-pick-of="0"],.fig[data-pick="1"] [data-pick-of="1"],.fig[data-pick="2"] [data-pick-of="2"],.fig[data-pick="3"] [data-pick-of="3"],.fig[data-pick="4"] [data-pick-of="4"]{opacity:1}@media(prefers-reduced-motion:reduce){.fig *,.fig *:before,.fig *:after{transition-duration:0s!important;transition-delay:0s!important;animation:none!important}}}@layer type{:where(.fig-display){font-family:var(--font-display);font-size:var(--t-d3);font-weight:300;line-height:1;font-variant-numeric:oldstyle-nums}.fig .plot :is(.tick,.axis-label){font:400 13px var(--font-text);font-variant-numeric:lining-nums tabular-nums}@media(width<40rem){.fig .plot :is(.tick,.axis-label){font-size:22px}}}

@layer reset,base,layout,components,writing,reader,type,motion,print;@layer reader{.bubbles .dot{stroke:var(--paper);stroke-width:.8;transition:opacity .4s ease}.bubbles :is(.dot,.fig-key i).c0{fill:color-mix(in oklab,var(--ink) 32%,var(--paper));background:color-mix(in oklab,var(--ink) 32%,var(--paper))}.bubbles :is(.dot,.fig-key i).c1{fill:var(--accent);background:var(--accent)}.bubbles .fig-key i{border-radius:50%}.bubbles[data-step="1"] .dot:not(.s1),.bubbles[data-step="2"] .dot:not(.s2),.bubbles[data-step="3"] .dot:not(.s3){opacity:.14}.bubbles .plot .near{fill:none;stroke:var(--ink);stroke-width:1.5;opacity:0}.bubbles.pointing .plot .near{opacity:1}.bubbles-story{display:grid;gap:.35rem;margin-top:.8rem;counter-reset:step}.bubbles-story li{counter-increment:step;display:grid;grid-template-columns:1.6rem minmax(0,1fr);color:var(--ink-2)}.bubbles-story li:before{content:counter(step);color:var(--accent-ink)}.bubbles-story button{text-align:start;color:inherit;transition:color .2s ease}.bubbles-story button:hover,.bubbles-story [aria-pressed=true]{color:var(--ink)}}

@layer reset,base,layout,components,writing,reader,type,motion,print;@layer reader{.drawn-cloth{--m1: var(--d1);--m2: var(--d2);--m3: var(--d3);--m4: var(--d4);--cloth: color-mix(in oklab, var(--ink) 9%, transparent);position:relative;inline-size:min(100%,calc(85svh * var(--across) / var(--rows)));aspect-ratio:var(--across) / var(--rows);margin-inline:auto;background-color:var(--paper);background-image:linear-gradient(to right,var(--cloth) 1px,transparent 1px),linear-gradient(to bottom,var(--cloth) 1px,transparent 1px);background-size:calc(100% / var(--across)) calc(100% / var(--rows))}.image-frame>.drawn-cloth{inline-size:min(100%,calc((100svh - 10rem) * var(--across) / var(--rows)))}:is(.entry,.card) .thumb-drawn{position:relative;display:block;overflow:hidden;filter:none}.entry .thumb-drawn>.drawn-cloth{position:absolute;inset-block-start:50%;inset-inline-start:50%;translate:-50% -50%;inline-size:max(100%,calc(100% * var(--across) / var(--rows)))}.card .thumb-drawn>.drawn-cloth{display:block;inline-size:100%}.drawn-beside{display:block;float:left;inline-size:min(40%,18rem);margin:.35em 1.25rem .5rem 0}p:has(>.drawn-beside:first-child){display:flow-root}.drawn-cloth>span{position:absolute;inset:0;-webkit-mask:var(--m) 0 0 / 100% 100% no-repeat;mask:var(--m) 0 0 / 100% 100% no-repeat;-webkit-print-color-adjust:exact;print-color-adjust:exact}.drawn-1{--m: var(--m1);background:color-mix(in oklab,var(--accent) 28%,var(--paper))}.drawn-2{--m: var(--m2);background:color-mix(in oklab,var(--accent) 60%,var(--paper))}.drawn-3{--m: var(--m3);background:var(--accent)}.drawn-4{--m: var(--m4);background:var(--ink)}.figure.emblem{display:grid;justify-items:center;gap:.55rem;text-align:center}.figure.emblem .drawn-cloth{inline-size:min(100%,30rem,calc(60svh * var(--across) / var(--rows)))}.figure.emblem.image-frame .drawn-cloth{inline-size:min(100%,40rem,calc((100svh - 18rem) * var(--across) / var(--rows)))}.emblem-motto{margin:0 0 .3rem;max-inline-size:34rem;color:var(--accent-ink)}.emblem-gloss{margin:.5rem 0 0;max-inline-size:34rem;color:var(--ink)}.emblem-source{margin:0;color:var(--ink-2)}.emblem-meme{margin:.35rem 0 0;max-inline-size:30rem;color:var(--ink-2)}:root[data-theme=night] .drawn-cloth{--m1: var(--n1);--m2: var(--n2);--m3: var(--n3);--m4: var(--n4)}@media(prefers-color-scheme:dark){:root:not([data-theme=paper],[data-theme=sepia]) .drawn-cloth{--m1: var(--n1);--m2: var(--n2);--m3: var(--n3);--m4: var(--n4)}}}@layer type{:where(.emblem-gloss){font-family:var(--font-display);font-size:var(--t-d6);font-style:italic;font-weight:400;line-height:1.3}:where(.emblem-meme b){font-weight:500;letter-spacing:var(--track-caps);text-transform:uppercase;font-size:.85em}}

@layer reset,base,layout,components,writing,reader,type,motion,print;@layer reader{.regions .divide{fill:none;stroke:var(--accent);stroke-width:3;stroke-dasharray:2 6;stroke-linecap:round}.regions .axis{stroke:var(--ink);stroke-width:1.6}.regions .axis-name{fill:var(--ink)}.regions .side{fill:var(--ink-2)}.regions.succeeds .side.succeed,.regions:not(.succeeds) .side.fail{fill:var(--accent-ink)}.regions .example circle{fill:var(--ink-3)}.regions .example text{fill:var(--ink-2)}.regions .probe{fill:var(--accent);stroke:var(--paper);stroke-width:3;cursor:grab;outline:none}.regions .probe:focus-visible{stroke:var(--ink)}.regions .plot{touch-action:none;cursor:crosshair}}@layer type{.regions .axis-name{font:600 15px var(--font-text);letter-spacing:.14em;text-transform:uppercase}.regions .side{font:italic 400 21px var(--font-display)}.regions .example text{font:400 13px var(--font-text)}@media(width<40rem){.regions .axis-name{font-size:24px}.regions .side{font-size:30px}.regions .example text{font-size:19px}}}

@layer reset,base,layout,components,writing,reader,type,motion,print;@layer reader{.routes .edge{--d: 0;fill:none;stroke:var(--ink-2);stroke-width:1.5;transition:opacity .45s ease calc(var(--d) * .38s),stroke .2s ease}.routes .edge.back{stroke:var(--accent);stroke-dasharray:2 6;stroke-linecap:round;stroke-width:2}.routes .head path{fill:none;stroke:var(--ink-2);stroke:context-stroke;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.routes.drawing .edge{opacity:0}.routes .node{outline:none;cursor:default}.routes .node circle{fill:var(--paper);stroke:var(--ink);stroke-width:2;transition:fill .2s ease}.routes .plot .node text{fill:var(--ink);stroke:var(--paper);stroke-width:5px;stroke-linejoin:round;paint-order:stroke}.routes .node:is(.on,:focus-visible) circle{fill:var(--accent);stroke:var(--accent)}.routes.tracing .edge:not(.lit){opacity:.18;transition-delay:0s}.routes .edge.lit{stroke:var(--accent);transition-delay:0s}.routes .node.lit circle{fill:var(--accent);stroke:var(--accent)}.routes .mark{outline:none;cursor:default}.routes .mark circle{fill:var(--paper);stroke:var(--accent);stroke-width:2;transition:fill .2s ease}.routes .plot .mark text{fill:var(--accent-ink);transition:fill .2s ease}.routes .mark:is(.on,:focus-visible) circle{fill:var(--accent)}.routes .plot .mark:is(.on,:focus-visible) text{fill:var(--paper)}}@layer type{.routes .plot .node text{font:400 14px var(--font-text);letter-spacing:.01em}.routes .plot .mark text{font:600 14px var(--font-text)}@media(width<40rem){.routes .plot .node text{font-size:22px}.routes .plot .mark text{font-size:18px}}}

@layer reset,base,layout,components,writing,reader,type,motion,print;@layer reader{.piece-text>.figure.screenshot{--figure: min(56rem, 100cqi);inline-size:var(--figure);margin-inline:calc((100% - var(--figure)) / 2)}.figure.screenshot .glass{position:relative;isolation:isolate;display:block;inline-size:min(100%,var(--shot-width),calc((100svh - 8rem) * var(--shot-ratio)));margin-inline:auto;border-radius:6px;overflow:hidden;box-shadow:0 0 0 1px color-mix(in oklab,var(--ink) 16%,transparent),0 2px 6px color-mix(in oklab,var(--ink) 10%,transparent)}:is(.piece-text,.image-hero) .figure.screenshot .glass img{inline-size:100%;max-inline-size:none;max-block-size:none;border-radius:0}.image-frame.screenshot .glass{inline-size:min(100%,var(--shot-width),calc((100svh - 10rem) * var(--shot-ratio)))}.figure.screenshot .glass:before,.figure.screenshot .glass:after{content:"";position:absolute;inset:0;pointer-events:none}.figure.screenshot .glass:before{background:color-mix(in oklab,var(--paper) 5%,transparent)}.figure.screenshot .glass:after{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='g' x='0' y='0'><feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='3' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='220' height='220' filter='url(%23g)'/></svg>");background-size:220px;mix-blend-mode:overlay;opacity:.12}}@layer print{@media print{.figure.screenshot .glass:before,.figure.screenshot .glass:after{display:none}}}