.hub .tut-layout{display:grid;grid-template-columns:290px minmax(0,740px) 220px;justify-content:space-between;gap:40px;margin-top:44px;align-items:start}.hub .tut-side,.hub .tut-toc{position:sticky;top:92px;max-height:calc(100dvh - 112px)}.hub .tut-side{display:flex;flex-direction:column;gap:14px;padding:4px;margin:-4px}.hub .tut-side>*{flex:none}.hub .tut-side>.tut-mine{flex:0 1 auto;min-height:0;overflow-y:auto;scrollbar-width:thin}.hub .tut-side>b,.hub .tut-toc .toc>b{font:600 11px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}.hub .tut-side>b{margin-top:8px}.hub .tut-mine{list-style:none;margin:0;padding:0;display:grid;gap:4px}.hub .tut-mine a{display:grid;grid-template-columns:24px minmax(0,1fr);gap:8px;padding:8px 12px;border-radius:9px;font-size:14px;line-height:1.35;color:var(--ink-2);transition:color .15s,background .15s,border-color .15s}.hub .tut-mine a:hover{color:var(--ink);background:var(--card-2)}.hub .tut-mine a[aria-current]{color:var(--at);font-weight:600;background:color-mix(in srgb,var(--a) 13%,transparent)}.hub .tut-all{font-size:13.5px;color:var(--ink-2);padding-left:4px}.hub .tut-all:hover{color:var(--ink)}.hub .tut-side .tut-open{width:100%;justify-content:center;height:44px;padding:0 14px;font-size:14px;white-space:nowrap}.hub .tut-toc{display:flex;flex-direction:column;gap:18px}.hub .tut-toc .toc{position:static;min-height:0;overflow-y:auto;scrollbar-width:thin}.hub .tut-toc .toc a[aria-current]{color:var(--at);font-weight:600}.hub .tut-toc .toc a[aria-current]:after{content:"";position:absolute;left:-19px;top:6px;bottom:6px;width:2px;border-radius:2px;background:var(--a,var(--ink))}.hub .phero-ctas.tut-narrow,.hub .post-meta>.tut-narrow{display:none}@media (max-width:1240px){.hub .tut-layout{grid-template-columns:minmax(0,740px) 230px}.hub .tut-side{display:none}.hub .phero-ctas.tut-narrow,.hub .post-meta>.tut-narrow{display:inline-flex}}@media (max-width:980px){.hub .tut-layout{grid-template-columns:1fr;gap:24px}.hub .tut-toc{position:static;max-height:none;order:-1}}.hub .tut-text{counter-reset:step}.hub .tut-text h2{counter-increment:step}.hub .tut-text h2:after{content:"Step " counter(step);display:block;order:-1;margin-bottom:6px;font:600 12px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--at)}.hub .tut-text h2{display:flex;flex-direction:column}.hub .tut-text h2 .md-anchor{display:none}.hub .lesson-of{display:flex;align-items:center;gap:12px;margin-top:26px}.hub .lesson-of i{width:90px;height:5px;border-radius:99px;background:linear-gradient(90deg,var(--btn,var(--a)) calc(var(--at-pct) * 1%),color-mix(in srgb,var(--a) 18%,var(--rule)) 0)}.hub .lv-chip:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lv)}.hub .tm-n{font:700 12px var(--font-mono);color:var(--ink-3);padding-top:2px;position:relative}.hub .tut-mine a[aria-current] .tm-n{color:var(--at)}.hub .tut-mine a[data-done] .tm-n{color:transparent}.hub .tut-mine a[data-done] .tm-n:after{content:"✓";position:absolute;left:0;top:1px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;color:var(--bink);background:var(--btn,var(--a))}.hub .tut-course{display:grid;gap:8px;padding:14px;border-radius:14px;border:1px solid var(--rule);background:var(--card);color:var(--ink-2)}.hub .tut-course:hover{border-color:color-mix(in srgb,var(--a) 45%,var(--rule))}.hub .tut-course small{font:12px var(--font-mono);color:var(--ink-3)}.hub .tut-facts{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12.5px;color:var(--ink-2)}.hub .tut-facts>span{display:inline-flex;align-items:center;gap:6px}.hub .tut-facts svg{color:var(--ink-3)}.hub .tut-meter{height:6px;border-radius:99px;background:color-mix(in srgb,var(--a) 16%,var(--bg-2));overflow:hidden}.hub .tut-meter i{display:block;height:100%;width:calc(var(--pct, 0) * 1%);background:var(--btn,var(--a));border-radius:inherit;transition:width .6s var(--ease)}.hub .tut-done{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:44px;padding:22px;border-radius:var(--r-mid);border:1px dashed color-mix(in srgb,var(--a) 45%,var(--rule));font-size:14px;color:var(--ink-3)}.hub .tut-done.is-done{border-style:solid;background:color-mix(in srgb,var(--a) 9%,var(--card))}.hub .tut-done.is-done .tut-done-btn{color:var(--bink);background:var(--btn,var(--a));border-color:transparent}.hub .lesson-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.hub .lesson-nav a{display:grid;gap:6px;padding:18px 20px;border-radius:var(--r-mid);border:1px solid var(--rule);background:var(--card);transition:border-color .2s,transform .3s var(--ease)}.hub .lesson-nav a:hover{border-color:color-mix(in srgb,var(--a) 50%,var(--rule));transform:translateY(-2px)}.hub .lesson-nav small{display:inline-flex;align-items:center;gap:6px;font:600 11.5px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--at)}.hub .lesson-nav b{font-size:16px;line-height:1.3;color:var(--ink)}.hub .ln-next{text-align:right;justify-items:end}@media (max-width:620px){.hub .lesson-nav{grid-template-columns:1fr}}.hub .course-h{max-width:980px}.hub .course-h .road{margin-top:30px;max-width:720px}.hub .course-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:start;margin-top:30px}.hub .course-intro{margin-top:18px}.hub .syl-h{margin:0 0 18px;font-size:28px;letter-spacing:-.03em}.hub .syl-level{position:relative;padding-left:22px;margin-bottom:22px}.hub .syl-level:before{content:"";position:absolute;left:4px;top:26px;bottom:6px;width:2px;border-radius:2px;background:color-mix(in srgb,var(--lv) 55%,transparent)}.hub .syl-lv{position:relative;display:block;margin-bottom:10px;font:600 11.5px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}.hub .syl-lv:before{content:"";position:absolute;left:-22px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--lv);box-shadow:0 0 0 4px color-mix(in srgb,var(--lv) 22%,transparent)}.hub .syllabus ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}.hub .syl-item{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:14px;align-items:start;padding:16px 18px;border-radius:var(--r-mid);border:1px solid var(--rule);background:var(--card);color:var(--ink-2);transition:border-color .2s,transform .3s var(--ease)}.hub .syl-item:hover{border-color:color-mix(in srgb,var(--a) 50%,var(--rule));transform:translateX(3px)}.hub .syl-item>svg{align-self:center;color:var(--ink-3)}.hub .syl-n{position:relative;font:700 15px var(--font-mono);color:var(--at);padding-top:1px}.hub .syl-body{display:grid;gap:5px}.hub .syl-body b{font-size:16.5px;line-height:1.3;color:var(--ink)}.hub .syl-body>span{font-size:14px;line-height:1.5}.hub .syl-body small{display:flex;flex-wrap:wrap;gap:4px 14px;font:12px var(--font-mono);color:var(--ink-3);margin-top:2px}.hub .syl-vid{display:inline-flex;align-items:center;gap:5px;color:var(--at)}.hub .syl-item[data-done] .syl-n{color:transparent}.hub .syl-item[data-done] .syl-n:after{content:"✓";position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:13px;color:var(--bink);background:var(--btn,var(--a))}@media (max-width:980px){.hub .course-body{grid-template-columns:1fr}}