.blog-article--reference{--blog-accent:#16a34a;--blog-accent-strong:#0d9488;--blog-accent-soft:#16a34a1a;--fmt-ink:#15803d;--fmt-spy-bg:#16a34a1f;--ans-green:#16a34a;--ans-amber:#d97706;--ans-ticket:var(--panel-strong);--ans-notch:color-mix(in oklab, var(--panel) 85%, #dcfce7);--ans-window:#f1f5f9;counter-reset:ans-solved}html[data-theme=dark] .blog-article--reference{--fmt-ink:#86efac;--ans-notch:var(--panel);--ans-window:#1e293b}.ans-stage__window{border:1px solid color-mix(in oklab, var(--ans-green) 18%, var(--panel-border));background:radial-gradient(circle, #f87171 0 5px, transparent 5.5px) 14px 13px / 14px 14px no-repeat, radial-gradient(circle, #fbbf24 0 5px, transparent 5.5px) 32px 13px / 14px 14px no-repeat, radial-gradient(circle, #34d399 0 5px, transparent 5.5px) 50px 13px / 14px 14px no-repeat, linear-gradient(color-mix(in oklab, var(--ans-window) 80%, #cbd5e1), color-mix(in oklab, var(--ans-window) 80%, #cbd5e1)) top / 100% 40px no-repeat, var(--ans-window);border-radius:16px;animation:.6s ease-out .1s both ans-window-in;position:absolute;inset:-16% -6% -8%;box-shadow:0 30px 60px -28px #15803d80}.ans-stage__ping{opacity:0;border:2px solid #16a34a73;border-radius:50%;width:150px;height:150px;animation:3.4s ease-out 1s 4 ans-ping;position:absolute;bottom:-14%;right:-12%}.ans-stage__ping--late{animation-delay:2.7s}.ans-stage__typing,.ans-stage__bubble--q{position:absolute;top:34%;left:-4%}.ans-stage__typing{background:#fff;border-radius:18px 18px 18px 4px;gap:5px;padding:12px 14px;animation:.35s cubic-bezier(.3,1.6,.5,1) .2s both ans-pop,.3s ease-in 1.55s forwards ans-typing-out;display:flex;box-shadow:0 10px 22px -10px #0f172a73}.ans-stage__typing i{background:#94a3b8;border-radius:50%;width:8px;height:8px;animation:.42s ease-in-out .3s 6 alternate ans-dot}.ans-stage__typing i:nth-child(2){animation-delay:.42s}.ans-stage__typing i:nth-child(3){animation-delay:.54s}.ans-stage__bubble{align-items:center;gap:6px;font-weight:850;display:flex;box-shadow:0 12px 24px -10px #0f172a73}.ans-stage__bubble--q{color:#475569;background:#e2e8f0;border-radius:20px 20px 20px 6px;justify-content:center;width:54px;height:50px;font-size:1.6rem;animation:.45s cubic-bezier(.3,1.6,.5,1) 1.65s both ans-pop}.ans-stage__bubble--a{color:#fff;background:linear-gradient(140deg,#22c55e,#15803d);border-radius:20px 20px 6px;padding:10px 14px;font-size:.9rem;animation:.45s cubic-bezier(.3,1.6,.5,1) 2.15s both ans-pop;position:absolute;bottom:8%;right:5%}.ans-stage__timer{color:#92400e;background:#fef3c7;border-radius:999px;align-items:center;gap:6px;padding:5px 12px 5px 6px;font-size:.74rem;font-weight:800;animation:.4s cubic-bezier(.3,1.6,.5,1) .6s both ans-pop;display:flex;position:absolute;top:-12%;right:0;box-shadow:0 8px 18px -10px #92400e99}.ans-stage__ring{border:2.5px solid #fbbf24;border-top-color:#92400e;border-radius:50%;width:18px;height:18px;animation:1s linear .6s 4 ans-sweep}.ans-stage__timer svg{display:none}@keyframes ans-window-in{0%{opacity:0;transform:translateY(18px)scale(.96)}}@keyframes ans-ping{0%{opacity:.8;transform:scale(.2)}to{opacity:0;transform:scale(1.5)}}@keyframes ans-pop{0%{opacity:0;transform:scale(.2)}}@keyframes ans-typing-out{to{opacity:0;transform:scale(.6)}}@keyframes ans-dot{to{transform:translateY(-6px)}}@keyframes ans-sweep{to{transform:rotate(360deg)}}.ans-ambient__glow{aspect-ratio:1;background:radial-gradient(closest-side,#22c55e2e,#0000);border-radius:50%;width:75vmax;animation:32s ease-in-out infinite alternate ans-glow;position:absolute;top:-30vmax;left:-20vmax}.ans-ambient__dots{background:radial-gradient(circle,#16a34a29 1.3px,#0000 1.8px) 0 0/26px 26px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(160deg,#000,#0000 70%);mask-image:linear-gradient(160deg,#000,#0000 70%)}.ans-ambient__ping{opacity:0;border:1.5px solid #16a34a59;border-radius:50%;width:260px;height:260px;animation:7s ease-out infinite ans-ping-wide;position:absolute;top:8%;right:6%}.ans-ambient__ping--late{animation-delay:3.5s}.ans-ambient__tick{top:0;left:var(--x);opacity:0;width:10px;height:18px;animation:ans-rise var(--t) linear var(--d) infinite;border-bottom:3px solid #16a34a66;border-right:3px solid #16a34a66;position:absolute;translate:0 105lvh;rotate:45deg}.ans-ambient__glyph{top:var(--y);left:var(--x);width:34px;height:34px;animation:ans-drift 9s ease-in-out var(--d) infinite alternate;position:absolute}.ans-ambient__glyph i{color:#15803d8c;border:2px solid #16a34a4d;border-radius:50%;place-items:center;font-size:1.1rem;font-style:normal;font-weight:900;display:grid;position:absolute;inset:0}.ans-ambient__glyph i:first-child{color:#b4530980;animation:ans-glyph-out 6s ease-in-out var(--d) infinite;border-color:#d977064d}.ans-ambient__glyph i:last-child{animation:ans-glyph-in 6s ease-in-out var(--d) infinite}@keyframes ans-glow{to{transform:translate(14vmax,10vmax)scale(1.15)}}@keyframes ans-ping-wide{0%{opacity:.7;transform:scale(.15)}to{opacity:0;transform:scale(1.6)}}@keyframes ans-rise{0%{opacity:0;translate:0 105lvh}20%,80%{opacity:.5}to{opacity:0;translate:0 -10lvh}}@keyframes ans-drift{to{transform:translate(18px,-26px)}}@keyframes ans-glyph-out{0%,40%{opacity:.8;transform:rotate(0)scale(1)}55%,90%{opacity:0;transform:rotate(-90deg)scale(.5)}to{opacity:.8}}@keyframes ans-glyph-in{0%,40%{opacity:0;transform:rotate(90deg)scale(.5)}55%,90%{opacity:.85;transform:none}to{opacity:0}}.blog-article .ans-nav .fmt-nav__title{border:1.5px solid color-mix(in oklab, var(--ans-green) 35%, var(--panel-border));color:var(--muted);background:var(--panel-strong);letter-spacing:0;text-transform:none;border-radius:999px;padding:10px 10px 10px 14px;font-size:.86rem;font-weight:600;box-shadow:0 8px 18px -14px #15803d99}.ans-nav .fmt-nav__marker{color:#fff;background:var(--ans-green);border-radius:50%;width:28px;height:28px}.ans-nav li:first-child .fmt-nav__marker{background:var(--ans-amber)}.ans-nav .fmt-nav__link{grid-template-columns:28px minmax(0,1fr)}.ans-nav .fmt-nav__count{white-space:nowrap}.ans-nav:not(.fmt-nav--inline) .fmt-nav__count{display:none}.ans-nav .fmt-nav__text:after{color:var(--fmt-ink);content:"→";margin-left:6px}@media (max-width:1050px){.ans-nav.fmt-nav--inline{background:color-mix(in oklab, var(--ans-green) 6%, var(--panel-strong));border-radius:22px;padding:14px 12px 12px}}.ans-meter{--fmt-seg-on:var(--ans-green);--fmt-seg-glow:0 0 10px #22c55e99;--fmt-seg-now:1.6}.ans-meter .fmt-meter__label b{background:var(--ans-green)}.ans-meter .fmt-meter__label--idle svg{color:var(--ans-green)}.ans-meter .fmt-meter__label--idle b{background:0 0}.blog-article__body .ans-ticket{border:1px solid color-mix(in oklab, var(--ans-green) 22%, var(--panel-border));background:var(--ans-ticket);border-radius:18px;gap:16px;padding:22px 24px 24px;transition:border-color .3s,background-color .3s;position:relative;box-shadow:0 20px 40px -32px #15803db3}.blog-article__body .ans-ticket--short{border:2px solid color-mix(in oklab, var(--ans-green) 45%, transparent);background:linear-gradient(160deg, color-mix(in oklab, var(--ans-green) 12%, var(--panel-strong)), var(--panel-strong) 65%)}.blog-article__body .ans-ticket--short>p:first-of-type{color:var(--heading);font-size:clamp(1.1rem,1.6vw,1.22rem);font-weight:560}.blog-article__body .ans-ticket:has(.ans-check__option--yes input:checked){border-color:var(--ans-green);background-color:color-mix(in oklab, var(--ans-green) 7%, var(--panel-strong))}.ans-solved{z-index:2;border:3px solid var(--ans-green);color:var(--ans-green);background:color-mix(in oklab, var(--panel-strong) 80%, transparent);letter-spacing:.1em;outline-offset:2px;text-transform:uppercase;border-radius:8px;outline:1.5px solid #16a34a59;padding:6px 12px;font-size:.86rem;font-weight:900;display:none;position:absolute;top:-15px;right:18px;rotate:8deg}.ans-ticket:has(.ans-check__option--yes input:checked) .ans-solved{animation:.45s cubic-bezier(.3,1.6,.5,1) ans-stamp;display:block}.ans-head{border-bottom:2px dashed color-mix(in oklab, var(--ans-green) 28%, transparent);grid-template-columns:40px minmax(0,1fr);align-items:center;gap:2px 14px;padding-bottom:16px;display:grid;position:relative}.ans-head:before,.ans-head:after{background:var(--ans-notch);width:18px;height:18px;box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--ans-green) 22%, var(--panel-border));content:"";border-radius:50%;position:absolute;bottom:-10px}.ans-head:before{left:-34px}.ans-head:after{right:-34px}.ans-head--short{border-bottom-style:solid}.ans-head--short:before,.ans-head--short:after{display:none}.ans-head__badge{color:#fff;background:var(--ans-green);border-radius:50%;grid-row:span 2;place-items:center;width:40px;height:40px;font-size:1.05rem;font-weight:900;display:grid}.ans-head--short .ans-head__badge{background:linear-gradient(140deg, #fbbf24, var(--ans-amber));border-radius:12px}.blog-article .ans-head__kicker{color:var(--fmt-ink);letter-spacing:.1em;text-transform:uppercase;margin:0;font-size:.72rem;font-weight:850}.blog-article .ans-head--short .ans-head__kicker{color:#b45309}html[data-theme=dark] .blog-article .ans-head--short .ans-head__kicker{color:#fcd34d}.ans-head h2{margin:0}.ans-check{border:1.5px dashed color-mix(in oklab, var(--ans-green) 35%, var(--panel-border));border-radius:14px;margin:4px 0 0;padding:12px}.ans-check legend{color:var(--fmt-ink);letter-spacing:.08em;text-transform:uppercase;padding:0 6px;font-size:.74rem;font-weight:850}.ans-check__options{grid-template-columns:1fr 1fr;gap:8px;display:grid}.ans-check__option{border:2px solid var(--panel-border);min-height:44px;color:var(--heading);background:var(--panel-strong);cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:12px;place-items:center;padding:8px 12px;font-size:.86rem;font-weight:800;transition:background-color .2s,color .2s,border-color .2s;display:grid;position:relative}.ans-check__option input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.ans-check__option--yes{border-color:color-mix(in oklab, var(--ans-green) 55%, transparent)}.ans-check__option--yes input:checked{counter-increment:ans-solved}.ans-check__option--yes:has(input:checked){border-color:var(--ans-green);color:#fff;background:var(--ans-green);animation:.4s cubic-bezier(.3,1.6,.5,1) ans-picked}.ans-check__option--no:has(input:checked){color:#fff;background:#64748b;border-color:#64748b}.ans-check__option:has(input:focus-visible){outline:3px solid color-mix(in oklab, var(--ans-green) 50%, transparent);outline-offset:2px}.blog-article .ans-check__next{color:var(--muted);margin:10px 2px 0;font-size:.86rem;font-weight:650;display:none}.ans-check:has(.ans-check__option--no input:checked) .ans-check__next{display:block}@keyframes ans-stamp{0%{opacity:0;transform:scale(2.2)rotate(-20deg)}}@keyframes ans-picked{45%{transform:scale(1.08)}}.blog-article__body .blog-content-section>ul.ans-checks{background:0 0;border:0;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px;margin:2px 0;padding:0;list-style:none;display:grid}.blog-article__body .ans-checks li{color:var(--text);background:color-mix(in oklab, var(--ans-green) 7%, var(--panel-strong));border-radius:12px;grid-template-columns:20px minmax(0,1fr);gap:10px;padding:12px 14px;font-size:1rem;line-height:1.55;display:grid}.ans-checks svg{color:var(--ans-green);margin-top:3px}.blog-article__body .blog-content-section>ol.ans-fixes{background:0 0;border:0;gap:8px;margin:2px 0;padding:0;list-style:none;display:grid}.blog-article__body .ans-fixes li{color:var(--text);grid-template-columns:54px minmax(0,1fr);align-items:start;gap:12px;font-size:1rem;line-height:1.6;display:grid}.ans-fixes__no{color:#fff;background:var(--ans-green);text-align:center;border-radius:8px;padding:3px 0;font-size:.74rem;font-weight:850}.ans-table .blog-table th:first-child{color:#fff;background:var(--ans-amber)}.ans-table .blog-table th:last-child{color:#fff;background:var(--ans-green)}.ans-table .blog-table td:first-child{color:var(--heading);font-weight:720}.blog-figure.ans-figure{border:1px solid color-mix(in oklab, var(--ans-green) 25%, var(--panel-border));background:var(--panel-strong);border-radius:16px;padding:8px}.ans-stuck{border:2px dashed color-mix(in oklab, var(--ans-green) 40%, var(--panel-border));background:color-mix(in oklab, var(--ans-green) 5%, var(--panel-strong));view-timeline-name:--ans-stuck;border-radius:22px;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:14px 16px;padding:clamp(22px,4vw,30px);display:grid}.ans-stuck__icon{color:#fff;background:var(--ans-green);border-radius:50%;place-items:center;width:54px;height:54px;display:grid}.blog-article .ans-stuck__kicker{color:var(--fmt-ink);letter-spacing:.1em;text-transform:uppercase;margin:0;font-size:.74rem;font-weight:850}.blog-article__body .ans-stuck h2{margin:0;font-size:clamp(1.35rem,3vw,1.8rem)}.blog-article .ans-stuck__tally{color:var(--fmt-ink);background:color-mix(in oklab, var(--ans-green) 10%, var(--panel-strong));border-radius:12px;grid-column:1/-1;margin:0;padding:10px 14px;font-weight:800}.ans-stuck__tally:before{content:"✓ You marked " counter(ans-solved) " of " attr(data-total) " answers as solved"}.blog-article--reference:not(:has(.ans-check__option--yes input:checked)) .ans-stuck__tally{display:none}.blog-article__body .ans-stuck__routes{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.blog-article__body .ans-stuck__routes a{min-height:48px;color:var(--heading);background:var(--panel-strong);border-radius:14px;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;font-weight:700;text-decoration:none;display:flex;box-shadow:0 8px 18px -14px #15803d99}.blog-article a.ans-pill{z-index:40;color:#fff;background:var(--ans-green);border-radius:999px;align-items:center;gap:7px;padding:10px 16px;font-size:.86rem;font-weight:800;text-decoration:none;display:none;position:fixed;bottom:18px;left:50%;transform:translate(-50%);box-shadow:0 14px 30px -10px #15803d99}.ans-pill__count:before{content:counter(ans-solved) " solved"}.blog-article--reference:has(.ans-check__option--yes input:checked) .ans-pill{animation:.45s cubic-bezier(.3,1.4,.5,1) ans-pill-in;display:inline-flex}@keyframes ans-pill-in{0%{opacity:0;transform:translate(-50%,20px)}}@supports (animation-timeline:view()){.blog-article__body .ans-ticket{animation:linear both ans-print;animation-timeline:view();animation-range:entry entry 70%}.ans-head__badge{animation:linear both ans-badge;animation-timeline:view();animation-range:entry 20% cover 30%}.ans-checks li svg{animation:linear both ans-check-pop;animation-timeline:view();animation-range:entry 40%}.ans-fixes__no{animation:linear both ans-fix-in;animation-timeline:view();animation-range:entry 20% cover 30%}.ans-table .blog-table td:first-child{animation:linear both ans-cell-left;animation-timeline:view();animation-range:entry}.ans-table .blog-table td:last-child:not(:first-child){animation:linear both ans-cell-right;animation-timeline:view();animation-range:entry}.ans-stuck__icon{animation:linear both ans-buoy;animation-timeline:--ans-stuck;animation-range:entry 30% cover 40%}}@keyframes ans-print{0%{clip-path:inset(-40px -40px 100%);transform:translateY(-30px)}to{clip-path:inset(-40px -40px -60px);transform:none}}@keyframes ans-badge{0%{opacity:0;transform:scale(.3)rotate(-30deg)}}@keyframes ans-check-pop{0%{opacity:0;transform:scale(.2)}}@keyframes ans-fix-in{0%{opacity:0;transform:translate(-16px)}}@keyframes ans-cell-left{0%{opacity:.25;transform:translate(-22px)}}@keyframes ans-cell-right{0%{opacity:.25;transform:translate(22px)}}@keyframes ans-buoy{0%{opacity:0;transform:rotate(-270deg)scale(.3)}70%{opacity:1;transform:rotate(20deg)scale(1.1)}}@media (max-width:1050px){.blog-article--reference .blog-article-hero{padding-bottom:36px}}@media (max-width:680px){.ans-stage__ping{width:110px;height:110px}.blog-article__body .ans-ticket{padding:20px 16px}.ans-head:before{left:-26px}.ans-head:after{right:-26px}.blog-article__body .ans-ticket h2{font-size:clamp(1.35rem,6.2vw,1.75rem)}.ans-solved{font-size:.74rem;right:12px}.ans-table.blog-table-scroll{box-shadow:none;background:0 0;border:0;overflow:visible}.ans-table .blog-table,.ans-table .blog-table tbody,.ans-table .blog-table tr,.ans-table .blog-table td,.ans-table .blog-table th[scope=row]{width:auto;min-width:0;display:block}.ans-table .blog-table thead{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.ans-table .blog-table tr{border:1px solid var(--panel-border);background:var(--panel-strong);border-radius:14px;margin-bottom:12px;overflow:hidden}.ans-table .blog-table td,.ans-table .blog-table th[scope=row]{border:0;padding:10px 14px}.ans-table .blog-table tr>:first-child{background:color-mix(in oklab, var(--ans-amber) 12%, var(--panel-strong))}.ans-table .blog-table tr>:last-child:not(:first-child){background:color-mix(in oklab, var(--ans-green) 9%, var(--panel-strong))}.ans-table .blog-table td:before{color:var(--fmt-ink);letter-spacing:.08em;text-transform:uppercase;content:attr(data-label);margin-bottom:2px;font-size:.66rem;font-weight:850;display:block}.ans-table .blog-table tr>td:first-child:before{color:#b45309}}@media (prefers-reduced-motion:reduce){.blog-article__body .ans-ticket,.ans-head__badge,.ans-checks li svg,.ans-fixes__no,.ans-table .blog-table td,.ans-stuck__icon,.ans-solved,.ans-check__option,.ans-pill{animation:none!important}}
.blog-article--tutorial{--tut-grad:linear-gradient(140deg, var(--blog-accent), var(--blog-accent-strong));--tut-line:color-mix(in oklab, var(--blog-accent) 46%, transparent);--tut-line-soft:color-mix(in oklab, var(--blog-accent) 22%, transparent);--tut-done:#10b981;--tut-done-ink:#047857;--tut-paper:#fbf6ea;--tut-paper-line:color-mix(in oklab, var(--blog-accent) 13%, transparent);--tut-bar-top:68px}html[data-theme=dark] .blog-article--tutorial{--tut-done-ink:#6ee7b7;--tut-paper:#1b2335}.blog-article--tutorial:before{display:none}.blog-article--tutorial .blog-article-hero__visual{animation:.9s cubic-bezier(.2,.8,.3,1) .15s both tut-land}.tut-stage__map{perspective:1400px;display:flex;position:absolute;inset:-14% -8% -12%}.tut-stage__map i{background:linear-gradient(var(--tut-shade,90deg), #0f172a14, transparent 24%, transparent 76%, #ffffff4d), linear-gradient(var(--tut-paper-line) 1px, transparent 1px) 0 0 / 100% 26px, linear-gradient(90deg, var(--tut-paper-line) 1px, transparent 1px) 0 0 / 26px 100%, var(--tut-paper);transform-origin:0;flex:1;animation:.75s cubic-bezier(.3,.9,.3,1) 50ms both tut-unfold;box-shadow:0 26px 44px -30px #1e293b8c}.tut-stage__map i:nth-child(2n){--tut-shade:270deg;--tut-fold:75deg}.tut-stage__map i:first-child{border-radius:14px 0 0 14px}.tut-stage__map i:nth-child(2){animation-delay:.2s}.tut-stage__map i:nth-child(3){animation-delay:.35s}.tut-stage__map i:last-child{border-radius:0 14px 14px 0;animation-delay:.5s}.tut-stage__route{width:116%;height:126%;animation:1.5s cubic-bezier(.6,.05,.3,1) .7s both tut-route-wipe;position:absolute;top:-14%;left:-8%;overflow:visible}.tut-stage__route path{fill:none;stroke:var(--blog-accent);stroke-dasharray:2 9;stroke-linecap:round;stroke-width:3.5px;vector-effect:non-scaling-stroke}.tut-stage__pin{color:#fff;background:var(--tut-grad);width:44px;height:44px;box-shadow:0 12px 24px -8px color-mix(in oklab, var(--blog-accent-strong) 70%, transparent);border-radius:50% 50% 50% 0;place-items:center;animation:.7s cubic-bezier(.3,1.5,.5,1) 1.2s both tut-stage-pin;display:grid;position:absolute;top:-9%;right:10%;rotate:-45deg}.tut-stage__pin svg{rotate:45deg}.tut-stage__pin:after{border:2px solid var(--blog-accent-strong);opacity:0;content:"";border-radius:50%;animation:2.2s ease-out 1.9s 3 tut-ring;position:absolute;inset:-8px}.tut-stage__orbit{border:1.5px dashed color-mix(in oklab, var(--blog-accent) 50%, transparent);border-radius:50%;width:128px;height:128px;animation:.6s ease-out 1.6s both tut-orbit-in,9s linear 1.6s infinite tut-orbit;position:absolute;top:calc(-9% - 42px);right:calc(10% - 42px)}.tut-stage__plane{width:24px;height:24px;color:var(--blog-accent-strong);background:var(--panel-strong);border-radius:50%;place-items:center;margin-left:-12px;display:grid;position:absolute;top:-12px;left:50%;box-shadow:0 4px 10px -4px #0f172a73}.tut-stage__plane svg{rotate:45deg}.tut-stage__compass{border:3px solid color-mix(in oklab, var(--blog-accent-strong) 70%, var(--heading));background:radial-gradient(circle, var(--panel-strong) 0 56%, transparent 57%), repeating-conic-gradient(color-mix(in oklab, var(--heading) 40%, transparent) 0 2deg, transparent 2deg 30deg), var(--panel-strong);border-radius:50%;place-items:center;width:70px;height:70px;animation:1s cubic-bezier(.2,.9,.3,1.1) .45s both tut-compass-in;display:grid;position:absolute;bottom:-9%;left:-3%;box-shadow:0 14px 26px -12px #0f172a80}.tut-stage__compass:before{color:#dc2626;content:"N";font-size:.56rem;font-weight:900;line-height:1;position:absolute;top:7px;left:50%;translate:-50%}.tut-stage__compass i{background:linear-gradient(#ef4444 50%, color-mix(in oklab, var(--heading) 85%, transparent) 50%);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);width:11px;height:44px;animation:2.4s ease-in-out 1.3s both tut-needle;rotate:40deg}.tut-stage__sign{color:#fff;letter-spacing:.02em;white-space:nowrap;transform-origin:50% -20px;background:#15803d;border-radius:9px;align-items:center;gap:8px;padding:8px 14px;font-size:.8rem;font-weight:800;animation:1.2s ease-out 2s both tut-sign;display:flex;position:absolute;bottom:-10%;right:5%;box-shadow:inset 0 0 0 2px #15803d,inset 0 0 0 4px #fff,0 12px 22px -10px #14532db3}.tut-stage__sign:after{content:"→";font-size:1rem}@keyframes tut-land{0%{translate:0 22px;scale:.94}}@keyframes tut-unfold{0%{opacity:0;transform:rotateY(var(--tut-fold,-75deg))}}@keyframes tut-route-wipe{0%{clip-path:inset(100% 100% 0 0)}to{clip-path:inset(-10%)}}@keyframes tut-stage-pin{0%{opacity:0;translate:0 -70px}}@keyframes tut-orbit-in{0%{opacity:0;scale:.4}}@keyframes tut-orbit{to{rotate:360deg}}@keyframes tut-compass-in{0%{opacity:0;transform:rotate(-400deg)scale(.3)}}@keyframes tut-needle{0%{rotate:-120deg}30%{rotate:80deg}50%{rotate:20deg}68%{rotate:52deg}84%{rotate:34deg}to{rotate:40deg}}@keyframes tut-sign{0%{opacity:0;transform:rotate(-24deg)translateY(-14px)}35%{opacity:1;transform:rotate(10deg)}60%{transform:rotate(-5deg)}80%{transform:rotate(2deg)}to{transform:none}}.blog-article--tutorial{--tut-glow-third:#a78bfa}.blog-article--tutorial[data-blog-product=occasion-video]{--tut-glow-third:#fb923c}.tut-ambient{z-index:-1;pointer-events:none;animation:1.8s ease-out 1s both tut-ambient-in;position:absolute;inset:0}@keyframes tut-ambient-in{0%{visibility:hidden;opacity:0}to{visibility:visible;opacity:1}}.tut-ambient__stage{height:100lvh;position:sticky;top:0;overflow:hidden}.tut-ambient__glow{aspect-ratio:1;background:radial-gradient(closest-side, var(--tut-glow), transparent);opacity:.8;border-radius:50%;width:72vmax;animation:30s ease-in-out infinite alternate tut-drift-a;position:absolute}html[data-theme=dark] .tut-ambient__glow{opacity:.6}.tut-ambient__glow--a{--tut-glow:color-mix(in oklab, var(--blog-accent) 34%, transparent);top:-26vmax;left:-28vmax}.tut-ambient__glow--b{--tut-glow:color-mix(in oklab, var(--blog-accent-strong) 28%, transparent);animation-name:tut-drift-b;animation-duration:37s;top:24%;right:-36vmax}.tut-ambient__glow--c{--tut-glow:color-mix(in oklab, var(--tut-glow-third) 30%, transparent);animation-name:tut-drift-c;animation-duration:44s;bottom:-34vmax;left:2%}.tut-ambient__topo{width:calc(100% + 96px);height:calc(100% + 96px);color:var(--blog-accent);opacity:.1;animation:70s ease-in-out infinite alternate tut-topo;position:absolute;top:-48px;left:-48px}.tut-ambient__topo path{fill:none;stroke:currentColor;stroke-linejoin:round;stroke-width:1.3px}.tut-ambient__rose{border:2px solid color-mix(in oklab, var(--blog-accent) 55%, transparent);opacity:.09;border-radius:50%;width:260px;height:260px;animation:160s linear infinite tut-rose;position:absolute;bottom:6%;right:-40px}.tut-ambient__rose:before,.tut-ambient__rose:after{content:"";position:absolute}.tut-ambient__rose:before{background:var(--blog-accent);clip-path:polygon(50% 0%,53.4% 41.7%,71.2% 28.8%,58.3% 46.6%,100% 50%,58.3% 53.4%,71.2% 71.2%,53.4% 58.3%,50% 100%,46.6% 58.3%,28.8% 71.2%,41.7% 53.4%,0% 50%,41.7% 46.6%,28.8% 28.8%,46.6% 41.7%);inset:14px}.tut-ambient__rose:after{border:1.5px dashed var(--blog-accent);border-radius:50%;inset:34px}.tut-ambient__cloud{--tut-cloud:#fffc;top:var(--y);background:radial-gradient(closest-side, var(--tut-cloud), transparent) 0 70% / 50% 70% no-repeat, radial-gradient(closest-side, var(--tut-cloud), transparent) 40% 0 / 52% 100% no-repeat, radial-gradient(closest-side, var(--tut-cloud), transparent) 100% 75% / 50% 66% no-repeat;width:240px;height:90px;scale:var(--k);animation:tut-cloud var(--t) linear var(--d) infinite;position:absolute;left:0}html[data-theme=dark] .tut-ambient__cloud{--tut-cloud:#94a3b81a}.tut-ambient__pin{top:0;left:var(--x);width:var(--s);height:var(--s);background:radial-gradient(circle, transparent 0 26%, var(--blog-accent) 31%);opacity:0;animation:tut-pin-rise var(--t) linear var(--d) infinite;border-radius:50% 50% 50% 0;position:absolute;translate:0 110lvh;rotate:-45deg}.tut-ambient__flight{width:0;height:0;position:absolute;bottom:8%;left:-6%;rotate:-36deg}.tut-ambient__plane{color:var(--blog-accent-strong);opacity:0;animation:30s linear 2.5s infinite tut-fly;display:block;position:absolute;top:-10px;left:0}.tut-ambient__plane svg{display:block;rotate:45deg}.tut-ambient__plane:before{content:"";border-top:2px dashed;width:150px;position:absolute;top:50%;right:calc(100% + 2px);-webkit-mask-image:linear-gradient(270deg,#000,#0000);mask-image:linear-gradient(270deg,#000,#0000)}@keyframes tut-drift-a{to{transform:translate(16vmax,12vmax)scale(1.18)}}@keyframes tut-drift-b{to{transform:translate(-18vmax,10vmax)scale(.9)}}@keyframes tut-drift-c{to{transform:translate(12vmax,-16vmax)scale(1.12)}}@keyframes tut-topo{to{transform:translate(40px,30px)rotate(1.5deg)scale(1.04)}}@keyframes tut-rose{to{rotate:360deg}}@keyframes tut-cloud{0%{translate:-280px}to{translate:110vw}}@keyframes tut-pin-rise{0%{opacity:0;translate:0 110lvh}12%,88%{opacity:.17}50%{translate:24px 50lvh}to{opacity:0;translate:0 -12lvh}}@keyframes tut-fly{0%{opacity:0;transform:translate(-12vmax)}4%,40%{opacity:.24}46%,to{opacity:0;transform:translate(150vmax)}}.tut-route{align-content:start;gap:12px;display:grid}.blog-article .tut-route__title{color:var(--heading);letter-spacing:.07em;text-transform:uppercase;align-items:center;gap:9px;margin:0;font-size:.8rem;font-weight:800;display:flex}.blog-article .tut-route__title svg{color:var(--blog-accent);flex:none}.tut-route__count{color:color-mix(in oklab, var(--blog-accent) 80%, var(--heading));background:var(--blog-accent-soft);letter-spacing:.04em;border-radius:999px;margin-left:auto;padding:3px 9px;font-size:.68rem}.tut-route__stops{gap:2px;margin:0;padding:0;list-style:none;display:grid;position:relative}.tut-route__stops:before{border-left:2px dashed var(--tut-line);content:"";position:absolute;top:20px;bottom:20px;left:14px}.tut-route__link{min-height:44px;color:var(--label);border-radius:13px;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:11px;padding:5px 10px 5px 0;font-size:.84rem;font-weight:640;line-height:1.32;text-decoration:none;transition:color .2s,background-color .2s;display:grid}.tut-route__stop{border:2px solid color-mix(in oklab, var(--blog-accent) 55%, var(--panel-border));width:30px;height:30px;color:color-mix(in oklab, var(--blog-accent) 85%, var(--heading));background:var(--panel-strong);border-radius:50%;place-items:center;font-size:.74rem;font-weight:850;transition:transform .2s;display:grid;position:relative}.tut-route__link--finish .tut-route__stop{color:var(--tut-done-ink);border-style:dashed}.tut-route__link--start .tut-route__stop{background:radial-gradient(circle, var(--blog-accent) 0 5px, var(--panel-strong) 5.5px)}.tut-route__link:hover,.tut-route__link:focus-visible{color:var(--heading);background:var(--blog-accent-soft);outline:none}.tut-route__link:focus-visible{box-shadow:inset 0 0 0 2px var(--blog-accent)}.tut-route__link:hover .tut-route__stop{transform:scale(1.08)}.blog-article .tut-route__extras{flex-wrap:wrap;gap:6px;margin:0;padding-left:41px;display:flex}.blog-article .tut-route__extras a{border:1px solid var(--tut-line-soft);color:color-mix(in oklab, var(--blog-accent) 80%, var(--heading));border-radius:999px;padding:5px 10px;font-size:.74rem;font-weight:720;text-decoration:none}.blog-article .tut-route__extras a:hover,.blog-article .tut-route__extras a:focus-visible{background:var(--blog-accent-soft)}.tut-route__top{width:fit-content;color:color-mix(in oklab, var(--blog-accent) 78%, var(--heading));font-size:.74rem;font-weight:780}.tut-route--side{border-right:1px solid color-mix(in oklab, var(--blog-accent) 18%, var(--panel-border));scrollbar-width:thin;max-height:calc(100vh - 132px);padding:18px 12px 18px 0;position:sticky;top:104px;overflow-y:auto}.tut-route--inline{display:none}.tut-steps{display:grid}.tut-progress{display:none}.tut-progress__labels{min-height:21px;display:grid}.tut-progress__label{min-width:0;color:var(--heading);background:var(--panel-strong);grid-area:1/1;align-items:center;gap:8px;font-size:.8rem;font-weight:720;line-height:1.25;display:flex}.tut-progress__label b{color:#fff;background:var(--blog-accent);letter-spacing:.03em;border-radius:999px;flex:none;padding:2px 8px;font-size:.68rem;font-weight:850}.tut-progress__label--idle b{color:color-mix(in oklab, var(--blog-accent) 85%, var(--heading));background:var(--blog-accent-soft)}.tut-progress__label span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.tut-progress__label--step{opacity:0}.tut-progress__track{align-items:center;height:12px;display:flex}.tut-progress__leg{flex:1;height:12px;position:relative}.tut-progress__leg:before{border-top:2px dashed var(--tut-line);content:"";position:absolute;top:5px;left:0;right:0}.tut-progress__stop,.tut-progress__fill,.tut-progress__car{position:absolute}.tut-progress__stop{z-index:2;border:2px solid var(--blog-accent);background:var(--panel-strong);border-radius:50%;width:8px;height:8px;top:2px;left:0}.tut-progress__fill{background:var(--tut-grad);transform-origin:0;border-radius:4px;height:4px;top:4px;left:0;right:0;transform:scaleX(0)}.tut-progress__car{z-index:3;border:3px solid var(--panel-strong);background:var(--blog-accent-strong);width:14px;height:14px;box-shadow:0 0 0 3px color-mix(in oklab, var(--blog-accent-strong) 28%, transparent);opacity:0;border-radius:50%;margin-left:-7px;top:-1px;left:0}.tut-progress__flag{background:repeating-conic-gradient(var(--heading) 0 25%, var(--panel-strong) 0 50%) 0 0 / 6.5px 5.5px;width:13px;height:11px;box-shadow:0 0 0 1px var(--heading);border-radius:2px;flex:none;margin-left:3px}.blog-article--tutorial .tut-step{gap:18px;padding-top:0;scroll-margin-top:112px;display:grid}.blog-article--tutorial .tut-step:before{display:none}.blog-article--tutorial .blog-content-section__heading{grid-template-columns:minmax(0,1fr)}.tut-step__head{transform-origin:50% 100%;grid-template-columns:46px minmax(0,1fr);align-items:center;gap:4px 14px;display:grid}.tut-step__head h2{grid-column:2}.tut-step__marker{grid-row:1/span 2;align-self:start;width:46px;height:58px;position:relative}.tut-step__marker:before{border:2px solid color-mix(in oklab, var(--blog-accent) 70%, transparent);opacity:0;pointer-events:none;content:"";border-radius:50%;width:84px;height:84px;margin:-42px 0 0 -42px;position:absolute;top:21px;left:23px}.tut-step__pin{background:var(--tut-grad);width:38px;height:38px;box-shadow:0 10px 22px color-mix(in oklab, var(--blog-accent-strong) 30%, transparent);border-radius:50% 50% 50% 0;place-items:center;display:grid;position:absolute;top:2px;left:4px;transform:rotate(-45deg)}.tut-step__pin b{color:#fff;font-size:.95rem;font-weight:850;transform:rotate(45deg)}.tut-step__shadow{background:color-mix(in oklab, var(--heading) 20%, transparent);border-radius:50%;width:24px;height:7px;position:absolute;bottom:0;left:11px}.blog-article .tut-step__kicker{color:color-mix(in oklab, var(--blog-accent) 82%, var(--heading));letter-spacing:.08em;text-transform:uppercase;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0;font-size:.74rem;font-weight:820;display:flex}.tut-step__dots{align-items:center;gap:4px;display:inline-flex}.tut-step__dots i{background:var(--tut-line-soft);border-radius:999px;width:6px;height:6px}.tut-step__dots .is-done{background:var(--blog-accent)}.tut-step__dots .is-done:not(:has(+.is-done)){background:var(--tut-grad);width:16px}.tut-leg{view-timeline-name:--tut-leg;height:72px;margin:12px 0 16px;position:relative}.tut-leg>svg{width:300px;height:72px;position:absolute;top:0;left:0;overflow:visible}.tut-leg>svg path{fill:none;stroke-linecap:round}.tut-leg__track{stroke:var(--tut-line-soft);stroke-width:3px;stroke-dasharray:2 8}.tut-leg__draw{stroke:var(--blog-accent);stroke-width:2.5px;stroke-dasharray:1}.tut-leg__car{border:2px solid var(--panel-strong);color:#fff;background:var(--blog-accent-strong);width:24px;height:24px;box-shadow:0 0 0 4px color-mix(in oklab, var(--blog-accent-strong) 22%, transparent), 0 6px 12px -4px #0f172a66;offset-path:path("M23 0C23 30 170 14 170 36S23 42 23 72");offset-distance:100%;offset-rotate:auto 90deg;border-radius:50%;place-items:center;display:grid;position:absolute;top:0;left:0}.tut-leg__car svg{fill:currentColor}.tut-leg__label{border:1px solid color-mix(in oklab, var(--blog-accent) 24%, var(--panel-border));background:color-mix(in oklab, var(--panel-strong) 92%, transparent);border-radius:12px;gap:1px;max-width:320px;padding:7px 12px;display:grid;position:absolute;top:10px;left:190px;right:0;box-shadow:0 10px 22px -16px #1e293b99}.tut-leg__label b{color:color-mix(in oklab, var(--blog-accent) 85%, var(--heading));letter-spacing:.08em;text-transform:uppercase;font-size:.64rem;font-weight:850}.tut-leg__label span{color:var(--heading);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.8rem;font-weight:700;line-height:1.3;display:-webkit-box;overflow:hidden}.tut-checklist{border:1px solid color-mix(in oklab, var(--blog-accent) 18%, var(--panel-border));background:linear-gradient(135deg, var(--blog-accent-soft), color-mix(in oklab, var(--panel-strong) 95%, transparent));counter-reset:tut-done;border-radius:20px;gap:4px;margin:2px 0;padding:8px;transition:border-color .3s;display:grid;position:relative}.blog-article__body .tut-checklist ul{gap:2px;margin:0;padding:0;list-style:none;display:grid}.tut-checklist label{color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:14px;grid-template-columns:28px minmax(0,1fr);align-items:start;gap:12px;padding:11px 12px;font-size:1.02rem;line-height:1.6;transition:background-color .2s;display:grid;position:relative}.tut-checklist label:hover{background:color-mix(in oklab, var(--panel-strong) 70%, transparent)}.tut-checklist input{opacity:0;cursor:pointer;width:26px;height:26px;margin:0;position:absolute;top:13px;left:13px}.tut-checklist input:checked{counter-increment:tut-done}.tut-checklist__box{border:2px solid color-mix(in oklab, var(--blog-accent) 50%, var(--panel-border));background:var(--panel-strong);border-radius:8px;place-items:center;width:26px;height:26px;margin-top:1px;transition:background-color .2s,border-color .2s;display:grid}.tut-checklist__box svg{fill:none;stroke:#fff;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;width:17px;height:17px}.tut-checklist__box path{stroke-dasharray:1;stroke-dashoffset:1px;transition:stroke-dashoffset .3s 50ms}.tut-checklist input:checked+.tut-checklist__box{background:var(--tut-done);border-color:#0000;animation:.4s cubic-bezier(.3,1.6,.5,1) tut-check-pop}.tut-checklist input:checked+.tut-checklist__box path{stroke-dashoffset:0}.tut-checklist input:focus-visible+.tut-checklist__box{outline:3px solid color-mix(in oklab, var(--blog-accent) 60%, transparent);outline-offset:2px}.tut-checklist label:has(input:checked){background:color-mix(in oklab, var(--tut-done) 10%, transparent)}.blog-article .tut-checklist__foot{color:var(--label);margin:0;padding:2px 12px 6px 52px;font-size:.78rem;font-weight:720}.blog-article .tut-checklist__foot:before{content:counter(tut-done) " of " attr(data-total) " checked · tap to tick"}.tut-checklist:not(:has(input:not(:checked))) .tut-checklist__foot{color:var(--tut-done-ink)}.tut-checklist:not(:has(input:not(:checked))) .tut-checklist__foot:before{content:"All " attr(data-total) " checked. Ready for the next stop."}.tut-checklist:not(:has(input:not(:checked))){border-color:color-mix(in oklab, var(--tut-done) 60%, var(--panel-border))}.tut-checklist__confetti{pointer-events:none;width:0;height:0;position:absolute;bottom:16px;left:64px}.tut-checklist__confetti i{background:var(--blog-accent);opacity:0;border-radius:2px;width:6px;height:10px;position:absolute;top:-5px;left:-3px}.tut-checklist__confetti i:nth-child(4n+1){background:var(--tut-done)}.tut-checklist__confetti i:nth-child(4n+2){background:#f59e0b}.tut-checklist__confetti i:nth-child(4n+3){background:#ec4899}.tut-checklist:not(:has(input:not(:checked))) .tut-checklist__confetti i{animation:1.3s cubic-bezier(.15,.7,.3,1) both tut-confetti}.tut-checklist:not(:has(input:not(:checked))) .tut-checklist__confetti i:nth-child(odd){animation-duration:1.55s;animation-delay:50ms}@keyframes tut-confetti{0%{opacity:1;transform:rotate(var(--a)) translateY(0) scale(.4);translate:0}65%{opacity:1}to{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--r) * -1)) rotate(var(--spin)) scale(1);translate:0 34px}}.blog-article--tutorial .blog-article__body .tut-substeps{counter-reset:tut-substep;background:0 0;border:0;margin:2px 0;padding:4px 0;list-style:none;display:grid}.tut-substeps li{color:var(--text);counter-increment:tut-substep;padding:0 0 16px 46px;font-size:1.02rem;line-height:1.65;position:relative}.tut-substeps li:before{color:#fff;background:var(--tut-grad);width:30px;height:30px;box-shadow:0 6px 14px color-mix(in oklab, var(--blog-accent) 24%, transparent);content:counter(tut-substep);border-radius:50%;place-items:center;font-size:.78rem;font-weight:850;display:grid;position:absolute;top:-1px;left:0}.tut-substeps li:after{border-left:2px solid var(--tut-line-soft);content:"";position:absolute;top:33px;bottom:3px;left:14px}.tut-substeps li:last-child{padding-bottom:0}.tut-substeps li:last-child:after{display:none}.blog-figure.tut-figure{border:1px solid color-mix(in oklab, var(--blog-accent) 18%, var(--panel-border));background:var(--panel-strong);border-radius:22px;margin:16px 0;padding:8px;position:relative;box-shadow:0 22px 48px #263d631f}.tut-figure img,.tut-figure video{box-shadow:none;border-radius:15px}.tut-figure:before{--c:color-mix(in oklab, var(--blog-accent) 75%, transparent);background:linear-gradient(var(--c) 0 0) top left / 22px 3px, linear-gradient(var(--c) 0 0) top left / 3px 22px, linear-gradient(var(--c) 0 0) top right / 22px 3px, linear-gradient(var(--c) 0 0) top right / 3px 22px, linear-gradient(var(--c) 0 0) bottom left / 22px 3px, linear-gradient(var(--c) 0 0) bottom left / 3px 22px, linear-gradient(var(--c) 0 0) bottom right / 22px 3px, linear-gradient(var(--c) 0 0) bottom right / 3px 22px;pointer-events:none;content:"";background-repeat:no-repeat;position:absolute;inset:-7px}.tut-figure figcaption{padding:4px 6px 2px}.tut-finish{border:1px solid color-mix(in oklab, var(--tut-done) 34%, var(--panel-border));background:radial-gradient(circle at 90% 8%, color-mix(in oklab, var(--tut-done) 20%, transparent), transparent 42%), linear-gradient(150deg, color-mix(in oklab, var(--tut-done) 8%, var(--panel-strong)), var(--panel-strong));border-radius:26px;gap:18px;padding:clamp(22px,4vw,34px);scroll-margin-top:112px;display:grid;position:relative;overflow:clip}.tut-finish__scene{--tut-pad:clamp(22px, 4vw, 34px);height:144px;margin:calc(var(--tut-pad) * -1) calc(var(--tut-pad) * -1) 0;view-timeline-name:--tut-scene;position:relative}.tut-finish__tape{background:repeating-conic-gradient(var(--heading) 0 25%, var(--panel-strong) 0 50%) 0 0 / 16px 16px;width:50%;height:16px;position:absolute;top:66px;box-shadow:0 8px 14px -8px #0f172a80}.tut-finish__tape--left{clip-path:polygon(0 0,100% 0,97% 35%,100% 62%,96% 100%,0 100%);transform-origin:0;left:0}.tut-finish__tape--right{clip-path:polygon(4% 0,100% 0,100% 100%,3% 100%,0 62%,4% 35%);transform-origin:100%;right:0}.tut-finish__burst{top:var(--y);left:var(--x);width:0;height:0;position:absolute}.tut-finish__burst:before{opacity:0;content:"";background:linear-gradient(#f59e0b,#0000);border-radius:2px;width:3px;height:26px;position:absolute;top:0;left:-1.5px}.tut-finish__burst i{background:var(--blog-accent);opacity:0;border-radius:2px;width:4px;height:12px;position:absolute;top:-6px;left:-2px}.tut-finish__burst i:nth-child(3n){background:var(--tut-done)}.tut-finish__burst i:nth-child(3n+1){background:#f59e0b}.tut-finish__burst:nth-child(4) i:nth-child(odd){background:#ec4899}.tut-finish__stamp{z-index:1;width:112px;height:112px;color:var(--tut-done-ink);place-items:center;margin:-56px 0 0 -56px;display:grid;position:absolute;top:54%;left:50%;rotate:-12deg}.tut-finish__stamp>svg:first-child{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.tut-finish__stamp circle{fill:color-mix(in oklab, var(--panel-strong) 94%, transparent);stroke:currentColor;stroke-width:3px}.tut-finish__stamp .tut-finish__stamp-inner{fill:none;stroke-dasharray:3 3;stroke-width:1.5px}.tut-finish__stamp path{fill:none}.tut-finish__stamp text{fill:currentColor;font-size:10.5px;font-weight:850}.tut-finish__stamp>svg:last-child{box-sizing:content-box;color:#fff;background:var(--tut-done);border-radius:50%;width:28px;height:28px;padding:9px;position:relative}.tut-finish__copy{gap:6px;max-width:560px;display:grid}.blog-article .tut-finish__kicker{color:var(--tut-done-ink);letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:.74rem;font-weight:850}.blog-article__body .tut-finish h2{color:var(--heading);letter-spacing:-.03em;text-wrap:balance;margin:0;font-size:clamp(1.5rem,3vw,2.1rem);font-weight:790;line-height:1.15}.tut-finish__copy>p:last-child{color:var(--body);margin:0;font-size:.98rem;line-height:1.6}.blog-article__body .tut-finish__recap{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.tut-finish__recap a{border:1px solid color-mix(in oklab, var(--tut-done) 22%, var(--panel-border));min-height:44px;color:var(--heading);background:color-mix(in oklab, var(--panel-strong) 82%, transparent);border-radius:14px;grid-template-columns:22px minmax(0,1fr);align-items:start;gap:10px;padding:10px 12px;font-size:.86rem;font-weight:650;line-height:1.35;text-decoration:none;transition:border-color .2s,transform .2s;display:grid}.tut-finish__recap a:hover,.tut-finish__recap a:focus-visible{border-color:var(--tut-done);outline:none;transform:translateY(-1px)}.tut-finish__tick{color:#fff;background:var(--tut-done);border-radius:50%;place-items:center;width:22px;height:22px;display:grid}.tut-finish__number{color:color-mix(in oklab, var(--blog-accent) 85%, var(--heading));margin-right:6px;font-weight:850}@supports (animation-timeline:view()){.tut-step__pin{animation:linear both tut-pin-drop;animation-timeline:view();animation-range:entry cover 30%}.tut-step__shadow{animation:linear both tut-shadow;animation-timeline:view();animation-range:entry cover 30%}.tut-leg__draw{animation:linear both tut-draw;animation-timeline:--tut-leg;animation-range:cover 15% cover 60%}.tut-leg__car{animation:linear both tut-drive;animation-timeline:--tut-leg;animation-range:cover 15% cover 60%}.tut-leg__label{animation:linear both tut-fade-up;animation-timeline:--tut-leg;animation-range:cover 20% cover 45%}.tut-figure:before{animation:linear both tut-focus;animation-timeline:view();animation-range:entry cover 35%}.tut-route--inline .tut-route__stop,.tut-finish__tick{animation:linear both tut-pop-in;animation-timeline:view();animation-range:entry}.tut-step__head{animation:linear both tut-camera;animation-timeline:view();animation-range:entry cover 24%}.tut-step__marker{view-timeline-name:--tut-marker}.tut-step__marker:before{animation:linear both tut-zoom-ring;animation-timeline:--tut-marker;animation-range:entry 40% cover 40%}.tut-substeps li{view-timeline-name:--tut-substep}.tut-substeps li:before{animation:linear both tut-badge;animation-timeline:--tut-substep;animation-range:entry entry 90%}.tut-substeps li:after{transform-origin:top;animation:linear both tut-line-grow;animation-timeline:--tut-substep;animation-range:entry 60% cover 55%}.tut-finish__tape--left{animation:linear both tut-tape-left;animation-timeline:--tut-scene;animation-range:cover 10% cover 30%}.tut-finish__tape--right{animation:linear both tut-tape-right;animation-timeline:--tut-scene;animation-range:cover 10% cover 30%}.tut-finish__burst:before{animation:linear both tut-rocket;animation-timeline:--tut-scene;animation-range:var(--tut-burst-range,cover 8% cover 38%)}.tut-finish__burst i{animation:linear both tut-burst;animation-timeline:--tut-scene;animation-range:var(--tut-burst-range,cover 8% cover 38%)}.tut-finish__burst:nth-child(4){--tut-burst-range:cover 14% cover 44%}.tut-finish__burst:nth-child(5){--tut-burst-range:cover 20% cover 50%}.tut-finish__stamp{animation:linear both tut-stamp;animation-timeline:--tut-scene;animation-range:cover 22% cover 38%}}@supports (animation-timeline:view()) and (timeline-scope:none){.blog-article--tutorial .tut-step{view-timeline-name:var(--tut-tl);view-timeline-inset:35% 64%}.tut-route--side .tut-route__link:not(.tut-route__link--finish,.tut-route__link--start){animation:linear tut-spy-link;animation-timeline:var(--tut-tl)}.tut-route--side .tut-route__link:not(.tut-route__link--finish,.tut-route__link--start) .tut-route__stop{animation:linear tut-spy-stop,step-end forwards tut-visited;animation-timeline:var(--tut-tl), var(--tut-tl)}.tut-progress__label--step{animation:linear tut-spy-label;animation-timeline:var(--tut-tl)}.tut-progress__fill{animation:linear both tut-fill;animation-timeline:var(--tut-tl)}.tut-progress__stop{animation:step-start both tut-stop-on;animation-timeline:var(--tut-tl)}.tut-progress__car{animation:linear tut-car;animation-timeline:var(--tut-tl)}}@keyframes tut-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes tut-pop-in{0%{opacity:0;transform:scale(.4)}}@keyframes tut-ring{0%{opacity:.75;transform:scale(.8)}to{opacity:0;transform:scale(2.6)}}@keyframes tut-pin-drop{0%{opacity:0;transform:translateY(-30px)rotate(-45deg)scale(.6)}60%{opacity:1;transform:translateY(3px)rotate(-45deg)scale(1.04)}to{transform:rotate(-45deg)}}@keyframes tut-shadow{0%{opacity:0;transform:scale(.3)}60%{opacity:1;transform:scale(1.1)}}@keyframes tut-drive{0%{offset-distance:0%}to{offset-distance:100%}}@keyframes tut-fade-up{0%{opacity:0;transform:translateY(8px)}}@keyframes tut-focus{0%{opacity:0;transform:scale(1.07)}}@keyframes tut-camera{0%{opacity:.2;transform:perspective(700px)rotateX(42deg)translateY(36px)scale(.9)}}@keyframes tut-zoom-ring{0%{opacity:0;scale:2.6}40%{opacity:.7}to{opacity:0;scale:.45}}@keyframes tut-badge{0%{opacity:0;transform:scale(.3)rotate(-90deg)}}@keyframes tut-line-grow{0%{transform:scaleY(0)}}@keyframes tut-tape-left{0%{transform:none}30%{transform:scaleX(1.03)}to{transform:rotate(16deg)scaleX(.9)}}@keyframes tut-tape-right{0%{transform:none}30%{transform:scaleX(1.03)}to{transform:rotate(-16deg)scaleX(.9)}}@keyframes tut-rocket{0%{opacity:0;transform:translateY(110px)}10%{opacity:1}34%{opacity:1;transform:none}40%,to{opacity:0;transform:none}}@keyframes tut-burst{0%,36%{opacity:0;transform:rotate(var(--a)) translateY(0) scale(.3)}46%{opacity:1}to{opacity:0;transform:rotate(var(--a)) translateY(-46px) scale(1)}}@keyframes tut-stamp{0%{opacity:0;transform:scale(2.6)rotate(-30deg)}70%{opacity:1;transform:scale(.94)}to{opacity:1;transform:none}}@keyframes tut-check-pop{40%{transform:scale(1.18)}}@keyframes tut-spy-link{0%,to{color:var(--heading);background-color:var(--blog-accent-soft)}}@keyframes tut-spy-stop{0%,to{color:#fff;background-color:var(--blog-accent);box-shadow:0 0 0 5px color-mix(in oklab, var(--blog-accent) 18%, transparent);border-color:#0000;transform:scale(1.14)}}@keyframes tut-visited{to{color:#fff;background-color:color-mix(in oklab, var(--blog-accent) 62%, var(--panel-strong));border-color:#0000}}@keyframes tut-spy-label{0%,to{opacity:1}}@keyframes tut-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes tut-stop-on{to{background-color:var(--blog-accent)}}@keyframes tut-car{0%{opacity:1;left:0%}to{opacity:1;left:100%}}.blog-article--tutorial .blog-reading-surface{background:color-mix(in oklab, var(--panel-strong) 84%, transparent);overflow:clip}@media (max-width:1050px){.tut-route--side{display:none}.tut-route--inline{border-bottom:1px solid color-mix(in oklab, var(--blog-accent) 18%, var(--panel-border));background:color-mix(in oklab, var(--blog-accent) 5%, var(--panel-strong));padding:18px 20px 20px;display:grid}.blog-article--tutorial .tut-step,.tut-finish{scroll-margin-top:136px}.blog-article--tutorial .blog-article-hero{padding-bottom:50px}@supports (animation-timeline:view()) and (timeline-scope:none){.tut-progress{top:var(--tut-bar-top);z-index:6;border:1px solid color-mix(in oklab, var(--blog-accent) 22%, var(--panel-border));background:var(--panel-strong);border-radius:16px;gap:8px;margin:0 -6px 24px;padding:9px 14px;display:grid;position:sticky;box-shadow:0 12px 30px #233d6921}}}@media (max-width:680px){.blog-article--tutorial .blog-article-hero__eyebrow>span:last-child{display:inline-flex}.blog-article--tutorial .blog-article-hero h1{letter-spacing:-.045em;font-size:clamp(1.9rem,8.8vw,2.45rem);line-height:1.06}.blog-article--tutorial .blog-article-hero__description{font-size:.98rem}.tut-stage__pin{width:38px;height:38px}.tut-stage__orbit{width:104px;height:104px;top:calc(-9% - 33px);right:calc(10% - 33px)}.tut-stage__compass{width:58px;height:58px}.tut-stage__compass i{height:36px}.tut-stage__sign{padding:7px 12px;font-size:.74rem}.blog-article--tutorial .blog-reading-surface{box-shadow:none;background:0 0;border:0;border-radius:0}.blog-article--tutorial .blog-article__body{gap:40px;padding:4px 4px 28px}.tut-route--inline{border:1px solid color-mix(in oklab, var(--blog-accent) 20%, var(--panel-border));background:color-mix(in oklab, var(--blog-accent) 6%, var(--panel-strong));border-radius:20px;margin-bottom:26px;padding:16px 14px 14px}.blog-article--tutorial .blog-article__body .blog-content-section>p{font-size:1.0625rem;line-height:1.72}.blog-article--tutorial .blog-article__body .tut-step h2{font-size:clamp(1.4rem,6.4vw,1.8rem)}.tut-step__head{grid-template-columns:42px minmax(0,1fr);column-gap:12px}.tut-checklist{padding:4px}.tut-checklist label{gap:11px;padding:10px}.tut-checklist input{top:11px;left:11px}.blog-article .tut-checklist__foot{padding-left:48px}.blog-article__body .tut-finish__recap{grid-template-columns:1fr}.tut-finish__burst i{height:10px}}@media (prefers-reduced-motion:reduce){.tut-ambient__pin,.tut-ambient__flight,.tut-ambient__cloud,.tut-checklist__confetti,.tut-finish__burst{display:none}.tut-ambient,.tut-ambient__glow,.tut-ambient__topo,.tut-ambient__rose,.blog-article--tutorial .blog-article-hero__visual,.tut-step__head,.tut-step__marker:before,.tut-substeps li:before,.tut-substeps li:after,.tut-finish__tape,.tut-finish__stamp,.tut-step__pin,.tut-step__shadow,.tut-leg__draw,.tut-leg__car,.tut-leg__label,.tut-figure:before,.tut-route--inline .tut-route__stop,.tut-finish__tick,.tut-checklist input:checked+.tut-checklist__box{animation:none}.tut-checklist__box path,.tut-route__link,.tut-route__stop,.tut-finish__recap a{transition:none}}@media print{.tut-ambient,.tut-progress,.tut-leg,.tut-checklist__confetti,.tut-finish__scene{display:none}}