.tutorial-dot-toc[data-astro-cid-i3cnjmc5]{position:relative;width:2.25rem;height:100%;--toc-neutral: var(--color-base-content, currentColor);--toc-primary: var(--color-primary, oklch(var(--p, .65 .22 30)));--toc-dot-bg: color-mix(in srgb, var(--toc-neutral) 24%, transparent);--toc-dot-border: color-mix(in srgb, var(--toc-neutral) 32%, transparent);--toc-dot-hover-bg: color-mix(in srgb, var(--toc-neutral) 40%, transparent);--toc-dot-hover-border: color-mix(in srgb, var(--toc-neutral) 48%, transparent);--toc-active: var(--toc-primary);--toc-active-ring: color-mix(in srgb, var(--toc-primary) 30%, transparent);--toc-tooltip-bg: var(--color-base-100, #fff);--toc-tooltip-text: var(--color-base-content, #111827);--toc-tooltip-border: color-mix( in srgb, var(--color-base-content, #111827) 14%, transparent );--toc-rail-start: color-mix(in srgb, var(--toc-neutral) 8%, transparent);--toc-rail-mid: color-mix(in srgb, var(--toc-neutral) 16%, transparent);--toc-rail-end: color-mix(in srgb, var(--toc-neutral) 8%, transparent)}.tutorial-dot-toc-list[data-astro-cid-i3cnjmc5]{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;padding:.25rem 0;min-height:100%;overflow:visible}.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]{position:relative;display:block;width:.5rem;height:.5rem;border-radius:9999px;background-color:var(--toc-dot-bg);border:1px solid var(--toc-dot-border);opacity:.7;transition:transform .18s cubic-bezier(.22,1,.36,1),width .14s ease,height .14s ease,background-color .14s ease,box-shadow .14s ease,border-color .14s ease,opacity .14s ease;outline:none;padding:0;cursor:pointer;transform:scale(1);-webkit-tap-highlight-color:transparent}.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:hover,.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:focus-visible{background-color:var(--toc-dot-hover-bg);border-color:var(--toc-dot-hover-border);opacity:1;transform:scale(1.18)}.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:focus-visible{box-shadow:0 0 0 3px var(--toc-active-ring)}.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5].is-active{width:.875rem;height:.875rem;background-color:var(--toc-active);border-color:var(--toc-active);opacity:1;box-shadow:0 0 0 3px var(--toc-active-ring);animation:tutorial-dot-toc-pulse .9s ease-out}@keyframes tutorial-dot-toc-pulse{0%{transform:scale(.92)}60%{transform:scale(1.04)}to{transform:scale(1)}}.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:before{content:"";position:absolute;left:1.02rem;top:50%;transform:translateY(-50%) translate(-4px) rotate(45deg);opacity:0;pointer-events:none;width:.55rem;height:.55rem;background-color:var(--toc-tooltip-bg);border-left:1px solid var(--toc-tooltip-border);border-bottom:1px solid var(--toc-tooltip-border);box-shadow:0 6px 16px oklch(var(--bc) / .14);transition:opacity .12s ease,transform .12s ease;z-index:120}.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:after{content:attr(data-label);position:absolute;left:1.25rem;top:50%;transform:translateY(-50%) translate(-4px);opacity:0;pointer-events:none;white-space:nowrap;max-width:16rem;overflow:hidden;text-overflow:ellipsis;padding:.35rem .55rem;border-radius:.5rem;font-size:.75rem;line-height:1;color:var(--toc-tooltip-text);background-color:var(--toc-tooltip-bg);border:1px solid var(--toc-tooltip-border);box-shadow:0 8px 20px oklch(var(--bc) / .2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:opacity .12s ease,transform .12s ease;z-index:120}html[data-theme=dark] .tutorial-dot-toc[data-astro-cid-i3cnjmc5],html[data-theme$=-dark] .tutorial-dot-toc[data-astro-cid-i3cnjmc5]{--toc-dot-bg: color-mix(in srgb, var(--toc-neutral) 34%, transparent);--toc-dot-border: color-mix(in srgb, var(--toc-neutral) 42%, transparent);--toc-dot-hover-bg: color-mix(in srgb, var(--toc-neutral) 56%, transparent);--toc-dot-hover-border: color-mix(in srgb, var(--toc-neutral) 64%, transparent);--toc-tooltip-bg: var(--color-base-200, #1f2937);--toc-tooltip-text: var(--color-base-content, #f9fafb)}.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:hover:after,.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:focus-visible:after{opacity:1;transform:translateY(-50%) translate(0)}.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:hover:before,.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:focus-visible:before{opacity:1;transform:translateY(-50%) translate(0) rotate(45deg)}@media(prefers-reduced-motion:reduce){.tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5],.tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:before,.tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5]:after{transition:none}.tutorial-dot-toc[data-astro-cid-i3cnjmc5] .tutorial-dot-toc-dot[data-astro-cid-i3cnjmc5].is-active{animation:none}}.chapter-details[data-astro-cid-2tdllnze] .chapter-chevron[data-astro-cid-2tdllnze]{transform:rotate(-90deg)}.chapter-details[data-astro-cid-2tdllnze][open] .chapter-chevron[data-astro-cid-2tdllnze]{transform:rotate(0)}.chapter-details[data-astro-cid-2tdllnze] summary[data-astro-cid-2tdllnze]::-webkit-details-marker,.chapter-details[data-astro-cid-2tdllnze] summary[data-astro-cid-2tdllnze]::marker{display:none;content:""}.sidebar-expanded-content[data-astro-cid-2tdllnze],.sidebar-nav[data-astro-cid-2tdllnze],.sidebar-footer[data-astro-cid-2tdllnze],.chapter-text[data-astro-cid-2tdllnze],.chapter-chevron[data-astro-cid-2tdllnze]{opacity:1;transition:opacity .2s ease .1s}.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed{width:60px!important;overflow:hidden}.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .sidebar-expanded-content[data-astro-cid-2tdllnze],.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .sidebar-nav[data-astro-cid-2tdllnze],.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .sidebar-footer[data-astro-cid-2tdllnze],.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .chapter-text[data-astro-cid-2tdllnze],.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .chapter-chevron[data-astro-cid-2tdllnze]{opacity:0;pointer-events:none;overflow:hidden;white-space:nowrap;width:0;height:0;padding:0;margin:0;transition:opacity .15s ease}.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .sidebar-header[data-astro-cid-2tdllnze]{padding:.5rem;justify-content:center;align-items:center;gap:0}.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .sidebar-expanded-content[data-astro-cid-2tdllnze]{flex:0;min-width:0;width:0;height:0;overflow:hidden;opacity:0;padding:0;margin:0;pointer-events:none}.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .sidebar-toggle[data-astro-cid-2tdllnze]{margin:0 auto}.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .sidebar-collapse-icon[data-astro-cid-2tdllnze]{display:none}.tutorial-sidebar[data-astro-cid-2tdllnze].collapsed .sidebar-expand-icon[data-astro-cid-2tdllnze]{display:block}summary[data-astro-cid-bposejjw]::-webkit-details-marker{display:none}.tutorial-structure[data-astro-cid-bposejjw]{background:oklch(var(--b1));border:1px solid oklch(var(--b2));border-radius:1.5rem;padding:1.5rem;box-shadow:0 1px 3px #0000000d}.tutorial-layout[data-astro-cid-5mk7rcd7]{display:flex;width:100%;min-height:100vh;background:oklch(var(--b1));align-items:flex-start}.tutorial-sidebar-wrapper[data-astro-cid-5mk7rcd7]{display:none;width:auto;flex-shrink:0;z-index:20;position:sticky;top:3.75rem;height:calc(100vh - 3.75rem)}@media(min-width:768px){.tutorial-sidebar-wrapper[data-astro-cid-5mk7rcd7]{display:block}}.tutorial-dot-toc-wrapper[data-astro-cid-5mk7rcd7]{display:none;width:3rem;flex-shrink:0;z-index:20;position:sticky;top:7rem;height:calc(100vh - 7rem);padding:0 .25rem}@media(min-width:768px){.tutorial-dot-toc-wrapper[data-astro-cid-5mk7rcd7]{display:block}}.tutorial-content-area[data-astro-cid-5mk7rcd7]{display:none;flex:1;flex-direction:column;width:100%;min-width:0;position:relative;background:oklch(var(--b2) / .15)}@media(min-width:768px){.tutorial-content-area[data-astro-cid-5mk7rcd7]{display:flex}}.tutorial-content-inner[data-astro-cid-5mk7rcd7]{flex:1;width:100%;padding:1.5rem 1.5rem 6rem}@media(min-width:1024px){.tutorial-content-inner[data-astro-cid-5mk7rcd7]{padding:1.5rem 3rem 6rem}}@media(min-width:1280px){.tutorial-content-inner[data-astro-cid-5mk7rcd7]{padding:1.5rem 4rem 6rem}}.tutorial-breadcrumbs{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;color:oklch(var(--bc) / .5);margin-bottom:2rem;flex-wrap:wrap}.tutorial-breadcrumb-link{display:inline-flex;align-items:center;gap:.25rem;color:oklch(var(--bc) / .5);transition:color .15s}.tutorial-breadcrumb-link:hover{color:oklch(var(--p))}.tutorial-article[data-astro-cid-5mk7rcd7]{padding-bottom:2rem;line-height:1.8}.tutorial-article[data-astro-cid-5mk7rcd7] h1{letter-spacing:-.02em}.tutorial-article[data-astro-cid-5mk7rcd7] h2{letter-spacing:-.01em}.tutorial-nav-desktop{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:4rem;padding-top:2rem;border-top:1px solid oklch(var(--b2))}.tutorial-nav-card{display:flex;flex-direction:column;gap:.375rem;padding:1rem 1.25rem;border:1px solid oklch(var(--b2));border-radius:.875rem;transition:all .2s}.tutorial-nav-card:hover{border-color:oklch(var(--p) / .4);background:oklch(var(--b2) / .25);box-shadow:0 2px 12px oklch(var(--p) / .06)}.tutorial-nav-card-next{text-align:right}.tutorial-nav-card-label{display:flex;align-items:center;gap:.375rem;font-size:.75rem;color:oklch(var(--bc) / .45);font-weight:500;text-transform:uppercase;letter-spacing:.02em}.tutorial-nav-card-title{font-weight:600;color:oklch(var(--bc));line-height:1.3;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.tutorial-nav-card:hover .tutorial-nav-card-title{color:oklch(var(--p))}.mobile-topbar[data-astro-cid-5mk7rcd7]{display:flex;align-items:center;background:oklch(var(--b1) / .85);border-bottom:1px solid oklch(var(--b2) / .7);backdrop-filter:blur(14px);padding:.5rem;min-height:3rem;position:sticky;top:0;z-index:30}.tutorial-nav-mobile{display:flex;flex-direction:column;gap:.5rem;margin-top:2rem;padding-top:1.5rem;border-top:1px solid oklch(var(--b2))}.tutorial-nav-btn{display:flex;align-items:center;gap:.5rem;padding:.625rem .875rem;border:1px solid oklch(var(--b2));border-radius:.75rem;font-size:.875rem;color:oklch(var(--bc) / .7);transition:all .2s}.tutorial-nav-btn:hover{border-color:oklch(var(--p) / .3);color:oklch(var(--p))}.tutorial-nav-btn-next{background:oklch(var(--p));color:oklch(var(--pc));border-color:oklch(var(--p));font-weight:500;justify-content:space-between}.tutorial-nav-btn-next:hover{background:oklch(var(--p) / .9);color:oklch(var(--pc));border-color:oklch(var(--p) / .9)}.tutorial-overview[data-astro-cid-5mk7rcd7]{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:50vh;padding:3rem 1rem}.tutorial-overview-banner[data-astro-cid-5mk7rcd7]{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:1rem;overflow:hidden;margin-bottom:2rem;box-shadow:0 4px 24px oklch(var(--bc) / .08)}.tutorial-overview-banner-overlay[data-astro-cid-5mk7rcd7]{position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,oklch(var(--b1) / .4) 100%)}.tutorial-overview-icon[data-astro-cid-5mk7rcd7]{font-size:4rem;margin-bottom:1.5rem;animation:float 3s ease-in-out infinite}.tutorial-lesson-banner[data-astro-cid-5mk7rcd7]{width:100%;aspect-ratio:3 / 1;border-radius:.75rem;overflow:hidden;margin-bottom:1.5rem;box-shadow:0 2px 12px oklch(var(--bc) / .06)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.tutorial-scrollbar{scrollbar-width:thin;scrollbar-color:oklch(var(--b3)) transparent}.tutorial-scrollbar::-webkit-scrollbar{width:4px}.tutorial-scrollbar::-webkit-scrollbar-track{background:transparent}.tutorial-scrollbar::-webkit-scrollbar-thumb{background-color:oklch(var(--b3));border-radius:9999px}.tutorial-scrollbar::-webkit-scrollbar-thumb:hover{background:oklch(var(--bc) / .2)}.tutorial-sidebar{will-change:width}@media(min-width:768px){body{height:auto!important;overflow:visible!important}}@media(max-width:767px){html,body{height:100vh!important;overflow:hidden!important;padding-bottom:0!important}.tutorial-layout[data-astro-cid-5mk7rcd7]{height:calc(100vh - 3rem);min-height:auto!important}}#main-header{box-shadow:0 1px 2px #0000000d}