@layer components{.ss-copy[data-copy=copied]{color:var(--brand)}.ss-copy[data-copy=copied] .ss-copy__label{animation:ss-tick .2s var(--ease-out) backwards}.ss-copy__check{color:var(--brand);animation:ss-copy-pop .26s var(--ease-pop) backwards}.ss-copy[data-copy=failed]{animation:.36s ss-shake}.ss-copy__failed{animation:ss-rise .2s var(--ease-out) backwards}.cx{background:var(--code-bg);box-shadow:0 0 0 1px color-mix(in oklch, var(--line) 80%, transparent), var(--shadow-card);border-radius:16px;position:relative;overflow:hidden}.cx-bar{border-bottom:1px solid color-mix(in oklch, var(--line) 75%, transparent);background:var(--card);align-items:center;gap:12px;min-height:44px;padding:0 6px 0 16px;display:flex}.cx-bar--file{gap:10px;min-height:42px}.cx-file{min-width:0;color:var(--ink-2);font-family:var(--font-mono);text-overflow:ellipsis;white-space:nowrap;align-items:center;gap:7px;font-size:12.5px;display:inline-flex;overflow:hidden}.cx-file svg{width:14px;height:14px;color:var(--ink-3);flex:none}.cx-lang{background:var(--paper-3);height:19px;color:var(--ink-3);font-family:var(--font-mono);border-radius:999px;flex:none;align-items:center;padding-inline:7px;font-size:11px;display:inline-flex}.cx-tools{flex:none;align-items:center;gap:2px;margin-left:auto;display:flex}.cx-tools .cx-lang{margin-right:6px}.cx-tool{height:30px;color:var(--ink-2);border-radius:9px;font-size:12.5px}.cx-download{font-family:var(--font-mono);align-items:center;gap:5px;padding-inline:9px;font-size:11.5px;transition:background-color .15s,color .15s;display:inline-flex}.cx-download:hover{background:color-mix(in oklch, var(--ink) 6%, transparent);color:var(--ink)}.cx-download:focus-visible{outline:2px solid var(--brand);outline-offset:1px}.cx-download svg{width:14px;height:14px}.cx-tabs{flex:1;align-self:stretch;gap:18px;min-width:0}.cx-tabs .list-tabs__tab{height:44px;font-family:var(--font-mono);font-size:12.5px}.cx-note{border-bottom:1px solid color-mix(in oklch, var(--line) 70%, transparent);background:color-mix(in oklch, var(--card) 55%, transparent);color:var(--ink-2);animation:ss-tick .24s var(--ease-out) backwards;padding:10px 16px 11px;font-size:13px;line-height:1.55}.cx-code{max-height:36rem;color:var(--code-fg);white-space:pre;tab-size:2;scrollbar-width:thin;padding:14px 18px 18px;font-size:13px;line-height:1.7;overflow:auto}.cx-code:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}.cx-code--wrap{white-space:pre-wrap;overflow-wrap:anywhere}.cx-code--lines code{counter-reset:line}.cx-code--lines .line:before{counter-increment:line;content:counter(line);width:2.6ch;color:var(--ink-3);opacity:.55;text-align:right;-webkit-user-select:none;user-select:none;margin-right:2.2ch;display:inline-block}.cx-code--wrap.cx-code--lines .line{text-indent:-4.8ch;width:100%;padding-left:4.8ch;display:inline-block}.cx-loading{color:var(--ink-3);padding:28px 18px;font-size:13px;position:relative;overflow:hidden}.cx-loading[data-busy]:before{content:"";background:linear-gradient(90deg, transparent, color-mix(in oklch, var(--brand) 85%, transparent), transparent);width:36%;height:2px;animation:1.15s ease-in-out infinite ss-thread;position:absolute;inset:0 auto auto 0}@media (width<=639px){.cx--panel .cx-bar{flex-wrap:wrap;row-gap:0;padding-right:10px}.cx--panel .cx-tabs{flex-basis:100%}.cx--panel .cx-tools{border-top:1px solid color-mix(in oklch, var(--line) 60%, transparent);justify-content:flex-end;width:100%;min-height:40px}.cx--panel .cx-tools .cx-lang{margin-right:auto}}.cx-footnote{color:var(--ink-3);padding-inline:4px;font-size:12px;line-height:1.5}@media (width>=1024px){.mx--strip{grid-template:"head steps""intro steps""stub steps"1fr/minmax(15rem,.95fr) minmax(0,2.6fr);column-gap:0;padding:14px 6px 14px 20px;display:grid}.mx--strip .mx-head{grid-area:head;justify-content:flex-start}.mx--strip .mx-thread{display:none}.mx--strip .mx-intro{grid-area:intro;margin-top:8px;padding-right:20px;font-size:14px}.mx--strip .mx-steps{grid-area:steps;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:0;margin-top:0}.mx--strip .mx-step{background-image:linear-gradient(var(--line-strong) 50%, transparent 0);background-position:0 0;background-repeat:repeat-y;background-size:1px 8px;align-content:start;padding:2px 16px 2px 18px}.mx--strip .mx-step:not(:last-child):before,.mx--strip .mx-step:not(:last-child):after{display:none}.mx--strip .mx-stub{border-top:0;grid-area:stub;align-self:end;margin:10px 0 0;padding:0 20px 0 0}.mx--strip .mx-done{margin-top:0}.mx--strip .mx-stub>p{display:none}.mx--strip .mx-step__hint{font-size:12px}}.mx{background:var(--card);box-shadow:0 0 0 1px color-mix(in oklch, var(--line) 75%, transparent), var(--shadow-card);border-radius:20px;padding:18px 20px;position:relative;overflow:hidden}.mx-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.mx-label{color:var(--ink);align-items:center;gap:7px;font-size:13px;font-weight:600;display:inline-flex}.mx-label svg{width:14px;height:14px;color:var(--ink-3)}.mx-count{background:var(--paper-3);min-width:34px;height:22px;color:var(--ink-2);animation:ss-tick .22s var(--ease-out) backwards;border-radius:999px;justify-content:center;align-items:center;padding-inline:8px;font-size:12px;font-weight:600;transition:background-color .2s,color .2s;display:inline-flex}.mx[data-complete] .mx-count{background:color-mix(in oklch, var(--brand) 12%, transparent);color:var(--brand)}.mx-thread{gap:4px;margin-top:12px;display:flex}.mx-thread>span{background:var(--paper-3);border-radius:999px;flex:1;height:3px;position:relative;overflow:hidden}.mx-thread>span:after{content:"";border-radius:inherit;background:var(--brand);transform-origin:0;transition:scale .52s var(--ease-glide);position:absolute;inset:0;scale:0 1}.mx-thread>span[data-on]:after{scale:1}.mx-intro{color:var(--ink);letter-spacing:-.012em;margin-top:14px;font-size:15px;font-weight:550;line-height:1.4}.mx-steps{gap:14px;margin-top:16px;display:grid}.mx-step{grid-template-columns:24px minmax(0,1fr);gap:12px;display:grid;position:relative}.mx-step:not(:last-child):before,.mx-step:not(:last-child):after{content:"";background:var(--line);border-radius:999px;width:1.5px;position:absolute;top:30px;bottom:-10px;left:11.25px}.mx-step:not(:last-child):after{background:var(--brand);transform-origin:top;transition:scale .42s var(--ease-glide) .12s;scale:1 0}.mx-step[data-done]:not(:last-child):after{scale:1}.mx-mark{background:var(--card);width:24px;height:24px;color:var(--ink-2);box-shadow:inset 0 0 0 1.5px var(--line-strong);border-radius:999px;place-items:center;font-size:11.5px;font-weight:600;transition:background-color .2s,box-shadow .2s;display:grid;position:relative}.mx-check{fill:none;width:14px;height:14px;stroke:var(--brand-ink);stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1px;position:absolute}.mx-step[data-done] .mx-mark{background:var(--brand);box-shadow:inset 0 0 0 1.5px var(--brand);animation:mx-pop .36s var(--ease-pop)}.mx-step[data-done] .mx-num{opacity:0}.mx-step[data-done] .mx-check{stroke-dashoffset:0;transition:stroke-dashoffset .32s var(--ease-out) .12s}.mx-step__label{color:var(--ink);font-size:13.5px;line-height:1.45;transition:color .2s}.mx-step[data-done] .mx-step__label{color:var(--ink-3);text-decoration:line-through;-webkit-text-decoration-color:color-mix(in oklch, var(--ink-3) 55%, transparent);text-decoration-color:color-mix(in oklch, var(--ink-3) 55%, transparent)}.mx-step__hint{color:var(--ink-3);margin-top:3px;font-size:12.5px;line-height:1.5}.mx-step[data-done] .mx-step__hint{display:none}.mx-stub{border-top:1px dashed var(--line-strong);color:var(--ink-3);margin:18px -20px 0;padding:14px 20px 0;font-size:12px;line-height:1.55}.mx-stub>*+*{margin-top:6px}.mx-done{animation:ss-rise .36s var(--ease-glide) backwards;grid-template-columns:34px minmax(0,1fr);align-items:start;gap:12px;display:grid}.mx-done__seal{fill:none;width:34px;height:34px;stroke:var(--brand);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.mx-done__seal circle{stroke-dasharray:1;animation:ss-draw .52s var(--ease-out) backwards}.mx-done__seal path{stroke-dasharray:1;animation:ss-draw .3s var(--ease-out) .42s backwards}.mx-done__title{color:var(--brand);letter-spacing:-.01em;font-size:14.5px;font-weight:600}.mx-done__body{color:var(--ink-2);margin-top:2px;font-size:13px}.mx[data-complete]:before{content:"";background:linear-gradient(90deg, transparent, var(--brand), transparent);width:40%;height:2px;animation:ss-thread 1.1s var(--ease-out) backwards;position:absolute;inset:0 auto auto 0;translate:270%}@media (prefers-reduced-motion:reduce){.ss-copy[data-copy=copied] .ss-copy__label,.ss-copy__check,.ss-copy[data-copy=failed],.ss-copy__failed,.cx-note,.cx-loading[data-busy]:before,.mx-count,.mx-step[data-done] .mx-mark,.mx-done,.mx-done__seal circle,.mx-done__seal path,.mx[data-complete]:before{animation:none}.mx-thread>span:after,.mx-step:not(:last-child):after,.mx-step[data-done]:not(:last-child):after,.mx-mark,.mx-step[data-done] .mx-check,.mx-step__label{transition:none}}}@keyframes mx-pop{40%{scale:1.18}}