:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--gray-0:#fff;--gray-25:#fafbfc;--gray-50:#f4f6f8;--gray-100:#e9ecf1;--gray-200:#d9dee6;--gray-300:#c2c9d4;--gray-400:#9aa3b2;--gray-500:#6b7384;--gray-600:#4b5263;--gray-700:#343a48;--gray-800:#21262f;--gray-900:#13171e;--gray-950:#0b0e13;--blue-50:#eef2ff;--blue-100:#d9e1ff;--blue-200:#b4c5ff;--blue-300:#88a1ff;--blue-400:#5879fb;--blue-500:#2f55f0;--blue-600:#1f3fd6;--blue-700:#1a33ad;--blue-800:#182b85;--blue-900:#15245f;--amber-50:#fff7e6;--amber-100:#ffe9bf;--amber-200:#ffd585;--amber-300:#fbbe45;--amber-400:#f5a623;--amber-500:#d9870a;--amber-600:#ad6906;--teal-100:#cdf3ec;--teal-300:#5fd4c2;--teal-500:#16a394;--teal-700:#0c6b62;--green-500:#16a36b;--green-100:#d4f3e4;--red-500:#e5484d;--red-100:#fbdcdd;--yellow-500:#f5a623;--yellow-100:#ffeec6;--text-strong:var(--gray-0);--text-body:var(--gray-100);--text-muted:var(--gray-400);--text-subtle:var(--gray-600);--text-inverse:var(--gray-950);--text-link:var(--blue-300);--text-on-accent:var(--gray-950);--surface-page:var(--gray-950);--surface-card:var(--gray-900);--surface-sunken:#07090c;--surface-raised:var(--gray-800);--surface-inverse:var(--gray-0);--surface-hover:var(--gray-800);--border-subtle:var(--gray-800);--border-default:var(--gray-700);--border-strong:var(--gray-600);--border-focus:var(--blue-400);--brand:var(--blue-400);--brand-hover:var(--blue-300);--brand-active:var(--blue-200);--brand-subtle:var(--blue-900);--accent:var(--amber-400);--accent-hover:var(--amber-300);--accent-subtle:#1e1200;--success:var(--green-500);--success-subtle:#0a2018;--danger:var(--red-500);--danger-subtle:#2a0f10;--warning:var(--yellow-500);--warning-subtle:#1e1200;--info:var(--blue-400);--ring:0 0 0 3px color-mix(in srgb, var(--blue-400) 45%, transparent);--glow-amber:0 0 0 1px var(--amber-500), 0 8px 32px -6px color-mix(in srgb, var(--amber-400) 70%, transparent)}[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--accent:var(--amber-500);--text-strong:var(--gray-950);--text-body:var(--gray-800);--text-muted:var(--gray-500);--text-subtle:var(--gray-400);--text-inverse:var(--gray-0);--text-link:var(--blue-600);--surface-page:var(--gray-25);--surface-card:var(--gray-0);--surface-sunken:var(--gray-50);--surface-raised:var(--gray-0);--surface-inverse:var(--gray-950);--surface-hover:var(--gray-50);--border-subtle:var(--gray-100);--border-default:var(--gray-200);--border-strong:var(--gray-300);--border-focus:var(--blue-500);--brand:var(--blue-500);--brand-hover:var(--blue-600);--brand-active:var(--blue-700);--brand-subtle:var(--blue-50);--accent-hover:var(--amber-500);--accent-subtle:var(--amber-50);--success-subtle:var(--green-100);--danger-subtle:var(--red-100);--warning-subtle:var(--yellow-100);--info:var(--blue-500);--ring:0 0 0 3px color-mix(in srgb, var(--blue-500) 35%, transparent);--glow-amber:0 0 0 1px var(--amber-300), 0 8px 28px -8px color-mix(in srgb, var(--amber-400) 55%, transparent)}
@font-face{font-family:Cousine Nerd Font Mono;src:url(/fonts/cousine-nerd/CousineNerdFontMono-Regular.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Cousine Nerd Font Mono;src:url(/fonts/cousine-nerd/CousineNerdFontMono-Italic.woff2)format("woff2");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:Cousine Nerd Font Mono;src:url(/fonts/cousine-nerd/CousineNerdFontMono-Bold.woff2)format("woff2");font-weight:500 700;font-style:normal;font-display:swap}:root{--font-cousine:"Cousine Nerd Font Mono", "Cousine", ui-monospace, "SF Mono", Menlo, monospace;--font-display:var(--font-cousine);--font-body:var(--font-cousine);--font-mono:var(--font-cousine);--text-2xs:.6875rem;--text-xs:.75rem;--text-sm:.875rem;--text-md:1rem;--text-lg:1.125rem;--text-xl:1.375rem;--text-2xl:1.75rem;--text-3xl:2.25rem;--text-4xl:2.875rem;--text-5xl:3.75rem;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--leading-tight:1.1;--leading-snug:1.25;--leading-normal:1.5;--leading-relaxed:1.65;--tracking-tight:-.01em;--tracking-snug:-.005em;--tracking-normal:0em;--tracking-wide:.04em;--tracking-caps:.08em;--display-font:var(--font-display);--display-weight:var(--weight-semibold);--display-tracking:var(--tracking-tight);--heading-font:var(--font-display);--heading-weight:var(--weight-semibold);--body-font:var(--font-body);--body-weight:var(--weight-regular);--body-leading:var(--leading-relaxed);--label-font:var(--font-body);--label-weight:var(--weight-medium);--eyebrow-font:var(--font-mono);--eyebrow-weight:var(--weight-medium);--eyebrow-tracking:var(--tracking-caps);--eyebrow-size:var(--text-xs);--code-font:var(--font-mono)}
:root{--space-0:0;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:2.5rem;--space-8:3rem;--space-9:4rem;--space-10:6rem;--space-11:8rem;--radius-xs:4px;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-2xl:28px;--radius-pill:999px;--radius-card:var(--radius-lg);--border-hairline:1px;--border-thick:1.5px;--shadow-xs:0 1px 2px #0b0e130d;--shadow-sm:0 1px 3px #0b0e1312, 0 1px 2px #0b0e130a;--shadow-md:0 4px 12px -2px #0b0e1314, 0 2px 6px -2px #0b0e130d;--shadow-lg:0 12px 28px -8px #0b0e131f, 0 4px 10px -4px #0b0e130f;--shadow-xl:0 28px 56px -16px #0b0e132e;--shadow-inset:inset 0 1px 2px #0b0e130f;--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--duration-fast:.12s;--duration-base:.2s;--duration-slow:.32s;--transition-base:all var(--duration-base) var(--ease-out);--container-sm:640px;--container-md:840px;--container-lg:1080px;--container-xl:1280px;--container-2xl:1440px;--gutter:var(--space-5);--section-y:var(--space-10);--header-height:64px}
:root{--grid-line:color-mix(in srgb, var(--blue-400) 7%, transparent);--grid-size:32px}[data-theme=light]{--grid-line:color-mix(in srgb, var(--blue-500) 10%, transparent)}.lab-grid{position:relative}.lab-grid>*{z-index:1;position:relative}.lab-grid:before{content:"";z-index:0;pointer-events:none;background-image:linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);background-size:var(--grid-size) var(--grid-size);position:absolute;inset:0;-webkit-mask-image:radial-gradient(90% 85% at 50% 0,#000 30%,#0000 100%);mask-image:radial-gradient(90% 85% at 50% 0,#000 30%,#0000 100%)}.hover-lift{transition:box-shadow var(--duration-base) var(--ease-out), border-color var(--duration-base) var(--ease-out), transform var(--duration-base) var(--ease-out)}.hover-lift:hover{border-color:color-mix(in srgb, var(--course-color,var(--border-strong)) 65%, transparent);box-shadow:0 12px 28px -8px color-mix(in srgb, var(--course-color,var(--gray-950)) 28%, transparent), var(--shadow-lg);transform:translateY(-2px)}@keyframes draw-stroke{to{stroke-dashoffset:0}}.draw-in path,.draw-in circle,.draw-in line,.draw-in rect,.draw-in polyline{stroke-dasharray:1;stroke-dashoffset:1px;animation:draw-stroke 1.1s var(--ease-out) forwards}.draw-in .fade{stroke-dasharray:0;stroke-dashoffset:0;animation:fadeUp .5s var(--ease-out) both}.draw-in .dashed{stroke-dasharray:.02 .025;stroke-dashoffset:0;animation:fadeUp .5s var(--ease-out) both}html[data-js] .reveal{opacity:0;transition:opacity .48s var(--ease-out), transform .48s var(--ease-out);transform:translateY(12px)}html[data-js] .reveal.is-visible{opacity:1;transform:none}.telemetry-chip{font-family:var(--font-mono);letter-spacing:.05em;color:var(--text-muted);background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-pill);align-items:center;gap:7px;padding:4px 12px;font-size:11px;display:inline-flex}@keyframes live-pulse{0%,to{box-shadow:0 0 0 0 color-mix(in srgb, var(--amber-400) 45%, transparent)}50%{box-shadow:0 0 0 5px #0000}}.status-dot{background:var(--amber-400);border-radius:50%;flex-shrink:0;width:7px;height:7px;animation:2.2s ease-in-out infinite live-pulse}.cta-primary{transition:box-shadow var(--duration-base) var(--ease-out), transform var(--duration-base) var(--ease-out)}.cta-primary:hover{box-shadow:var(--glow-amber);transform:translateY(-1px)}.hero-art{display:none}@media (min-width:900px){.hero-art{flex:0 0 360px;width:360px;height:auto;display:block}}@media (prefers-reduced-motion:reduce){.hover-lift{transition:none}.hover-lift:hover{transform:none}.cta-primary{transition:none}.cta-primary:hover{transform:none}.draw-in path,.draw-in circle,.draw-in line,.draw-in rect,.draw-in polyline,.draw-in .fade,.draw-in .dashed{stroke-dashoffset:0;opacity:1;animation:none}.draw-in .dashed{stroke-dasharray:.02 .025}.draw-in .fade{stroke-dasharray:0}html[data-js] .reveal{opacity:1;transition:none;transform:none}.status-dot{animation:none}}.path-pipeline{align-items:stretch;gap:0;display:flex}.path-node{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);transition:border-color var(--duration-base) var(--ease-out), box-shadow var(--duration-base) var(--ease-out);flex-direction:column;flex:1;align-items:flex-start;gap:4px;padding:16px 18px;text-decoration:none;display:flex}.path-node:hover{border-color:color-mix(in srgb, var(--course-color) 65%, transparent);box-shadow:0 8px 20px -8px color-mix(in srgb, var(--course-color) 30%, transparent)}.path-node-glyph{margin-bottom:6px;display:block}.path-node-step{font-family:var(--font-mono);letter-spacing:.09em;color:var(--text-subtle);font-size:10px}.path-node-title{font-family:var(--font-display);color:var(--text-strong);font-size:14px;font-weight:600}.path-node-meta{font-family:var(--font-mono);color:var(--text-muted);font-size:11px}.path-connector{background:repeating-linear-gradient(90deg, var(--border-strong) 0 4px, transparent 4px 8px);flex:0 0 28px;align-self:center;height:1px}@media (max-width:720px){.path-pipeline{flex-direction:column}.path-connector{background:repeating-linear-gradient(180deg, var(--border-strong) 0 4px, transparent 4px 8px);flex-basis:20px;width:1px;height:20px;margin-left:32px}}.lesson-row{border-bottom:1px solid var(--border-subtle);transition:background var(--duration-fast) var(--ease-out), border-left-color var(--duration-fast) var(--ease-out);border-left:2px solid #0000;align-items:center;gap:16px;padding:14px;text-decoration:none;display:flex}.lesson-row:first-child{border-top:1px solid var(--border-subtle)}.lesson-row:hover{background:var(--surface-hover);border-left-color:var(--course-color,var(--brand))}.lesson-row-num{font-family:var(--font-mono);letter-spacing:.05em;color:var(--text-subtle);flex-shrink:0;width:38px;font-size:12px}
*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}:focus-visible{outline:2px solid var(--border-focus,var(--brand));outline-offset:2px;border-radius:3px}.skip-link{z-index:400;background:var(--surface-card);color:var(--text-strong);border:1px solid var(--border-default);border-radius:var(--radius-md);font-family:var(--font-body);transition:transform var(--duration-fast) var(--ease-out);padding:10px 16px;font-size:14px;text-decoration:none;position:fixed;top:8px;left:8px;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}body{background:var(--surface-page);color:var(--text-body);font-family:var(--font-body);min-height:100vh;line-height:var(--leading-relaxed);margin:0}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-subtle)}.katex-display{background:var(--surface-sunken);border:1px solid var(--border-subtle);border-radius:var(--radius-md);margin:1.5em 0;padding:1.25em 1.5em;overflow:auto hidden}.katex-display>.katex{max-width:100%}.hljs{color:var(--gray-100);background:0 0}.hljs-keyword,.hljs-built_in{color:var(--amber-300)}.hljs-string,.hljs-literal{color:var(--teal-300)}.hljs-number{color:var(--blue-200)}.hljs-comment{color:var(--gray-500);font-style:italic}.hljs-function,.hljs-title,.hljs-class,.hljs-type{color:var(--blue-300)}.hljs-variable,.hljs-name{color:var(--gray-100)}.hljs-attr{color:var(--amber-200)}.hljs-selector-tag{color:var(--amber-300)}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.fade-up{animation:.22s cubic-bezier(.22,1,.36,1) both fadeUp}@media (prefers-reduced-motion:reduce){.fade-up{animation:none}}@media (max-width:640px){.pad-x{padding-left:20px!important;padding-right:20px!important}}@media (max-width:600px){.site-header{gap:14px!important;padding-left:16px!important;padding-right:16px!important}}@media (max-width:720px){.search-trigger-label,.search-trigger-kbd{display:none}.search-trigger{padding:0 10px!important}}.codeblock{margin-bottom:1.5em}.codeblock-bar{background:var(--gray-900);border:1px solid var(--border-subtle);border-radius:var(--radius-md) var(--radius-md) 0 0;border-bottom:none;align-items:center;gap:10px;padding:7px 14px;display:flex}.codeblock-lang{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--gray-400);font-size:10.5px}.codeblock-copy{font-family:var(--font-mono);letter-spacing:.04em;color:var(--gray-400);background:var(--gray-800);border:1px solid var(--gray-700);border-radius:var(--radius-sm);cursor:pointer;transition:color var(--duration-fast), border-color var(--duration-fast);margin-left:auto;padding:3px 10px;font-size:11px}.codeblock-copy:hover{color:var(--gray-100);border-color:var(--gray-600)}.codeblock-copy:focus-visible{outline:2px solid var(--brand);outline-offset:2px}@keyframes live-pulse-dot{0%,to{box-shadow:0 0 0 0 color-mix(in srgb, var(--amber-400) 45%, transparent)}50%{box-shadow:0 0 0 5px #0000}}.live-dot{background:var(--amber-400);border-radius:50%;flex-shrink:0;width:7px;height:7px;animation:2.2s ease-in-out infinite live-pulse-dot}@media (prefers-reduced-motion:reduce){.live-dot{animation:none}}.heading-linked .anchor-link{color:var(--text-subtle);opacity:0;transition:opacity var(--duration-fast) var(--ease-out), color var(--duration-fast);margin-left:.4em;font-weight:400;text-decoration:none}.heading-linked:hover .anchor-link,.heading-linked:focus-within .anchor-link{opacity:1}.anchor-link:hover{color:var(--brand)}.anchor-link:focus-visible{opacity:1;outline:2px solid var(--brand);outline-offset:2px;border-radius:var(--radius-xs)}.lesson-nav-card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:14px 18px;transition:border-color .12s}.lesson-nav-card:hover{border-color:var(--border-strong)}.lesson-nav-card-next{text-align:right}.lesson-nav-card-next:hover{border-color:var(--brand)}.reading-progress{top:var(--header-height);z-index:90;pointer-events:none;height:3px;position:fixed;left:0;right:0}.reading-progress-fill{background:var(--brand);transform-origin:0;will-change:transform;width:100%;height:100%;transform:scaleX(0)}.lesson-shell{min-height:calc(100vh - var(--header-height));display:flex}.lesson-sidebar{background:var(--surface-card);border-right:1px solid var(--border-subtle);width:280px;height:calc(100vh - var(--header-height));top:var(--header-height);z-index:1;flex-direction:column;flex-shrink:0;display:flex;position:sticky;overflow-y:auto}.lesson-mobilebar,.lesson-overlay{display:none}.lesson-head{padding:32px 48px 28px}.lesson-body{align-items:flex-start;gap:44px;padding:40px 48px 60px;display:flex}.lesson-article{flex:1;min-width:0;max-width:800px}.lesson-article h2:not(:first-child){border-top:1px solid var(--border-subtle);padding-top:28px}.lesson-toc{display:none}@media (min-width:1280px){.lesson-toc{flex-shrink:0;width:200px;max-height:calc(100vh - 110px);display:block;position:sticky;top:88px;overflow-y:auto}}@media (max-width:1023px){.lesson-shell{display:block}.lesson-sidebar{width:min(84vw,320px);height:100dvh;transition:transform var(--duration-base) var(--ease-out);box-shadow:var(--shadow-xl);z-index:200;position:fixed;top:0;left:0;transform:translate(-100%)}.lesson-sidebar[data-open=true]{transform:translate(0)}.lesson-overlay[data-open=true]{z-index:150;animation:fadeUp var(--duration-fast) var(--ease-out) both;background:#0b0e138c;display:block;position:fixed;inset:0}.lesson-mobilebar{top:var(--header-height);z-index:80;background:var(--surface-card);border-bottom:1px solid var(--border-subtle);align-items:center;gap:12px;padding:10px 16px;display:flex;position:sticky}.lesson-drawer-close{display:inline-flex!important}.lesson-head{padding:24px 20px 20px}.lesson-body{padding:28px 20px 56px}}@media (max-width:600px){.lesson-head{padding:20px 16px 18px}.lesson-body{padding:22px 16px 48px}}@media (prefers-reduced-motion:reduce){.lesson-sidebar{transition:none}.lesson-overlay[data-open=true]{animation:none}}@keyframes pyodide-sweep{0%{transform:translate(-100%)}to{transform:translate(500%)}}.pyodide-progress-bar{background:var(--brand);border-radius:2px;width:20%;height:100%;animation:1.4s ease-in-out infinite pyodide-sweep}