.blog-article[lang=en-US]{--app-font-sans: "Inter", system-ui, -apple-system, sans-serif;--app-font-heading: "General Sans", "Inter", system-ui, sans-serif;font-family:var(--app-font-sans)}.blog-prose{color:var(--foreground);font-size:1rem;line-height:1.8}.replay-component{position:relative;outline:1px solid transparent;outline-offset:3px;transition:outline-color .18s ease}.agent-replay[data-step="2"] .replay-updated:after{content:"";position:absolute;inset:-4px;border:1px solid var(--primary);border-radius:inherit;pointer-events:none;opacity:0;animation:replay-update .55s ease-out}@keyframes replay-update{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.045)}}.replay-updated{outline-color:color-mix(in oklch,var(--primary) 40%,transparent)}.replay-selected{outline:2px solid var(--primary)}.replay-video-grid{background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:radial-gradient(ellipse at center,black,transparent 80%);mask-image:radial-gradient(ellipse at center,black,transparent 80%)}.replay-cursor{opacity:0;transform:translate(25px,25px);transition:transform .55s cubic-bezier(.22,1,.36,1),opacity .18s ease}.agent-replay[data-step="1"] .replay-cursor{opacity:1;transform:translate(0)}.agent-replay[data-step="2"] .replay-cursor{opacity:1;transform:scale(.86)}.replay-progress{transition:transform .3s ease-out}@media(prefers-reduced-motion:reduce){.agent-replay *,.agent-replay *:before,.agent-replay *:after{animation:none;transition:none}}.blog-prose>:first-child{margin-block-start:0}.blog-prose>:is(p,h2,h3,ul,ol,blockquote,details){max-inline-size:65ch}.blog-prose :is(p,ul,ol,blockquote,table,figure){margin-block:1.35rem}.blog-prose>p:first-child{font-size:1.15rem;line-height:1.75}.blog-prose h2{margin-block-start:3.75rem;margin-block-end:1.25rem;font-size:1.625rem;font-weight:650;line-height:1.2;letter-spacing:-.025em}.blog-prose .section-heading{margin-block-start:5.5rem;font-size:1.875rem;font-weight:700;letter-spacing:-.03em;text-wrap:balance}.section-heading-kicker{display:flex;align-items:center;gap:.875rem;margin-block-end:.875rem;font-family:var(--font-mono);font-size:.75rem;font-weight:500;letter-spacing:.08em;color:var(--primary)}.section-heading-kicker .wake-map{height:2.75rem}.blog-prose .sidenote{position:relative;max-inline-size:65ch;margin-block:2.75rem;border:1px solid;border-radius:1rem;padding:1.25rem 1.5rem 1.25rem 1.75rem}.sidenote-note{--sidenote-accent: var(--primary)}.sidenote-warning{--sidenote-accent: var(--chart-5)}.blog-prose .sidenote{border-color:color-mix(in oklab,var(--sidenote-accent) 32%,transparent);background:color-mix(in oklab,var(--sidenote-accent) 7%,transparent)}.sidenote-icon{position:absolute;inset-block-start:-1rem;inset-inline-start:-1rem;display:grid;place-items:center;inline-size:2.25rem;block-size:2.25rem;border:1px solid color-mix(in oklab,var(--sidenote-accent) 45%,transparent);border-radius:9999px;background:var(--background);color:var(--sidenote-accent)}.blog-prose .sidenote-title{margin:0;font-weight:650;line-height:1.4}.blog-prose .sidenote-body>p{margin-block:.5rem 0;font-size:.95rem;line-height:1.7}.blog-prose :is(.player-demo,.automation-loop){margin-block:2.5rem}.blog-prose h3{margin-block-start:2.25rem;margin-block-end:.8rem;font-size:1.15rem;font-weight:650;line-height:1.35}.blog-prose :is(ul,ol){padding-inline-start:1.35rem}.blog-prose ul{list-style:disc}.blog-prose ol{list-style:decimal}.blog-prose li{padding-inline-start:.35rem;margin-block:.55rem}.blog-prose li::marker{color:var(--primary);font-family:var(--font-mono)}.blog-prose strong{color:var(--foreground);font-weight:650}.blog-prose :is(p,li,blockquote):not(figure *) a{border-radius:2px;color:var(--foreground);font-weight:500;text-decoration-line:underline;text-decoration-thickness:1px;text-decoration-color:color-mix(in oklab,var(--primary) 55%,transparent);text-underline-offset:.25em;transition:color .15s ease,text-decoration-color .15s ease,text-decoration-thickness .15s ease}.blog-prose :is(p,li,blockquote):not(figure *) a:hover{color:var(--primary);text-decoration-color:var(--primary);text-decoration-thickness:2px}.blog-prose :is(p,li,blockquote):not(figure *) a:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.mdx-link-icon{display:inline-block;width:.75em;height:.75em;margin-inline-start:.15em;vertical-align:.05em;color:var(--muted-foreground);transition:color .15s ease,transform .15s ease}a:hover>.mdx-link-icon{color:var(--primary);transform:translate(1px,-1px)}[dir=rtl] .mdx-link-icon{scale:-1 1}[dir=rtl] a:hover>.mdx-link-icon{transform:translate(-1px,-1px)}@media(prefers-reduced-motion:reduce){.blog-prose :is(p,li,blockquote):not(figure *) a,.mdx-link-icon{transition:none}a:hover>.mdx-link-icon{transform:none}}.blog-prose :not(pre)>code{white-space:nowrap;border:1px solid color-mix(in oklab,var(--border) 75%,transparent);border-radius:calc(var(--radius) - 6px);background:var(--muted);padding:.15em .38em;font-family:var(--font-mono);font-size:.86em}.blog-prose figure[data-rehype-pretty-code-figure]{margin-block:2rem}.blog-prose figure[data-rehype-pretty-code-figure] pre{direction:ltr;text-align:left;overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--muted);padding:1.15rem;scrollbar-width:thin}.blog-prose figure[data-rehype-pretty-code-figure] code{display:grid;min-width:max-content;font-family:var(--font-mono);font-size:.78rem;line-height:1.75}.blog-prose [data-rehype-pretty-code-figure] [data-line]{padding-inline:.15rem}.blog-prose pre[data-language=text] code{min-width:0;white-space:pre-wrap}.blog-prose pre[data-language=text] [data-line]{padding-inline-start:2ch;text-indent:-2ch}.blog-prose blockquote{border-inline-start:2px solid var(--border);padding-inline-start:1.25rem;color:var(--muted-foreground)}.blog-prose table{width:100%;border-collapse:collapse;font-size:.875rem}.blog-prose :is(th,td){border-block-end:1px solid var(--border);padding:.75rem;text-align:start;overflow-wrap:anywhere}.blog-prose th{font-family:var(--font-mono);font-size:.68rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-foreground)}@media(max-width:40rem){.blog-prose .migration-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.blog-prose .migration-table :is(table,tbody,tr,td){display:block}.blog-prose .migration-table tr{border-block-end:1px solid var(--border);padding-block:1rem}.blog-prose .migration-table td{border:0;padding:0}.blog-prose .migration-table td:nth-child(2){margin-block-start:.35rem}.blog-prose .migration-table td:nth-child(2):before{content:"→" / "";margin-inline-end:.4em;color:var(--primary)}.blog-prose .migration-table td:nth-child(3){margin-block-start:.5rem;color:var(--muted-foreground)}}.blog-prose hr{margin-block:3rem;border-color:color-mix(in oklab,var(--border) 70%,transparent)}.blog-prose sup{font-family:var(--font-mono);font-size:.68rem}.blog-prose details{margin-block:1.75rem;border-block:1px solid var(--border);padding-block:1rem}.blog-prose summary{cursor:pointer;font-size:.875rem;font-weight:500}.blog-prose summary::marker{color:var(--primary)}.blog-prose summary:focus-visible{outline:2px solid var(--ring);outline-offset:4px}@media(prefers-reduced-motion:no-preference){.render-tree-node[data-updates=true]{animation:render-tree-update .2s ease-out both}[data-wake-count]{animation:wake-count-pop .26s cubic-bezier(.34,1.56,.64,1) both}}@keyframes wake-count-pop{0%{transform:scale(1.18)}to{transform:scale(1)}}.blog-prose .doctor-code code{background:none;border:0;padding:0;font-size:inherit}.blog-prose figure .code-morph pre{margin:0;border:0;padding:1rem;background:transparent;font-size:.875rem;line-height:1.5rem;overflow:visible}@media(max-width:40rem){.blog-prose figure .code-morph pre{font-size:.75rem;line-height:1.25rem}.blog-prose .course-doctor .code-morph{width:max-content;min-width:100%;padding-inline-end:2rem}}.code-morph-surface:empty{display:none}.blog-prose .course-doctor h3{margin-block:.5rem 0;font-size:1.125rem}.blog-prose .course-doctor p{margin-block:.5rem 0}.blog-prose .code-morph-surface:not(:empty)+.code-morph-fallback{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.code-token-keyword{color:var(--primary)}.code-token-default{color:var(--foreground)}.code-token-comment{color:var(--muted-foreground)}.code-morph .shiki-magic-move-item{transition-property:transform,opacity}@media(prefers-reduced-motion:reduce){.doctor-lab button,.doctor-lab button:after{transition:none}.code-morph .shiki-magic-move-item{transition:none;animation:none}}@keyframes render-tree-update{0%{opacity:.5;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}.blog-prose [data-slot=player-demo] ul{margin-block:1.25rem 0;padding-inline-start:0;list-style:none}.blog-prose [data-slot=player-demo] li{margin-block:0}.blog-prose :is(.course-demo,.automation-loop) :is(ul,ol){margin-block:0;padding-inline-start:0;list-style:none}.blog-prose .course-demo li{margin-block:0;padding-inline-start:0}.blog-prose .automation-loop li{margin:0;padding:1.25rem}.blog-prose .course-demo [data-course-tree]>li:not(:first-child){padding-inline-start:.75rem}@media(prefers-reduced-motion:reduce){.course-demo *,.course-demo *:before,.course-demo *:after{animation:none;transition:none}}@media(max-width:40rem){.blog-prose{font-size:.95rem;line-height:1.8}.blog-prose h2{margin-block-start:3rem;font-size:1.5rem}}.player-demo [data-node]{cursor:default}.course-lab{display:flex;flex-direction:column}@container (width >= 40rem){.course-lab{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:1fr auto auto;grid-template-areas:"player tree" "player meter" "player impact"}}.player-demo [data-lesson]{position:relative}.player-demo [data-lesson]+[data-lesson]:before{content:"";position:absolute;inset-inline:0;inset-block-start:0;border-block-start:1px solid var(--border)}.player-demo [data-component]{border-radius:.5rem;outline:2px dashed transparent;outline-offset:4px;transition:outline-color .15s ease}.player-demo:has([data-node=CoursePlayer]:hover) [data-component=CoursePlayer],.player-demo:has([data-node=LessonList]:hover) [data-component=LessonList],.player-demo:has([data-node=intro]:hover) [data-component=intro],.player-demo:has([data-node=observables]:hover) [data-component=observables],.player-demo:has([data-node=consumers]:hover) [data-component=consumers],.player-demo:has([data-node=Progress]:hover) [data-component=Progress],.player-demo:has([data-node=Notes]:hover) [data-component=Notes],.player-demo:has([data-node=Captions]:hover) [data-component=Captions]{outline-color:var(--primary)}.player-demo:has([data-component=intro]:hover) [data-node=intro],.player-demo:has([data-component=observables]:hover) [data-node=observables],.player-demo:has([data-component=consumers]:hover) [data-node=consumers],.player-demo:has([data-component=Progress]:hover) [data-node=Progress],.player-demo:has([data-component=Notes]:hover) [data-node=Notes],.player-demo:has([data-component=Captions]:hover) [data-node=Captions]{box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--primary) 55%,transparent);color:var(--foreground)}.blog-prose .story-recap{margin-block:2.5rem}.blog-prose .story-recap ol{margin:0;padding:0;list-style:none}.blog-prose .story-recap li{margin:0;padding:1rem}.story-recap-stop[data-beat=broken]{border-color:color-mix(in oklab,var(--destructive) 40%,transparent);background:color-mix(in oklab,var(--destructive) 6%,transparent)}