verso-story{--story-length: calc(100svh + var(--steps) * 50svh);--gutter: 1rem}@media(min-width:640px){verso-story{--gutter: 1.5rem}}@media(min-width:1024px){verso-story{--gutter: 2rem}}@media(prefers-reduced-motion:no-preference){verso-story{margin-top:-3.5rem;pointer-events:none}}@media(prefers-reduced-motion:no-preference)and (min-width:1024px){verso-story{margin-top:min(-3.5rem,calc((28rem - 100svh)/2 + 2.5rem))}}.story{position:relative;width:100%;height:var(--story-length);pointer-events:none}.story-stage{--handoff: 1;--progress: 0;--mx: 0;--my: 0;--ms: 64;--tx: 0;--ty: 0;--tw: 0;--th: 0;--k: calc(1 - (1 - var(--handoff)) * (1 - var(--handoff)));--kr: calc(var(--handoff) * var(--handoff) * (3 - 2 * var(--handoff)));--u: calc(var(--ms) / 64);--s-flip: clamp(0, (var(--progress) - .111) / .133, 1);--s-got: clamp(0, (var(--progress) - .333) / .178, 1);--s-again: clamp(0, (var(--progress) - .578) / .178, 1);--s-summary: clamp(0, (var(--progress) - .822) / .111, 1);--s-press: clamp(0, (var(--progress) - .933) / .067, 1);--e-flip: calc(var(--s-flip) * var(--s-flip) * (3 - 2 * var(--s-flip)));--e-got: calc(var(--s-got) * var(--s-got) * (3 - 2 * var(--s-got)));--e-again: calc(var(--s-again) * var(--s-again) * (3 - 2 * var(--s-again)));--e-summary: calc( var(--s-summary) * var(--s-summary) * (3 - 2 * var(--s-summary)) );position:sticky;top:0;z-index:10;display:grid;grid-template-rows:auto minmax(0,1fr);gap:.75rem;height:100svh;margin-inline:calc(-1 * var(--gutter));padding:5.25rem var(--gutter) 1rem;overflow-x:clip}.story-nav a{pointer-events:auto}@media(min-width:1024px){.story-stage{grid-template-rows:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-content:center;align-items:start;gap:3rem;padding-top:5rem}}.story-nav ol{display:flex;flex-wrap:wrap;gap:.375rem;margin-top:1rem}.story-nav a{display:inline-flex;align-items:center;gap:.4rem;border-radius:999px;padding:.25rem .7rem .25rem .25rem;background:var(--card-chip);font-size:.8rem;font-weight:500;color:var(--color-zinc-700);transition:background-color .2s ease,color .2s ease}.story-nav a:hover{background:var(--card-chip-hover)}.story-nav a:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.story-nav-number{display:grid;place-items:center;width:1.4rem;height:1.4rem;border-radius:999px;background:var(--card-chip);font-family:var(--font-mono);font-size:.7rem}.story-nav a[aria-current]{background:var(--color-primary-600);color:var(--color-primary-50)}.story-nav a[aria-current] .story-nav-number{background:#fff3}[data-color-mode=dark] .story-nav a{color:var(--color-zinc-300)}[data-color-mode=dark] .story-nav a[aria-current]{background:var(--color-primary-400);color:var(--color-primary-950)}@media(max-width:639px){.story .story-nav a:not([aria-current]){padding-right:.25rem}.story .story-nav a:not([aria-current]) .story-nav-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}.story-captions{display:grid;margin-top:.875rem}.story-captions li{grid-area:1 / 1;opacity:0;transition:opacity .2s ease}.story-captions li[aria-current]{opacity:1}.story-captions strong{display:block;font-weight:600}.story-captions span{color:var(--color-zinc-600);text-wrap:pretty}[data-color-mode=dark] .story-captions span{color:var(--color-zinc-400)}@media(min-width:1024px){.story-captions{margin-top:1.5rem;font-size:1.125rem}.story-captions strong{font-size:1.25rem}}.story-table{display:grid;place-items:center;min-height:0}.story-slot{width:min(19rem,72vw,calc((100svh - 21rem) * 63 / 88));aspect-ratio:63 / 88}@media(min-width:1024px){.story-slot{width:min(20rem,calc((100svh - 9rem) * 63 / 88))}}.twin-card{--w0: calc(19 * var(--u));--h0: calc(42 * var(--u));--w: calc(var(--w0) + (var(--tw) - var(--w0)) * var(--k));--h: calc(var(--h0) + (var(--th) - var(--h0)) * var(--k));--x0: calc(var(--mx) + var(--cx) * var(--u));--y0: calc(var(--my) + var(--cy) * var(--u));--x1: calc(var(--tx) + var(--tw) / 2);--y1: calc(var(--ty) + var(--th) / 2);position:absolute;top:0;left:0;width:calc(var(--w) * 1px);height:calc(var(--h) * 1px);border-radius:calc((5.5 * var(--u) + (24 - 5.5 * var(--u)) * var(--k)) * 1px);opacity:clamp(0,var(--handoff) / .04,1);transform:translate(calc((var(--x0) + (var(--x1) - var(--x0)) * var(--k) - var(--w) / 2) * 1px),calc((var(--y0) + (var(--y1) - var(--y0)) * var(--k) - var(--h) / 2) * 1px)) rotate(calc(var(--r0) * (1 - var(--kr)) * 1deg));visibility:hidden;pointer-events:none}.story-stage.is-measured .twin-card{visibility:visible}.twin-amber{--cx: 24.68;--cy: 31.56;--r0: -24;--paint-from: #fcc94e;--paint-to: #d97706;--paint-gloss: rgba(255, 255, 255, .55);--paint-edge: rgba(255, 255, 255, .75);z-index:1}.twin-teal{--cx: 39.32;--cy: 31.56;--r0: 24;--paint-from: #3fdcc6;--paint-to: #0d9488;--paint-gloss: rgba(255, 255, 255, .55);--paint-edge: rgba(255, 255, 255, .75);z-index:2}[data-color-mode=dark] .twin-amber{--paint-from: #fde68a;--paint-to: #f59e0b;--paint-gloss: rgba(255, 255, 255, .45);--paint-edge: rgba(255, 255, 255, .5)}[data-color-mode=dark] .twin-teal{--paint-from: #5eead4;--paint-to: #14b8a6;--paint-gloss: rgba(255, 255, 255, .45);--paint-edge: rgba(255, 255, 255, .5)}.twin-motion,.twin-flip{position:absolute;inset:0;border-radius:inherit}.twin-motion{perspective:1200px}.twin-flip{transform:rotateY(calc(var(--e-flip) * 180deg));transform-style:preserve-3d}.twin-card .study-face{transition:none}.twin-teal .study-face{background-color:color-mix(in srgb,var(--card-base) calc(clamp(0,var(--s-got) * 10,1)*100%),transparent)}.twin-paint{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,var(--paint-gloss),transparent 48%),linear-gradient(150deg,var(--paint-from),var(--paint-to));box-shadow:inset 0 0 0 1px var(--paint-edge);opacity:calc(1 - clamp(0,(var(--handoff) - .7) / .28,1))}.twin-teal .twin-motion{--swipe-got: clamp(0, var(--s-got) * 2.5, 1);opacity:calc(1 - clamp(0,(var(--s-got) - .5) * 2,1));transform:translate(calc(var(--e-got) * 140%)) rotate(calc(var(--e-got) * 14deg))}.twin-amber .twin-motion{--swipe-again: clamp(0, var(--s-again) * 2.5, 1);opacity:calc(1 - clamp(0,(var(--s-again) - .5) * 2,1));transform:translate(calc(var(--e-again) * -140%)) rotate(calc(var(--e-again) * -14deg))}.story-ghost{--slot: calc(clamp(0, var(--s-again) * 2.5, 1)*clamp(0, (1 - var(--s-again)) * 20, 1)) ;inset:auto;top:calc(var(--ty) * 1px);left:calc(var(--tx) * 1px);width:calc(var(--tw) * 1px);height:calc(var(--th) * 1px);border-radius:24px;visibility:hidden}.story-stage.is-measured .story-ghost{visibility:visible}.twin-amber .study-face>*{opacity:var(--e-got)}.story-hand{--a: calc(var(--progress));--flip-shown: calc(clamp(0, (var(--a) - .06) / .025, 1)*(1 - clamp(0, (var(--a) - .17) / .03, 1))) ;--flip-press: calc(clamp(0, (var(--a) - .1) / .005, 1)*(1 - clamp(0, (var(--a) - .125) / .005, 1))) ;--got-span: calc(1 - clamp(0, (var(--a) - .52) / .005, 1)) ;--got-shown: calc(clamp(0, (var(--a) - .29) / .025, 1)*(1 - clamp(0, (var(--s-got) - .25) / .2, 1))) ;--got-press: calc( clamp(0, (var(--a) - .322) / .004, 1) * var(--got-span) );--again-shown: calc(clamp(0, (var(--a) - .535) / .025, 1)*(1 - clamp(0, (var(--s-again) - .25) / .2, 1))) ;--again-press: clamp(0, (var(--a) - .567) / .004, 1);--closed: clamp( 0, var(--flip-press) + var(--got-press) + var(--again-press), 1 );--pull: calc( var(--e-got) * var(--got-span) - var(--e-again) * (1 - var(--got-span)) );position:absolute;top:calc((var(--ty) + var(--th) * .72) * 1px);left:calc((var(--tx) + var(--tw) * .66) * 1px);z-index:3;display:none;width:1.75rem;height:1.75rem;opacity:calc(.92 * (var(--flip-shown) + var(--got-shown) + var(--again-shown)));filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.35));transform:translate(calc(var(--pull) * 1.4 * var(--tw) * 1px)) rotate(calc(var(--pull) * 14deg)) scale(calc(1 - .12 * var(--flip-press)));pointer-events:none}@media(hover:hover)and (pointer:fine)and (prefers-reduced-motion:no-preference){.story-stage.is-measured .story-hand{display:block}}.story-hand-outline{fill:#111;stroke:#111;stroke-width:2.4;stroke-linejoin:round}.story-hand-fill{fill:#fff}.story-hand-open{opacity:calc(1 - var(--closed))}.story-hand-closed{opacity:var(--closed)}.story-summary{position:absolute;top:calc(var(--ty) * 1px);left:calc(var(--tx) * 1px);width:calc(var(--tw) * 1px);height:calc(var(--th) * 1px);border-radius:24px;font-size:calc(min(var(--tw) / 21,var(--th) / 29.5)*1px);opacity:var(--e-summary);visibility:hidden;pointer-events:none}.story-stage.is-measured .story-summary{visibility:visible}.story-summary .demo-review{transform:scale(calc(1 - .04 * var(--s-press)));box-shadow:0 0 0 calc(var(--s-press) * 5px) color-mix(in oklch,var(--color-primary-500) 35%,transparent)}.story-static{position:absolute;inset:0;visibility:hidden;pointer-events:none}.story-static>div{display:none}.story-static-row>li{position:absolute;top:calc(var(--at) * (var(--story-length) - 100svh));left:0;width:1px;height:1px;overflow:hidden;scroll-margin-top:0}@media(prefers-reduced-motion:reduce){.story{display:none}.story-static{position:static;visibility:visible;pointer-events:auto}}.story-static[style],.story-static{flex-direction:column;gap:1.5rem}@media(prefers-reduced-motion:reduce){.story-static{display:flex}.story-static>div{display:block}.story-static-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 1rem}.story-static-row>li{position:static;display:flex;flex-direction:column;gap:1rem;width:auto;height:auto;overflow:visible;scroll-margin-top:6rem}}@media(prefers-reduced-motion:reduce)and (min-width:768px){.story-static-row{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce)and (min-width:1280px){.story-static-row{grid-template-columns:repeat(5,minmax(0,1fr))}}.story-static-row>li>p{color:var(--color-zinc-600);text-wrap:pretty}.story-static-row strong{color:var(--color-zinc-950);font-weight:600}[data-color-mode=dark] .story-static-row>li>p{color:var(--color-zinc-400)}[data-color-mode=dark] .story-static-row strong{color:var(--color-zinc-50)}.story-mini{position:relative;width:min(100%,11rem);aspect-ratio:63 / 88}.story-mini .study-face,.story-mini .study-verdict{border-radius:1rem}.story-mini .study-verdict{padding:2.25rem .5rem}.story-mini-summary{border-radius:1rem;font-size:.55rem}.story-mini .study-verdict span{padding:.15rem .5rem;font-size:.7rem}.hero-v[data-astro-cid-j7pv25f6]{display:inline-block;width:1.4em;height:1.4em;margin-inline:-.17em -.14em;vertical-align:-.217em}.hero-v[data-astro-cid-j7pv25f6] img[data-astro-cid-j7pv25f6]{width:100%;height:100%}.hero[data-astro-cid-j7pv25f6]{min-height:calc(100svh - 5.25rem)}@media(min-width:640px){.hero[data-astro-cid-j7pv25f6]{min-height:calc(100svh - 5.75rem)}}@media(min-width:1024px){.hero[data-astro-cid-j7pv25f6]{min-height:calc(100svh - 6.25rem)}}.hero-cue[data-astro-cid-j7pv25f6]{animation:hero-cue 2.4s ease-in-out infinite}@keyframes hero-cue{50%{translate:0 3px}}
