:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#fff;--text:#2c2c2c;--muted:#8a8a8a;--line:#ececec;--soft:#fafafa;--peach:#ffab92;--peach-dark:#9c523c;--cyan:#1cb4dc;--cyan-hover:#44c5e7;--code-text:#383a42;--t-comment:#8e908c;--t-string:#50a14f;--t-number:#b76b01;--t-keyword:#a626a4;--t-call:#4078f2;--t-key:#c18401;--t-tag:#e45649;font:500 16px/1.6 Raleway,system-ui,-apple-system,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#1b1b1d;--text:#e8e6e3;--muted:#9b9895;--line:#333336;--soft:#232326;--peach-dark:#ffc2ad;--code-text:#d7dae0;--t-comment:#7f848e;--t-string:#98c379;--t-number:#d19a66;--t-keyword:#c678dd;--t-call:#61afef;--t-key:#e5c07b;--t-tag:#e06c75}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);margin:0;overflow-x:hidden}a{color:var(--cyan);text-decoration:none;transition:color .1s}a:hover{color:var(--cyan-hover)}h1,h2{font-weight:700;line-height:1.2}h2{margin:0 0 14px;font-size:26px}p{margin:0 0 12px}code{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:.88em}p code{border:1px solid var(--line);background:var(--soft);border-radius:3px;padding:1px 5px}.hint{color:var(--muted)}.hero{text-align:center;padding:56px 16px 72px}.hero h1{color:var(--cyan);margin:0 0 6px;font-size:clamp(36px,7vw,48px)}.tagline{color:var(--muted);margin:0 0 14px;font-size:20px}.logo{background:#ffab92;border-radius:6px;width:300px;max-width:100%;height:120px;margin:0 auto 28px;position:relative;overflow:hidden}.logo-window{border-radius:4px;position:absolute;inset:5px 60px;box-shadow:0 0 0 200px #fffc}@media (prefers-color-scheme:dark){.logo-window{box-shadow:0 0 0 200px #1b1b1db8}}.logo-abbr{color:#fafafa;letter-spacing:.05em;text-shadow:0 2px #ffa083,0 -2px #ffa083,2px 0 #ffa083,-2px 0 #ffa083;justify-content:center;align-items:center;font-size:66px;font-weight:700;display:flex;position:absolute;inset:0}.logo-lines span{top:calc(var(--y) - 1.5px);width:var(--w);background:var(--cyan);height:3px;animation:logo-line 3.5s linear var(--d) infinite;position:absolute;left:0}@keyframes logo-line{0%{translate:320px}to{translate:-100px}}@media (prefers-reduced-motion:reduce){.logo-lines span{animation-play-state:paused}}.facts{color:var(--muted);margin:0 auto 32px;font-size:15px}.facts span+span:before{content:"·";margin:0 10px}.install{border:1px solid var(--line);background:var(--soft);text-align:left;border-radius:5px;width:min(540px,100%);margin:0 auto 24px}.install-tabs{gap:2px;padding:6px 8px 0;display:flex}.install-tabs button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;padding:2px 10px;font-size:14px}.install-tabs [aria-selected=true]{color:var(--text);font-weight:700}.install-line{align-items:center;gap:12px;padding:6px 8px 10px 18px;display:flex}.install-line code{white-space:nowrap;min-width:0;color:var(--code-text);flex:1;font-size:15px;overflow-x:auto}.hero-links{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 28px;font-weight:700;display:flex}.button{background:var(--cyan);color:#fff;border-radius:5px;align-items:center;gap:12px;padding:9px 18px;font-weight:700;transition:background .2s;display:inline-flex}.button:hover{background:var(--cyan-hover);color:#fff}.button:active{transform:translateY(1px)}.button.big{padding:12px 22px;font-size:22px}main{max-width:1200px;margin:0 auto;padding:0 24px}main>section{margin:0 0 96px}.quick,.example{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 48px;display:grid}.example{grid-template-rows:auto 1fr;grid-template-areas:"text demo""code demo"}.example-text{grid-area:text}.example-demo{grid-area:demo;min-width:0;padding-top:6px}.more{font-weight:700}.more:after{content:" →"}@media (width<=900px){main>section{margin-bottom:72px}.quick,.example{grid-template-columns:minmax(0,1fr)}.example{grid-template-rows:auto;grid-template-areas:"text""demo""code"}}@media (width<=480px){main{padding:0 16px}h2{font-size:23px}}.code{border:1px solid var(--line);background:var(--soft);color:var(--code-text);border-radius:4px;position:relative}.code-bar{color:var(--muted);justify-content:space-between;align-items:center;padding:6px 8px 0 16px;font-size:13px;display:flex}.code pre{white-space:pre-wrap;overflow-wrap:anywhere;tab-size:2;margin:0;padding:6px 16px 14px;font-size:13.5px;line-height:1.55}.code code{font-size:inherit}.example .code{grid-area:code;align-self:start}@media (width<=600px){.code pre{white-space:pre;overflow-wrap:normal;font-size:12.5px;overflow-x:auto}}.copy{border:1px solid var(--line);background:var(--bg);color:var(--muted);font:inherit;cursor:pointer;border-radius:4px;flex:none;padding:2px 8px;font-size:13px}.copy:hover{color:var(--text)}.t-comment{color:var(--t-comment);font-style:italic}.t-string{color:var(--t-string)}.t-number{color:var(--t-number)}.t-keyword{color:var(--t-keyword)}.t-call{color:var(--t-call)}.t-key{color:var(--t-key)}.t-tag{color:var(--t-tag)}.viewport{cursor:grab;-webkit-user-select:none;user-select:none;border-radius:6px;position:relative;overflow:hidden}.viewport:active{cursor:grabbing}.viewport:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}.cards{gap:16px;width:max-content;display:flex}.card{width:200px;color:var(--text);-webkit-user-drag:none;flex-direction:column;display:flex}.card-art{background:radial-gradient(circle at 75% 30%, #ffffff8c 0 14%, transparent 15%), linear-gradient(160deg, hsl(var(--hue) 70% 88%), hsl(calc(var(--hue) + 35) 45% 77%));border-radius:6px;height:150px;margin-bottom:10px}@media (prefers-color-scheme:dark){.card-art{background:radial-gradient(circle at 75% 30%, #ffffff40 0 14%, transparent 15%), linear-gradient(160deg, hsl(var(--hue) 30% 58%), hsl(calc(var(--hue) + 35) 25% 44%))}}.card strong{font-size:17px}.card span:last-child{color:var(--cyan);font-size:14px;font-weight:700}.card:hover span:last-child{color:var(--cyan-hover)}.progress{background:var(--line);border-radius:2px;height:3px;margin-top:16px;overflow:hidden}.progress span{background:var(--peach);transform-origin:0;height:100%;display:block;scale:0 1}.picture{background:var(--peach);height:360px}.picture>div{width:max-content}.picture img{-webkit-user-drag:none;width:1600px;max-width:none;height:auto;display:block}@media (width<=480px){.picture{height:280px}}.carousel{position:relative}.slides{container-type:inline-size}.slides-track{width:max-content;display:flex}.slide{background:linear-gradient(150deg, hsl(var(--hue) 60% 86%), hsl(calc(var(--hue) + 30) 45% 74%));color:#2c2c2c;flex-direction:column;justify-content:flex-end;width:100cqw;height:260px;padding:24px 64px;display:flex}@media (prefers-color-scheme:dark){.slide{background:linear-gradient(150deg, hsl(var(--hue) 28% 52%), hsl(calc(var(--hue) + 30) 24% 38%));color:#fff}}.slide-number{opacity:.6;margin-bottom:auto;font-size:14px;font-weight:700}.slide strong{font-size:30px;font-weight:700}.slide p{opacity:.85;max-width:340px;margin:2px 0 0}@media (width<=480px){.slide{padding:20px 52px}.slide strong{font-size:26px}}.arrow{color:#2c2c2c;cursor:pointer;background:#ffffffbf;border:0;border-radius:50%;width:36px;height:36px;margin-top:-18px;font:700 22px/1 system-ui,sans-serif;position:absolute;top:50%}.arrow:hover{background:#fff}.arrow.prev{left:10px}.arrow.next{right:10px}.dots{justify-content:center;gap:8px;margin-top:14px;display:flex}.dots button{background:var(--line);cursor:pointer;border:0;border-radius:4px;width:8px;height:8px;padding:0;transition:width .2s,background .2s}.dots button[aria-current]{background:var(--peach);width:22px}.table-wrap{border:1px solid var(--line);overscroll-behavior:contain;height:340px;overflow:auto}.table-wrap table{border-collapse:separate;border-spacing:0;white-space:nowrap;font-size:14px}.table-wrap th,.table-wrap td{border-bottom:1px solid var(--line);background:var(--bg);text-align:right;padding:8px 16px}.table-wrap thead th{z-index:1;background:var(--peach);color:#9c523c;font-weight:700;position:sticky;top:0}.table-wrap tbody th{background:var(--soft);text-align:left;font-weight:700;position:sticky;left:0}.table-wrap thead th:first-child{z-index:2;text-align:left;left:0}.table-wrap td:nth-child(2){text-align:left}.table-wrap input{accent-color:var(--cyan)}.tabs-track{border-bottom:1px solid var(--line);gap:4px;width:max-content;display:flex}.tabs-track button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;margin-bottom:-1px;padding:10px 14px;font-weight:700}.tabs-track button:hover{color:var(--text)}.tabs-track [aria-selected=true]{border-bottom-color:var(--peach);color:var(--text)}.scene{background:linear-gradient(#ffe3d8,#fff4ef);height:300px}@media (prefers-color-scheme:dark){.scene{background:linear-gradient(#2b2333,#3a2a30)}}.scene:before{content:"";background:#fff6dc;border-radius:50%;width:60px;height:60px;position:absolute;top:36px;right:18%}.layer{pointer-events:none;width:2400px;height:320px;position:absolute;bottom:0;left:0}.layer svg{display:block}#scene-far{fill:#fbcdbd}#scene-mid{fill:#f4a98f}#scene-near{fill:#8a5a55}@media (prefers-color-scheme:dark){#scene-far{fill:#5a4152}#scene-mid{fill:#774a52}#scene-near{fill:#1e1719}}.demo-list{columns:2 320px;column-gap:48px;margin:16px 0 0;padding:0;list-style:none}.demo-list li{break-inside:avoid;margin:0 0 10px}.demo-list a{font-weight:700}.demo-list li span{color:var(--muted)}.demo-list li span:before{content:"— "}.footer{color:var(--muted);text-align:center;padding:8px 16px 56px}.footer p{margin:18px 0 0}.photo-credit{font-size:13px}.toast{z-index:10;color:#fff;opacity:0;pointer-events:none;background:#2c2c2c;border-radius:5px;padding:8px 16px;font-size:15px;transition:opacity .2s,translate .2s;position:fixed;bottom:24px;left:50%;translate:-50% 8px}.toast.shown{opacity:1;translate:-50%}
