:root{--ink-rgb:23, 24, 26;--elev-rgb:255, 255, 255;--bg:#fff;--fg:rgb(var(--ink-rgb));--fg-2:rgba(var(--ink-rgb), .72);--muted:rgba(var(--ink-rgb), .48);--line:rgba(var(--ink-rgb), .08);--wash:.06;--surface:linear-gradient(rgba(var(--ink-rgb), var(--wash)), rgba(var(--ink-rgb), var(--wash))) var(--bg);--chip:rgba(var(--ink-rgb), .06);--chip-on:rgb(var(--ink-rgb));--chip-on-fg:#fff;--elev:rgb(var(--elev-rgb));--modal:#fff;--stage:#f1f1f1;--well:var(--stage);--modal-shadow:0 1px 3px #0000000a, 0 16px 48px #00000014;--spring:cubic-bezier(.28, 1.3, .36, 1);--ease:cubic-bezier(.33, .55, .2, 1);--mono:"SF Mono", ui-monospace, Menlo, Consolas, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;scrollbar-gutter:stable}html[data-theme=dark]{--ink-rgb:242, 241, 238;--elev-rgb:54, 54, 58;--bg:#0e0f11;--wash:.05;--chip-on-fg:#0e0f11;--modal:#191a1c;--stage:#191a1c;--well:var(--bg);--modal-shadow:none;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html,body{background:var(--bg);color:var(--fg)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar-thumb{background:rgba(var(--ink-rgb), .18) padding-box;border:3px solid #0000;border-radius:999px}::-webkit-scrollbar-thumb:hover{background-color:rgba(var(--ink-rgb), .34)}@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:rgba(var(--ink-rgb), .22) transparent}}html.is-locked body{overflow:hidden}a{color:inherit;text-decoration:none}:focus-visible{box-shadow:0 0 0 2px var(--bg), 0 0 0 4px rgba(var(--ink-rgb), .35);outline:none}.iconbtn{width:36px;height:36px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;place-items:center;transition:color .16s;display:inline-grid;position:relative}.iconbtn:before{content:"";border-radius:inherit;background:rgba(var(--ink-rgb), .08);opacity:0;transition:opacity .15s,scale .26s cubic-bezier(.3,1.12,.4,1);position:absolute;inset:0;scale:.86}.iconbtn:hover{color:var(--fg)}.iconbtn:hover:before{opacity:1;scale:1}.iconbtn>svg{transition:scale .26s cubic-bezier(.3,1.12,.4,1);position:relative}.iconbtn:active>svg{transition-duration:90ms;scale:.9}.iconbtn--sm{width:28px;height:28px}.textbtn{height:30px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;align-items:center;gap:6px;padding:0 10px;font-size:12.5px;transition:background .15s,color .15s,opacity .2s;display:inline-flex}.textbtn:hover:not(:disabled){background:var(--chip);color:var(--fg)}.textbtn:disabled{opacity:0;pointer-events:none}.btn{cursor:pointer;white-space:nowrap;height:40px;transition:transform .2s var(--spring), opacity .15s, background .18s, border-color .18s;border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-size:13px;font-weight:500;display:inline-flex}.btn:active{transition-duration:90ms;transform:scale(.96)}.btn--primary{background:var(--chip-on);color:var(--chip-on-fg)}.btn--primary:hover{opacity:.86}.btn--line{border:1px solid rgba(var(--ink-rgb), .16);color:var(--fg-2);background:0 0}.btn--line:hover{background:rgba(var(--ink-rgb), .05);border-color:rgba(var(--ink-rgb), .28);color:var(--fg)}.chip{background:var(--chip);height:32px;color:var(--fg-2);cursor:pointer;white-space:nowrap;transition:background .18s, color .18s, transform .24s var(--spring);border:0;border-radius:999px;align-items:center;gap:6px;padding:0 14px;font-size:13px;font-weight:500;display:inline-flex}.chip:hover:not(:disabled){color:var(--fg);background:rgba(var(--ink-rgb), .09)}.chip:active:not(:disabled){transform:scale(.95)}.chip span{color:var(--muted);font-variant-numeric:tabular-nums;font-size:11.5px}.chip[aria-selected=true]{background:var(--chip-on);color:var(--chip-on-fg)}.chip[aria-selected=true] span{color:inherit;opacity:.6}.chip:disabled{opacity:.35;cursor:default}.seg{background:rgba(var(--ink-rgb), var(--wash));border-radius:999px;gap:2px;padding:2px;display:inline-flex}.seg button{height:32px;color:var(--muted);white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;gap:6px;padding:0 14px;font-size:12.5px;font-weight:500;transition:background .18s,color .18s,box-shadow .18s;display:inline-flex}.seg button:hover{color:var(--fg)}.seg button:disabled{opacity:.35;cursor:not-allowed}.seg button:disabled:hover{color:var(--muted)}.seg button[aria-selected=true],.seg button[aria-checked=true]{background:var(--elev);color:var(--fg);box-shadow:0 1px 2px #0000000f}.seg--full{display:flex}.seg--full button{flex:1;min-width:0;padding:0 8px}.seg--icons button{padding:0 12px}.site{min-height:100vh}.topbar{z-index:20;background:color-mix(in srgb, var(--bg) 86%, transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);align-items:center;gap:28px;height:64px;padding:0 24px;display:flex;position:sticky;top:0}.logo{letter-spacing:-.02em;align-items:center;gap:10px;font-size:16px;font-weight:600;display:inline-flex}.logo__mark{background:var(--fg);border-radius:8px;width:24px;height:24px;position:relative;overflow:hidden}.logo__mark:after{content:"";background:var(--bg);border-radius:999px;position:absolute;inset:6px 4px 6px 10px;transform:skew(-18deg)}.topnav{color:var(--muted);gap:20px;font-size:14px;display:flex}.topnav .is-active{color:var(--fg);font-weight:500}.topnav__soon{cursor:default;align-items:center;gap:6px;display:inline-flex}.topnav__soon em{background:var(--chip);border-radius:6px;padding:1px 6px;font-size:11px;font-style:normal}.searchbox{background:var(--chip);width:240px;height:36px;color:var(--muted);border-radius:999px;align-items:center;gap:8px;margin-left:auto;padding:0 10px 0 12px;transition:background .18s,box-shadow .18s;display:flex}.searchbox:focus-within{background:var(--bg);box-shadow:0 0 0 1px rgba(var(--ink-rgb), .16)}.searchbox input{min-width:0;color:var(--fg);font:inherit;background:0 0;border:0;outline:0;flex:1;font-size:14px}.searchbox kbd{font:11px var(--mono);color:var(--muted)}.topbar__tools{gap:4px;display:flex}.hero{text-align:center;justify-items:center;gap:18px;padding:96px 24px 56px;display:grid}.hero>*{animation:.7s cubic-bezier(.22,1,.36,1) backwards rise}.hero>:nth-child(2){animation-delay:60ms}.hero>:nth-child(3){animation-delay:.12s}.hero p b{color:var(--fg);font-weight:400}.hero__cta{height:42px;margin-top:6px;padding:0 20px}.hero>:nth-child(4){animation-delay:.18s}.hero__badge{border:1px solid var(--line);color:var(--fg-2);border-radius:999px;padding:6px 12px;font-size:12px}.hero h1{letter-spacing:-.025em;text-wrap:balance;margin:0;font-size:clamp(32px,3.4vw,42px);font-weight:500;line-height:1.12}.hero p{max-width:460px;color:rgba(var(--ink-rgb), .58);text-wrap:balance;margin:0;font-size:15px;line-height:1.65}@keyframes rise{0%{opacity:0;transform:translateY(14px)}}.filters{z-index:15;scrollbar-width:none;background:color-mix(in srgb, var(--bg) 86%, transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);gap:8px;padding:10px 24px 14px;animation:.7s cubic-bezier(.22,1,.36,1) .18s backwards rise;display:flex;position:sticky;top:64px;overflow-x:auto}.grid{padding:4px 24px 48px;position:relative}.card{background:var(--surface);cursor:pointer;animation:rise .7s cubic-bezier(.22, 1, .36, 1) calc(.24s + var(--i,0) * 70ms) backwards;border-radius:28px;position:absolute;overflow:hidden}.card iframe{opacity:0;background:0 0;border:0;border-radius:28px;width:100%;height:100%;transition:opacity .45s;position:absolute;inset:0}.card iframe[data-ready]{opacity:1}html.is-detail .card iframe:not([style]){opacity:0;transition-duration:.3s;transition-delay:.3s}.card__new{background:rgba(var(--elev-rgb), .94);color:var(--fg-2);pointer-events:none;border-radius:999px;padding:4px 10px;font-size:11.5px;font-weight:500;transition:opacity .16s;position:absolute;bottom:23px;left:14px}.card__veil{opacity:0;transition:opacity .2s, transform .26s var(--spring);pointer-events:none;padding:0 70px 12px 12px;display:flex;position:absolute;bottom:0;left:0;right:0;transform:translateY(4px)}.card__name{background:rgba(var(--elev-rgb), .94);max-width:100%;height:44px;color:var(--fg-2);letter-spacing:-.01em;white-space:nowrap;cursor:pointer;pointer-events:auto;border:0;border-radius:999px;align-items:center;gap:8px;padding:0 16px;font-size:13.5px;display:inline-flex;box-shadow:0 1px 2px #0000000a}.card__name span{color:var(--muted)}.card__open{background:rgba(var(--elev-rgb), .94);width:44px;height:44px;color:var(--muted);cursor:pointer;opacity:0;transition:opacity .18s, transform .24s var(--spring), background .2s, color .16s;border:0;border-radius:999px;place-items:center;display:grid;position:absolute;bottom:12px;right:12px;box-shadow:0 1px 2px #0000000a}.card__open:hover{background:var(--elev);color:var(--fg);transform:scale(.95)}.card__open:active{transform:scale(.9)}.card:hover .card__veil{opacity:1;transform:none}.card:has(:focus-visible) .card__veil{opacity:1;transform:none}.card:hover .card__open{opacity:1}.card:has(:focus-visible) .card__open{opacity:1}.card:hover .card__new{opacity:0}.card:has(:focus-visible) .card__new{opacity:0}.card__tag{background:rgba(var(--ink-rgb), .08);color:var(--fg-2);border-radius:999px;margin-left:-2px;padding:2px 7px;font-size:11px;font-style:normal;font-weight:500}@media (hover:none){.card__veil,.card__open{opacity:1;transform:none}.card__new{display:none}}.empty{text-align:center;color:var(--muted);padding:64px 0}.sitefoot{text-align:center;color:var(--muted);padding:24px;font-size:12px}@media (max-width:720px){.topbar{gap:12px;padding:0 16px}.topnav{display:none}.searchbox{flex:1;width:auto;min-width:0}.topbar__tools{gap:0;margin-right:-6px}.hero{padding:56px 20px 36px}.searchbox kbd{display:none}.filters{padding:10px 16px}.grid{padding:4px 16px 32px}}.dtl{z-index:100;position:fixed;inset:0}.dtl-scrim{opacity:0;background:#0009;transition:opacity .26s;position:absolute;inset:0}.dtl[data-on] .dtl-scrim{opacity:1}.dtl-block{background:var(--modal);border-radius:28px;transition:box-shadow .3s;position:fixed;overflow:hidden;container:dtl-block/inline-size}.dtl-morph{background:var(--stage);opacity:0;pointer-events:none;position:fixed}.dtl[data-on] .dtl-block{box-shadow:var(--modal-shadow)}.dtl-bar{opacity:0;align-items:center;gap:8px;height:40px;transition:opacity .14s;display:flex;position:absolute;top:10px;left:10px;right:10px}.dtl[data-on] .dtl-bar{opacity:1;transition:opacity .2s .16s}.dtl-tools{gap:2px;margin-left:auto;display:flex}.dtl-code{scrollbar-gutter:stable;animation:.2s fade-in;position:absolute;inset:60px 0 10px 10px;overflow:auto}@keyframes fade-in{0%{opacity:0}}.dtl-grid{left:var(--st-left);top:var(--st-top);width:calc(var(--st-w) + 1px);height:calc(var(--st-h) + 1px);--line:rgba(var(--ink-rgb), .1);background:linear-gradient(var(--stage), var(--stage)) 0 0 / calc(100% - 1px) calc(100% - 1px) no-repeat;opacity:0;pointer-events:none;border-radius:22px;transition:opacity .3s cubic-bezier(.23,1,.32,1);position:absolute}.dtl-grid:before,.dtl-grid:after{content:"";clip-path:inset(1px round 21px);position:absolute;inset:0}.dtl-grid:before{background:linear-gradient(to right, var(--line) 1px, transparent 1px) 0 0 / 40px 100%;-webkit-mask:repeating-linear-gradient(#000 0 4px,#0000 4px 8px);mask:repeating-linear-gradient(#000 0 4px,#0000 4px 8px)}.dtl-grid:after{background:linear-gradient(to bottom, var(--line) 1px, transparent 1px) 0 0 / 100% 40px;-webkit-mask:repeating-linear-gradient(90deg,#000 0 4px,#0000 4px 8px);mask:repeating-linear-gradient(90deg,#000 0 4px,#0000 4px 8px)}.dtl-grid__edge{width:var(--st-w);height:var(--st-h);position:absolute;top:0;left:0;overflow:visible}.dtl-grid__edge rect{fill:none;stroke:var(--line);stroke-dasharray:4 4}.dtl-block[data-narrow] .dtl-grid{opacity:1}.dtl-size{left:calc(var(--st-left) + (var(--st-w) + var(--cw)) / 2 + 16px);top:calc(var(--st-top) + (var(--st-h) + var(--ch,var(--st-h))) / 2 - 26px);font:500 11.5px/1 var(--mono);white-space:nowrap;color:var(--muted);opacity:0;pointer-events:none;transition:opacity .3s cubic-bezier(.23,1,.32,1);position:absolute}.dtl[data-on] .dtl-block[data-narrow] .dtl-size{opacity:1}.dtl-block[data-size-in] .dtl-size{visibility:hidden}.dtl-size-float{z-index:103;background:rgba(var(--elev-rgb), .92);font:500 11.5px/1 var(--mono);white-space:nowrap;color:var(--fg-2);opacity:0;pointer-events:none;border-radius:999px;padding:6px 9px;transition:opacity .18s;position:fixed;translate:-100%;box-shadow:0 1px 2px #00000014,0 4px 12px #00000014}.dtl-size-float[data-show]{opacity:1;transition-duration:.1s}.dtl-grip{left:calc(var(--st-left) + (var(--st-w) + var(--cw)) / 2 + 4px);top:calc(var(--st-top) + var(--st-h) / 2 - 22px);background:rgba(var(--ink-rgb), .16);cursor:ew-resize;touch-action:none;opacity:0;border-radius:999px;width:6px;height:44px;transition:opacity .2s,background .15s;position:absolute}.dtl-grip:before{content:"";position:absolute;inset:-10px -8px}.dtl[data-on] .dtl-grip{opacity:1;transition:opacity .2s .3s,background .15s}.dtl-grip:hover,.dtl-grip:focus-visible,.dtl-block[data-dragging] .dtl-grip{background:rgba(var(--ink-rgb), .42);outline:none}.dtl-block[data-dragging]{cursor:ew-resize}.dtl-block[data-tab=code] :is(.dtl-grid,.dtl-size,.dtl-grip){display:none}.dtl-demo[aria-pressed=true]{color:var(--fg)}.dtl-demo[aria-pressed=true]:before{opacity:1;scale:1}.dtl-side{background:var(--modal);box-shadow:var(--modal-shadow);opacity:0;border-radius:28px;flex-direction:column;padding:18px;display:flex;position:fixed}.dtl[data-mobile] .dtl-side{padding:14px 16px}.dtl-head{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.dtl-id{min-width:0}.dtl-id h2{letter-spacing:-.02em;white-space:nowrap;text-overflow:ellipsis;margin:4px 0 0;font-size:17px;font-weight:500;line-height:1.25;overflow:hidden}.dtl-kind{color:var(--muted);margin:4px 0 0;font-size:12.5px}.dtl-acts{align-items:center;margin:-6px -8px 0 0;display:flex}.dtl-acts .iconbtn{width:32px;height:32px}.dtl-x{margin-left:4px}.dtl-say{text-wrap:pretty;color:var(--fg-2);margin:10px 0 0;font-size:13px;line-height:1.6}.dtl-ctls{scrollbar-gutter:stable;flex:1;min-height:0;margin:16px -14px 0 -4px;padding:2px 4px;overflow-y:auto}.dtl-foot{gap:8px;margin-top:12px;display:flex}.dtl-foot .btn{flex:1}.params{flex-direction:column;gap:8px;display:flex}.ctl{flex-direction:column;gap:8px;margin-bottom:6px;display:flex}.ctl-label{color:var(--fg-2);font-size:12.5px}.ctl-row{background:rgba(var(--ink-rgb), var(--wash));border-radius:10px;justify-content:space-between;align-items:center;gap:12px;min-height:44px;padding:0 7px 0 13px;display:flex}.ctl-row .ctl-label{color:var(--fg-2);font-size:13.5px;font-weight:500}.bar{background:rgba(var(--ink-rgb), var(--wash));cursor:ew-resize;touch-action:pan-y;border-radius:10px;justify-content:space-between;align-items:center;gap:10px;height:44px;padding:0 13px;transition:background .15s;display:flex;position:relative;overflow:hidden}.bar:before{content:"";width:var(--fill,0%);background:rgba(var(--ink-rgb), .12);pointer-events:none;position:absolute;inset:0 auto 0 0}.bar:hover{background:rgba(var(--ink-rgb), calc(var(--wash) + .02))}.bar:hover:before{background:rgba(var(--ink-rgb), .15)}.bar:focus-within{box-shadow:0 0 0 2px var(--bg), 0 0 0 4px rgba(var(--ink-rgb), .3)}.bar__label,.bar__val{pointer-events:none;white-space:nowrap;position:relative}.bar__label{color:var(--fg-2);text-overflow:ellipsis;font-size:13.5px;font-weight:500;overflow:hidden}.bar__val{font-variant-numeric:tabular-nums;color:var(--fg);font-size:12.5px;font-weight:500}.bar input{opacity:0;cursor:ew-resize;width:100%;height:100%;margin:0;position:absolute;inset:0}.switch{background:rgba(var(--ink-rgb), .16);cursor:pointer;border:0;border-radius:999px;flex:none;width:50px;height:30px;transition:background .2s;position:relative}.switch[aria-checked=true]{background:var(--fg)}.switch__knob{background:var(--elev);width:24px;height:24px;transition:translate .32s var(--ease), background .2s;border-radius:50%;position:absolute;top:3px;left:3px;box-shadow:0 1px 2px #0003}.switch[aria-checked=true] .switch__knob{background:var(--bg);translate:20px}.color{align-items:center;gap:10px;display:inline-flex}.color code{font:12px var(--mono);color:var(--fg-2)}.color__swatch{border-radius:8px;width:30px;height:30px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #0000001a}.color__swatch input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.params__reset{align-self:flex-start;margin-top:2px}.code{flex-direction:column;gap:20px;padding:4px 6px 12px;display:flex}.code h4{align-items:baseline;gap:8px;margin:0 0 8px;font-size:13px;font-weight:500;display:flex}.code h4 small{color:var(--muted);font-weight:400}.code__step+.code__step{margin-top:12px}.code__todo{background:var(--well);border-radius:14px;align-items:center;gap:16px;padding:14px 14px 14px 18px;display:flex}.code__todo p{color:var(--fg-2);flex:1;gap:4px;margin:0;font-size:12.5px;line-height:1.5;display:grid}.code__todo strong{color:var(--fg);font-size:14px;font-weight:500}.code__src{font:12.5px var(--mono);color:var(--fg-2);align-items:center;gap:6px;text-decoration:none;display:inline-flex}.code__src:hover{color:var(--fg)}.code__how{color:var(--muted);margin:0 0 6px;font-size:12px;line-height:1.5}.snippet,.codefile{background:var(--well);border-radius:14px;position:relative}.snippet pre{font:12.5px/1.6 var(--mono);margin:0;padding:14px 48px 14px 16px;overflow-x:auto}.copybtn{position:absolute;top:8px;right:8px}.codefile__tabs{border-bottom:1px solid var(--line);gap:2px;padding:6px 44px 0 8px;display:flex}.codefile__tabs button[role=tab]{height:32px;color:var(--muted);font:12px var(--mono);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;padding:0 12px}.codefile__tabs button[aria-selected=true]{border-bottom-color:var(--fg);color:var(--fg)}.codefile__tabs .copybtn{top:6px}.codefile__body{overflow-x:auto}.codefile__body pre{font:12.5px/1.65 var(--mono);margin:0;padding:14px 16px;background:0 0!important}html[data-theme=dark] .codefile__body pre{filter:invert(.88)hue-rotate(180deg)}.codefile__loading{color:var(--muted);padding:24px 16px;font-size:13px}.propstable table{border-collapse:collapse;background:var(--well);border-radius:14px;width:100%;font-size:12.5px;overflow:hidden}.propstable th{border-bottom:1px solid var(--line);text-align:left;color:var(--muted);padding:10px 12px;font-weight:500}.propstable td{border-bottom:1px solid var(--line);color:var(--fg-2);vertical-align:top;padding:11px 12px;line-height:1.5}.propstable tr:last-child td{border-bottom:0}.propstable td:first-child code{color:var(--fg)}.propstable code{font:12px var(--mono)}.toast{z-index:120;background:var(--chip-on);color:var(--chip-on-fg);pointer-events:none;border-radius:999px;padding:11px 18px;font-size:13px;position:fixed;bottom:40px;left:50%;box-shadow:0 10px 30px #0000002e}@container dtl-block (max-width:780px){.dtl-bar .seg button span{display:none}.dtl-bar .seg button{padding:0 11px}.dtl-bar{gap:6px}}@media (prefers-reduced-motion:reduce){.card,.hero>*,.filters{animation:none}}