.sv-uiart{display:block;overflow:visible}.sv-uiart *{transform-box:fill-box;transform-origin:50% 50%}.sv-uiart .p-card{fill:#fff;stroke:var(--line);stroke-width:1.5}.sv-uiart .p-soft{fill:color-mix(in srgb,var(--fw) 16%,#fff)}.sv-uiart .p-ink,.sv-uiart .p-ink-c{fill:var(--ink)}.sv-uiart .p-mute,.sv-uiart .p-skel,.sv-uiart .p-skel-c{fill:#e4e0d9}.sv-uiart .p-fw,.sv-uiart .p-fw-c{fill:var(--fw)}.sv-uiart .p-w-soft{fill:hsla(0,0%,100%,.35)}.sv-uiart .p-w-c{fill:hsla(0,0%,100%,.6)}.sv-uiart .p-outlines rect{fill:none;stroke:var(--fw);stroke-dasharray:5 5;stroke-width:1.5;opacity:.5}.sv-uiart .p-line-box{fill:#fff;stroke:var(--line);stroke-width:1.5}.sv-uiart .p-glyph,.sv-uiart .p-route,.sv-uiart .p-stroke,.sv-uiart .p-track,.sv-uiart .u-ring{fill:none;stroke-linecap:round;stroke-linejoin:round}.sv-uiart .p-stroke{stroke:var(--ink);stroke-width:5}.sv-uiart .p-route{stroke:var(--line);stroke-dasharray:4 6;stroke-width:3}.sv-uiart .p-glyph{stroke:#fff;stroke-width:2.5}.sv-uiart .p-track{stroke:#e4e0d9;stroke-width:14}.sv-uiart text{fill:var(--ink);font-family:var(--font-sans);font-weight:700}.sv-uiart .p-pill,.sv-uiart .p-tag{font-family:var(--mono);font-size:12px;font-weight:600}.sv-uiart .p-tag{fill:var(--fw)}.sv-uiart .p-pill{text-anchor:middle;fill:#fff}.sv-uiart .p-price{font-size:22px}.sv-uiart .p-op{fill:var(--ink-2)}.sv-uiart .p-op,.sv-uiart .p-qty{text-anchor:middle;font-size:22px}.sv-uiart .p-badge{text-anchor:middle;fill:#fff;font-size:15px}.sv-uiart .p-total{font-size:26px}.sv-uiart .p-small{text-anchor:end;font-size:15px}.sv-uiart .p-score{text-anchor:middle;font-size:44px;letter-spacing:-.04em}.sv-uiart .p-cap{text-anchor:middle;fill:var(--ink-2);font-size:13px;font-weight:600}.sv-uiart .p-cap--left{text-anchor:start}.sv-uiart .p-test{fill:var(--ink-2);font-size:14px;font-weight:500}.sv-uiart .p-pass{fill:var(--ink);font-size:16px}.sv-uiart .u-in{--t:clamp(0,calc((var(--lp) - var(--a))*7),1);opacity:var(--t);transform:translateY(calc((1 - var(--t))*10px))}.sv-uiart .u-win{opacity:calc(clamp(0, (var(--lp) - var(--a)) * 25, 1) * clamp(0, (var(--b) - var(--lp)) * 25, 1))}.sv-uiart .u-tap{fill:var(--fw);opacity:calc(.35 * clamp(0, (var(--lp) - var(--a)) * 25, 1) * clamp(0, (var(--a) + .1 - var(--lp)) * 25, 1))}.sv-uiart .u-nav,.sv-uiart .u-page-in,.sv-uiart .u-page-out{--s:clamp(0,calc((var(--lp) - 0.35)*3.5),1)}.sv-uiart .u-nav{transform:translateX(calc(var(--s)*92px))}.sv-uiart .u-page-out{opacity:calc(1 - var(--s));transform:translateX(calc(var(--s)*-160px))}.sv-uiart .u-page-in{opacity:var(--s);transform:translateX(calc((1 - var(--s))*160px))}.sv-uiart .u-ring{stroke:var(--fw);stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--lp));stroke-width:14;transform:rotate(-90deg)}.sv-uiart .u-bar{transform:scaleX(calc(var(--lp)*var(--k)));transform-origin:0 50%}.sv-uiart .p-skel{animation:cui-shimmer 1.4s ease-in-out infinite}.sv-uiart .u-stream{fill:var(--fw);animation:cui-stream 1.2s linear infinite}.sv-uiart .u-stream--2{animation-delay:-.6s}@keyframes cui-shimmer{0%{opacity:1}50%{opacity:.45}to{opacity:1}}@keyframes cui-stream{0%{opacity:0;transform:translateX(0)}20%{opacity:1}80%{opacity:1}to{opacity:0;transform:translateX(44px)}}.sv-cui .sv-uiart *{animation-play-state:paused!important}.sv-cui__chapter.is-seen .sv-uiart *,.sv-cui__scene.is-active .sv-uiart *{animation-play-state:running!important}@media (prefers-reduced-motion:reduce){.sv-cui .sv-uiart *{animation:none!important}}.sv-cui{--p:0;--lp:1;--fw:var(--orange);--fw-code:var(--orange-lift);--mono:ui-monospace,sfmono-regular,menlo,consolas,"Liberation Mono",monospace}.sv-cui--react{--fw:#149eca;--fw-code:#61dafb}.sv-cui--angular{--fw:#dd0031;--fw-code:#ff6b8b}.sv-cui--vue{--fw:#2f9768;--fw-code:#42b883}.sv-cui--next{--fw:#111;--fw-code:#8ab4ff}.sv-cui--nuxt{--fw:#00a565;--fw-code:#00dc82}.sv-cui__body{align-items:start;display:grid;gap:clamp(28px,4vw,64px);grid-template-columns:minmax(0,4fr) minmax(0,8fr);margin-block-start:clamp(34px,4vw,58px)}@media (max-width:960px){.sv-cui__body{grid-template-columns:1fr}}.sv-cui__list{list-style:none;padding:0}@media (max-width:960px){.sv-cui__list{display:grid;gap:16px}}@media (min-width:961px){.sv-cui__chapter{align-items:center;display:flex;min-block-size:max(260px,52vh)}}@media (max-width:960px){.sv-cui__chapter{background:var(--bone);border-radius:var(--r-card);overflow:hidden}}.sv-cui__copy{align-items:baseline;display:grid;gap:6px 16px;grid-template-columns:auto minmax(0,1fr);inline-size:100%}@media (max-width:960px){.sv-cui__copy{padding:22px 22px 18px}}.sv-cui__number{color:var(--ink-3);font-family:var(--font-serif);font-size:clamp(30px,2.6vw,40px);font-style:italic;line-height:.9;transition:color .4s var(--ease)}@media (max-width:960px){.sv-cui__number{color:var(--orange-text)}}.sv-cui__title{color:var(--ink-3);font-size:clamp(20px,1.7vw,26px);font-weight:800;letter-spacing:-.03em;line-height:1.15;transition:color .4s var(--ease)}@media (max-width:960px){.sv-cui__title{color:var(--ink)}}.sv-cui__meter,.sv-cui__text-copy{grid-column:2}@media (max-width:960px){.sv-cui__meter,.sv-cui__text-copy{grid-column:1/-1}}.sv-cui__text-copy{color:var(--ink-2);font-size:var(--fs-sm);line-height:1.6;margin-block-start:6px;max-inline-size:44ch}.sv-cui__meter{background:var(--line);block-size:3px;border-radius:2px;display:block;margin-block-start:16px;overflow:hidden}.sv-cui__meter i{background:var(--orange);block-size:100%;display:block;transform:scaleX(var(--lp,0));transform-origin:0 50%}@media (max-width:960px){.sv-cui__meter{display:none}}.sv-cui__chapter.is-active .sv-cui__number{color:var(--orange-text)}.sv-cui__chapter.is-active .sv-cui__title{color:var(--ink)}.sv-cui__bench{background:var(--ink);border-radius:var(--r-panel);box-shadow:0 40px 70px -40px hsla(0,0%,7%,.55);color:var(--paper);inset-block-start:max(110px,50vh - 270px);overflow:hidden;position:sticky}@media (max-width:960px){.sv-cui__bench{display:none}}.sv-cui__status,.sv-cui__top{align-items:center;display:flex;font-size:13px;gap:14px;padding:12px 18px}.sv-cui__top{border-block-end:1px solid hsla(0,0%,100%,.1)}.sv-cui__dots{display:flex;gap:6px}.sv-cui__dots i{background:hsla(0,0%,100%,.18);block-size:10px;border-radius:50%;inline-size:10px}.sv-cui__dots i:first-child{background:var(--orange)}.sv-cui__file{background:hsla(0,0%,100%,.08);border-radius:8px 8px 0 0;color:hsla(0,0%,100%,.85);font-family:var(--mono);font-size:12.5px;padding:5px 12px}.sv-cui__fw{border:1px solid var(--fw-code);border-radius:var(--r-pill);color:var(--fw-code);font-weight:700;margin-inline-start:auto;padding:4px 12px}.sv-cui__split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-block-size:clamp(300px,46vh,400px)}.sv-cui__editor{overflow:hidden;padding:18px 8px 18px 0;position:relative}.sv-cui__code{color:hsla(0,0%,100%,.82);counter-reset:cui-line;display:none;font-family:var(--mono);font-size:clamp(11.5px,.95vw,13.5px);line-height:1.75}.sv-cui__code.is-active{display:block}.sv-cui__line{align-items:center;counter-increment:cui-line;display:flex;min-block-size:1.75em;white-space:pre}.sv-cui__line:before{color:hsla(0,0%,100%,.25);content:counter(cui-line);flex:0 0 auto;inline-size:3.2ch;margin-inline-end:1.4ch;text-align:end}.sv-cui__line.is-caret:after{animation:sv-cui-blink 1s steps(1) infinite;background:var(--fw-code);block-size:1.2em;content:"";flex:0 0 auto;inline-size:2px;margin-inline-start:1px}.sv-cui__text{display:inline-block;overflow:hidden;vertical-align:top}@keyframes sv-cui-blink{0%{opacity:1}50%{opacity:0}to{opacity:1}}.sv-cui .sv-cui__code .t-k{color:var(--fw-code)}.sv-cui .sv-cui__code .t-s{color:#ffc58f}.sv-cui .sv-cui__code .t-t{color:#ff9e7a}.sv-cui .sv-cui__code .t-d{color:#f7b0c8}.sv-cui .sv-cui__code .t-n{color:#c7a6ff}.sv-cui .sv-cui__code .t-f{color:#fff;font-weight:600}.sv-cui .sv-cui__code .t-c{color:hsla(0,0%,100%,.4);font-style:italic}.sv-cui__preview{background:var(--paper);border-radius:14px;color:var(--ink);display:flex;flex-direction:column;margin:10px 10px 10px 0;overflow:hidden}.sv-cui__address{align-items:center;background:var(--bone);border-radius:var(--r-pill);color:var(--ink-2);display:flex;font-family:var(--mono);font-size:12px;gap:8px;margin:10px;padding:6px 12px}.sv-cui__lock{background:var(--fw);block-size:8px;border-radius:50%;inline-size:8px}.sv-cui__scenes{flex:1;margin:0 12px 12px;position:relative}.sv-cui__scene{inset:0;opacity:0;position:absolute;transition:opacity .35s var(--ease)}.sv-cui__scene.is-active{opacity:1}.sv-cui__scene .sv-uiart{block-size:100%;inline-size:100%}.sv-cui__status{border-block-start:1px solid hsla(0,0%,100%,.1);color:hsla(0,0%,100%,.7);font-family:var(--mono)}.sv-cui__state{align-items:center;display:inline-flex;gap:8px}.sv-cui__state:before{background:#f2b36d;block-size:8px;border-radius:50%;content:"";inline-size:8px}.sv-cui__state.is-done:before{background:#4cc38a}.sv-cui__step b{color:var(--paper);font-weight:700}.sv-cui__progress{background:hsla(0,0%,100%,.12);block-size:3px;border-radius:2px;flex:1;overflow:hidden}.sv-cui__progress i{background:var(--orange);block-size:100%;display:block;transform:scaleX(var(--p));transform-origin:0 50%}.sv-cui__card-art{display:none}@media (max-width:960px){.sv-cui__card-art{display:grid;gap:10px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin:0 12px 12px}}@media (max-width:960px) and (max-width:640px){.sv-cui__card-art{grid-template-columns:1fr}}.sv-cui__mini-code{background:var(--ink);border-radius:calc(var(--r-card) - 6px);padding:14px 12px 14px 0}.sv-cui__mini-code .sv-cui__code{display:block;font-size:11.5px}.sv-cui__mini-code .sv-cui__line{white-space:pre-wrap}.sv-cui__mini-file{color:var(--fw-code);display:block;font-family:var(--mono);font-size:11.5px;margin:0 0 8px 14px}.sv-cui__mini-preview{background:var(--paper);border-radius:calc(var(--r-card) - 6px);padding:4%}.sv-cui__mini-preview .sv-uiart{block-size:auto;inline-size:100%}.sv-cui__foot{margin-block-start:clamp(28px,3vw,44px)}@media (prefers-reduced-motion:reduce){.sv-cui__number,.sv-cui__scene,.sv-cui__title{transition:none}.sv-cui__line.is-caret:after{display:none}}