@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(../media/manrope-cyrillic-ext-wght-normal.1dtltwig2y3wh.woff2)format("woff2-variations");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(../media/manrope-cyrillic-wght-normal.1hmx3sz6swr8m.woff2)format("woff2-variations");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(../media/manrope-greek-wght-normal.37b2k1x9f-55d.woff2)format("woff2-variations");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(../media/manrope-vietnamese-wght-normal.3xvzy9_grgcx4.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(../media/manrope-latin-ext-wght-normal.0-hru0xfwhnbp.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(../media/manrope-latin-wght-normal.1p_a2k8qd5zhp.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#f7f4ff;--muted:#9b95a8;--purple:#8b5cf6;--lime:#c7ff5e;--surface:#121016;--line:#ffffff12}*{box-sizing:border-box}html{scroll-behavior:smooth}html,body{min-height:100%;margin:0}body{color:var(--ink);background:#0b0910;font-family:Manrope Variable,sans-serif}button,input{font:inherit}button{color:inherit}a{color:inherit;text-decoration:none}.shell{background:linear-gradient(#ffffff04 1px,#0000 1px) 0 0/48px 48px,linear-gradient(90deg,#ffffff04 1px,#0000 1px) 0 0/48px 48px,radial-gradient(circle at 75% 5%,#3a1f614f 0,#0000 30rem),#0b0910;min-height:100vh;overflow:hidden}.nav{border-bottom:1px solid var(--line);grid-template-columns:1fr auto 1fr;align-items:center;width:min(1220px,100% - 40px);margin:auto;padding:25px 0;display:grid}.brand{letter-spacing:-.7px;font-size:20px;font-weight:900}.brand span{color:var(--lime)}.navlinks{color:#8f899c;gap:30px;font-size:13px;font-weight:700;display:flex}.navlinks a:hover{color:#fff}.status{color:#c9c4d5;text-transform:uppercase;letter-spacing:.08em;justify-self:end;align-items:center;gap:8px;font-size:11px;font-weight:750;display:flex}.status:before{content:"";background:var(--lime);width:7px;height:7px;box-shadow:0 0 16px var(--lime);border-radius:50%}.intro{width:min(1220px,100% - 40px);margin:72px auto 68px;position:relative}.intro:after{content:"03";color:#ffffff05;letter-spacing:-.1em;pointer-events:none;font-size:clamp(130px,22vw,290px);font-weight:950;line-height:1;position:absolute;top:-48px;right:1%}.eyebrow{color:var(--lime);letter-spacing:.16em;text-transform:uppercase;align-items:center;gap:8px;font-size:10px;font-weight:850;display:flex}.intro h1{z-index:1;letter-spacing:-.07em;max-width:780px;margin:18px 0 20px;font-size:clamp(54px,8vw,96px);line-height:.91;position:relative}.intro h1 span{color:#0000;-webkit-text-stroke:1px #f7f4ff}.intro>p{max-width:620px;color:var(--muted);margin:0 0 28px;font-size:16px;line-height:1.65}.primary{background:var(--lime);color:#0b0910;border-radius:10px;align-items:center;gap:9px;padding:14px 20px;font-weight:850;display:inline-flex;box-shadow:0 8px 30px #c7ff5e23}.studio{background:#0d0b11e8;border:1px solid #ffffff16;border-radius:22px;grid-template-columns:285px minmax(0,1fr);width:min(1220px,100% - 40px);margin:0 auto 120px;display:grid;overflow:hidden;box-shadow:0 40px 120px #0008}.widgetRail{background:#0a080d;border-right:1px solid #ffffff14;flex-direction:column;min-height:900px;display:flex}.railHead{border-bottom:1px solid var(--line);color:#88818f;letter-spacing:.15em;justify-content:space-between;align-items:center;padding:24px 22px;font-size:9px;font-weight:900;display:flex}.railHead b{width:23px;height:23px;color:var(--lime);border:1px solid #ffffff1a;border-radius:6px;place-items:center;display:grid}.widgetList{gap:7px;padding:10px;display:grid}.widgetList button{text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:12px;grid-template-columns:auto 1fr auto;align-items:start;gap:12px;width:100%;padding:16px 13px;display:grid;position:relative}.widgetList button:hover{background:#ffffff05}.widgetList button.active{background:linear-gradient(100deg,#c7ff5e0d,#0000);border-color:#c7ff5e36}.widgetIcon{color:#81798c;background:#ffffff07;border:1px solid #ffffff14;border-radius:9px;place-items:center;width:38px;height:38px;display:grid}.widgetList button.active .widgetIcon{color:var(--lime);background:#c7ff5e10;border-color:#c7ff5e43;box-shadow:0 0 24px #c7ff5e10}.widgetList small,.widgetList strong,.widgetList em{display:block}.widgetList small{color:#696272;letter-spacing:.12em;text-transform:uppercase;font-size:8px;font-weight:850}.widgetList strong{margin-top:3px;font-size:13px}.widgetList em{color:#756f7c;margin-top:5px;font-size:9px;font-style:normal;line-height:1.45}.widgetList button>i{color:#554f5b;align-self:center;font-style:normal}.widgetList button.active>i{color:var(--lime)}.railFoot{color:#696272;text-transform:uppercase;letter-spacing:.08em;border:1px dashed #ffffff16;border-radius:10px;align-items:center;gap:10px;margin:auto 18px 18px;padding:14px;font-size:9px;line-height:1.5;display:flex}.railFoot svg{color:var(--purple)}.workspace{min-width:0;padding:26px}.workspaceHead{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.workspaceHead>div>span{color:#6f6878;letter-spacing:.16em;font-size:8px;font-weight:900}.workspaceHead h2{letter-spacing:-.035em;align-items:center;gap:10px;margin:5px 0 0;font-size:25px;display:flex}.workspaceHead h2 svg{color:var(--lime)}.demoButton{color:var(--lime);cursor:pointer;background:#c7ff5e0b;border:1px solid #c7ff5e3d;border-radius:9px;align-items:center;gap:8px;padding:10px 13px;font-size:10px;font-weight:850;display:flex}.demoButton:hover,.demoButton.playing{background:var(--lime);color:#0b0910}.previewPanel{aspect-ratio:16/8.7;background:linear-gradient(145deg,#16121d,#0b090e);border:1px solid #ffffff15;border-radius:16px;position:relative;overflow:hidden}.previewPanel:before{content:"";background-color:#0000;background-image:linear-gradient(#ffffff03 1px,#0000 1px),linear-gradient(90deg,#ffffff03 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:24px 24px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:absolute;inset:0}.previewBar{z-index:2;color:#696371;letter-spacing:.13em;pointer-events:none;justify-content:space-between;padding:13px 15px;font-size:8px;font-weight:850;display:flex;position:absolute;top:0;left:0;right:0}.previewBar i{background:#ff4667;border-radius:50%;width:6px;height:6px;margin-right:7px;display:inline-block;box-shadow:0 0 10px #ff4667}.previewPanel iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.optionGrid{grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;display:grid}.optionCard,.sourceCard{border:1px solid var(--line);background:var(--surface);border-radius:13px;padding:19px}.optionTitle{align-items:center;gap:11px;margin-bottom:15px;display:flex}.optionTitle>span{width:27px;height:27px;color:var(--lime);border:1px solid #ffffff18;border-radius:7px;place-items:center;font-size:8px;font-weight:900;display:grid}.optionTitle strong,.optionTitle small{display:block}.optionTitle strong{font-size:12px}.optionTitle small{color:#766f7e;margin-top:2px;font-size:9px}.inputWrap{background:#0b090e;border:1px solid #ffffff18;border-radius:9px;align-items:center;padding:0 12px;display:flex}.inputWrap:focus-within{border-color:var(--purple);box-shadow:0 0 0 3px #8b5cf620}.inputWrap b{color:#5f5966;font-size:12px}.inputWrap input{color:#fff;background:0 0;border:0;outline:0;width:100%;padding:11px 4px}.connectionCard{background:#0b090e;border:1px solid #ffffff10;border-radius:9px;justify-content:space-between;align-items:center;gap:10px;margin-top:9px;padding:10px;display:flex}.connectionCard>div{align-items:center;gap:9px;display:flex}.connectionCard>div>i{background:#716b78;border-radius:50%;flex:none;width:7px;height:7px}.connectionCard strong,.connectionCard small{display:block}.connectionCard strong{font-size:10px}.connectionCard small{color:#706a76;margin-top:2px;font-size:8px}.connectionCard>a,.connectedBadge{white-space:nowrap;border-radius:6px;align-items:center;gap:5px;padding:7px 8px;font-size:8px;font-weight:850;display:flex}.connectionCard>a{background:#9146ff}.connectionCard.connected{border-color:#c7ff5e2b}.connectionCard.connected>div>i{background:var(--lime);box-shadow:0 0 9px var(--lime)}.connectedBadge{color:var(--lime);background:#c7ff5e0c}.presetGrid{grid-template-columns:1fr 1fr;gap:7px;display:grid}.preset{text-align:left;cursor:pointer;background:#0b090e;border:1px solid #ffffff10;border-radius:9px;align-items:center;gap:10px;min-width:0;padding:10px;display:flex;position:relative}.preset.selected{background:#c7ff5e08;border-color:#c7ff5e45}.preset>span:nth-child(2){min-width:0}.preset strong,.preset small{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.preset strong{font-size:10px}.preset small{color:#716b78;margin-top:2px;font-size:8px}.swatches{flex:none;display:flex}.swatches i{border:2px solid #0b090e;border-radius:5px;width:16px;height:22px;margin-right:-6px}.check{color:var(--lime);position:absolute;top:6px;right:6px}.compact{align-self:stretch}.idleGrid{grid-template-columns:1fr 1fr;gap:7px;display:grid}.idleGrid button{text-align:left;cursor:pointer;background:#0b090e;border:1px solid #ffffff10;border-radius:8px;align-items:center;gap:9px;padding:10px;display:flex}.idleGrid button.selected{background:#c7ff5e08;border-color:#c7ff5e45}.idleGrid i{border:1px solid #ffffff20;border-radius:6px;flex:none;width:25px;height:25px}.transparentSwatch{background:repeating-conic-gradient(#ddd 0 25%, #777 0 50%) 50% / 9px 9px}.greenSwatch{background:#0f0}.idleGrid strong,.idleGrid small{display:block}.idleGrid strong{font-size:9px}.idleGrid small{color:#716b78;margin-top:2px;font-size:8px}.sourceCard{background:linear-gradient(145deg,#22182e,#15101c);border-color:#8b5cf635;flex-direction:column;min-width:0;display:flex}.urlLabel{color:#958d9f;letter-spacing:.13em;justify-content:space-between;font-size:8px;font-weight:850;display:flex}.ready{color:var(--lime)}.sourceCard code{color:#d9d2df;word-break:break-all;flex:1;padding:16px 0;font-size:9px;line-height:1.55;display:block;overflow:hidden}.sourceCard button{background:var(--lime);color:#0b0910;cursor:pointer;border:0;border-radius:8px;justify-content:center;align-items:center;gap:7px;padding:10px;font-size:10px;font-weight:900;display:flex}.sourceCard>a{color:#aaa3b4;justify-content:center;align-items:center;gap:6px;margin-top:10px;font-size:9px;display:flex}.how{width:min(1220px,100% - 40px);margin:0 auto 110px}.sectionHead{border-bottom:1px solid var(--line);justify-content:space-between;align-items:end;padding-bottom:24px;display:flex}.sectionHead>div>span{color:var(--lime);letter-spacing:.17em;font-size:9px;font-weight:900}.sectionHead h2{letter-spacing:-.045em;margin:7px 0 0;font-size:39px}.sectionHead p{max-width:400px;color:var(--muted);margin:0;font-size:13px;line-height:1.55}.steps{grid-template-columns:repeat(3,1fr);gap:12px;margin-top:25px;display:grid}.steps>div{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:22px}.steps b{background:var(--lime);color:#0b0910;border-radius:7px;place-items:center;width:27px;height:27px;font-size:11px;display:grid}.steps span,.steps small{display:block}.steps span{margin-top:17px;font-weight:800}.steps small{color:#777180;margin-top:4px;font-size:10px}.shell>footer{border-top:1px solid var(--line);color:#6f6977;align-items:center;gap:28px;width:min(1220px,100% - 40px);margin:auto;padding:32px 0 42px;font-size:10px;display:flex}.shell>footer p{flex:1}@media (max-width:900px){.nav{grid-template-columns:1fr auto}.navlinks{display:none}.studio{grid-template-columns:1fr}.widgetRail{border-right:0;border-bottom:1px solid var(--line);min-height:0}.widgetList{grid-template-columns:repeat(3,1fr)}.widgetList button{grid-template-columns:auto 1fr}.widgetList button>i,.widgetList em,.railFoot{display:none}}@media (max-width:680px){.intro{margin-top:48px}.workspace{padding:15px}.workspaceHead{align-items:end;gap:12px}.workspaceHead h2{font-size:20px}.optionGrid,.steps{grid-template-columns:1fr}.previewPanel{aspect-ratio:4/3}.sectionHead p{display:none}.widgetList{grid-template-columns:1fr}.widgetList button{grid-template-columns:auto 1fr auto}.widgetList button>i{display:block}}@media (max-width:440px){.nav,.intro,.studio,.how,.shell>footer{width:min(100% - 24px,1220px)}.intro h1{font-size:49px}.previewBar span:last-child{display:none}.presetGrid,.idleGrid{grid-template-columns:1fr}.demoButton{padding:9px}.demoButton svg{display:none}.shell>footer{flex-direction:column;align-items:start;gap:4px}}