.scroll-cue{--scroll-cue-bg:Canvas;--scroll-cue-shade:color-mix(in srgb, CanvasText 28%, transparent);--scroll-cue-size:1.25rem;overscroll-behavior-x:contain;background-color:var(--scroll-cue-bg);background-image:linear-gradient(to right, var(--scroll-cue-bg) 40%, transparent), linear-gradient(to left, var(--scroll-cue-bg) 40%, transparent), radial-gradient(farthest-side at 0 50%, var(--scroll-cue-shade), transparent), radial-gradient(farthest-side at 100% 50%, var(--scroll-cue-shade), transparent);background-position:0,100%,0,100%;background-size:calc(var(--scroll-cue-size) * 2) 100%, calc(var(--scroll-cue-size) * 2) 100%, var(--scroll-cue-size) 100%, var(--scroll-cue-size) 100%;background-repeat:no-repeat;background-attachment:local,local,scroll,scroll;overflow-x:auto}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:var(--lightningcss-light,#f5f6f8)var(--lightningcss-dark,#0d1117);--surface:var(--lightningcss-light,#fff)var(--lightningcss-dark,#151b23);--surface-2:var(--lightningcss-light,#f1f3f6)var(--lightningcss-dark,#1b222c);--line:var(--lightningcss-light,#d8dce3)var(--lightningcss-dark,#2c3440);--text:var(--lightningcss-light,#141a24)var(--lightningcss-dark,#e6e9ee);--muted:var(--lightningcss-light,#566170)var(--lightningcss-dark,#9ba5b3);--p1:var(--lightningcss-light,#9a5b06)var(--lightningcss-dark,#e6a640);--p2:var(--lightningcss-light,#0b7354)var(--lightningcss-dark,#3cc293);--p3:var(--lightningcss-light,#1d5fc4)var(--lightningcss-dark,#62acff);--on-accent:var(--lightningcss-light,#fff)var(--lightningcss-dark,#0d1117);--bad:var(--lightningcss-light,#b42318)var(--lightningcss-dark,#ff8a80);--v-str:var(--lightningcss-light,#a3361a)var(--lightningcss-dark,#f3a785);--v-num:var(--lightningcss-light,#0b7354)var(--lightningcss-dark,#74d8ad);--v-bool:var(--lightningcss-light,#2550c4)var(--lightningcss-dark,#93b9ff);--v-key:var(--lightningcss-light,#7a2a8c)var(--lightningcss-dark,#d6adff);--mono:ui-monospace, "SFMono-Regular", "Cascadia Code", Menlo, Consolas, monospace;--radius:12px}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{background:var(--bg)}body{max-width:1320px;color:var(--text);background:var(--bg);margin:0 auto;padding:0 clamp(14px,3vw,32px);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}a{color:var(--p3)}code,.mono{font-family:var(--mono)}code{font-size:.92em}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--p3);outline-offset:2px}.skip{position:absolute;left:-9999px}.skip:focus{background:var(--surface);z-index:10;padding:6px 10px;top:8px;left:8px}.top{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:10px 24px;padding:22px 0 14px;display:flex}.wordmark{letter-spacing:-.02em;align-items:center;gap:10px;margin:0;font-size:clamp(1.5rem,4vw,1.9rem);display:flex}.mark{gap:4px;display:inline-flex}.mark i{background:var(--p1);border-radius:50%;width:10px;height:10px}.mark i:nth-child(2){background:var(--p2)}.mark i:nth-child(3){background:var(--p3)}.lead{max-width:64ch;color:var(--muted);margin:6px 0 0}.links{flex-wrap:wrap;align-items:center;gap:4px 16px;font-size:.92rem;display:flex}.links a{text-decoration:none}.links a:hover{text-decoration:underline}.theme{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:999px;padding:4px 10px;font-size:.85rem}.controls{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);gap:10px;padding:12px 14px;display:grid}.ctl-row{flex-wrap:wrap;align-items:center;gap:8px 14px;display:flex}.ctl-label{min-width:4.6rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;font-weight:600}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{border:1px solid var(--line);background:var(--surface-2);cursor:pointer;border-radius:999px;padding:6px 13px;font-size:.9rem}.chip:hover{border-color:var(--muted)}.chip[aria-pressed=true]{border-color:var(--text);background:var(--text);color:var(--bg)}.segs{flex-wrap:wrap;gap:8px 18px;display:flex}.seg-group{align-items:center;gap:8px;display:flex}.seg-group.unused{opacity:.55}.seg-label{line-height:1.15;display:grid}.seg-label code{font-size:.85rem;font-weight:600}.seg-note{color:var(--muted);font-size:.66rem}.seg{border:1px solid var(--line);border-radius:8px;display:inline-flex;overflow:hidden}.seg button{border:0;border-left:1px solid var(--line);cursor:pointer;background:0 0;padding:5px 11px;font-size:.85rem}.seg button:first-child{border-left:0}.seg button[aria-checked=true]{background:var(--p2);color:var(--on-accent);font-weight:600}.panels{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:14px;display:grid}.panel{border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:var(--radius);background:var(--surface);flex-direction:column;min-width:0;display:flex}.p-data{--accent:var(--p1)}.p-out{--accent:var(--p2)}.p-react{--accent:var(--p3)}.ph{gap:10px;padding:12px 14px 8px;display:flex}.num{background:var(--accent);width:26px;height:26px;color:var(--on-accent);border-radius:50%;flex:none;place-items:center;font-size:.85rem;font-weight:700;display:grid}.ph h2{margin:0;font-size:1.02rem;line-height:1.6}.ph p{color:var(--muted);margin:0;font-size:.82rem}.editor{border:1px solid var(--line);background:var(--surface-2);width:calc(100% - 28px);height:27rem;color:var(--text);white-space:pre;resize:vertical;tab-size:2;border-radius:8px;margin:0 14px;padding:10px 12px;font-size:.8rem;line-height:1.5;display:block;overflow:auto}.editor[aria-invalid=true]{border-color:var(--bad)}.status{color:var(--muted);margin:8px 14px 12px;font-size:.78rem}.status.bad{color:var(--bad);font-weight:600}.tabs{align-items:center;gap:4px;padding:0 14px 8px;display:flex}.tabs button{cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;padding:3px 10px;font-size:.82rem}.tabs button[aria-selected=true]{border-color:var(--line);background:var(--surface-2);font-weight:600}.stats{color:var(--muted);font-family:var(--mono);white-space:nowrap;margin-left:auto;font-size:.72rem}.panel-body{border:1px solid var(--line);background:var(--surface-2);scrollbar-gutter:stable;border-radius:8px;flex:auto;height:27rem;margin:0 14px;padding:10px;overflow:auto}.p-out .panel-body{height:24.2rem}.stale .panel-body{opacity:.6}.wire-json{--scroll-cue-bg:var(--surface-2);margin:0;font-size:.74rem;line-height:1.45}.wire-button{background:var(--p2);color:var(--on-accent);cursor:pointer;border:0;border-radius:8px;justify-content:center;align-items:center;gap:8px;margin:10px 14px 14px;padding:9px 14px;font-weight:600;display:flex}.wire-button:hover{filter:brightness(1.08)}.wire-button:disabled{opacity:.5;cursor:default}.source{color:var(--muted);margin:-2px 14px 8px;font-size:.78rem}.source.wire{color:var(--p2);font-weight:600}.react-body{margin-bottom:14px;font-size:.88rem}.flash{border-radius:6px;animation:.9s ease-out flash}@keyframes flash{0%{box-shadow:0 0 0 3px var(--p2)}to{box-shadow:0 0 0 3px #0000}}@media (prefers-reduced-motion:reduce){.flash{animation:none}}.size-note{color:var(--muted);margin:8px 2px 0;font-size:.78rem}.tree{font-family:var(--mono);font-size:.76rem;line-height:1.5}.tn>summary,.tn.leaf{border-radius:4px;align-items:baseline;gap:6px;min-width:0;padding:1px 4px;display:flex}.tn>summary{cursor:pointer;list-style:none}.tn>summary::-webkit-details-marker{display:none}.tn>summary:before{width:10px;color:var(--muted);content:"▸";flex:none}.tn[open]>summary:before{content:"▾"}.tn.leaf{padding-left:20px}.tn>summary:hover{background:color-mix(in srgb, var(--p2) 12%, transparent)}.tn-type{color:var(--p2);flex:none;font-weight:700}.tn-props{min-width:0;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;flex:auto;overflow:hidden}.tn-count{border:1px solid var(--line);color:var(--muted);border-radius:999px;flex:none;padding:0 6px;font-size:.68rem}.tn-kids{border-left:1px dashed var(--line);margin-left:8px;padding-left:8px}.v-str{color:var(--v-str);overflow-wrap:anywhere}.v-num{color:var(--v-num)}.v-bool{color:var(--v-bool)}.v-null,.v-empty{color:var(--muted);font-style:italic}.v-str,.v-num,.v-bool,.v-null{font-family:var(--mono);font-size:.84em}.v-array{gap:8px;display:grid}.v-cell{min-width:0;container-type:inline-size}.v-object{gap:4px;display:grid}.v-kv{grid-template-columns:minmax(4.5rem,max-content) minmax(0,1fr);align-items:baseline;gap:10px;display:grid}.v-key{color:var(--v-key);font-family:var(--mono);overflow-wrap:anywhere;font-size:.8em;font-weight:700}.v-val{min-width:0}.v-val>span>.v-object,.v-val>span>.v-array{border-left:2px solid var(--line);padding:4px 0 4px 10px}.v-cell>span>.v-object{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:8px 10px}.user-card{border:1px solid var(--line);background:var(--surface);border-radius:10px;grid-template-columns:32px minmax(0,1fr);grid-template-areas:"avatar name""email email""role role";align-items:center;gap:6px 10px;padding:10px;display:grid}.avatar{background:linear-gradient(135deg, var(--p3), var(--p2));width:32px;height:32px;color:var(--on-accent);border-radius:50%;grid-area:avatar;place-items:center;font-size:.76rem;font-weight:700;display:grid}.user-card[data-active=false] .avatar{background:var(--muted)}.uc-text{display:contents}.uc-name{overflow-wrap:anywhere;grid-area:name;min-width:0;line-height:1.25}.uc-email{grid-area:email;min-width:0}.user-card .role{grid-area:role}.uc-email,.ur-name,.ur-email{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.uc-email,.ur-email{color:var(--muted);font-size:.8rem}@container (width<=150px){.user-card{grid-template-columns:minmax(0,1fr);grid-template-areas:"avatar""name""email""role"}.uc-email{font-size:.74rem}}.role{background:color-mix(in srgb, var(--p3) 16%, transparent);color:var(--p3);border-radius:999px;justify-self:start;padding:0 8px;font-size:.72rem;font-weight:600}.user-row{border:1px solid var(--line);background:var(--surface);border-radius:8px;grid-template-columns:10px minmax(0,1.1fr) minmax(0,1.4fr) auto;align-items:center;gap:2px 8px;padding:6px 8px;display:grid}.dot{background:var(--p2);border-radius:50%;width:8px;height:8px}.user-row[data-active=false] .dot{background:var(--muted)}.ur-name{font-weight:600}@container (width<=300px){.user-row{grid-template-columns:10px minmax(0,1fr) auto}.ur-email{grid-area:2/2/auto/-1}}.product-card{border:1px solid var(--line);background:var(--surface);border-radius:10px;gap:10px;padding:14px;display:grid}.pc-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 10px;display:flex}.pc-name{font-size:1.05rem}.pc-price{color:var(--p2);font-size:1.2rem;font-weight:700}.stock{border-radius:999px;justify-self:start;padding:0 9px;font-size:.75rem;font-weight:600}.stock.in{background:color-mix(in srgb, var(--p2) 16%, transparent);color:var(--p2)}.stock.out{background:color-mix(in srgb, var(--bad) 16%, transparent);color:var(--bad)}.pc-part{gap:4px;display:grid}.pc-label{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:.68rem;font-weight:600}.v-unknown{border:1px dashed var(--bad);color:var(--bad);border-radius:8px;padding:10px 12px;font-size:.84rem}.section{margin-top:44px}.section>h2{letter-spacing:-.01em;margin:0 0 14px;font-size:1.35rem}.steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.step{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);gap:10px;padding:14px;display:flex}.step:first-child{--accent:var(--p1)}.step:nth-child(2),.step:nth-child(3){--accent:var(--p2)}.step:nth-child(4){--accent:var(--p3)}.step h3{margin:1px 0 4px;font-size:.98rem}.step p{color:var(--muted);margin:0;font-size:.88rem}.pkg{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:14px;display:flex}.pkg-name{border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:999px;align-items:center;gap:8px;max-width:100%;padding:6px 6px 6px 12px;font-weight:600;text-decoration:none;display:inline-flex}.pkg-name code{overflow-wrap:anywhere}.ver{background:var(--p2);color:var(--on-accent);font-family:var(--mono);border-radius:999px;padding:1px 9px;font-size:.8rem}.pill{border:1px solid var(--line);color:var(--muted);overflow-wrap:anywhere;border-radius:999px;padding:4px 11px;font-size:.82rem}.pill.link{color:var(--p3);text-decoration:none}.codeblock{border:1px solid var(--line);background:var(--surface);border-radius:10px;margin:0 0 12px;overflow:hidden}.code-head{border-bottom:1px solid var(--line);color:var(--muted);font-family:var(--mono);justify-content:space-between;align-items:center;gap:10px;padding:6px 8px 6px 14px;font-size:.75rem;display:flex}.codeblock pre{--scroll-cue-bg:var(--surface);margin:0;padding:12px 14px;font-size:.8rem;line-height:1.55}.copy{border:1px solid var(--line);background:var(--surface-2);cursor:pointer;border-radius:6px;padding:3px 10px;font-family:system-ui,sans-serif;font-size:.78rem}.hint{color:var(--muted);margin:16px 0 8px;font-size:.9rem}.sample-result{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.sample-result .user{border:1px solid var(--line);background:var(--surface);border-radius:8px;margin:0;padding:4px 12px}.foot{border-top:1px solid var(--line);color:var(--muted);margin-top:48px;padding:16px 0 28px;font-size:.85rem}.foot p{overflow-wrap:anywhere;margin:0}@media (max-width:1080px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:960px){.panels{grid-template-columns:minmax(0,1fr)}.editor{height:17rem}.panel-body,.p-out .panel-body{height:auto;max-height:24rem}.react-body{min-height:8rem;max-height:none}}@media (max-width:600px){.steps{grid-template-columns:minmax(0,1fr)}.ctl-label{min-width:100%}}