:root{--bg:#f6f8fb;--surface:#fff;--text:#1b2430;--muted:#5f6b7a;--border:#dfe5ec;--accent:#0468d7;--accent-soft:#e3f0ff;--good:#1a8a4c;--good-soft:#e2f6ea;--bad:#c0392b;--bad-soft:#fdecea;--warn-soft:#fff4d6;--code-bg:#111927;--code-text:#e4e9f2;--sidebar-width:290px;--radius:12px;color:var(--text);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.65}@media (prefers-color-scheme:dark){:root{--bg:#0e141c;--surface:#161e29;--text:#e6ebf2;--muted:#98a4b3;--border:#283341;--accent:#5fb0ff;--accent-soft:#14304f;--good:#58d08c;--good-soft:#143424;--bad:#ff8a7a;--bad-soft:#3d1c18;--warn-soft:#3a3013;--code-bg:#0a1018}}*{box-sizing:border-box}body{background:var(--bg);margin:0}a{color:var(--accent)}button{font:inherit;color:inherit;cursor:pointer}.layout{min-height:100vh}.topbar{display:none}.sidebar{width:var(--sidebar-width);background:var(--surface);border-right:1px solid var(--border);padding:20px 14px 28px;position:fixed;inset:0 auto 0 0;overflow-y:auto}.backdrop{display:none}main{margin-left:var(--sidebar-width);padding:40px 32px 80px}.page{max-width:800px;margin:0 auto}.brand{color:var(--text);align-items:center;gap:8px;padding:4px 10px 14px;font-size:1.15rem;font-weight:700;text-decoration:none;display:flex}.brand-logo{font-size:1.4rem}.overall{color:var(--muted);padding:0 10px 14px;font-size:.8rem}.bar{background:var(--border);border-radius:99px;height:8px;margin-bottom:6px;overflow:hidden}.bar-fill{background:var(--accent);border-radius:99px;height:100%;transition:width .3s}.nav-module{margin-top:14px}.nav-module-title{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:4px 10px;font-size:.75rem;font-weight:700}.nav-lesson{color:var(--text);border-radius:8px;align-items:center;gap:10px;padding:6px 10px;font-size:.92rem;text-decoration:none;display:flex}.nav-lesson:hover{background:var(--bg)}.nav-lesson.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.check{border:2px solid var(--border);border-radius:50%;flex:none;place-items:center;width:18px;height:18px;font-size:.7rem;font-weight:700;line-height:1;display:inline-grid}.check.done{border-color:var(--good);background:var(--good);color:#fff}.reset{color:var(--muted);background:0 0;border:0;margin:24px 10px 0;padding:0;font-size:.8rem;text-decoration:underline}.button{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:10px;padding:10px 18px;font-weight:600;text-decoration:none;display:inline-block}.button:hover{border-color:var(--accent)}.button.primary{border-color:var(--accent);background:var(--accent);color:#fff}@media (prefers-color-scheme:dark){.button.primary{color:#06121f}}.hero{border:1px solid var(--border);border-radius:var(--radius);background:linear-gradient(135deg, var(--accent-soft), var(--surface) 70%);margin-bottom:32px;padding:32px}.hero h1{margin:0 0 8px;font-size:2rem;line-height:1.2}.hero p{max-width:60ch;color:var(--muted);margin:0 0 20px}.modules{gap:16px;display:grid}.module-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:22px 24px}.module-card header{gap:14px;display:flex}.module-emoji{font-size:1.8rem;line-height:1.3}.module-card h2{margin:0;font-size:1.15rem}.module-card header p{color:var(--muted);margin:2px 0 0;font-size:.92rem}.module-meta{color:var(--muted);white-space:nowrap;align-items:center;gap:12px;margin:14px 0 6px;font-size:.8rem;display:flex}.module-meta .bar{flex:1;margin:0}.module-card ol{margin:0;padding:0;list-style:none}.module-card li a{color:var(--text);border-radius:8px;align-items:center;gap:10px;margin:0 -8px;padding:6px 8px;text-decoration:none;display:flex}.module-card li a:hover{background:var(--bg)}.crumb{color:var(--muted);margin:0;font-size:.85rem}.lesson h1{margin:4px 0 24px;font-size:2rem;line-height:1.2}.lesson h2{margin:36px 0 8px;font-size:1.3rem}.lesson p,.lesson ul{margin:12px 0}.lesson li{margin:4px 0}.lesson :not(pre)>code{background:var(--accent-soft);border-radius:6px;padding:2px 6px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em}.note{border-radius:var(--radius);background:var(--accent-soft);gap:12px;margin:18px 0;padding:12px 16px;display:flex}.note.warn{background:var(--warn-soft)}.note p{margin:0}.code{border-radius:var(--radius);background:var(--code-bg);color:var(--code-text);margin:18px 0;overflow:hidden}.code-bar{border-bottom:1px solid #ffffff1a;align-items:center;gap:8px;padding:6px 8px 6px 16px;font-size:.8rem;display:flex}.code-title{color:#9aa7b8;flex:1}.code-bar button{color:var(--code-text);background:0 0;border:1px solid #ffffff2b;border-radius:7px;padding:4px 10px}.code-bar button:hover{background:#ffffff1a}.code-bar button.run{color:#06121f;background:#5fb0ff;border-color:#5fb0ff;font-weight:600}.code pre{tab-size:2;margin:0;padding:16px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.86rem;line-height:1.55;overflow-x:auto}.hljs-comment{color:#7d8ba0;font-style:italic}.hljs-keyword,.hljs-literal{color:#ff9ac1}.hljs-string,.hljs-subst{color:#a5e075}.hljs-number{color:#ffc66d}.hljs-built_in,.hljs-type,.hljs-title{color:#7cc7ff}.hljs-meta,.hljs-attr{color:#c9a6ff}.dartpad{border:0;border-top:1px solid #ffffff1a;width:100%;height:560px;display:block}.lesson .dartpad-hint{color:#9aa7b8;margin:0;padding:8px 16px 10px;font-size:.78rem}.exercise{border:2px dashed var(--accent);border-radius:var(--radius);background:var(--surface);margin:28px 0;padding:18px 20px}.exercise-label{letter-spacing:.04em;text-transform:uppercase;color:var(--accent);font-size:.75rem;font-weight:700}.exercise h3{margin:2px 0 0;font-size:1.1rem}.exercise details{margin-top:8px}.exercise summary{color:var(--accent);cursor:pointer;font-weight:600}.quiz{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);margin-top:44px;padding:6px 24px 20px}.quiz h2{margin-top:18px}.question+.question{margin-top:26px}.question-text{font-weight:600}.options{gap:8px;display:grid}.option{border:1px solid var(--border);background:var(--bg);text-align:left;border-radius:10px;padding:10px 14px}.option:hover{border-color:var(--accent)}.option.right{border-color:var(--good);background:var(--good-soft)}.option.wrong{border-color:var(--bad);background:var(--bad-soft)}.lesson .feedback{border-radius:10px;margin:10px 0 0;padding:10px 14px;font-size:.93rem}.feedback.right{background:var(--good-soft)}.feedback.wrong{background:var(--bad-soft)}.lesson-nav{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:36px;display:flex}.lesson-nav-right{flex-wrap:wrap;gap:12px;display:flex}@media (width<=860px){.topbar{z-index:10;border-bottom:1px solid var(--border);background:var(--surface);align-items:center;gap:12px;padding:10px 16px;display:flex;position:sticky;top:0}.topbar a{color:var(--text);font-weight:700;text-decoration:none}.topbar button{border:1px solid var(--border);background:0 0;border-radius:8px;padding:4px 10px;font-size:1.1rem}.sidebar{z-index:30;width:min(var(--sidebar-width), 85vw);transition:transform .2s;transform:translate(-100%)}.menu-open .sidebar{transform:none}.menu-open .backdrop{z-index:20;background:#0008;display:block;position:fixed;inset:0}main{margin-left:0;padding:24px 16px 64px}.hero{padding:22px}.hero h1,.lesson h1{font-size:1.6rem}.dartpad{height:480px}}