:root{--desk:#e9e3d6;--paper:#fffdf6;--rule:#dce7f3;--margin:#f0a8a8;--ink:#1e2b4a;--ink-blue:#1f3a93;--ink-green:#2c7a3f;--ink-red:#b3261e;--muted:#667085;--c0:#ffd3de;--c1:#cfe2ff;--c2:#cdf2d3;--c3:#e4d8ff;--c4:#fff0a6;--marker:#fff27a;--line-h:30px;--hand:"Patrick Hand", "Itim", "Segoe Print", cursive;--head:"Itim", "Patrick Hand", cursive;--mono:"JetBrains Mono", ui-monospace, Consolas, monospace;--wobbly:255px 12px 225px 12px / 12px 225px 12px 255px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{margin:0}body{background:var(--desk);color:var(--ink);font-family:var(--hand);-webkit-font-smoothing:antialiased;font-variant-ligatures:none;font-size:19px;line-height:1.5;overflow-x:hidden}a{color:var(--ink-blue)}button{font:inherit;cursor:pointer}:focus-visible{outline-offset:2px;outline:3px solid #f59e0b}.muted{color:var(--muted)}.topbar{z-index:10;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:2px solid var(--ink);background:#fffdf6f0;align-items:center;gap:12px;padding:10px 16px;display:flex;position:sticky;top:0}.topbar a{text-decoration:none}.brand{font-family:var(--head);color:var(--ink);white-space:nowrap;font-size:22px}.brand span{background:linear-gradient(transparent 55%, var(--c2) 55%)}.topbar .crumb{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.topbar .spacer{flex:1}.container{max-width:1100px;margin:0 auto;padding:24px 16px 64px}.btn,.btn-run,.btn-ghost{border:2px solid var(--ink);border-radius:var(--wobbly);background:var(--paper);color:var(--ink);align-items:center;gap:6px;padding:4px 14px;line-height:1.4;text-decoration:none;transition:transform .1s,box-shadow .1s;display:inline-flex}.btn:hover,.btn-run:hover,.btn-ghost:hover{box-shadow:3px 3px 0 var(--ink);transform:translate(-1px,-1px)}.btn.primary,.btn-run{background:var(--c2)}.btn[aria-disabled=true],.btn:disabled{opacity:.45;pointer-events:none}.btn-ghost{background:0 0;border-color:#0000}.hero{gap:8px;margin-bottom:28px;display:grid}.hero h1{font-family:var(--head);margin:0;font-size:clamp(30px,5vw,44px);line-height:1.15}.hero h1 span{background:linear-gradient(transparent 50%, var(--c4) 50%);padding:0 6px}.hero p{color:var(--muted);max-width:62ch;margin:0}.resume{background:var(--paper);border:2px solid var(--ink);border-radius:var(--wobbly);box-shadow:4px 4px 0 var(--ink);flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:28px;padding:14px 18px;display:flex}.resume strong{font-family:var(--head)}.section-title{font-family:var(--head);margin:36px 0 6px;font-size:26px}.section-title+p{color:var(--muted);margin:0 0 14px}.tabs{flex-wrap:wrap;gap:8px;margin:10px 0 14px;display:flex}.tab{border:2px solid var(--ink);border-radius:var(--wobbly);color:var(--ink);background:0 0;padding:2px 14px}.tab[aria-selected=true]{background:var(--c4);box-shadow:3px 3px 0 var(--ink)}.track{background:var(--paper);border:2px solid var(--ink);border-radius:14px;padding:16px 18px}.track-summary{color:var(--muted);margin:0 0 8px}.phase{border-top:1.5px dashed #b9c3d6;grid-template-columns:170px 1fr;gap:10px;padding:10px 0;display:grid}.phase:first-of-type{border-top:0}.phase-title{font-family:var(--head)}.chips{flex-wrap:wrap;align-items:center;gap:6px 4px;display:flex}.chip{border:1.5px solid var(--ink);color:var(--ink);background:#fff;border-radius:999px;align-items:baseline;gap:6px;padding:1px 10px;font-size:17px;text-decoration:none;display:inline-flex}.chip small{color:var(--muted);font-size:14px}.chip.ready{background:var(--c2)}.chip-arrow{color:var(--muted)}.shelf{margin-top:30px}.shelf-head{border-bottom:3px solid #8a6f4d;flex-wrap:wrap;align-items:baseline;gap:12px;padding-bottom:4px;display:flex}.shelf-head h3{font-family:var(--head);margin:0;font-size:24px}.shelf-head p{color:var(--muted);margin:0;font-size:16px}.books{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;padding:16px 0 6px;display:grid}.book-card{background:var(--paper);min-height:170px;color:var(--ink);border:2px solid var(--ink);border-radius:6px 14px 14px 6px;flex-direction:column;gap:4px;padding:14px 14px 12px 26px;text-decoration:none;transition:transform .12s;display:flex;position:relative;box-shadow:3px 4px #1e2b4ad9}.book-card:hover{transform:translateY(-3px)rotate(-.4deg)}.book-card:before{content:"";background:var(--spine,var(--c1));border-right:2px solid var(--ink);border-radius:4px 0 0 4px;width:14px;position:absolute;inset:0 auto 0 0}.book-code{font-family:var(--mono);color:var(--muted);font-size:12px}.book-card h4{font-family:var(--head);margin:0;font-size:20px;line-height:1.2}.book-card .ver{color:var(--muted);font-size:15px}.book-card .meta{justify-content:space-between;gap:8px;margin-top:auto;font-size:15px;display:flex}.badge{border:1.5px solid var(--ink);background:var(--c4);white-space:nowrap;border-radius:999px;padding:0 8px;font-size:13px}.badge.opt{background:#eee}.bar{border:1.5px solid var(--ink);background:#fff;border-radius:99px;height:8px;overflow:hidden}.bar>i{background:var(--ink-green);height:100%;display:block}.book-head{background:var(--paper);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);border-radius:14px;gap:10px;margin-bottom:22px;padding:22px 24px;display:grid}.book-head h1{font-family:var(--head);margin:0;font-size:clamp(28px,4.5vw,40px);line-height:1.15}.book-head h1 span{background:linear-gradient(transparent 55%, var(--spine,var(--c1)) 55%)}.book-head .facts{color:var(--muted);flex-wrap:wrap;gap:6px 18px;font-size:17px;display:flex}.book-head .actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.book-grid{grid-template-columns:minmax(0,1fr) 300px;align-items:start;gap:22px;display:grid}.toc-chapter{background:var(--paper);border:2px solid var(--ink);border-radius:12px;margin-bottom:14px;padding:12px 16px}.toc-chapter h3{font-family:var(--head);margin:0 0 6px;font-size:21px}.toc-chapter ol{margin:0;padding:0;list-style:none}.toc-lesson{border-top:1.5px dashed #c9d2e3;grid-template-columns:30px minmax(0,1fr) auto;align-items:start;gap:8px;padding:6px 0;display:grid}.toc-lesson:first-child{border-top:0}.toc-lesson .num{font-family:var(--mono);color:var(--muted);padding-top:4px;font-size:13px}.toc-lesson a,.toc-lesson .title{font-size:18px;line-height:1.3}.toc-lesson .goal{color:var(--muted);font-size:15px;line-height:1.35;display:block}.toc-lesson.pending .title{color:var(--muted)}.check{border:2px solid var(--ink);background:#fff;border-radius:6px;place-items:center;width:26px;height:26px;padding:0;font-size:16px;line-height:1;display:grid}.check[aria-pressed=true]{background:var(--c2)}.soon{color:var(--muted);border:1.5px dashed var(--muted);white-space:nowrap;border-radius:999px;padding:0 8px;font-size:13px}.side-card{background:var(--paper);border:2px solid var(--ink);border-radius:12px;margin-bottom:14px;padding:12px 16px}.side-card h3{font-family:var(--head);margin:0 0 6px;font-size:20px}.side-card ul{margin:0;padding-left:20px}.side-card li{margin:2px 0;font-size:17px}.reader{max-width:1040px;margin:0 auto;padding:18px 12px 120px}.reader-head{flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 6px 12px;display:flex}.reader-head .lesson-no{font-family:var(--mono);color:var(--muted);font-size:13px}.reader-head h2{font-family:var(--head);margin:0;font-size:22px}.sheet{background-color:var(--paper);background-image:linear-gradient(90deg, transparent 70px, var(--margin) 70px, var(--margin) 72px, transparent 72px), repeating-linear-gradient(transparent 0, transparent calc(var(--line-h) - 1px), var(--rule) calc(var(--line-h) - 1px), var(--rule) var(--line-h));transform-origin:0;background-position:0 0,0 18px;border-radius:4px 10px 10px 4px;min-height:70vh;padding:26px 34px 44px 92px;position:relative;box-shadow:0 1px #d6cfbf,0 12px 28px -10px #281e0a59}.sheet:before{content:"";background:radial-gradient(circle at 13px 13px,#2a2a2a 0 5.5px,#9a9488 6px,#0000 7px) 0 0/26px 34px repeat-y;width:26px;position:absolute;top:14px;bottom:14px;left:10px}.sheet:after{content:"";clip-path:inset(0 13px 0 0);background:radial-gradient(14px 5px at 13px 13px,#0000 0 9px,#3a3a3a 9.5px 11px,#0000 11.5px) 0 0/26px 34px repeat-y;width:26px;position:absolute;top:14px;bottom:14px;left:-9px}.sheet.flip-next{animation:.26s ease-out flipNext}.sheet.flip-prev{animation:.26s ease-out flipPrev}@keyframes flipNext{0%{opacity:0;transform:perspective(1400px)rotateY(-9deg)translate(26px)}}@keyframes flipPrev{0%{opacity:0;transform:perspective(1400px)rotateY(9deg)translate(-26px)}}@media (prefers-reduced-motion:reduce){.sheet.flip-next,.sheet.flip-prev{animation:none}}.pager{z-index:10;padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:2px solid var(--ink);background:#fffdf6f2;justify-content:center;align-items:center;gap:12px;display:flex;position:fixed;bottom:0;left:0;right:0}.dots{flex-wrap:wrap;justify-content:center;display:flex}.dots a{place-items:center;width:24px;height:24px;display:grid}.dots a:after{content:"";border:2px solid var(--ink);background:#fff;border-radius:50%;width:12px;height:12px}.dots a[aria-current=page]:after{background:var(--ink)}.pager .count{font-family:var(--mono);color:var(--muted);text-align:center;min-width:52px;font-size:13px}.note>:first-child{margin-top:0}.note p,.note li{line-height:var(--line-h)}.note p{margin:0 0 var(--line-h)}.note ul,.note ol{margin:0 0 var(--line-h);padding-left:24px}.note li::marker{color:var(--ink-blue)}.note li>p{margin:0}.note-title{text-align:center;font-family:var(--head);letter-spacing:.5px;margin:4px 0 18px;font-size:clamp(28px,4.6vw,40px);font-weight:400;line-height:1.2}.note-title span{background:var(--c2);border-radius:var(--wobbly);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:2px 14px}.note-title+p{font-size:20px}.sec{font-family:var(--head);letter-spacing:.3px;border-radius:var(--wobbly);background:var(--c0);margin:14px 0 6px;padding:0 12px;font-size:22px;font-weight:400;line-height:1.4;display:inline-block}.sec.c1{background:var(--c1)}.sec.c2{background:var(--c2)}.sec.c3{background:var(--c3)}.sec.c4{background:var(--c4)}.sub{font-family:var(--head);text-underline-offset:5px;margin:10px 0 4px;font-size:20px;font-weight:400;-webkit-text-decoration:underline wavy #c45a7a;text-decoration:underline wavy #c45a7a;text-decoration-thickness:1.5px}.hl{background:linear-gradient(transparent 52%, var(--marker) 52%, var(--marker) 92%, transparent 92%);color:inherit;padding:0 2px;font-weight:400}.note code:not(pre code){font-family:var(--mono);color:#24346e;word-break:break-word;-webkit-box-decoration-break:clone;box-decoration-break:clone;background:#eef2fb;border:1px solid #c9d5ee;border-radius:5px;padding:1px 5px;font-size:.78em}.cols{grid-template-columns:repeat(var(--n,2), minmax(0, 1fr));gap:0 28px;margin-bottom:6px;display:grid}.cols>.col+.col{border-left:2px solid var(--ink-blue);padding-left:24px}.col>:last-child{margin-bottom:8px}.note pre{font-family:var(--mono);margin:0 0 var(--line-h);border:2px solid var(--ink-blue);border-radius:10px;padding:12px 14px;font-size:14px;line-height:1.6;overflow-x:auto;background:#fbfcff!important}.note pre code{font-family:inherit}.flow{margin:8px 0 var(--line-h);flex-wrap:wrap;align-items:stretch;gap:10px 0;display:flex}.flow-step{align-items:center;display:flex}.flow-arrow{color:var(--ink-blue);padding:0 8px;font-size:26px}.flow-box{text-align:center;border:2px solid var(--ink-blue);background:var(--c1);border-radius:8px;flex-direction:column;justify-content:center;max-width:220px;padding:6px 14px;line-height:1.25;display:flex}.flow-box strong{font-size:19px;font-weight:400}.flow-box small{color:#3b4a6b;font-size:15px}.flow-box.c0{background:var(--c0)}.flow-box.c2{background:var(--c2)}.flow-box.c3{background:var(--c3)}.flow-box.c4{background:var(--c4)}.tree{font-family:var(--mono);margin:0 0 var(--line-h);border:2px solid var(--ink-blue);background:#fbfcff;border-radius:10px;padding:10px 14px;font-size:14px;line-height:1.7;overflow-x:auto}.tree-row{white-space:pre;grid-template-columns:minmax(max-content,1fr) auto;gap:24px;display:grid}.tree-branch{color:#8592ad}.tree-icon{border:1.6px solid var(--ink-blue);vertical-align:-1px;width:14px;height:11px;margin-right:6px;display:inline-block}.tree-icon.dir{box-shadow:inset 0 3px 0 -1px var(--ink-blue);background:#fff5c9;border-radius:1px 3px 2px 2px}.tree-icon.file{background:#fff;border-radius:1px;width:10px;height:13px}.tree-comment{color:var(--ink-green);font-family:var(--hand);white-space:normal;font-size:17px}.cmd{margin:0 0 var(--line-h);border:2px solid var(--ink-blue);background:#fbfcff;border-radius:10px;display:grid;overflow:hidden}.cmd-row{border-top:1px dashed #c9d5ee;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:baseline;gap:16px;padding:5px 14px;display:grid}.cmd-row:first-child{border-top:0}.cmd-code{font-family:var(--mono);color:#1d2b5c;overflow-wrap:anywhere;font-size:13.5px}.cmd-prompt{color:var(--ink-green)}.cmd-desc{font-size:17px;line-height:1.35}.table-wrap{margin:0 0 var(--line-h);overflow-x:auto}.note table{border-collapse:collapse;background:#fbfcff;min-width:100%;font-size:17px;line-height:1.35}.note th,.note td{border:1.5px solid var(--ink-blue);text-align:left;vertical-align:top;padding:5px 10px}.note th{font-family:var(--head);background:var(--c1);font-weight:400}.example{margin:6px 0 var(--line-h);border:2px dashed var(--ink-blue);background:#ffffff8c;border-radius:12px;padding:10px 16px 2px}.example-head{flex-wrap:wrap;align-items:center;gap:4px 10px;margin-bottom:6px;display:flex}.example-n{font-family:var(--head);background:var(--ink-blue);color:#fff;border-radius:6px;padding:0 10px}.level{border:1.5px solid var(--ink);border-radius:999px;padding:0 9px;font-size:14px}.level-basic{background:var(--c2)}.level-intermediate{background:var(--c1)}.level-advanced{background:var(--c3)}.level-production{background:var(--c0)}.example-title{font-family:var(--head);flex-basis:100%;margin:0;font-size:20px;font-weight:400}.callout{margin:6px 0 var(--line-h);border:2px solid var(--ink);border-radius:var(--wobbly);gap:12px;padding:10px 16px 0;display:flex}.callout-icon{font-size:28px;line-height:1.2}.callout-title{font-family:var(--head);text-underline-offset:4px;text-decoration:underline;margin:0!important}.key-idea{background:#fffbe0}.pitfall{border-color:var(--ink-red);background:#fff0ee}.pitfall .callout-title{color:var(--ink-red)}.diagram{margin:4px 0 var(--line-h);text-align:center;overflow-x:auto}.diagram svg{height:auto;max-width:none!important}.diagram-loading{color:var(--muted);border:2px dashed #b9c3d6;border-radius:10px;padding:24px}.diagram-error{text-align:left;color:var(--ink-red)}.coderun{margin:0 0 var(--line-h);position:relative}.coderun>pre{margin-bottom:0}.coderun>.btn-run{padding:0 10px;font-size:16px;position:absolute;top:8px;right:8px}.coderun.open{border:2px solid var(--ink-blue);background:#fbfcff;border-radius:10px;overflow:hidden}.coderun-bar{border-bottom:1.5px solid var(--ink-blue);background:var(--c1);flex-wrap:wrap;align-items:center;gap:6px 8px;padding:6px 10px;display:flex}.coderun-bar .btn-run,.coderun-bar .btn-ghost{padding:0 10px;font-size:16px}.coderun-lang{font-family:var(--mono);text-transform:uppercase;font-size:12px}.coderun-hint{color:var(--muted);flex:1;font-size:15px}.coderun-editor{width:100%;font:14px/1.6 var(--mono);color:#1d2b5c;resize:vertical;tab-size:2;white-space:pre;background:#fbfcff;border:0;padding:12px 14px;display:block;overflow:auto}.coderun-out{border-top:1.5px solid var(--ink-blue)}.coderun-preview,.coderun-console{padding:22px 10px 8px;position:relative}.coderun-console{border-top:1.5px solid var(--ink-blue);color:#e6e9f2;background:#1e2433;max-height:220px;overflow:auto}.coderun-console .muted{color:#8a93a8;margin:0;font-size:15px}.coderun-label{color:var(--muted);font-size:13px;position:absolute;top:2px;left:10px}.coderun-console .coderun-label{color:#8a93a8}.coderun-preview iframe{resize:vertical;background:#fff;border:0;width:100%;height:260px}.console-only .coderun-preview{clip-path:inset(50%);width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.console-only .coderun-console{border-top:0;min-height:120px}.log{font:13px/1.5 var(--mono);white-space:pre-wrap;word-break:break-word;border-bottom:1px solid #2c3446;padding:2px 0}.log-warn{color:#ffd479}.log-error{color:#ff8a80}.lesson-end{border-top:2px dashed var(--ink-blue);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:18px;padding-top:14px;display:flex}@media (width<=860px){.book-grid{grid-template-columns:1fr}.phase{grid-template-columns:1fr;gap:4px}}@media (width<=720px){body{font-size:18px}.cols{grid-template-columns:minmax(0,1fr)}.cols>.col+.col{border-left:0;border-top:2px dashed var(--ink-blue);padding-top:8px;padding-left:0}.sheet{background-image:linear-gradient(90deg, transparent 38px, var(--margin) 38px, var(--margin) 40px, transparent 40px), repeating-linear-gradient(transparent 0, transparent calc(var(--line-h) - 1px), var(--rule) calc(var(--line-h) - 1px), var(--rule) var(--line-h));padding:18px 14px 32px 46px}.sheet:before{transform-origin:0 0;left:4px;transform:scale(.8)}.sheet:after{display:none}.cmd-row{grid-template-columns:1fr;gap:0}.flow-box{max-width:100%}.tree-row{grid-template-columns:max-content;gap:0}.tree-comment{padding-left:2.2em;font-size:15px}.topbar .crumb{display:none}}