:root{--bg:#f7f8fb;--panel:#fff;--ink:#1a2230;--muted:#5b6678;--line:#e4e8ef;--accent:#4f7ff5;--accent-2:#9b7bff;--accent-ink:#fff;--code-bg:#0f1524;--code-ink:#d7e0f4;--chip:#eef2fb;--chip-ink:#3a4a6b;--shadow:0 1px 2px #141e320d, 0 8px 30px #141e320f}@media (prefers-color-scheme:dark){:root{--bg:#0d1017;--panel:#161a24;--ink:#e8ecf4;--muted:#9aa6bd;--line:#252b39;--accent:#6e97ff;--code-bg:#0a0e18;--code-ink:#cdd8f2;--chip:#1c2436;--chip-ink:#a7b6d6;--shadow:0 1px 2px #0000004d, 0 10px 34px #00000059}}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}code,pre,kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.wrap{max-width:1040px;margin:0 auto;padding:0 20px}.wrap-wide{max-width:1240px}header{z-index:20;border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--bg) 82%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:sticky;top:0}.nav{align-items:center;gap:14px;height:60px;display:flex}.brand{color:var(--ink);align-items:center;gap:10px;font-size:18px;font-weight:700;display:flex}.brand:hover{text-decoration:none}.logo{flex:none;width:28px;height:28px}.ver{border:1px solid var(--line);background:var(--panel);color:var(--accent);border-radius:20px;padding:5px 9px;font:600 11px/1 ui-monospace,monospace}.nav .spacer{flex:1}.nav a.navlink{color:var(--muted);font-size:14px;font-weight:500}.nav a.navlink:hover,.nav a.navlink[aria-current]{color:var(--ink);text-decoration:none}.hero{text-align:center;padding:72px 0 44px}.hero h1{letter-spacing:-.02em;margin:0 0 18px;font-size:clamp(34px,6vw,56px);line-height:1.05}.hero h1 .g{background:linear-gradient(100deg, var(--accent), var(--accent-2));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.lead{max-width:660px;color:var(--muted);margin:0 auto 14px;font-size:clamp(17px,2.4vw,21px)}.tags{flex-wrap:wrap;justify-content:center;gap:8px;margin:22px 0 30px;display:flex}.tag{border:1px solid var(--line);background:var(--chip);color:var(--chip-ink);border-radius:20px;padding:6px 13px;font-size:13px;font-weight:500}.cta{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.btn{cursor:pointer;border:1px solid #0000;border-radius:10px;align-items:center;gap:8px;padding:12px 22px;font-family:inherit;font-size:15px;font-weight:600;display:inline-flex}.btn:hover{text-decoration:none}.btn-primary{background:var(--accent);color:var(--accent-ink)}.btn-primary:hover{filter:brightness(1.06)}.btn-ghost{border-color:var(--line);background:var(--panel);color:var(--ink);box-shadow:var(--shadow)}.btn-sm{padding:7px 13px;font-size:13px}.codewrap{max-width:720px;margin:44px auto 0}.code{background:var(--code-bg);color:var(--code-ink);text-align:left;box-shadow:var(--shadow);border-radius:12px;padding:20px 22px;font:13.5px/1.7 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow-x:auto}.code .c{color:#7f8db0}.code .k{color:#c792ea}.code .s{color:#c3e88d}.code .t{color:#82aaff}.code .n{color:#f5c77e}.caption{color:var(--muted);text-align:center;margin-top:10px;font-size:13px}.wrap>section{padding:52px 0}h2{letter-spacing:-.01em;margin:0 0 8px;font-size:clamp(24px,3.4vw,32px)}.sub{color:var(--muted);margin:0 0 30px;font-size:16px}.grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;display:grid}.card{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);border-radius:14px;padding:20px}.card .ic{background:var(--chip);width:34px;height:34px;color:var(--accent);border-radius:9px;place-items:center;margin-bottom:12px;display:grid}.card h3{margin:0 0 6px;font-size:16.5px}.card p{color:var(--muted);margin:0;font-size:14.5px;line-height:1.55}.card code{background:var(--chip);color:var(--chip-ink);border-radius:4px;padding:1px 4px;font-size:13px}.chips{flex-wrap:wrap;gap:8px;margin-top:6px;display:flex}.chip{border:1px solid var(--line);background:var(--chip);color:var(--chip-ink);border-radius:7px;padding:8px 11px;font:500 13px/1 ui-monospace,monospace}.two{grid-template-columns:1fr 1fr;gap:34px;display:grid}.two h3{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin:0 0 12px;font-size:15px}footer{border-top:1px solid var(--line);color:var(--muted);padding:34px 0;font-size:14px}.fnav{flex-wrap:wrap;align-items:center;gap:18px;display:flex}.fnav .spacer{flex:1}.docs{grid-template-columns:232px minmax(0,1fr);align-items:start;gap:40px;padding:40px 0 72px;display:grid}.toc{max-height:calc(100vh - 110px);font-size:14px;position:sticky;top:80px;overflow-y:auto}.toc strong{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin:18px 0 6px;font-size:11px;display:block}.toc strong:first-child{margin-top:0}.toc a{color:var(--muted);padding:3px 0;display:block}.toc a:hover,.toc a.active{color:var(--ink);text-decoration:none}.prose h1{letter-spacing:-.02em;margin:0 0 8px;font-size:clamp(28px,4vw,38px)}.prose>p.lead{text-align:left;margin:0 0 8px}.prose h2{border-bottom:1px solid var(--line);margin:48px 0 12px;padding-bottom:8px;font-size:24px}.prose h3{margin:30px 0 8px;font-size:17px}.prose h3 code{font-size:16px}.prose p,.prose li{font-size:15.5px}.prose :not(pre)>code{background:var(--chip);color:var(--chip-ink);border-radius:5px;padding:1.5px 5px;font-size:13.5px}.prose .code{margin:14px 0}.prose table{border-collapse:collapse;width:100%;margin:14px 0;font-size:14px}.prose th,.prose td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;padding:9px 12px}.prose th{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:11.5px;font-weight:700}.prose td:first-child{white-space:nowrap}.table-wrap{overflow-x:auto}.callout{border:1px solid var(--line);border-left:3px solid var(--accent);background:var(--panel);border-radius:0 12px 12px 0;margin:18px 0;padding:14px 18px;font-size:14.5px}.callout>strong:first-child{margin-bottom:2px;display:block}.callout p{margin:0}.sig{border:1px solid var(--line);background:var(--panel);border-radius:9px;margin:0 0 10px;padding:10px 14px;font:13.5px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-x:auto}.sig .t{color:var(--muted)}.demo-grid{grid-template-columns:280px minmax(0,1fr);align-items:start;gap:24px;display:grid}.panel{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);border-radius:14px;padding:20px}.panel>h3{color:var(--muted);letter-spacing:.07em;text-transform:uppercase;margin:0 0 14px;font-size:12px;font-weight:700}.panel+.panel{margin-top:16px}.field{margin-bottom:14px;font-size:13.5px;display:block}.field>span{color:var(--ink);margin-bottom:4px;font-size:12.5px;display:block}.field code,.switch code{color:var(--muted);font-size:11.5px}.field em{color:var(--muted);margin-top:1px;font-size:11.5px;font-style:normal;line-height:1.35;display:block}.panel-note{color:var(--muted);margin:-6px 0 16px;font-size:12.5px;line-height:1.45}.field select,.field input{border:1px solid var(--line);background:var(--bg);width:100%;color:inherit;font:inherit;border-radius:7px;padding:7px 9px;font-size:13.5px}.css-grid{grid-template-columns:auto minmax(230px,1fr);align-items:start;gap:24px;display:grid}.css-preview{padding-bottom:4px}.css-fields{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0 16px;display:grid}.css-fields>button{grid-column:1/-1;justify-self:start}@media (max-width:900px){.css-grid{grid-template-columns:minmax(0,1fr)}}.switch{cursor:pointer;align-items:flex-start;gap:8px;margin-bottom:9px;font-size:12.5px;line-height:1.4;display:flex}.switch input{flex:none;margin-top:1px}.switch>span{flex:1}.switch input{accent-color:var(--accent)}.stage-input{border:1px solid var(--line);background:var(--panel);width:min(380px,100%);color:inherit;font:inherit;border-radius:10px;padding:10px 13px;font-size:15px}.readout{background:var(--chip);color:var(--chip-ink);white-space:pre-line;word-break:break-word;border-radius:9px;gap:4px;margin-top:14px;padding:12px 14px;font:13px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;display:grid}.event-log{max-height:150px;margin:0;padding:0;font:12.5px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;list-style:none;overflow-y:auto}.event-log li{border-bottom:1px solid var(--line);color:var(--muted);padding:2px 0}.event-log b{color:var(--accent);font-weight:600}.example{gap:10px;display:grid}.example>h3{margin:0;font-size:15px}.themes{grid-template-columns:260px minmax(0,1fr);align-items:start;gap:24px;display:grid}.theme-picks{gap:8px;display:grid}.theme-pick{border:1px solid var(--line);background:var(--panel);color:inherit;font:inherit;text-align:left;cursor:pointer;border-radius:12px;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:12px;padding:10px 12px;display:grid}.theme-pick:hover{border-color:color-mix(in srgb, var(--accent) 40%, var(--line))}.theme-pick[aria-checked=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.theme-chip{border:1px solid #0000001f;border-radius:7px;justify-content:center;align-items:center;gap:3px;height:30px;display:flex}.theme-chip i{border-radius:2px;width:7px;height:16px}.theme-pick b{font-size:14px;display:block}.theme-pick small{color:var(--muted);font-size:12px;line-height:1.35}@media (max-width:900px){.themes{grid-template-columns:minmax(0,1fr)}}.example>p{color:var(--muted);margin:0;font-size:13.5px}.two-fields{grid-template-columns:1fr 1fr;gap:8px;display:grid}.badge{border:1px solid var(--line);background:var(--chip);color:var(--chip-ink);cursor:pointer;border-radius:999px;align-items:center;gap:6px;padding:5px 12px;font-size:14px;display:inline-flex}.badge:hover,.badge:focus-visible{border-color:var(--accent);outline:none}.two-fields .stage-input{width:100%}@media (max-width:900px){.docs,.demo-grid,.two{grid-template-columns:minmax(0,1fr)}.toc{max-height:none;position:static}}
