.home .hero{padding-top:30px;padding-bottom:10px}.home h1{font:700 clamp(40px,6vw,72px)/1.15 var(--font-hand);margin:10px 0 14px}.home .sub{font-size:19px;color:var(--ink2);margin:0 0 22px;max-width:760px}.home .search{width:min(560px,100%);font:inherit;font-size:17px;color:var(--ink);background:transparent;border:0;border-bottom:2.5px solid var(--ink);padding:10px 2px;outline:none}.home .search::placeholder{color:var(--mute)}.home .search:focus{border-bottom-color:var(--blue)}.start{display:flex;gap:26px;align-items:center;margin:36px 0 10px;padding:22px 26px;border:1.5px solid var(--edge);border-radius:18px;background:var(--board);text-decoration:none;max-width:860px}.start:hover{border-color:var(--ink)}.start svg{width:200px;flex:none}.start .s-k{font:700 14px var(--font-hand);color:var(--red)}.start .s-t{font:700 30px/1.3 var(--font-hand)}.start .s-d{color:var(--ink2);font-size:16px;margin:4px 0 12px}.start .s-go{display:inline-block;background:var(--ink);color:var(--page);font-weight:700;padding:8px 16px;border-radius:10px;font-size:15px}.home .body{display:grid;grid-template-columns:200px 1fr;gap:40px;margin-top:40px;align-items:start}.index{position:sticky;top:16px;display:flex;flex-direction:column;gap:2px}.index button{display:flex;align-items:center;gap:10px;text-align:left;border:0;background:none;padding:8px 10px;border-radius:10px;font-size:15px;color:var(--ink2);cursor:pointer}.index button small{margin-left:auto;color:var(--mute);font-size:12px}.index button.on,.index button:hover{background:var(--soft);color:var(--ink);font-weight:700}.dot{width:12px;height:12px;border-radius:4px;flex:none}.dot.y{background:var(--y)}.dot.p{background:var(--p)}.dot.g{background:var(--g)}.dot.b{background:var(--b)}.dot.o{background:var(--o)}.grp{padding-bottom:40px;scroll-margin-top:16px}.grp header{display:flex;gap:16px;align-items:center;margin-bottom:8px}.grp header svg{width:72px;height:58px;flex:none}.grp header .dd{stroke:var(--ink);stroke-width:2.4}.grp h2{font:700 32px/1.3 var(--font-hand);margin:0}.grp header p{margin:0;color:var(--ink2);font-size:15px}.trk{margin-top:18px}.trk h3{font-size:15px;font-weight:700;margin:0 0 6px;color:var(--ink)}.trk h3 span{font-weight:400;color:var(--mute);margin-left:10px;font-size:14px}.list{display:grid;grid-template-columns:1fr 1fr;column-gap:28px}.course{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:14px;padding:12px 4px;border-top:1.5px solid var(--edge);text-decoration:none}.course .c-t{font-weight:700;font-size:16px;line-height:1.45}.course .c-b{grid-column:1;color:var(--mute);font-size:14px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.course .c-m{grid-column:2;grid-row:1/3;align-self:center;font-size:13px;color:var(--mute);white-space:nowrap}.course.open{cursor:pointer}.course.open:hover .c-t{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}.none{color:var(--mute)}@media(max-width:900px){.home .body{grid-template-columns:1fr;gap:10px}.index{position:sticky;top:0;z-index:2;flex-direction:row;overflow-x:auto;background:var(--page);padding:8px 0;gap:4px}.index button{white-space:nowrap;padding:6px 10px}.index button small{margin-left:6px}.list{grid-template-columns:1fr}.start{flex-direction:column;align-items:flex-start}.start svg{width:160px}}.course-page{display:grid;grid-template-columns:300px minmax(0,1fr);gap:8px;max-width:1360px;margin:0 auto;padding:0 20px 0 28px;align-items:start}.course-side{position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto;padding:8px 8px 24px 0;border-right:1.5px solid var(--edge)}.course-main .wrap{max-width:none;padding:0 0 0 28px}.course-bar,.course-drawer{display:none}.toc-home{font-size:14px;color:var(--mute);text-decoration:none}.toc-home:hover{color:var(--ink)}.toc-course{font:700 24px/1.35 var(--font-hand);margin:12px 0 10px}.toc-prog{font-size:13px;color:var(--mute);margin-bottom:14px}.toc-prog i{display:block;height:6px;border-radius:3px;background:var(--soft);margin-top:6px;overflow:hidden}.toc-prog b{display:block;height:100%;background:var(--g)}.toc ol{list-style:none;margin:0;padding:0}.toc li a,.toc li span.off{display:grid;grid-template-columns:30px 1fr;gap:6px;padding:9px 10px;border-radius:10px;text-decoration:none;font-size:15px;line-height:1.45;color:var(--ink2)}.toc li a:hover{background:var(--soft);color:var(--ink)}.toc .n{font:700 13px var(--font-body);color:var(--mute);padding-top:2px}.toc .done .n{color:#2fa36b;font-size:15px}.toc .cur{background:var(--soft);color:var(--ink);font-weight:700;box-shadow:inset 3px 0 0 var(--ink)}.toc .off{color:var(--mute);cursor:default}.toc small{grid-column:2;font-size:12px;color:var(--mute)}.course-main .lesson-end{margin:40px 0 90px}.lesson-end{display:flex;flex-direction:column;gap:14px;align-items:flex-start}.le-mark{border:2px solid var(--ink);background:var(--board);color:var(--ink);border-radius:10px;padding:10px 18px;font-weight:700;font-size:16px;cursor:pointer}.le-done{display:flex;gap:14px;align-items:center;font-size:17px}.le-done button{border:0;background:none;color:var(--mute);text-decoration:underline;cursor:pointer;font-size:14px}.le-next{font:700 20px var(--font-hand);text-decoration:none;border-bottom:2.5px solid var(--ink)}.le-soon{color:var(--mute);margin:0}.course-main .lesson .refs{margin-bottom:20px}@media(max-width:1000px){.course-page{grid-template-columns:1fr;padding:0}.course-side{display:none}.course-main .wrap{padding:0 16px}.course-bar{display:block;position:sticky;top:0;z-index:3;background:var(--page);border-bottom:1.5px solid var(--edge);padding:8px 16px}.course-bar button{border:0;background:none;font-size:15px;font-weight:700;color:var(--ink);cursor:pointer;padding:6px 0}.course-drawer{display:block;position:sticky;top:46px;z-index:3;background:var(--page);border-bottom:1.5px solid var(--edge);padding:8px 16px 14px;max-height:70vh;overflow:auto}}.exp .course-side,.exp .course-bar,.exp .course-drawer,.exp .lesson-end{display:none}.exp .course-page{display:block;padding:0;max-width:none}.exp .course-main .wrap{padding:0}:root,[data-theme=white]{--page:#ffffff;--board:#ffffff;--edge:#e9e9ec;--ink:#1f1f24;--ink2:#4a4a52;--mute:#8b8b93;--red:#e5484d;--blue:#2f6fdb;--y:#ffe066;--p:#ffb8cc;--g:#b6efc0;--b:#bfdfff;--o:#ffd09e;--hl:1;--soft:#f6f6f7}[data-theme=beige]{--page:#f6f0e4;--board:#fbf7ee;--edge:#e6dcc8;--ink:#2b2620;--ink2:#564e43;--mute:#8f8473;--red:#d9443f;--blue:#2f63c4;--y:#ffd84d;--p:#ffb0c2;--g:#a9e6b4;--b:#b4d6fb;--o:#ffc78f;--hl:1;--soft:#f1e9d9}[data-theme=black]{--page:#111214;--board:#18191c;--edge:#2a2b30;--ink:#ecebe6;--ink2:#c3c2bc;--mute:#8d8c86;--red:#ff6b6b;--blue:#6fa3ff;--y:#ffe066;--p:#ff8fb1;--g:#7fe39a;--b:#7fbfff;--o:#ffb366;--hl:.38;--soft:#1f2024}:root{--font-body:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;--font-hand:"LXGW WenKai TC","Noto Sans TC",cursive;--c-badge-1:#e5484d;--c-badge-2:#f08c2e;--c-badge-3:#2fa36b;--c-badge-4:#2f6fdb;--c-badge-5:#9b6bdf}html[lang=en]{--font-body:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--font-hand:"Patrick Hand","LXGW WenKai TC",cursive}html[lang=zh-CN]{--font-body:"Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;--font-hand:"LXGW WenKai TC","Noto Sans SC",cursive}html[lang=ja]{--font-body:"Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,sans-serif;--font-hand:"LXGW WenKai TC","Noto Sans JP",cursive}*{box-sizing:border-box}body{margin:0;background:var(--page);color:var(--ink);font:400 17px/1.8 var(--font-body);transition:background .2s,color .2s}a{color:inherit}button{font-family:inherit}.hand{font-family:var(--font-hand)}.wrap{max-width:1120px;margin:0 auto;padding:0 28px}@media(max-width:700px){.wrap{padding:0 16px}}.hl{padding:0 3px;margin:0 -1px;border-radius:3px 6px 4px 7px;-webkit-box-decoration-break:clone;box-decoration-break:clone;background-size:100% 62%;background-repeat:no-repeat;background-position:0 78%;font-weight:700;color:var(--ink)}[data-theme=black] .hl{color:#fff}.hl.y{background-image:linear-gradient(100deg,color-mix(in srgb,var(--y) calc(var(--hl)*100%),transparent),color-mix(in srgb,var(--y) calc(var(--hl)*85%),transparent))}.hl.p{background-image:linear-gradient(100deg,color-mix(in srgb,var(--p) calc(var(--hl)*100%),transparent),color-mix(in srgb,var(--p) calc(var(--hl)*85%),transparent))}.hl.g{background-image:linear-gradient(100deg,color-mix(in srgb,var(--g) calc(var(--hl)*100%),transparent),color-mix(in srgb,var(--g) calc(var(--hl)*85%),transparent))}.hl.b{background-image:linear-gradient(100deg,color-mix(in srgb,var(--b) calc(var(--hl)*100%),transparent),color-mix(in srgb,var(--b) calc(var(--hl)*85%),transparent))}.hl.o{background-image:linear-gradient(100deg,color-mix(in srgb,var(--o) calc(var(--hl)*100%),transparent),color-mix(in srgb,var(--o) calc(var(--hl)*85%),transparent))}.red{color:var(--red);font-weight:700}.k{stroke:var(--ink);fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.k2{stroke:var(--ink);fill:none;stroke-width:2.5;stroke-linecap:round}.r{stroke:var(--red);fill:none;stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round}.bl{stroke:var(--blue);fill:none;stroke-width:3.5;stroke-linecap:round}.fk{fill:var(--ink)}.fm{fill:var(--mute)}.fr{fill:var(--red)}.fb{fill:var(--blue)}.fbd{fill:var(--board)}.hy{fill:var(--y);opacity:var(--hl)}.hp{fill:var(--p);opacity:var(--hl)}.hg{fill:var(--g);opacity:var(--hl)}.hb{fill:var(--b);opacity:var(--hl)}.ho{fill:var(--o);opacity:var(--hl)}.ty{fill:var(--y)}.tp{fill:var(--p)}.tg{fill:var(--g)}.tb{fill:var(--b)}.to{fill:var(--o)}.sym{fill:#1f1f24}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:18px;padding-bottom:18px;flex-wrap:wrap}.brand{display:flex;align-items:baseline;gap:10px;text-decoration:none}.brand b{font:700 26px var(--font-hand)}.brand span{font-size:13px;color:var(--mute)}.switches{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.seg{display:flex;gap:4px}.pick{border:1.5px solid var(--edge);background:var(--board);color:var(--ink);border-radius:8px;padding:4px 8px;font-size:13px;cursor:pointer;font-family:inherit}.pick:focus-visible{outline:2px solid var(--ink);outline-offset:1px}.seg button{border:1.5px solid var(--edge);background:var(--board);color:var(--ink2);border-radius:8px;padding:3px 10px;font-size:13px;cursor:pointer}.seg button[aria-pressed=true]{border-color:var(--ink);color:var(--ink);font-weight:700}.route-loading{position:fixed;top:0;left:0;right:0;height:3px;z-index:50;overflow:hidden;background:transparent}.route-loading:after{content:"";position:absolute;top:0;bottom:0;width:30%;background:var(--ink);animation:route-bar 1s ease-in-out infinite}@keyframes route-bar{0%{left:-30%}to{left:100%}}