.toc-sidebar{flex-direction:column;flex-shrink:0;width:280px;height:calc(100vh - 100px);display:flex;position:sticky;top:100px;overflow:hidden}.toc-drawer{z-index:1200;pointer-events:none;width:320px;max-width:90vw;transition:transform .28s;position:fixed;inset:0 0 0 auto;transform:translate(100%)}.toc-drawer-open{pointer-events:auto;transform:translate(0)}.toc-drawer-inner{background-color:var(--off-canvas-color);-webkit-backdrop-filter:blur(22px);border-left:1px solid #0000000f;flex-direction:column;height:100%;padding:1.5rem;display:flex;overflow:hidden;box-shadow:-8px 0 32px #00000014}.toc-drawer-inner .toc-sidebar{width:100%;height:100%}.toc-drawer-inner:hover{scrollbar-color:var(--accent-color-tint) transparent}.toc-drawer-inner::-webkit-scrollbar{width:4px}.toc-drawer-inner::-webkit-scrollbar-track{background:0 0}.toc-drawer-inner::-webkit-scrollbar-thumb{background:0 0;border-radius:999px}.toc-drawer-inner:hover::-webkit-scrollbar-thumb{background:var(--accent-color-tint)}.toc-header{border-bottom:1px solid #0000000f;flex-shrink:0;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:14px;display:flex}.toc-title{letter-spacing:.14em;text-transform:uppercase;color:var(--accent-color);margin:0;font-size:.72rem;font-weight:700}.toc-scroll{scrollbar-width:thin;scrollbar-color:transparent transparent;flex:1;min-height:0;padding-bottom:10px;padding-right:6px;overflow:hidden auto}.toc-scroll:hover{scrollbar-color:var(--accent-color-tint) transparent}.toc-scroll::-webkit-scrollbar{width:4px}.toc-scroll::-webkit-scrollbar-track{background:0 0}.toc-scroll::-webkit-scrollbar-thumb{background:0 0;border-radius:999px}.toc-scroll:hover::-webkit-scrollbar-thumb{background:var(--accent-color-tint)}.toc-close-btn{width:34px;height:34px;color:var(--accent-color);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;transition:background .2s;display:flex}.toc-close-btn:hover{background:var(--accent-color-tint)}.toc-list,.toc-children{margin:0;padding:0;list-style:none}.toc-item{margin:2px 0}.toc-children{margin-top:2px}.toc-depth-0{padding-left:0}.toc-depth-1{padding-left:20px}.toc-depth-2{padding-left:30px}.toc-depth-3{padding-left:40px}.toc-depth-4{padding-left:50px}.toc-depth-5{padding-left:60px}.toc-link{width:100%;color:var(--text-muted);overflow-wrap:anywhere;word-break:break-word;-webkit-hyphens:auto;hyphens:auto;border-radius:8px;padding:6px 12px;font-size:.9rem;font-weight:450;line-height:1.55;text-decoration:none;transition:color .18s,background-color .18s;display:block;position:relative}.toc-depth-0>.toc-link{font-weight:600}.toc-depth-1>.toc-link{font-weight:500}.toc-depth-2>.toc-link,.toc-depth-3>.toc-link,.toc-depth-4>.toc-link,.toc-depth-5>.toc-link{font-weight:450}.toc-link:hover{color:var(--accent-color)}.toc-link:focus-visible{outline:2px solid var(--accent-color);outline-offset:2px}.toc-active>.toc-link{color:var(--accent-color);font-weight:600;position:relative}.toc-active>.toc-link:before{content:"";background:var(--accent-color);border-radius:999px;width:3px;height:20px;position:absolute;top:50%;left:-8px;transform:translateY(-50%)}.toc-ancestor>.toc-link{color:var(--accent-color);opacity:.8}.toc-link{transition:background-color .18s,color .18s,transform .18s}.toc-link:hover{transform:translate(3px)}.toc-link{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.toc-item+.toc-item{margin-top:2px}.toc-depth-0{margin-top:10px}.toc-depth-0:first-child{margin-top:0}@media (min-width:1281px){.toc-sidebar{display:flex}.toc-drawer{display:none}}@media (max-width:1280px){.toc-sidebar{display:none}.toc-drawer{display:block}}@media (max-width:640px){.toc-drawer{width:100%;max-width:100%}.toc-drawer-inner{padding:20px 16px}.toc-link{padding:6px 10px}}@media (prefers-reduced-motion:reduce){.toc-link,.toc-sidebar,.toc-drawer,.toc-drawer-inner{scroll-behavior:auto;transition:none}}[data-theme=dark] .toc-drawer-inner{-webkit-backdrop-filter:none;background-color:#111113;border-left:1px solid #1c1c1e;box-shadow:-4px 0 24px #00000080}[data-theme=dark] .toc-header{border-bottom:1px solid #1c1c1e}[data-theme=dark] .toc-title{color:var(--accent-color)}[data-theme=dark] .toc-depth-0>.toc-link{color:var(--text-muted)}[data-theme=dark] .toc-link:hover{color:#a1a1aa;background:#18181b;border-radius:5px}[data-theme=dark] .toc-active>.toc-link{color:var(--accent-color)}[data-theme=dark] .toc-active>.toc-link:before{background:var(--accent-color)}[data-theme=dark] .toc-ancestor>.toc-link{color:var(--accent-color)}[data-theme=dark] .toc-close-btn{color:#71717a}[data-theme=dark] .toc-close-btn:hover{color:#e4e4e7;background:#27272a}[data-theme=dark] .toc-scroll:hover{scrollbar-color:#3f3f46 transparent}[data-theme=dark] .toc-scroll:hover::-webkit-scrollbar-thumb{background:#3f3f46}[data-theme=dark] .toc-drawer-inner:hover::-webkit-scrollbar-thumb{background:#3f3f46}[data-theme=light] .toc-drawer-inner{-webkit-backdrop-filter:none;background-color:#fafafa;border-left:1px solid #e4e4e7;box-shadow:-4px 0 16px #0000000a}[data-theme=light] .toc-header{border-bottom:1px solid #e4e4e7}[data-theme=light] .toc-title{color:var(--accent-color)}[data-theme=light] .toc-link{color:var(--text-muted)}[data-theme=light] .toc-link:hover{color:#52525b;background:#f4f4f5;border-radius:5px}[data-theme=light] .toc-active>.toc-link{color:var(--accent-color)}[data-theme=light] .toc-active>.toc-link:before{background:var(--accent-color)}[data-theme=light] .toc-ancestor>.toc-link{color:var(--accent-color)}[data-theme=light] .toc-close-btn{color:#71717a}[data-theme=light] .toc-close-btn:hover{color:#09090b;background:#f4f4f5}[data-theme=light] .toc-scroll:hover{scrollbar-color:#d4d4d8 transparent}[data-theme=light] .toc-scroll:hover::-webkit-scrollbar-thumb{background:#d4d4d8}[data-theme=light] .toc-drawer-inner:hover::-webkit-scrollbar-thumb{background:#d4d4d8}
.toc-fab{-webkit-backdrop-filter:blur(16px);cursor:pointer;z-index:1100;width:52px;height:52px;color:var(--accent-color);will-change:transform, opacity;background:#ffffffd9;border:1px solid #fff9;border-radius:50%;justify-content:center;align-items:center;transition:transform .3s cubic-bezier(.34,1.56,.64,1),opacity .3s,box-shadow .2s,background .2s;display:flex;position:fixed;bottom:28px;right:28px;box-shadow:0 4px 20px #0000001f,0 1px 4px #00000014,inset 0 1px #ffffffe6}.toc-fab:hover{background:#fffffff2;transform:scale(1.06);box-shadow:0 8px 30px #8a24352e,0 2px 8px #0000001a}.toc-fab:active{transform:scale(.94)}.toc-fab-active{background:#8a24351a}.toc-fab-visible{opacity:1;pointer-events:auto;transform:translateY(0)scale(1)}.toc-fab-hidden{opacity:0;pointer-events:none;transform:translateY(12px)scale(.9)}.toc-fab-icon{justify-content:center;align-items:center;transition:transform .25s cubic-bezier(.4,0,.2,1),opacity .2s;display:flex;position:absolute}.toc-fab-ring{pointer-events:none;transform:rotate(-90deg)}.toc-fab-ring-track{fill:none;stroke:#8a24351a}.toc-fab-ring-fill{fill:none;stroke:var(--accent-color);stroke-linecap:round;transition:stroke-dashoffset .15s linear}@media (min-width:1281px){.toc-fab{display:none}}[data-theme=dark] .toc-fab{-webkit-backdrop-filter:none;color:#71717a;background:#18181b;border:1px solid #27272a;box-shadow:0 2px 12px #00000080}[data-theme=dark] .toc-fab:hover{color:#a1a1aa;background:#1c1c1e;border-color:#3f3f46;transform:scale(1.05);box-shadow:0 4px 16px #0009}[data-theme=dark] .toc-fab-ring-track{stroke:#18181b}[data-theme=dark] .toc-fab-ring-fill{stroke:var(--accent-color)}[data-theme=light] .toc-fab{-webkit-backdrop-filter:none;color:#71717a;background:#fff;border:1px solid #e4e4e7;box-shadow:0 2px 8px #0000000f,0 1px 3px #0000000a}[data-theme=light] .toc-fab:hover{color:var(--accent-color);background:#f4f4f5;border-color:#d4d4d8;transform:scale(1.05);box-shadow:0 4px 12px #8a24351a}[data-theme=light] .toc-fab-ring-track{stroke:#f4f4f5}[data-theme=light] .toc-fab-ring-fill{stroke:var(--accent-color)}
.tutorial-section{flex-direction:column;display:flex}.content-wrapper{flex:1;align-items:flex-start;gap:0;display:flex}.tutorial-backdrop,.toc-backdrop{display:none}.content-topic{-webkit-backdrop-filter:blur(10px);background:#fff3;border:1px solid #ffffff80;border-color:#ffffff80 #ffffff80 #ffffff40 #ffffff40;flex-direction:column;flex-shrink:0;width:280px;height:calc(100vh - 70px);padding:10px 20px;transition:transform .35s;display:flex;position:sticky;top:70px;box-shadow:0 15px 35px #0000000d}.content-topic-header{justify-content:space-between;align-items:center;margin-bottom:15px;display:flex}.content-topic-header h1{color:var(--topic-color);letter-spacing:.5px;font-size:1.2rem;font-weight:700}.topic-heading{color:var(--topic-color);margin:10px 0;font-size:1rem;font-weight:600}.topic-subheading{color:var(--topic-color);margin:8px 0;font-size:.9rem;font-weight:500}.topic-subheading span{color:var(--accent-color);font-weight:bolder}.content-topic-header button{cursor:pointer;fill:var(--accent-color);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff26;border:1px solid #ffffff4d;border-radius:5px;padding:3px;font-size:0;transition:background .3s;display:none;box-shadow:0 2px 8px #0000000d}.topic-nav{flex:1;min-height:0;padding-bottom:1rem;overflow-y:auto}.topic-nav ul{margin:0;padding:0}.topic-nav::-webkit-scrollbar{width:6px}.topic-nav::-webkit-scrollbar-track{background:#ffffff1a;border-radius:10px}.topic-nav::-webkit-scrollbar-thumb{background:#ffffff80;border-radius:15px}.topic-nav::-webkit-scrollbar-thumb:hover{background:#ffffffb3}.topic-nav li{margin-top:5px;margin-right:10px;list-style:none}.topic-nav li a{color:var(--accent-color);border-radius:25px;padding:8px 15px;font-size:.9rem;font-weight:500;text-decoration:none;transition:background .3s,box-shadow .3s;display:block;position:relative}.topic-nav li a.active{color:var(--accent-color);background:#fffc;font-weight:600;box-shadow:0 5px 10px #00000026}.topic-nav li a.active:before{content:none!important}.topic-nav li a:hover{background:#ffffff80}.topic-h2{padding-left:16px}.topic-h3{padding-left:32px}.topic-h2 .my-nav-link:before,.topic-h3 .my-nav-link:before{content:"";background-color:var(--accent-color);border-radius:50%;width:9px;height:9px;position:absolute;top:15.5px;left:-2px}.content-main{flex:1;min-width:0;padding:1.5rem 2rem 10rem;overflow:hidden}.navigation-buttons{justify-content:space-between;margin-top:80px;display:flex}.navigation-button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;opacity:0;pointer-events:none;background:#fff3;border:1px solid #ffffff40;border-radius:10px;justify-content:center;align-items:center;padding:10px;transition:background .2s;display:flex;box-shadow:0 15px 35px #0000000d}.navigation-button.active{opacity:1;pointer-events:auto}.navigation-button.pending{opacity:.5;pointer-events:none;cursor:progress}.navigation-button svg{color:var(--accent-color);padding:0}.navigation-button span{color:var(--text-color);font-size:1rem;font-weight:400}.navigation-button:nth-child(2) span{margin-right:7px}.navigation-button:hover{background:#ffffff4d}.navigation-button:active{transform:scale(.95)}@media (max-width:1280px){.toc-backdrop{display:block}.content-main{max-width:100%}}@media (max-width:1200px){.tutorial-backdrop{display:block}.content-topic{z-index:1000;background-color:var(--off-canvas-color);height:100%;box-shadow:none;-webkit-backdrop-filter:none;border:none;border-radius:0 20px 20px 0;position:fixed;top:0;transform:translate(-100%)}.content-topic.active{transform:translate(0)}.content-topic-header button{display:block}}@media (max-width:768px){.content-main{padding:1.5rem 1rem 10rem}}@media (max-width:350px){.content-topic{width:100%}}[data-theme=dark] .content-topic{-webkit-backdrop-filter:none;box-shadow:none;background:#111113;border:none;border-right:1px solid #1c1c1e}[data-theme=dark] .content-topic.active{background-color:#111113}[data-theme=dark] .content-topic-header h1{color:var(--topic-color)}[data-theme=dark] .content-topic-header button{-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;color:#71717a;background:#18181b;border:1px solid #27272a}[data-theme=dark] .content-topic-header button:hover{color:#e4e4e7;background:#27272a}[data-theme=dark] .topic-nav li a{color:var(--text-muted);font-weight:400}[data-theme=dark] .topic-nav li a:hover{color:var(--text-color);background:#18181b}[data-theme=dark] .topic-nav li a.active{box-shadow:none;color:var(--accent-color);background:#18181b;font-weight:600}[data-theme=dark] .topic-heading{color:var(--accent-color);font-weight:600}[data-theme=dark] .topic-subheading{color:var(--text-color)}[data-theme=dark] .topic-subheading span{color:var(--accent-color)}[data-theme=dark] .topic-nav::-webkit-scrollbar-thumb{background:#3f3f46}[data-theme=dark] .topic-nav::-webkit-scrollbar-track{background:0 0}[data-theme=dark] .navigation-button{-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;background:#18181b;border:1px solid #27272a}[data-theme=dark] .navigation-button svg{color:var(--accent-color)}[data-theme=dark] .navigation-button span{color:var(--text-color)}[data-theme=dark] .navigation-button:hover{color:#a1a1aa;background:#1c1c1e;border-color:#3f3f46}[data-theme=light] .content-topic{-webkit-backdrop-filter:none;box-shadow:none;background:#fafafa;border:none;border-right:1px solid #e4e4e7}[data-theme=light] .content-topic.active{background-color:#fafafa;border-right:1px solid #e4e4e7}[data-theme=light] .content-topic-header h1{color:var(--topic-color)}[data-theme=light] .content-topic-header button{-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;color:#71717a;background:#fff;border:1px solid #e4e4e7}[data-theme=light] .content-topic-header button:hover{color:#09090b;background:#f4f4f5}[data-theme=light] .topic-nav li a{color:var(--text-muted);font-weight:400}[data-theme=light] .topic-nav li a:hover{color:var(--text-color);background:#f4f4f5}[data-theme=light] .topic-nav li a.active{box-shadow:none;color:var(--accent-color);background:#f4f4f5;font-weight:600}[data-theme=light] .topic-heading{color:var(--accent-color);font-weight:600}[data-theme=light] .topic-subheading{color:var(--text-color)}[data-theme=light] .topic-subheading span{color:var(--accent-color)}[data-theme=light] .topic-nav ul::-webkit-scrollbar-thumb{background:#d4d4d8}[data-theme=light] .topic-nav ul::-webkit-scrollbar-track{background:0 0}[data-theme=light] .navigation-button{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff;border:1px solid #e4e4e7;box-shadow:0 1px 3px #0000000a}[data-theme=light] .navigation-button svg{color:var(--accent-color)}[data-theme=light] .navigation-button span{color:var(--text-color)}[data-theme=light] .navigation-button:hover{background:#fafafa;border-color:#d4d4d8}[data-theme=dark] .topic-h2 .my-nav-link:before,[data-theme=dark] .topic-h3 .my-nav-link:before{background-color:#3f3f46}[data-theme=dark] .topic-h2 .my-nav-link.active:before,[data-theme=dark] .topic-h3 .my-nav-link.active:before{background-color:var(--accent-color)}[data-theme=light] .topic-h2 .my-nav-link:before,[data-theme=light] .topic-h3 .my-nav-link:before{background-color:#d4d4d8}[data-theme=light] .topic-h2 .my-nav-link.active:before,[data-theme=light] .topic-h3 .my-nav-link.active:before{background-color:var(--accent-color)}