@keyframes land{0%,45%{outline-offset:7px;outline:3px solid #e0b93f}to{outline-offset:7px;outline:3px solid #0000}}.lesson{--ink:var(--foreground);--ink-soft:color-mix(in oklab, var(--foreground) 78%, var(--background));--ink-faint:color-mix(in oklab, var(--foreground) 55%, var(--background));--paper:var(--background);--rule:color-mix(in oklab, var(--foreground) 18%, var(--background));--accent-soft:color-mix(in oklab, var(--accent) 18%, var(--background));--chip-bg:#202f36;--chip-border:#2d434c;--chip-ink:#f3b184;--code-bg:#202f36;--code-border:#2d434c;--code-ink:#e8e5de;--code-accent:#d2703f;--code-faint:#99a0aa;--tok-c:#8b929c;--tok-k:#cf9be0;--tok-s:#a3cf8c;--tok-t:#7fc3e6;--tok-f:#edc07d;--tok-hl:#4d4327;--tok-add-bg:#2f3d34;--tok-add-bar:#63ac7d;--tok-del-bg:#3a2b2d;--tok-del-bar:#b8656b;--err-bg:#362a2c;--err-border:#574044;--err-accent:#e8878f;--ok:#2b6b3f;--no:#9b2c2c;--serif:et-book, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;--mono:"Iosevka", "JetBrains Mono", "SF Mono", "DejaVu Sans Mono", ui-monospace, monospace;font-family:var(--serif);color:var(--ink);counter-reset:sidenote stage;-webkit-font-smoothing:antialiased;max-width:44rem;margin:0 auto;padding:2rem;line-height:1.62;& .masthead{border-bottom:1px solid var(--rule);margin-bottom:2.5rem;padding-bottom:1rem}& .eyebrow{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 .6rem;font-size:.72rem}& .eyebrow .sep{opacity:.4;margin:0 .5em}& h4{letter-spacing:.02em;color:var(--ink-soft);margin:2rem 0 .5rem;font-size:.94rem;font-weight:600}& .subtitle{color:var(--ink-soft);margin:0 0 .4rem;font-size:1.15rem;font-style:italic}& p{margin:0 0 1.1rem}& a{color:var(--accent);text-underline-offset:2px;text-decoration-thickness:.5px}& a:hover{background:var(--accent-soft)}& strong{font-weight:650}& hr{border:0;border-top:1px solid var(--rule);margin:3rem 0}& ul,& ol{margin:0 0 1.1rem;padding-left:1.3rem}& li{margin-bottom:.4rem}& code{font-family:var(--mono);background:var(--chip-bg);color:var(--chip-ink);border:1px solid var(--chip-border);overflow-wrap:break-word;-webkit-print-color-adjust:exact;print-color-adjust:exact;border-radius:3.5px;padding:.12em .4em;font-size:.82em;line-height:1.4}& a code{color:var(--chip-ink)}& h1 code,& h2 code,& h3 code,& h4 code,& .subtitle code,& .thesis code,& .recall>summary code{color:inherit;background:0 0;border:0;padding:0;font-size:.86em}& pre{font-family:var(--mono);background:var(--code-bg);color:var(--code-ink);border:1px solid var(--code-border);border-left:3px solid var(--code-accent);-webkit-print-color-adjust:exact;print-color-adjust:exact;scrollbar-width:thin;scrollbar-color:#5b626d transparent;border-radius:4px;margin:0 0 1.3rem;padding:1rem 1.1rem;font-size:.8rem;line-height:1.6;overflow-x:auto}& pre::-webkit-scrollbar{height:9px}& pre::-webkit-scrollbar-track{background:0 0}& pre::-webkit-scrollbar-thumb{background:#4d545e;border-radius:5px}& pre::-webkit-scrollbar-thumb:hover{background:#646c78}& pre code,& .run code,& .filename code,& .quiz .options button code{color:inherit;font-size:inherit;background:0 0;border:0;border-radius:0;padding:0}& pre.error{background:var(--err-bg);border-color:var(--err-border);border-left:3px solid var(--err-accent)}& pre.error[data-label]:before{content:attr(data-label)}& pre.error:before{content:"compiler output";font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--err-accent);margin:-.15rem 0 .7rem;font-size:.62rem;display:block}& pre .c{color:var(--tok-c);font-style:italic}& pre .k{color:var(--tok-k);font-weight:600}& pre .s{color:var(--tok-s)}& pre .t{color:var(--tok-t)}& pre .f{color:var(--tok-f)}& pre .hl{background:var(--tok-hl);width:100%;display:inline-block}& pre .add{background:var(--tok-add-bg);width:100%;box-shadow:inset 2px 0 0 var(--tok-add-bar);padding-left:4px;display:inline-block}& pre .del{background:var(--tok-del-bg);width:100%;box-shadow:inset 2px 0 0 var(--tok-del-bar);text-decoration:line-through;text-decoration-color:var(--tok-del-bar);opacity:.8;padding-left:4px;display:inline-block}& pre .dim{opacity:.5}& pre .gap{white-space:normal;text-align:center;color:var(--code-faint);border-top:1px dashed var(--code-border);border-bottom:1px dashed var(--code-border);margin:.35rem 0;padding:.2rem 0;font-style:italic;display:block}& .filename.ref{background:var(--code-border);color:var(--code-faint);font-style:italic}& .filename.ref:after{content:" · reference, not an edit";opacity:.75;font-style:normal}& .filename{font-family:var(--mono);letter-spacing:.06em;color:var(--code-faint);background:var(--code-bg);border:1px solid var(--code-border);border-left:3px solid var(--code-accent);-webkit-print-color-adjust:exact;print-color-adjust:exact;border-bottom:0;border-radius:4px 4px 0 0;margin:0;padding:.34rem .85rem .28rem;font-size:.68rem;display:inline-block;position:relative;top:1px}& .filename+pre{border-top-left-radius:0;margin-top:0}& .filename .where{color:var(--chip-ink)}& .filename .where:before{content:" · ";color:var(--code-faint)}& pre.numbered{counter-reset:line;white-space:normal}& pre.numbered .l{white-space:pre;counter-increment:line;display:block}& pre.numbered .l:before{content:counter(line);text-align:right;width:2ch;color:var(--code-faint);opacity:.55;border-right:1px solid var(--code-border);-webkit-user-select:none;user-select:none;margin-right:1.4ch;padding-right:.9ch;display:inline-block}& .callout{background:color-mix(in oklab, #c9a227 14%, var(--background));border-left:3px solid var(--rule);color:var(--ink-soft);margin:0 0 1.3rem;padding:.2rem 1.1rem}& .callout .label{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:.25rem;font-size:.68rem;display:block}& .callout.key{border-left-color:var(--accent);color:var(--ink)}& .callout.warn{border-left-color:#c08a2e}& .callout.note{border:1px solid color-mix(in oklab, #c9a227 38%, var(--background));color:var(--ink);-webkit-print-color-adjust:exact;print-color-adjust:exact;border-left:3px solid #c9a227;border-radius:4px;padding:.8rem 1.1rem .85rem}& .callout.note .label{color:color-mix(in oklab, #c9a227 65%, var(--foreground))}& .thesis{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);text-align:center;margin:2rem 0;padding:1.1rem 0;font-size:1.16rem;font-style:italic;line-height:1.5}& .sidenote{float:right;clear:right;width:15rem;color:var(--ink-soft);margin-top:.3rem;margin-bottom:1rem;margin-right:-18rem;font-size:.78rem;line-height:1.45}@media (width<=1180px){& .sidenote{float:none;border-left:2px solid var(--rule);width:auto;margin:.8rem 0 1.2rem;padding-left:1rem}}& .steps{counter-reset:step;padding-left:0;list-style:none}& .steps>li{counter-increment:step;margin-bottom:1.5rem;padding-left:2.4rem;position:relative}& .steps>li:before{content:counter(step);font-family:var(--mono);color:var(--accent);border:1px solid var(--rule);border-radius:50%;place-items:center;width:1.6rem;height:1.6rem;font-size:.75rem;display:grid;position:absolute;top:.05rem;left:0}& .stage{counter-increment:stage;border-top:1px solid var(--rule);margin:2.6rem 0;padding-top:1.6rem}& .stage>h3{margin:0 0 .5rem;padding-left:0;font-size:1.2rem;font-weight:400;position:relative}& .stage>h3:first-of-type:before{content:"Stage " counter(stage);font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);padding-left:0;font-size:.64rem;position:absolute;top:-1.35rem;left:0}& .goal{color:var(--ink-soft);margin:0 0 1rem;font-style:italic}& .goal:before{content:"Goal — ";font-style:normal;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);font-size:.68rem}& .run{font-family:var(--mono);background:var(--code-bg);color:var(--code-ink);border:1px dashed var(--code-border);-webkit-print-color-adjust:exact;print-color-adjust:exact;border-radius:3px;margin:0 0 1rem;padding:.7rem .9rem;font-size:.8rem;line-height:1.5}& .run:before{content:"▸ run it";letter-spacing:.14em;text-transform:uppercase;color:var(--code-accent);margin-bottom:.35rem;font-size:.64rem;display:block}& .run .note{color:var(--code-faint)}& .legend{font-family:var(--mono);color:var(--ink-faint);margin:0 0 1.6rem;font-size:.7rem}& .legend .swatch{vertical-align:-1px;border-radius:2px;width:.8rem;height:.8rem;margin-right:.3rem;display:inline-block}& .legend .swatch.new{background:var(--tok-add-bg);box-shadow:inset 2px 0 0 var(--tok-add-bar)}& .legend .swatch.gone{background:var(--tok-del-bg);box-shadow:inset 2px 0 0 var(--tok-del-bar)}& .legend .swatch.old{background:var(--code-bg);border:1px solid var(--code-border)}& table{border-collapse:collapse;width:100%;margin:0 0 1.4rem;font-size:.88rem}& th,& td{text-align:left;border-bottom:1px solid var(--rule);vertical-align:top;padding:.5rem .7rem .5rem 0}& th{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);border-bottom:1px solid var(--ink-soft);font-size:.72rem;font-weight:600}& [id]{scroll-margin-top:2.5rem}& :target{animation:2.6s ease-out land}& .footer-nav{border-top:1px solid var(--rule);color:var(--ink-faint);margin-top:4rem;padding-top:1.2rem;font-size:.85rem}& .footer-nav a{margin-right:1.2rem}& .ask{background:var(--accent-soft);border-radius:4px;margin:2.5rem 0 0;padding:1rem 1.2rem;font-size:.9rem}& .ask strong{color:var(--accent)}& .quiz{border:1px solid var(--rule);background:color-mix(in oklab, var(--foreground) 3%, var(--background));border-radius:4px;margin:0 0 1.4rem;padding:1.3rem 1.4rem}& .quiz .q{margin:0 0 .9rem;font-size:1rem;line-height:1.45}& .quiz .q code{font-size:.8em}& .quiz .options button code{font-weight:600}& .quiz .options{margin:0;padding:0;list-style:none}& .quiz .options li{margin:0 0 .45rem}& .quiz .options button{font-family:var(--mono);text-align:left;background:var(--background);border:1px solid var(--rule);cursor:pointer;width:100%;color:var(--ink);border-radius:3px;padding:.55rem .8rem;font-size:.82rem;line-height:1.4;transition:background .12s,border-color .12s}& .quiz .options button:hover:not(:disabled){background:var(--accent-soft);border-color:var(--accent)}& .quiz .options button:disabled{cursor:default}& .quiz .options button.correct{border-color:var(--ok);background:color-mix(in oklab, var(--ok) 12%, var(--background));color:var(--ok)}& .quiz .options button.wrong{border-color:var(--no);background:color-mix(in oklab, var(--no) 12%, var(--background));color:var(--no);text-decoration:line-through 1px}& .quiz .why{border-top:1px dashed var(--rule);color:var(--ink-soft);margin:.9rem 0 0;padding-top:.8rem;font-size:.88rem}& .quiz .why .review{font-family:var(--mono);letter-spacing:.02em;margin-top:.6rem;font-size:.72rem;display:block}& .quiz .why:before{content:"Why: ";font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);font-size:.7rem}& .quiz-score{font-family:var(--mono);color:var(--ink-faint);text-align:right;margin:-.6rem 0 2rem;font-size:.78rem}& .recall{border-left:3px solid var(--accent);margin:0 0 1.4rem;padding:.2rem 0 .2rem 1.1rem}& .recall>summary{cursor:pointer;color:var(--accent);margin-bottom:.3rem;font-style:italic;list-style:none}& .recall>summary::-webkit-details-marker{display:none}& .recall>summary:before{content:"▸ ";font-style:normal}& .recall[open]>summary:before{content:"▾ "}& .recall>summary:after{content:" — say your answer out loud first";color:var(--ink-faint);font-size:.78rem}& .recall[open]>summary:after{content:""}& .recall>:not(summary){color:var(--ink-soft)}}@media (prefers-color-scheme:dark){.lesson{--ok:#7ec695;--no:#e08f8f}}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}@media print{.lesson{--ink:#111;--ink-soft:#4a4a4a;--ink-faint:#767676;--paper:#fff;--rule:#d8d8cf;--accent-soft:#f3e6df;--chip-bg:#f6ead9;--chip-border:#e5d2b8;--chip-ink:#8a4420;--code-bg:#f4f2e7;--code-border:#ded9c6;--code-ink:#111;--code-accent:#a0512d;--code-faint:#767676;--tok-c:#7a7568;--tok-k:#8438a0;--tok-s:#1f6b3a;--tok-t:#10557f;--tok-f:#8a5c00;--tok-hl:#fdf0c8;--tok-add-bg:#e8f4ea;--tok-add-bar:#2b6b3f;--tok-del-bg:#fbeceb;--tok-del-bar:#9b2c2c;--err-bg:#fcf3f1;--err-border:#ecd3cc;--err-accent:#9b2c2c;--ok:#2b6b3f;--no:#9b2c2c;max-width:none;padding:0;font-size:11pt;& .sidenote{float:none;border-left:2px solid var(--rule);width:auto;margin:.6rem 0;padding-left:.8rem}& pre{white-space:pre-wrap}& a{color:var(--ink);text-decoration:none}& a[href^=http]:after{content:" (" attr(href) ")";color:var(--ink-faint);font-size:.7em}& .quiz,& .ask,& .footer-nav{display:none}& h2{break-after:avoid}& pre,& .callout,& table{break-inside:avoid}& .recall>:not(summary){display:block}}}