.sv-demo{--sv-ink:#1f1f1f;--sv-ink-2:#555;--sv-ink-3:gray;--sv-line:#dedede;--sv-surface:#fff;--sv-accent:#0a84ff;--sv-ok:#298646;--sv-err:#c13c3b;--sv-ease:cubic-bezier(.23, 1, .32, 1);color:var(--sv-ink);padding:20px;font-size:13.5px;line-height:1.5}@supports (color:lab(0% 0 0)){.sv-demo{--sv-ink:lab(11.84% 0 0);--sv-ink-2:lab(36.2% 0 .00000596046);--sv-ink-3:lab(53.6% 0 0);--sv-line:lab(88.4% 0 .0000119209);--sv-ok:lab(49.4309% -39.316 25.9959);--sv-err:lab(46.0946% 53.6611 32.391)}}@media (min-width:640px){.sv-demo{padding:28px}}.sv-bar{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:16px;display:flex}.sv-seg{background:#eee;background:lab(94.2% 0 0);border-radius:12px;padding:3px;display:inline-flex}.sv-seg button{min-height:44px;font:inherit;color:var(--sv-ink-2);transition:background-color .16s var(--sv-ease), color .16s var(--sv-ease), box-shadow .16s var(--sv-ease);border-radius:9px;padding:0 14px;font-weight:500}.sv-seg button[aria-pressed=true]{background:var(--sv-surface);color:var(--sv-ink);box-shadow:0 1px 2px #00000014,0 0 0 1px #0000000a;box-shadow:0 1px 2px lab(0% 0 0/.08),0 0 0 1px lab(0% 0 0/.04)}.sv-btn{min-height:44px;font:inherit;background:var(--sv-surface);color:var(--sv-ink);box-shadow:0 0 0 1px var(--sv-line), 0 1px 2px #0000000d;transition:transform .16s var(--sv-ease), box-shadow .16s var(--sv-ease);border-radius:12px;padding:0 16px;font-weight:500}@supports (color:lab(0% 0 0)){.sv-btn{box-shadow:0 0 0 1px var(--sv-line), 0 1px 2px lab(0% 0 0/.05)}}.sv-btn:active{transform:scale(.97)}.sv-btn--accent{background:var(--sv-accent);color:#fff;box-shadow:none}.sv-seg button:focus-visible,.sv-btn:focus-visible,.sv-swatch:focus-visible,.sv-range:focus-visible{outline:2px solid var(--sv-accent);outline-offset:2px}.sv-label{letter-spacing:.05em;text-transform:uppercase;color:var(--sv-ink-3);font-size:11.5px;font-weight:500}.sv-clean{gap:16px;display:grid}@media (min-width:700px){.sv-clean{grid-template-columns:200px minmax(0,1fr);align-items:start}}.sv-clean__stage{background:var(--sv-surface);height:200px;box-shadow:0 0 0 1px var(--sv-line);border-radius:14px;place-items:center;display:grid;position:relative;overflow:hidden}.sv-clean__box{outline-offset:0;outline:1px dashed #c4c4c4;outline:1px dashed lab(79.12% -.0000298023 -.0000119209);width:112px;height:112px}.sv-clean__box>svg{width:100%;height:100%;display:block}.sv-clean__box>svg[width]{width:auto;height:auto}.sv-clean__hint{color:var(--sv-ink-3);text-align:center;font-size:11.5px;position:absolute;bottom:10px;left:12px;right:12px}.sv-swatches{gap:6px;display:flex}.sv-swatch{border-radius:12px;place-items:center;width:44px;height:44px;display:grid}.sv-swatch span{border-radius:50%;width:22px;height:22px;box-shadow:inset 0 0 0 1px #0000001a;box-shadow:inset 0 0 0 1px lab(0% 0 0/.1)}.sv-swatch[aria-pressed=true]{box-shadow:0 0 0 2px var(--sv-ink)}.sv-code{color:#d7d7d7;color:lab(86.08% -.0000298023 0);font-family:var(--font-geist-mono), ui-monospace, monospace;white-space:pre-wrap;overflow-wrap:anywhere;background:#161616;background:lab(7.22637% -.0000149012 0);border-radius:12px;margin:0;padding:14px 16px;font-size:11.5px;line-height:1.65}.sv-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px;display:grid}.sv-stat{background:var(--sv-surface);box-shadow:0 0 0 1px var(--sv-line);border-radius:12px;padding:10px 12px}.sv-stat b{font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:20px;font-weight:600;display:block}.sv-stat small{color:var(--sv-ink-3);font-size:11.5px}.sv-checks{gap:4px;margin:12px 0 0;padding:0;list-style:none;display:grid}@media (min-width:520px){.sv-checks{grid-template-columns:1fr 1fr}}.sv-checks li{color:var(--sv-ink-2);align-items:baseline;gap:8px;font-size:12.5px;display:flex}.sv-checks li:before{content:"✕";color:var(--sv-err);flex:none;width:12px;font-weight:600}.sv-checks li[data-ok]:before{content:"✓";color:var(--sv-ok)}.sv-draw{gap:16px;display:grid}@media (min-width:700px){.sv-draw{grid-template-columns:minmax(0,1fr) 260px;align-items:center}}.sv-draw__stage{background:var(--sv-surface);box-shadow:0 0 0 1px var(--sv-line);border-radius:14px;place-items:center;padding:16px;display:grid}.sv-draw__stage svg{width:100%;max-width:360px;height:auto;display:block}.sv-draw__path{fill:none;stroke:var(--sv-ink);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.sv-draw__path[data-play]{animation:1.6s cubic-bezier(.65,0,.35,1) both sv-draw}.sv-draw__ghost{fill:none;stroke:#e8e8e8;stroke:lab(91.88% .0000298023 -.0000119209);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}@keyframes sv-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}.sv-range{width:100%;height:44px;accent-color:var(--sv-accent)}.sv-readout{font-family:var(--font-geist-mono), ui-monospace, monospace;color:var(--sv-ink-2);background:#f2f2f2;background:lab(95.36% 0 0);border-radius:8px;padding:8px 10px;font-size:12px}.sv-origin{grid-template-columns:1fr 1fr;gap:12px;display:grid}.sv-origin__cell{background:var(--sv-surface);box-shadow:0 0 0 1px var(--sv-line);text-align:center;border-radius:14px;padding:12px;overflow:hidden}.sv-origin__cell svg{width:100%;max-width:180px;height:auto;margin:0 auto 8px;display:block;overflow:visible}.sv-origin__cell code{color:var(--sv-ink-2);font-size:11px}.sv-origin__frame{fill:none;stroke:#cecece;stroke:lab(82.6% .0000298023 -.0000119209);stroke-dasharray:3 3}.sv-origin__dot{fill:var(--sv-err)}.sv-origin__shape{transition:transform .4s var(--sv-ease)}.sv-origin__shape--fix{transform-box:fill-box;transform-origin:50%}.sv-morph{gap:16px;display:grid}@media (min-width:700px){.sv-morph{grid-template-columns:220px minmax(0,1fr);align-items:center}}.sv-morph__stage{background:var(--sv-surface);box-shadow:0 0 0 1px var(--sv-line);border-radius:14px;place-items:center;height:220px;display:grid}.sv-morph__stage svg{width:150px;height:150px;display:block}.sv-cmds{flex-wrap:wrap;gap:4px;margin-top:6px;display:flex}.sv-cmd{font-family:var(--font-geist-mono), ui-monospace, monospace;text-align:center;min-width:24px;color:var(--sv-ink-2);background:#eee;background:lab(94.2% 0 0);border-radius:6px;padding:2px 6px;font-size:11.5px}.sv-cmd[data-bad]{color:var(--sv-err);background:#ffe7e4;background:lab(93.8292% 12.2803 6.63641)}.sv-morph__row+.sv-morph__row{margin-top:12px}.sv-verdict{color:var(--sv-ink-2);margin-top:14px;font-size:13px}.sv-verdict b{color:var(--sv-ink)}.sv-swap{flex-wrap:nowrap;justify-content:center;align-items:flex-start;gap:16px;padding:8px 0;display:flex}.sv-swap__btn{background:var(--sv-surface);width:56px;height:56px;box-shadow:0 0 0 1px var(--sv-line), 0 1px 2px #0000000d;color:var(--sv-ink);transition:transform .16s var(--sv-ease);border-radius:16px;position:relative}@supports (color:lab(0% 0 0)){.sv-swap__btn{box-shadow:0 0 0 1px var(--sv-line), 0 1px 2px lab(0% 0 0/.05)}}.sv-swap__btn:active{transform:scale(.96)}.sv-swap__btn:focus-visible{outline:2px solid var(--sv-accent);outline-offset:2px}.sv-swap__btn svg{width:22px;height:22px;transition:transform .26s var(--sv-ease), opacity .2s var(--sv-ease), filter .2s var(--sv-ease);margin:auto;position:absolute;inset:0}.sv-swap__btn svg[data-off]{opacity:0;filter:blur(3px);transform:scale(.3)}.sv-swap__btn[data-naive] svg{transition:none}.sv-swap__item{color:var(--sv-ink-3);text-align:center;flex:1 1 0;justify-items:center;gap:8px;max-width:160px;font-size:12px;display:grid}.sv-sticker{gap:16px;display:grid}@media (min-width:700px){.sv-sticker{grid-template-columns:minmax(0,1fr) 240px;align-items:center}}.sv-sticker__stage{background:#eff6fd;background:lab(96.5096% -1.30332 -4.28046);border-radius:14px;place-items:center;padding:8px;display:grid}.sv-sticker__stage svg{width:100%;max-width:300px;height:auto;display:block}.sv-sticker__notes{color:var(--sv-ink-2);gap:8px;font-size:12.5px;display:grid}.sv-shackle[data-play]{animation:1s linear both sv-clasp}.sv-body[data-play]{transform-box:fill-box;transform-origin:50% 100%;animation:1s linear both sv-squash}.sv-spark{transform-box:fill-box;transform-origin:50%;transform:scale(0)}.sv-spark[data-play]{animation:1s linear both sv-spark}.sv-spark[data-still]{transform:scale(1)}@keyframes sv-clasp{0%{animation-timing-function:cubic-bezier(.55,0,1,.45);transform:translateY(-46px)}34%{animation-timing-function:cubic-bezier(.23,1,.32,1);transform:translateY(0)}48%{animation-timing-function:cubic-bezier(.55,0,1,.45);transform:translateY(-12px)}60%{animation-timing-function:cubic-bezier(.23,1,.32,1);transform:translateY(0)}70%{animation-timing-function:cubic-bezier(.55,0,1,.45);transform:translateY(-4px)}78%,to{transform:translateY(0)}}@keyframes sv-squash{0%,32%{transform:scale(1)}38%{transform:scale(1.03,.95)}50%,to{transform:scale(1)}}@keyframes sv-spark{0%,33%{transform:scale(0)rotate(-30deg)}45%{transform:scale(1.2)rotate(0)}56%,to{transform:scale(1)rotate(0)}}.sv-flip{gap:16px;display:grid}.sv-flip__stage{background:var(--sv-surface);box-shadow:0 0 0 1px var(--sv-line);border-radius:14px;place-items:center;height:200px;display:grid}.sv-flip__stage svg{width:160px;height:160px;display:block}.sv-flip__strip{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;display:grid}.sv-flip__cell{background:var(--sv-surface);box-shadow:0 0 0 1px var(--sv-line);text-align:center;color:var(--sv-ink-3);border-radius:10px;padding:4px;font-size:11px}.sv-flip__cell svg{width:100%;height:auto;display:block}.sv-frame{visibility:hidden}.sv-flip[data-play] .sv-frame{animation:.5s step-end infinite sv-step}.sv-flip:not([data-play]) .sv-frame:first-child{visibility:visible}@keyframes sv-step{0%{visibility:visible}16.6667%,to{visibility:hidden}}@media (prefers-reduced-motion:reduce){.sv-draw__path[data-play],.sv-shackle[data-play],.sv-body[data-play]{animation:none}.sv-spark[data-play]{animation:none;transform:scale(1)}.sv-flip[data-play] .sv-frame{animation:none}.sv-flip[data-play] .sv-frame:first-child{visibility:visible}.sv-origin__shape,.sv-swap__btn svg{transition-duration:0s}}.sv-clean>*,.sv-draw>*,.sv-morph>*,.sv-sticker>*,.sv-origin>*{min-width:0}.sv-demo code,.sv-demo pre,.sv-demo .sv-readout,.sv-demo .sv-cmd{font-family:var(--font-mono)}.sv-strip{gap:10px;margin-top:18px;display:grid}.sv-strip__hint{color:var(--sv-ink-3);text-align:center;font-size:12px}.sv-strip__row{grid-template-columns:92px repeat(5,minmax(0,1fr));align-items:center;gap:6px;display:grid}.sv-strip__label{color:var(--sv-ink-3);font-size:12px}.sv-strip__cell{aspect-ratio:1;background:var(--sv-surface);max-height:52px;box-shadow:0 0 0 1px var(--sv-line);color:var(--sv-ink);border-radius:10px;position:relative}.sv-strip__cell svg{width:46%;height:46%;margin:auto;position:absolute;inset:0}.sv-morph__ghost{fill:none;stroke:#aeaeae;stroke:lab(71% 0 0);stroke-width:.25px;stroke-dasharray:.8 .6}