:root{--bg:#fbfbfd;--bg-2:#f2f2f5;--card:#fff;--ink:#1d1d1f;--ink-2:#1d1d1fb8;--ink-3:#1d1d1f80;--line:#00000014;--line-2:#00000024;--accent:#0071e3;--accent-ink:#fff;--code-bg:#f5f5f7;--shadow:0 1px 1px #00000008, 0 8px 28px #0000000f;--radius:18px;--nav-bg:#fbfbfdb8;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font:100%/1.5 -apple-system,BlinkMacSystemFont,system-ui,Segoe UI,sans-serif}:root[data-scheme=dark]{--bg:#000;--bg-2:#0d0d0f;--card:#111113;--ink:#f5f5f7;--ink-2:#f5f5f7b8;--ink-3:#f5f5f77a;--line:#ffffff17;--line-2:#ffffff29;--accent:#2997ff;--accent-ink:#000;--code-bg:#111113;--shadow:0 1px 1px #0006, 0 12px 40px #00000080;--nav-bg:#000000a8;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:72px}body{background:var(--bg);color:var(--ink);margin:0;transition:background-color .24s,color .24s}a{color:var(--accent);text-decoration:none}a:hover{text-underline-offset:3px;text-decoration:underline}code{font:.88em/1.4 ui-monospace,SF Mono,Menlo,monospace}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}.nav{z-index:20;background:var(--nav-bg);-webkit-backdrop-filter:saturate(180%)blur(20px);border-bottom:.5px solid var(--line);align-items:center;gap:24px;height:52px;padding:0 max(20px,50vw - 540px);display:flex;position:sticky;top:0}.brand{color:var(--ink);letter-spacing:-.01em;align-items:center;gap:8px;font-size:15px;font-weight:600;display:flex}.brand:hover{text-decoration:none}.brand svg{fill:none;width:18px;height:18px;stroke:var(--accent);stroke-width:1.6px;stroke-linejoin:round}.nav nav{gap:22px;margin-left:auto;display:flex}.nav nav a{color:var(--ink-2);font-size:13px}.nav nav a:hover{color:var(--ink);text-decoration:none}.icon-btn{width:30px;height:30px;color:var(--ink-2);cursor:pointer;background:0 0;border:0;border-radius:999px;place-items:center;display:grid}.icon-btn:hover{background:var(--line);color:var(--ink)}.icon-btn svg{fill:none;stroke:currentColor;stroke-width:1.4px;width:17px;height:17px}.icon-btn .fill{fill:currentColor;stroke:none}main{display:block}.hero{text-align:center;max-width:1080px;margin:0 auto;padding:88px 20px 40px}.eyebrow{letter-spacing:.02em;color:var(--ink-3);margin:0 0 14px;font-size:13px;font-weight:600}.hero h1{letter-spacing:-.035em;text-wrap:balance;margin:0;font-size:clamp(2.4rem,6vw,4.2rem);font-weight:700;line-height:1.05}.lede{max-width:34ch;color:var(--ink-2);letter-spacing:-.01em;text-wrap:balance;margin:20px auto 0;font-size:clamp(1.1rem,2vw,1.35rem);line-height:1.4}.hero-actions{justify-content:center;gap:12px;margin-top:30px;display:flex}.btn{height:40px;color:var(--accent);border:1px solid var(--line-2);border-radius:999px;align-items:center;padding:0 20px;font-size:15px;font-weight:500;transition:transform .12s,background-color .16s;display:inline-flex}.btn:hover{background:var(--line);text-decoration:none}.btn:active{transform:scale(.97)}.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:#0000}.btn.primary:hover{filter:brightness(1.08);background:var(--accent)}.stage-wrap{margin-top:64px;position:relative}.stage{background:var(--card);border:.5px solid var(--line);box-shadow:var(--shadow);border-radius:24px;position:relative;overflow:hidden}.stage-inner{position:absolute;inset:0}.stage-inner>.prism{height:100%}.hero-stage{height:min(620px,74vh)}.stage-note{color:var(--ink-3);margin:14px 0 0;font-size:13px}.seg{z-index:5;background:color-mix(in srgb, var(--bg-2) 82%, transparent);-webkit-backdrop-filter:blur(14px);border:.5px solid var(--line);border-radius:10px;padding:3px;display:inline-flex;position:absolute;top:16px;right:16px}.seg button{min-width:44px;height:26px;color:var(--ink-2);cursor:pointer;background:0 0;border:0;border-radius:7px;padding:0 12px;font:500 13px/1 inherit;transition:background-color .18s,color .18s}.seg button[aria-checked=true]{background:var(--card);color:var(--ink);box-shadow:0 1px 3px #0000001f}.seg.small{position:static}.features{grid-template-columns:repeat(3,1fr);gap:40px;max-width:1080px;margin:0 auto;padding:72px 20px 24px;display:grid}.features h2{letter-spacing:-.015em;margin:0 0 8px;font-size:19px;font-weight:600}.features p{color:var(--ink-2);margin:0;font-size:15px;line-height:1.5}.block{max-width:1080px;margin:0 auto;padding:96px 20px 0}.section-title{letter-spacing:-.03em;margin:0;font-size:clamp(1.8rem,3.6vw,2.5rem);font-weight:700;line-height:1.1}.section-lede{max-width:60ch;color:var(--ink-2);text-wrap:pretty;margin:12px 0 32px;font-size:17px}.hint{color:var(--ink-3);max-width:70ch;margin:16px 0 0;font-size:14px}.code-card{background:var(--code-bg);border:.5px solid var(--line);border-radius:14px;margin-top:14px;overflow:hidden}.code-head{color:var(--ink-3);justify-content:space-between;align-items:center;padding:10px 14px 0 16px;font-size:12px;font-weight:500;display:flex}.code-card pre{margin:0;padding:12px 16px 16px;overflow-x:auto}.code-card code{color:var(--ink);font-size:13px;line-height:1.6}.copy{border:.5px solid var(--line-2);background:var(--card);height:24px;color:var(--ink-2);cursor:pointer;border-radius:999px;padding:0 10px;font:500 12px/1 inherit}.copy:hover{color:var(--ink)}.copy:active{transform:scale(.96)}.editor{grid-template-columns:minmax(280px,380px) 1fr;align-items:stretch;gap:20px;display:grid}.editor-side{flex-direction:column;gap:12px;display:flex}.field-label{color:var(--ink-3);font-size:12px;font-weight:600}textarea{resize:vertical;border:.5px solid var(--line-2);background:var(--code-bg);width:100%;min-height:340px;color:var(--ink);tab-size:2;border-radius:14px;flex:1;padding:14px 16px;font:13px/1.6 ui-monospace,SF Mono,Menlo,monospace}textarea:focus{outline:2px solid color-mix(in srgb, var(--accent) 60%, transparent);outline-offset:0}.controls{color:var(--ink-2);flex-wrap:wrap;align-items:center;gap:12px;font-size:13px;display:flex}.controls label{align-items:center;gap:6px;display:flex}select{border:.5px solid var(--line-2);background:var(--card);height:28px;color:var(--ink);border-radius:8px;padding:0 8px;font:13px inherit}.status{min-height:1.4em;color:var(--ink-3);margin:0;font-size:13px}.editor-stage{min-height:460px}.film{border:.5px solid var(--line);background:#0c0c0e;border-radius:20px;width:min(960px,100%);margin:28px auto 0;display:block}.gallery{grid-template-columns:repeat(2,1fr);gap:24px;display:grid}.gallery-3d{grid-template-columns:repeat(2,1fr)}.ex{flex-direction:column;gap:14px;display:flex}.ex-stage{border-radius:20px;height:360px}.gallery-3d .ex-stage{height:min(460px,58vh)}.ex-head{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.ex-head h3{letter-spacing:-.015em;margin:0;font-size:17px;font-weight:600}.ex-head p{color:var(--ink-2);margin:4px 0 0;font-size:14px}.ex-actions{flex-shrink:0;gap:6px;display:flex}.ex-code{max-height:0;margin:0;overflow:hidden}.links{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.link-card{border-radius:var(--radius);background:var(--card);border:.5px solid var(--line);box-shadow:var(--shadow);color:var(--ink);flex-direction:column;gap:6px;padding:22px 24px;transition:transform .16s;display:flex}.link-card:hover{text-decoration:none;transform:translateY(-1px)}.link-card strong{color:var(--accent);font-size:17px;font-weight:600}.link-card span{color:var(--ink-2);font-size:14px}.footer{border-top:.5px solid var(--line);max-width:1080px;color:var(--ink-3);justify-content:space-between;gap:40px;margin:120px auto 0;padding:32px 20px 56px;font-size:12px;line-height:1.6;display:flex}.footer p{max-width:70ch;margin:0 0 8px}.footer strong{color:var(--ink-2);font-weight:600}.footer nav{flex-direction:column;flex-shrink:0;gap:6px;display:flex}.footer a{color:var(--ink-2)}.footer p a{text-decoration:underline;-webkit-text-decoration-color:var(--line-2);text-decoration-color:var(--line-2);text-underline-offset:2px}.footer p a:hover{text-decoration-color:currentColor}.licenses{padding-top:64px;padding-bottom:96px}.licenses h2{letter-spacing:-.02em;margin:48px 0 10px;font-size:21px}.licenses p,.licenses li{color:var(--ink-2);max-width:72ch;font-size:15px}.table-wrap{border:.5px solid var(--line);background:var(--card);border-radius:14px;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:13px}th,td{text-align:left;border-bottom:.5px solid var(--line);vertical-align:top;padding:8px 14px}th{color:var(--ink-3);font-size:12px;font-weight:600}tr:last-child td{border-bottom:0}@media (max-width:860px){.features{grid-template-columns:1fr;gap:28px}.editor,.gallery,.links{grid-template-columns:1fr}.nav nav{display:none}.nav .icon-btn{margin-left:auto}.footer{flex-direction:column}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.01ms!important}}@media (prefers-reduced-transparency:reduce){.nav{background:var(--bg);-webkit-backdrop-filter:none}.seg{background:var(--bg-2);-webkit-backdrop-filter:none;backdrop-filter:none}}