:root{--code-base:clamp(1.05rem, 1.6vw + .55rem, 2.25rem);--prose-base:calc(var(--code-base) * 1.15);--code-scale:1;--fit:1;--demo-code-size:calc(var(--code-base) * var(--code-scale) * var(--fit))}.slide--demo,.slide--demo *,.slide--demo :before,.slide--demo :after{box-sizing:border-box}.slide--demo{scroll-snap-align:start;scroll-snap-stop:always;background:var(--surface-1);grid-template-rows:1fr;block-size:100dvh;min-inline-size:100%;padding:0;display:grid;position:relative;overflow:hidden}.demo__stage{gap:var(--space-2xs);grid-template-rows:1fr;grid-template-columns:1fr;display:grid;overflow:hidden}.demo__code,.demo__live{min-block-size:0}.slide-deck[data-live=on][data-view=split] .demo__stage{grid-template-columns:1fr 1fr}@media (orientation:portrait){.slide-deck[data-live=on][data-view=split] .demo__stage{grid-template-rows:1fr 1fr;grid-template-columns:1fr}}.slide-deck[data-live=on][data-view=split][data-split=third] .demo__stage{grid-template-rows:1fr 2fr;grid-template-columns:1fr}.slide-deck[data-split=third] .demo__live{padding-block-start:0}.demo__code{padding:var(--space-s) var(--space-m);align-content:center;justify-items:center;display:grid}.demo__live{padding:var(--space-s) var(--space-m);display:grid;overflow:hidden}.slide-deck[data-live=off] .demo__live,.slide-deck[data-view=code] .demo__live,.slide-deck[data-live=on][data-view=live] .demo__code{display:none}@media (orientation:portrait){.demo__live{padding-block-start:0;padding-inline-start:var(--space-m)}}.demo__frames{inline-size:var(--live-w,100%);justify-self:start;block-size:100%;max-inline-size:100%;display:grid;position:relative}.demo__frame{border:1px solid var(--border-subtle);background:var(--surface-2);border-radius:.6rem;grid-area:1/1;block-size:100%;inline-size:100%;box-shadow:0 1.5rem 3rem -1rem #00000059}.demo__frame[hidden]{display:none}.demo__grip{inline-size:var(--space-2xs);cursor:ew-resize;touch-action:none;place-content:center;display:grid;position:absolute;inset-block:0;inset-inline-end:calc(var(--space-2xs) * -1)}.demo__grip:before{content:"";background:var(--border-default);border-radius:.35rem;block-size:4rem;inline-size:.35rem;transition:background .15s ease-out}.demo__grip:hover:before,.slide-deck[data-resizing] .demo__grip:before{background:var(--brand-blue)}.slide-deck[data-resizing] .demo__frame{pointer-events:none}.demo__step{align-content:center;justify-items:center;gap:var(--space-2xs);grid-area:1/1;inline-size:min(100%,1700px);display:grid;&:has(.demo__block~.demo__block){justify-content:center;justify-items:start}}.demo__step[hidden]{display:none}.demo__block{min-inline-size:0;max-inline-size:100%;display:grid}.demo__block--markup{opacity:.9}.slide-deck[data-split=third] .demo__step[data-blocks=markup\ code]{justify-content:center;align-items:start;gap:var(--space-s);grid-auto-columns:minmax(0,auto);grid-auto-flow:column}.demo__block--prose{--prose-size:calc(var(--prose-base) * var(--code-scale) * var(--fit));max-inline-size:min(100%,46ch);font-size:var(--prose-size);color:var(--text-primary);text-align:center;text-wrap:pretty;gap:.65em;line-height:1.35;display:grid}.demo__block--prose:has(img){block-size:100%;inline-size:100%;position:absolute;inset:0;& img{object-fit:cover;block-size:100svb;max-block-size:100svb;inline-size:100svi;max-inline-size:100svi}}.demo__block--prose :is(h1,h2,h3,h4,h5,h6){text-wrap:balance;margin:0;line-height:1.05}.demo__block--prose h1{font-size:2em}.demo__block--prose h2{font-size:1.5em}.demo__block--prose h3{font-size:1.2em}.demo__block--prose p{margin:0}.demo__block--prose :is(ul,ol,blockquote){text-align:start;justify-self:center;margin:0}.demo__block--prose :is(ul,ol){gap:.35em;padding-inline-start:1.1em;list-style:outside;display:grid}.demo__block--prose blockquote{border-inline-start:.1em solid var(--border-default);color:var(--text-secondary);padding-inline-start:.7em}.demo__block--prose img{justify-self:center;max-block-size:68svb;inline-size:auto}.demo__block--prose a{color:var(--brand-blue)}.demo__block--prose :not(pre)>code{background:var(--surface-3);font-family:var(--ff-code,monospace);border-radius:.25em;padding:.1em .3em;font-size:.85em}.demo__block--prose hr{border:0;border-block-start:.08em solid var(--border-subtle);inline-size:4em;margin:.3em auto}.slide--demo .expressive-code{inline-size:100%;min-inline-size:0}.slide--demo .expressive-code .frame pre{max-block-size:none}.slide--demo .demo__block pre.is-capped{scrollbar-width:thin;scrollbar-gutter:stable;scrollbar-color:var(--border-strong) transparent;overscroll-behavior:contain;overflow:hidden auto}.slide--demo .frame{inline-size:fit-content;min-inline-size:0;max-inline-size:100%;margin-inline:auto}.expressive-code pre{scrollbar-width:none}.expressive-code pre::-webkit-scrollbar{display:none}@keyframes deck-mark-in{0%{background-color:#0000}}@keyframes deck-fade-in{0%{opacity:0}}@keyframes deck-swap-in{0%{background-color:color-mix(in oklab, currentColor 20%, transparent)}}.ec-line.deck-mark-in,.ec-line.deck-mark-in :is(mark,ins,del){animation:1.2s ease-out deck-mark-in}.ec-line.deck-mark-in :is(mark,ins,del):before{animation:1.2s ease-out deck-fade-in}.ec-line.deck-swap-in{animation:1.2s ease-out deck-swap-in}@media (prefers-reduced-motion:reduce){.ec-line.deck-mark-in,.ec-line.deck-mark-in :is(mark,ins,del),.ec-line.deck-mark-in :is(mark,ins,del):before,.ec-line.deck-swap-in{animation:none}}.demo__baseline{inset:var(--baseline-inset-block,var(--space-2xl));gap:var(--space-xs);zoom:1.5;--baseline-size:calc(var(--code-base) * var(--code-scale) * .8);z-index:1;filter:drop-shadow(0 .4rem 1.2rem #00000047);block-size:min-content;inline-size:max-content;margin:auto;animation:.4s cubic-bezier(.2,.7,.3,1) both demo-baseline-in;display:flex;position:absolute}@keyframes demo-baseline-in{0%{opacity:0;transform:translateY(1.5rem)}}.slide-deck[data-anim=off] .demo__baseline{animation:none}@media (prefers-reduced-motion:reduce){.demo__baseline{animation:none}}.slide--demo[data-current] .demo__block--markup .frame{view-transition-name:deck-markup}.slide--demo[data-current] .demo__block--code .frame{view-transition-name:deck-code}.slide--demo[data-current] .demo__block--prose{view-transition-name:deck-prose}.slide--demo[data-current] .demo__live{view-transition-name:deck-live}::view-transition-new(deck-code):only-child,::view-transition-new(deck-markup):only-child{animation:.3s cubic-bezier(.2,.7,.3,1) deck-block-in}::view-transition-old(deck-code):only-child,::view-transition-old(deck-markup):only-child{animation:.2s ease-in both deck-block-out}@keyframes deck-block-in{0%{opacity:0;transform:translate(var(--block-enter-x,0), var(--block-enter-y,1.5rem))}}@keyframes deck-block-out{to{opacity:0;transform:translate(var(--block-enter-x,0), var(--block-enter-y,1.5rem))}}:root[data-split=third]::view-transition-new(deck-code):only-child,:root[data-split=third]::view-transition-old(deck-code):only-child{--block-enter-x:1.5rem;--block-enter-y:0}:root[data-split=third]::view-transition-new(deck-markup):only-child,:root[data-split=third]::view-transition-old(deck-markup):only-child{--block-enter-x:-1.5rem;--block-enter-y:0}::view-transition-new(deck-live):only-child{animation:.3s cubic-bezier(.2,.7,.3,1) deck-live-in}::view-transition-old(deck-live):only-child{animation:.2s ease-in both deck-live-out}@keyframes deck-live-in{0%{opacity:0;transform:translate(25%)}}@keyframes deck-live-out{to{opacity:0;transform:translate(25%)}}@media (orientation:portrait){@keyframes deck-live-in{0%{opacity:0;transform:translateY(25%)}}@keyframes deck-live-out{to{opacity:0;transform:translateY(25%)}}}:root[data-split=third]::view-transition-new(deck-live):only-child{animation-name:deck-live-stack-in}:root[data-split=third]::view-transition-old(deck-live):only-child{animation-name:deck-live-stack-out}@keyframes deck-live-stack-in{0%{opacity:0;transform:translateY(25%)}}@keyframes deck-live-stack-out{to{opacity:0;transform:translateY(25%)}}html,body{background:var(--surface-1);height:100dvh;margin:0;padding:0;overflow:hidden}.slide-deck[data-astro-cid-l33geecl]{scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;grid-auto-columns:100%;grid-auto-flow:column;height:100dvh;display:grid;overflow:auto hidden}.slide-deck[data-astro-cid-l33geecl]::-webkit-scrollbar{display:none}.slide-nav[data-astro-cid-l33geecl]{bottom:calc(var(--space-xl));align-items:center;gap:var(--space-m);background:oklch(from var(--surface-2) l c h / .75);padding:var(--space-2xs) var(--space-xs);border:1px solid var(--border-subtle);z-index:100;font-family:var(--ff-code);font-size:var(--fs--1);border-radius:100px;display:flex;position:fixed;left:50%;translate:-50%}.slide-nav-btn[data-astro-cid-l33geecl]{color:var(--text-primary);cursor:pointer;aspect-ratio:1;background:0 0;border:none;border-radius:50%;place-items:center;transition:background-color .2s,opacity .2s;display:grid}.slide-nav-btn[data-astro-cid-l33geecl]:hover:not(:disabled){background:var(--surface-3)}.slide-nav-btn[data-astro-cid-l33geecl]:disabled{opacity:.3;cursor:not-allowed}.slide-counter[data-astro-cid-l33geecl]{text-align:center;min-width:4ch}.slide-progress[data-astro-cid-l33geecl]{bottom:calc(var(--space-m));gap:var(--space-2xs);z-index:100;display:flex;position:fixed;left:50%;translate:-50%}.slide-dot{background:var(--surface-4);cursor:pointer;border:none;border-radius:50%;width:8px;height:8px;padding:0;transition:background-color .2s,transform .2s}.slide-dot:hover{background:var(--text-muted)}.slide-dot.active{background:var(--accent);transform:scale(1.25)}.slide a:has(pre){text-decoration:none}.slide a:has(pre):is(:hover,:focus-visible){text-decoration:underline}@media (width<=768px){.slide-nav[data-astro-cid-l33geecl]{bottom:var(--space-s);padding:var(--space-2xs) var(--space-s)}.slide-progress[data-astro-cid-l33geecl]{bottom:calc(var(--space-s) + 50px)}}@container (width<400px){.slide-progress[data-astro-cid-l33geecl]:has(.slide-dot:nth-child(11)){display:none}}.slide-deck[data-astro-cid-l33geecl].hide-nav .slide-nav[data-astro-cid-l33geecl],.slide-deck[data-astro-cid-l33geecl].hide-nav .slide-progress[data-astro-cid-l33geecl]{opacity:0;pointer-events:none}.slide-nav[data-astro-cid-l33geecl],.slide-progress[data-astro-cid-l33geecl]{transition:opacity .3s}::view-transition-old(root),::view-transition-new(root){animation-duration:.4s;animation-timing-function:ease-in-out}:root[data-slide-transition=slide-up]::view-transition-old(root){animation:.5s ease-in-out vt-slide-out-up}:root[data-slide-transition=slide-up]::view-transition-new(root){animation:.5s ease-in-out vt-slide-in-up}:root[data-slide-transition=slide-down]::view-transition-old(root){animation:.5s ease-in-out vt-slide-out-down}:root[data-slide-transition=slide-down]::view-transition-new(root){animation:.5s ease-in-out vt-slide-in-down}:root[data-slide-transition=zoom]::view-transition-old(root){animation:.25s ease-in-out vt-zoom-in}:root[data-slide-transition=zoom]::view-transition-new(root){animation:.25s ease-in-out vt-zoom-out}:root[data-slide-transition=none]::view-transition-old(root),:root[data-slide-transition=none]::view-transition-new(root){animation:none}@keyframes vt-slide-out-up{to{transform:translateY(-100%)}}@keyframes vt-slide-in-up{0%{transform:translateY(100%)}}@keyframes vt-slide-out-down{to{transform:translateY(100%)}}@keyframes vt-slide-in-down{0%{transform:translateY(-100%)}}@keyframes vt-zoom-out{0%{opacity:0;transform:scale(.8)}}@keyframes vt-zoom-in{to{opacity:0;transform:scale(1.2)}}.slide[data-astro-cid-e2arjyk2]{scroll-snap-align:start;scroll-snap-stop:always;min-width:100%;height:100dvh;padding:var(--space-s-xl);box-sizing:border-box;container-type:inline-size scroll-state;place-items:center;display:grid;position:relative}.slide-content[data-astro-cid-e2arjyk2]{--slide-fs-base:clamp(1.5rem, 3cqi, var(--fs-3));--slide-fs-h1:calc(var(--fs-5) * 1.5);--slide-fs-h2:clamp(2rem, 10cqi, calc(var(--fs-5) * 1.25));--slide-fs-h3:var(--fs-4);--slide-fs-code:var(--fs-2);width:100%;max-width:1600px;max-height:100%;font-size:200%;font-size:var(--slide-fs-base)}.slide[data-astro-cid-e2arjyk2][data-bg=surface-1]{background:var(--surface-1)}.slide[data-astro-cid-e2arjyk2][data-bg=surface-2]{background:var(--surface-2)}.slide[data-astro-cid-e2arjyk2][data-bg=surface-3]{background:var(--surface-3)}.slide[data-astro-cid-e2arjyk2][data-bg=surface-4]{background:var(--surface-4)}.slide[data-astro-cid-e2arjyk2][data-bg=accent]{background:var(--accent);& h2{font-size:var(--slide-fs-h1);text-align:center}}.slide[data-astro-cid-e2arjyk2][data-bg=inverse]{background:var(--text-primary);color:var(--text-inverse)}.slide[data-astro-cid-e2arjyk2][data-layout=default] .slide-content[data-astro-cid-e2arjyk2]{gap:var(--space-m);align-content:start;display:grid}.slide[data-astro-cid-e2arjyk2][data-layout=title] .slide-content[data-astro-cid-e2arjyk2]{text-align:center;place-content:center;gap:var(--space-l);display:grid}.slide[data-astro-cid-e2arjyk2][data-layout=center] .slide-content[data-astro-cid-e2arjyk2]{text-align:center;place-content:center;display:grid}.slide[data-astro-cid-e2arjyk2][data-layout=split] .slide-content[data-astro-cid-e2arjyk2]{gap:var(--space-xl);grid-template-columns:1fr 1fr;align-items:center;display:grid}@container (width<800px){.slide[data-astro-cid-e2arjyk2][data-layout=split] .slide-content[data-astro-cid-e2arjyk2]{text-align:center;grid-template-columns:1fr}}.slide[data-astro-cid-e2arjyk2][data-layout=code] .slide-content[data-astro-cid-e2arjyk2]{gap:var(--space-m);font-family:var(--ff-code);display:grid}.slide-content[data-astro-cid-e2arjyk2] h1{font-size:var(--slide-fs-h1);margin:0;font-weight:900;line-height:1.1}.slide-content[data-astro-cid-e2arjyk2] h1 .tiny{font-size:var(--slide-fs-base)}.slide-content[data-astro-cid-e2arjyk2] h2{font-size:var(--slide-fs-h2);max-inline-size:18ch;margin:0;font-weight:900;line-height:1.2;&>code{white-space:nowrap;color:var(--text-primary);background-color:color-mix(in oklab, var(--brand-blue) 14%, var(--surface-2));background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.5'/%3E%3C/svg%3E"), linear-gradient(125deg, color-mix(in oklab, var(--brand-blue) 50%, var(--surface-2)), color-mix(in oklab, var(--brand-red) 50%, var(--surface-2)));background-blend-mode:soft-light;font-size:.9em}}.slide-content[data-astro-cid-e2arjyk2] h3{font-size:var(--slide-fs-h3);margin:0;font-weight:700;line-height:1.3}.slide-content[data-astro-cid-e2arjyk2] p{max-width:65ch;margin:0}.slide-content[data-astro-cid-e2arjyk2] img.full,.slide-content[data-astro-cid-e2arjyk2] video.full{block-size:100vb;max-block-size:100vb;inline-size:100vi;max-inline-size:100vi;position:absolute;inset:0}.slide-content[data-astro-cid-e2arjyk2] code-editor{--editor-height:100vb;block-size:100vb;inline-size:100vi;margin:auto;display:grid;position:absolute;inset:0}.slide-content[data-astro-cid-e2arjyk2] ul,.slide-content[data-astro-cid-e2arjyk2] ol{gap:.5em;margin:0;padding-left:1.5em;display:grid}.slide-content[data-astro-cid-e2arjyk2] li{font-size:var(--slide-fs-base)}.slide-content[data-astro-cid-e2arjyk2] code{font-family:var(--ff-code);font-size:var(--slide-fs-code);background-color:hsl(from var(--surface-3) h s calc(l * 1));background-blend-mode:overlay;color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.3'/%3E%3C/svg%3E"),linear-gradient(125deg,#bf4040,#4040bf);border-radius:.25em;padding:.125em .375em}.slide-content[data-astro-cid-e2arjyk2] pre{font-family:var(--ff-code);font-size:var(--slide-fs-code);background:var(--surface-3);padding:var(--space-m);border-radius:.5em;max-inline-size:fit-content;margin:0;overflow-x:auto}.slide-content[data-astro-cid-e2arjyk2] pre code{background:0 0;padding:0}.slide-content[data-astro-cid-e2arjyk2] img{object-fit:contain;border-radius:8px;max-width:100%;max-height:60vh}.slide-content[data-astro-cid-e2arjyk2] .highlight{color:var(--accent);font-weight:700}.slide-content[data-astro-cid-e2arjyk2] .subtitle{font-size:var(--slide-fs-base);opacity:.8.5;inset:auto 0 var(--space-2xl);position:absolute}.slide-content[data-astro-cid-e2arjyk2] ul{list-style:"";&.big-list{& li{font-weight:700;font-size:var(--slide-fs-h2)}}& li{align-items:center;gap:.5ch;display:flex}& li:before{content:"";aspect-ratio:1;background-color:color-mix(in oklab, var(--brand-blue) 14%, var(--surface-2));background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.15'/%3E%3C/svg%3E"), linear-gradient(125deg, var(--brand-blue), var(--brand-red));border-radius:100vw;width:.75ex;display:inline-block}}.slide-content[data-astro-cid-e2arjyk2] .fire-list{columns:100px 3;column-gap:3em;display:block;& ::marker{content:"🔥 "}& li{font-size:calc(var(--slide-fs-base) * .8)}}.slide-content[data-astro-cid-e2arjyk2] .baseline{--baseline-size:var(--fs-1)}
