:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f6f7f9;--surface:#ffffffeb;--surface-solid:#fff;--border:#0f172a1f;--text:#0f172a;--text-muted:#5b6475;--accent:#e91e63;--accent-soft:#e91e631f;--code-bg:#0f172a;--code-text:#e2e8f0;--code-key:#7dd3fc;--code-string:#fcd34d;--code-number:#f9a8d4;--code-comment:#94a3b8;--shadow:0 8px 24px #0f172a1f;--radius:10px;--header-height:52px;--font:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b1020;--surface:#111827eb;--surface-solid:#111827;--border:#e2e8f024;--text:#e5e7eb;--text-muted:#9ca3af;--accent:#f472b6;--accent-soft:#f472b629;--code-bg:#030712;--shadow:0 8px 24px #00000073}@media (prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b1020;--surface:#111827eb;--surface-solid:#111827;--border:#e2e8f024;--text:#e5e7eb;--text-muted:#9ca3af;--accent:#f472b6;--accent-soft:#f472b629;--code-bg:#030712;--shadow:0 8px 24px #00000073}}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);font-family:var(--font);margin:0;font-size:15px;line-height:1.5}a{color:var(--accent)}.site-header{height:var(--header-height);background:var(--surface);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:20;align-items:center;gap:16px;padding:0 16px;display:flex;position:fixed;inset:0 0 auto}.site-header .brand{color:var(--text);white-space:nowrap;align-items:baseline;gap:8px;font-size:17px;font-weight:700;text-decoration:none;display:flex}.site-header .brand .version{color:var(--text-muted);font-size:12px;font-weight:500}.site-header nav{scrollbar-width:none;gap:4px;display:flex;overflow-x:auto}.site-header nav a{color:var(--text-muted);white-space:nowrap;border-radius:8px;padding:6px 10px;text-decoration:none}.site-header nav a:hover,.site-header nav a:focus-visible{color:var(--text);background:var(--accent-soft)}.site-header nav a[aria-current=page]{color:var(--accent);background:var(--accent-soft)}.theme-toggle{border:1px solid var(--border);color:var(--text-muted);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;border-radius:8px;align-items:center;gap:6px;margin-left:auto;padding:6px 10px;font-size:13px;display:inline-flex}.theme-toggle:hover,.theme-toggle:focus-visible{color:var(--text);background:var(--accent-soft)}.stage{inset:var(--header-height) 0 0 0;touch-action:none;position:fixed;overflow:hidden}.stage canvas{display:block}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10;position:fixed}.panel>summary{cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;font-size:13px;font-weight:600;list-style:none;display:flex}.panel>summary::-webkit-details-marker{display:none}.panel>summary:after{content:"▾";color:var(--text-muted)}.panel:not([open])>summary:after{content:"▸"}.hud{top:calc(var(--header-height) + 12px);font-family:var(--mono);color:var(--text-muted);pointer-events:none;padding:8px 12px;font-size:12px;left:12px}.hud strong{color:var(--text);font-weight:600}.hint{top:calc(var(--header-height) + 52px);max-width:calc(100vw - 24px);color:var(--text-muted);pointer-events:none;white-space:nowrap;padding:6px 14px;font-size:13px;transition:opacity .6s;left:12px}.hint.hidden{opacity:0}.code-panel{width:min(460px,100vw - 24px);bottom:12px;left:12px;overflow:hidden}.code-panel[open]{background:var(--code-bg);border-color:#0000}.code-panel[open]>summary{color:var(--code-text)}.code-panel pre{overscroll-behavior:contain;max-height:38vh;font-family:var(--mono);color:var(--code-text);margin:0;padding:4px 14px 14px;font-size:12.5px;line-height:1.55;overflow:auto}.code-panel .tok-key{color:var(--code-key)}.code-panel .tok-string{color:var(--code-string)}.code-panel .tok-number{color:var(--code-number)}.code-panel .tok-comment{color:var(--code-comment);font-style:italic}.copy-button{font:inherit;color:var(--code-text);cursor:pointer;background:0 0;border:1px solid #e2e8f040;border-radius:6px;padding:2px 10px;font-size:12px}.code-panel:not([open]) .copy-button{display:none}.copy-button:hover,.copy-button:focus-visible{background:#e2e8f01f}.event-panel{width:min(260px,100vw - 24px);bottom:12px;right:12px}.event-panel ol{font-family:var(--mono);overscroll-behavior:contain;max-height:30vh;margin:0;padding:0 12px 10px;font-size:12px;list-style:none;overflow:auto}.event-panel li{justify-content:space-between;gap:8px;padding:2px 0;animation:.25s ease-out event-in;display:flex}.event-panel li .detail{color:var(--text-muted)}.event-panel li.empty{color:var(--text-muted);font-family:var(--font)}@keyframes event-in{0%{background:var(--accent-soft)}}.lil-gui.lil-root.controls{top:calc(var(--header-height) + 12px);max-height:calc(100vh - var(--header-height) - 24px - 30vh - 80px);z-index:11;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);position:fixed;right:12px;overflow-y:auto}.lil-gui.controls,.lil-gui.controls .lil-gui{--background-color:var(--surface-solid);--widget-color:#7f7f7f2e;--hover-color:#7f7f7f42;--focus-color:#7f7f7f52;--text-color:var(--text);--title-background-color:var(--surface-solid);--title-text-color:var(--text);--number-color:var(--accent);--string-color:var(--accent);--font-family:var(--font)}.page{max-width:760px;padding:calc(var(--header-height) + 24px) 16px 64px;margin:0 auto}.page h1{margin:0 0 8px;font-size:30px;line-height:1.2}.page .lede{color:var(--text-muted);margin-top:0;font-size:17px}.page figure{margin:24px 0}.page .demo{border-radius:var(--radius);border:1px solid var(--border);background:var(--surface-solid);height:420px;position:relative;overflow:hidden}.page figcaption{color:var(--text-muted);margin-top:8px;font-size:13px}.page .options{flex-wrap:wrap;gap:8px 20px;margin:12px 0;display:flex}.page label{cursor:pointer;align-items:center;gap:8px;display:inline-flex}.page code{font-family:var(--mono);background:var(--accent-soft);border-radius:4px;padding:1px 5px;font-size:.9em}.page pre{background:var(--code-bg);color:var(--code-text);border-radius:var(--radius);font-family:var(--mono);padding:14px;font-size:13px;overflow-x:auto}.page pre code{background:0 0;padding:0}.overlay-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:200px;max-height:calc(100% - 32px);box-shadow:var(--shadow);padding:10px 12px;font-size:13px;position:absolute;top:16px;right:16px;overflow-y:auto}.overlay-card h3{margin:0 0 6px;font-size:13px}.overlay-card ul{margin:0;padding-left:18px}@media (width<=700px){.site-header{gap:8px}.site-header .brand .version{display:none}.hint{white-space:normal}.hud{display:none}.hint{top:calc(var(--header-height) + 60px)}.lil-gui.lil-root.controls{width:auto;max-height:55vh;left:12px;right:12px}.site-header nav{-webkit-mask-image:linear-gradient(90deg,#000 85%,#0000);mask-image:linear-gradient(90deg,#000 85%,#0000)}.theme-toggle .label{display:none}.event-panel{width:calc(50vw - 18px);bottom:12px;right:12px}.code-panel{width:calc(50vw - 18px)}.code-panel[open],.event-panel[open]{z-index:12;width:calc(100vw - 24px)}.page .demo{height:340px}}
