.topics[data-v-ae23eedc]{gap:8px;display:grid}.topics label[data-v-ae23eedc]{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);align-items:center;gap:10px;display:grid}.topics span[data-v-ae23eedc]{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;overflow:hidden}.weight[data-v-05e660f4]{grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;display:grid}.weight>div[data-v-05e660f4]{background:var(--line-2);border-radius:10px;gap:1px;padding:10px 12px;display:grid}.weight b[data-v-05e660f4]{letter-spacing:-.01em;font-size:18px}.weight span[data-v-05e660f4]{color:var(--ink-2);font-size:12.5px}.weight small[data-v-05e660f4]{color:var(--muted);font-size:11.5px}.loading[data-v-ea02cbf6]{height:calc(100vh - 60px);color:var(--muted);place-items:center;display:grid}.fatal[data-v-ea02cbf6]{z-index:60;max-width:520px;box-shadow:var(--shadow);position:fixed;top:90px;left:50%;transform:translate(-50%)}:root{--ink:#18181b;--ink-2:#3f3f46;--muted:#71717a;--line:#e4e4e7;--line-2:#f0f0f2;--bg:#fafaf9;--panel:#fff;--brand:#134e4a;--brand-2:#0f766e;--brand-soft:#e6f4f1;--warn:#b45309;--warn-soft:#fffbeb;--bad:#b91c1c;--bad-soft:#fef2f2;--good:#15803d;--good-soft:#f0fdf4;--radius:12px;--shadow:0 1px 2px #18181b0d, 0 8px 24px #18181b0f;--font:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{height:100%}body{font:14px/1.5 var(--font);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0}button,input,select,textarea{font:inherit;color:inherit}code{font-family:var(--mono);background:var(--line-2);border-radius:5px;padding:1px 5px;font-size:.92em}h1,h2,h3{letter-spacing:-.01em;margin:0;line-height:1.25}[hidden]{display:none!important}.muted{color:var(--muted)}.small{font-size:12.5px}.skip{position:absolute;left:-999px}.skip:focus{z-index:99;background:#fff;border-radius:8px;padding:8px 12px;top:12px;left:12px}:focus-visible{outline:2px solid var(--brand-2);outline-offset:2px}.top{z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);background:#ffffffe6;align-items:center;gap:20px;height:60px;padding:0 20px;display:flex;position:sticky;top:0}.brand{color:inherit;white-space:nowrap;align-items:center;gap:10px;font-weight:700;text-decoration:none;display:flex}.brand svg{width:28px;height:28px}.brand svg rect{fill:var(--brand)}.brand svg path{fill:none;stroke:#fff;stroke-width:2.4px;stroke-linejoin:round}.brand small{color:var(--muted);margin-left:2px;font-weight:500}.steps{gap:4px;margin:0 auto;display:flex}.step{all:unset;cursor:pointer;color:var(--muted);border-radius:99px;align-items:center;gap:8px;padding:7px 12px 7px 8px;font-weight:600;transition:background .15s,color .15s;display:flex}.step b{background:var(--line-2);border-radius:50%;place-items:center;width:22px;height:22px;font-size:12px;display:grid}.step:hover{background:var(--line-2);color:var(--ink)}.step[aria-current=step]{background:var(--ink);color:#fff}.step[aria-current=step] b{background:#ffffff2e}.step.done b{background:var(--brand-soft);color:var(--brand-2)}.step:focus-visible{outline:2px solid var(--brand-2)}.conn{min-width:0;color:var(--muted);white-space:nowrap;align-items:center;gap:8px;font-size:12.5px;display:flex}.conn .dot{background:var(--line);border-radius:50%;flex:none;width:8px;height:8px}.conn.ok .dot{background:#22c55e;box-shadow:0 0 0 3px #dcfce7}.conn.sample .dot{background:#f59e0b;box-shadow:0 0 0 3px #fef3c7}.conn.bad .dot{background:#ef4444;box-shadow:0 0 0 3px #fee2e2}.app{grid-template-columns:minmax(340px,440px) 1fr;height:calc(100vh - 60px);display:grid}.panel{background:var(--panel);border-right:1px solid var(--line);overflow-y:auto}.pane{gap:18px;padding:24px 22px 40px;animation:.2s ease-out fade;display:grid}@keyframes fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.pane-head h1{margin-bottom:6px;font-size:21px}.pane-head p{color:var(--ink-2);margin:0}.pane-foot{padding-top:6px}.group{border-top:1px solid var(--line);padding-top:16px}.group-head{justify-content:space-between;align-items:baseline;margin-bottom:12px;display:flex}.group h2{text-transform:uppercase;letter-spacing:.07em;color:var(--ink-2);font-size:13px}details.group>summary{cursor:pointer;justify-content:space-between;align-items:center;margin-bottom:4px;list-style:none;display:flex}details.group>summary::-webkit-details-marker{display:none}details.group>summary:after{content:"";border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);width:8px;height:8px;margin-right:4px;transition:transform .2s;transform:rotate(45deg)}details.group[open]>summary:after{transform:rotate(-135deg)}details.group[open]>summary{margin-bottom:14px}.hint{color:var(--muted);margin:6px 0 0;font-size:12.5px}.types{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.type{all:unset;box-sizing:border-box;cursor:pointer;border:1px solid var(--line);border-radius:10px;align-items:flex-start;gap:10px;padding:10px 11px;transition:border-color .15s,background .15s,box-shadow .15s;display:flex}.type:hover{background:#fcfcfc;border-color:#d4d4d8}.type[aria-selected=true]{border-color:var(--brand-2);background:var(--brand-soft);box-shadow:0 0 0 1px var(--brand-2) inset}.type svg{fill:none;width:20px;height:20px;stroke:var(--brand-2);stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;flex:none;margin-top:1px}.type b{font-size:13px;line-height:1.3;display:block}.type span{color:var(--muted);margin-top:2px;font-size:11.5px;line-height:1.35;display:block}.type:focus-visible{outline:2px solid var(--brand-2);outline-offset:1px}.presets{flex-wrap:wrap;gap:8px;margin-bottom:14px;display:flex}.preset{all:unset;cursor:pointer;border:1px solid var(--line);border-radius:99px;align-items:center;gap:7px;padding:5px 10px 5px 5px;font-size:12.5px;font-weight:500;display:flex}.preset:hover{border-color:#d4d4d8}.preset i{border-radius:50%;width:20px;height:20px;box-shadow:inset 0 0 0 1px #00000014}.fields{gap:12px;display:grid}.f{grid-template-columns:1fr auto;align-items:center;gap:10px;display:grid}.f>label,.f>.label{color:var(--ink-2);font-weight:500}.f.stack{grid-template-columns:1fr;gap:6px}.f input[type=text],.f input[type=url],.f input[type=number],.f select,.f textarea,.connect input{border:1px solid var(--line);background:#fff;border-radius:8px;width:100%;padding:8px 10px;transition:border-color .15s,box-shadow .15s}.f input[type=number]{width:84px}.f select{min-width:170px;padding-right:28px}.f textarea{resize:vertical;min-height:70px}.f input:focus,.f select:focus,.f textarea:focus,.connect input:focus{border-color:var(--brand-2);box-shadow:0 0 0 3px var(--brand-soft);outline:none}.f .warn{color:var(--warn);grid-column:1/-1;margin-top:-4px;font-size:12px}.color{align-items:center;gap:8px;display:flex}.color input[type=color]{border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:8px;width:34px;height:30px;padding:0}.color input[type=color]::-webkit-color-swatch-wrapper{padding:3px}.color input[type=color]::-webkit-color-swatch{border:0;border-radius:5px}.color input[type=text]{font-family:var(--mono);font-size:12.5px;width:92px!important}.range{align-items:center;gap:10px;display:flex}.range input{width:140px;accent-color:var(--brand-2)}.range output{text-align:right;font-variant-numeric:tabular-nums;width:36px;color:var(--muted)}.switch{flex:none;width:38px;height:22px;position:relative}.switch input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.switch span{pointer-events:none;background:#d4d4d8;border-radius:99px;transition:background .15s;position:absolute;inset:0}.switch span:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .15s;position:absolute;top:3px;left:3px;box-shadow:0 1px 2px #0003}.switch input:checked+span{background:var(--brand-2)}.switch input:checked+span:after{transform:translate(16px)}.switch input:focus-visible+span{outline:2px solid var(--brand-2);outline-offset:2px}.disabled-note{background:var(--warn-soft);color:var(--warn);border-radius:8px;padding:10px 12px;font-size:12.5px}.review-pick{gap:6px;max-height:260px;padding:2px;display:grid;overflow:auto}.review-pick label{border:1px solid var(--line);cursor:pointer;border-radius:8px;grid-template-columns:auto 1fr;gap:8px;padding:8px 10px;font-size:12.5px;display:grid}.review-pick label:has(input:checked){border-color:var(--brand-2);background:var(--brand-soft)}.review-pick small{color:var(--muted);display:block}.review-pick .txt{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.code{width:100%;font:12px/1.55 var(--mono);border:1px solid var(--line);resize:vertical;tab-size:2;white-space:pre;background:#fbfbfa;border-radius:10px;padding:12px;overflow:auto}.code:focus{border-color:var(--brand-2);box-shadow:0 0 0 3px var(--brand-soft);outline:none}.row{align-items:center;gap:12px;margin-top:8px;display:flex}.field-ref{margin-top:14px}.field-ref h3{font-size:13px}.chips{flex-wrap:wrap;gap:5px;max-height:180px;margin-top:8px;display:flex;overflow:auto}.chip{all:unset;cursor:pointer;font:11.5px/1 var(--mono);background:var(--line-2);color:var(--ink-2);border-radius:6px;padding:5px 7px}.chip:hover{background:var(--brand-soft);color:var(--brand)}.chip.list{color:#3730a3;background:#eef2ff}.btn{cursor:pointer;white-space:nowrap;border:1px solid #0000;border-radius:9px;justify-content:center;align-items:center;gap:8px;height:38px;padding:0 16px;font-weight:600;text-decoration:none;transition:background .15s,transform 50ms,box-shadow .15s;display:inline-flex}.btn:active{transform:translateY(1px)}.btn.primary{background:var(--ink);color:#fff}.btn.primary:hover{background:#27272a}.btn.ghost{border-color:var(--line);color:var(--ink);background:#fff}.btn.ghost:hover{background:#fafafa;border-color:#d4d4d8}.btn.small{height:30px;padding:0 10px;font-size:12.5px}.btn.ok{background:var(--good)}.link{all:unset;cursor:pointer;color:var(--brand-2);text-underline-offset:3px;font-weight:600;text-decoration:underline}.sep{color:var(--muted);margin:0 4px}.howto{counter-reset:s;gap:18px;margin:0;padding:0;list-style:none;display:grid}.howto li{counter-increment:s;padding-left:40px;position:relative}.howto li:before{content:counter(s);background:var(--brand-soft);width:26px;height:26px;color:var(--brand);border-radius:50%;place-items:center;font-size:13px;font-weight:700;display:grid;position:absolute;top:-2px;left:0}.howto h3{margin-bottom:4px;font-size:15px}.howto p{color:var(--ink-2);margin:0 0 6px}.deploy{border-radius:6px;margin:6px 0;transition:transform .1s,box-shadow .15s;display:inline-block}.deploy:hover{box-shadow:var(--shadow);transform:translateY(-1px)}.deploy img{display:block}.callout{background:var(--line-2);border-radius:10px;padding:12px 14px;font-size:13px}.callout.warn{background:var(--warn-soft);color:#78350f;border:1px solid #fde68a}.callout.bad{background:var(--bad-soft);color:#7f1d1d;border:1px solid #fecaca}.callout.good{background:var(--good-soft);color:#14532d;border:1px solid #bbf7d0}.callout h3{margin-bottom:4px;font-size:14px}.callout p{margin:4px 0 0}.callout ol{margin:6px 0 0;padding-left:18px}.connect label{margin-bottom:6px;font-weight:600;display:block}.inline{gap:8px;display:flex}.inline input{flex:1;min-width:0}.picker{gap:8px;display:grid}.prop{all:unset;box-sizing:border-box;cursor:pointer;border:1px solid var(--line);border-radius:12px;grid-template-columns:64px 1fr auto;align-items:center;gap:12px;padding:8px;transition:border-color .15s,background .15s;display:grid}.prop:hover{border-color:#d4d4d8}.prop[aria-checked=true]{border-color:var(--brand-2);background:var(--brand-soft);box-shadow:0 0 0 1px var(--brand-2) inset}.prop img,.prop .ph{object-fit:cover;background:var(--line-2);border-radius:8px;width:64px;height:48px}.prop b{display:block}.prop span{color:var(--muted);font-size:12.5px}.prop .price{color:var(--ink-2);font-size:12.5px;font-weight:600}.snippet-bar{flex-wrap:wrap;gap:8px;display:flex}.snippet{color:#e4e4e7;max-height:340px;font:11.5px/1.6 var(--mono);white-space:pre-wrap;word-break:break-all;background:#18181b;border-radius:12px;margin:12px 0 6px;padding:14px;overflow:auto}.snippet .t{color:#7dd3fc}.snippet .a{color:#c4b5fd}.snippet .s{color:#86efac}.snippet .c{color:#71717a}.snippet .p{color:#fcd34d}.height-tip{color:var(--ink-2);border:1px dashed #cbd5e1;border-radius:10px;align-items:center;gap:10px;margin-top:12px;padding:10px 12px;font-size:12.5px;display:flex}.height-tip b{color:var(--ink)}.height-tip svg{width:18px;height:18px;stroke:var(--brand-2);fill:none;stroke-width:1.8px;stroke-linecap:round;flex:none}.guides h2{margin:6px 0 10px;font-size:15px}.guide-tabs{flex-wrap:wrap;gap:4px;margin-bottom:10px;display:flex}.guide-tabs button{all:unset;cursor:pointer;color:var(--muted);border-radius:8px;padding:6px 11px;font-size:12.5px;font-weight:600}.guide-tabs button[aria-selected=true]{background:var(--ink);color:#fff}.guide-body{color:var(--ink-2);gap:6px;margin:0;padding-left:20px;display:grid}select.mini{border:1px solid var(--line);background:#fff;border-radius:7px;padding:3px 24px 3px 8px;font-size:12.5px}.btn:disabled{opacity:.45;cursor:default;transform:none}#app{min-height:100%}.stage{flex-direction:column;min-width:0;display:flex;position:relative;overflow:hidden}.stage-bar{border-bottom:1px solid var(--line);background:var(--bg);flex-wrap:wrap;align-items:center;gap:14px;padding:12px 20px;display:flex}.seg{background:var(--line-2);border-radius:10px;padding:3px;display:inline-flex}.seg button{all:unset;cursor:pointer;color:var(--muted);border-radius:7px;align-items:center;gap:6px;padding:5px 10px;font-size:12.5px;font-weight:600;display:inline-flex}.seg button svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;width:16px;height:16px}.seg button[aria-pressed=true]{color:var(--ink);background:#fff;box-shadow:0 1px 2px #00000014}.data-src{color:var(--ink-2);align-items:center;gap:8px;min-width:0;font-size:12.5px;display:flex}.badge{border-radius:99px;align-items:center;gap:6px;padding:3px 9px;font-size:11.5px;font-weight:600;display:inline-flex}.badge.sample{color:#92400e;background:#fef3c7}.badge.live{color:#166534;background:#dcfce7}.badge.snap{color:#3730a3;background:#e0e7ff}.toggle-dark{color:var(--muted);cursor:pointer;align-items:center;gap:6px;margin-left:auto;font-size:12.5px;display:flex}.toggle-dark input{accent-color:var(--brand-2)}.canvas{background:radial-gradient(circle at 1px 1px,#e4e4e7 1px,#0000 0) 0 0/18px 18px;flex:1;padding:28px;overflow:auto}.browser{background:#fff;border-radius:14px;width:100%;max-width:1100px;margin:0 auto;transition:max-width .35s cubic-bezier(.2,.8,.2,1);overflow:hidden;box-shadow:0 0 0 1px #0000000f,0 24px 60px -20px #18181b40}.browser.tablet{max-width:768px}.browser.phone{max-width:390px}.chrome{border-bottom:1px solid var(--line);background:#f4f4f5;align-items:center;gap:6px;height:38px;padding:0 14px;display:flex}.chrome i{background:#d4d4d8;border-radius:50%;width:10px;height:10px}.chrome span{max-width:340px;height:24px;color:var(--muted);white-space:nowrap;background:#fff;border-radius:6px;flex:1;align-items:center;margin-left:12px;padding:0 10px;font-size:12px;display:flex;overflow:hidden}.page{background:#fff;padding:28px clamp(14px,4vw,44px) 40px;transition:background .2s}.page.dark{background:#0c0a09}.page-ghost{gap:8px;margin:0 0 22px;display:grid}.page-ghost:last-child{margin:22px 0 0}.page-ghost b{background:#f1f1f2;border-radius:6px;width:40%;height:18px}.page-ghost i{background:#f4f4f5;border-radius:5px;height:10px}.page-ghost i:last-child{width:75%}.page.dark .page-ghost b,.page.dark .page-ghost i{background:#292524}.preview{min-height:60px}.preview.loading{opacity:.5;transition:opacity .2s}.measure{visibility:hidden;pointer-events:none;position:absolute;top:0;left:-10000px}.toast{opacity:0;background:var(--ink);color:#fff;box-shadow:var(--shadow);pointer-events:none;z-index:50;border-radius:10px;padding:10px 16px;font-weight:600;transition:opacity .2s,transform .2s;position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px)}.toast.show{opacity:1;transform:translate(-50%)}@media (width<=900px){.top{flex-wrap:wrap;gap:10px;height:auto;padding:10px 16px}.steps{order:3;justify-content:space-between;width:100%;margin:0}.step{padding:6px 8px 6px 6px}.conn{margin-left:auto}.app{grid-template-columns:1fr;height:auto}.panel{border-right:0;border-bottom:1px solid var(--line);overflow:visible}.pane{padding:20px 16px 28px}.stage{min-height:70vh}.canvas{padding:16px}.stage-bar{padding:10px 16px}.seg button span{display:none}}@media (width<=420px){.types{grid-template-columns:1fr}.step span,.brand small{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}