.hero{min-height:100svh;padding:calc(var(--hdr) + env(safe-area-inset-top,0px) + clamp(28px,6vh,72px))0 clamp(36px,6vh,64px);flex-direction:column;display:flex;position:relative;overflow:hidden}.hero-in{flex-direction:column;flex:1;justify-content:flex-end;display:flex;position:relative;container:hero/inline-size}.hero-title{--wd:100;z-index:3;margin-bottom:clamp(24px,4vh,44px);font-size:clamp(1.9rem,9cqi,9rem);position:relative}.hero-title .line{white-space:nowrap;margin-bottom:-.09em;padding:.02em 0 .09em;display:block;overflow:hidden}.hero-title .char{display:inline-block}.hero-foot{z-index:3;grid-template-columns:minmax(0,34em) auto;align-items:end;gap:24px 48px;display:grid;position:relative}.hero-foot .lead{color:var(--lilac);margin:0}.hero-stage{z-index:1;perspective:1200px;width:min(46vw,620px);height:78%;position:absolute;top:0;right:0}.ms{aspect-ratio:4/5;width:clamp(190px,21vw,300px);font-family:var(--body);transform-style:preserve-3d;border-radius:16px;flex-direction:column;gap:10px;padding:16px;display:flex;position:absolute;overflow:hidden;box-shadow:0 40px 90px -20px #040010bf}.ms-top{justify-content:space-between;align-items:center;font-size:.72rem;font-weight:700;display:flex}.ms-top i{opacity:.7;border-top:2px solid;border-bottom:2px solid;width:34px;height:8px;display:block}.ms-title{font-family:var(--display);font-variation-settings:"wdth" 88,"wght" 780;font-size:clamp(1.05rem,1.6vw,1.5rem);line-height:1.02}.ms-btn{border-radius:999px;align-self:flex-start;padding:7px 12px;font-size:.68rem;font-weight:700}.ms-art{border-radius:10px;flex:1;position:relative;overflow:hidden}.ms-a{color:#0e3b35;background:#e8f3ef;top:8%;left:4%}.ms-a .ms-btn{color:#fff;background:#1f8a72}.ms-a .ms-art{background:#cfe7df}.ms-a .ms-art:before{content:"";aspect-ratio:1;background:#1f8a72;border-radius:50%;width:62%;position:absolute;bottom:-24%;left:-12%}.ms-a .ms-art:after{content:"";aspect-ratio:1;background:#f4b9a6;border-radius:50%;width:36%;position:absolute;top:16%;right:12%}.ms-b{color:#fbe7d3;z-index:2;background:#2a0f0b;top:0;left:38%}.ms-b .ms-btn{color:#fff;background:#e5553a}.ms-b .ms-art{background:#471a13}.ms-b .ms-art:before{content:"";aspect-ratio:1;background:#e5553a;border:10px solid #fbe7d3;border-radius:50%;width:70%;position:absolute;top:10%;left:15%}.ms-c{color:#ede4d0;z-index:3;background:#0f1b2e;top:42%;left:18%}.ms-c .ms-btn{color:#0f1b2e;background:#c9a25a}.ms-c .ms-art{background:repeating-linear-gradient(90deg,#1b2b45 0 14%,#0f1b2e 14% 20%)}.ms-c .ms-art:after{content:"";background:#c9a25a;height:18%;position:absolute;top:0;left:0;right:0}.hero-orbit{z-index:4;width:92px;position:absolute;bottom:6%;right:6%}.scroll-cue{color:var(--mute);align-items:center;gap:12px;font-size:.92rem;display:flex}.scroll-cue i{background:var(--ink-line);width:1.5px;height:42px;display:block;position:relative;overflow:hidden}.scroll-cue i:after{content:"";background:var(--flame);width:100%;height:40%;animation:cue 1.8s var(--ease)infinite;position:absolute;top:-40%;left:0}@keyframes cue{to{top:100%}}@media (max-width:900px){.hero-stage{order:-1;width:100%;height:clamp(260px,62vw,380px);margin-bottom:8px;position:relative}.ms{width:44vw}.ms-a{top:10%;left:0}.ms-b{top:0;left:30%}.ms-c{top:22%;left:52%}.hero-foot{grid-template-columns:minmax(0,1fr)}.hero-orbit{display:none}}.build{background:var(--ink);overflow:hidden}.build-in{min-height:100vh;padding-block:calc(var(--hdr) + 24px)40px;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:clamp(28px,5vw,72px);display:grid}.build-copy .h2{margin-bottom:28px}.stages{gap:6px;margin:0;padding:0;list-style:none;display:grid;position:relative}.stage{border-top:1px solid var(--ink-line);opacity:.38;grid-template-columns:44px 1fr;gap:14px;padding:14px 0;transition:opacity .4s;display:grid}.stage.on{opacity:1}.stage .n{font-family:var(--display);font-variation-settings:"wdth" 100,"wght" 800;background:var(--ink-3);border-radius:50%;place-items:center;width:36px;height:36px;font-size:1.05rem;transition:background-color .4s,color .4s;display:grid}.stage.on .n{background:var(--flame);color:var(--ink)}.stage h3{font-size:1.25rem;font-family:var(--display);font-variation-settings:"wdth" 100,"wght" 750;margin:4px 0}.stage p{color:var(--mute);max-width:30em;margin:0;font-size:.98rem}.build-bar{background:var(--ink-line);border-radius:3px;height:3px;margin-top:18px;overflow:hidden}.build-bar i{background:var(--flame);transform-origin:0;height:100%;display:block;transform:scaleX(0)}.browser{background:var(--ink-2);box-shadow:0 50px 120px -30px #000000b3,0 0 0 1px var(--ink-line);border-radius:18px;position:relative;overflow:hidden;container:br/inline-size}.br-bar{background:var(--ink-3);align-items:center;gap:8px;height:44px;padding:0 14px;display:flex}.br-bar>i{background:var(--ink-line);border-radius:50%;flex:none;width:11px;height:11px}.br-url{background:var(--ink-2);min-width:0;max-width:340px;height:28px;color:var(--mute);white-space:nowrap;border-radius:8px;flex:1;align-items:center;gap:8px;margin-left:10px;padding:0 12px;font-size:.8rem;display:flex;overflow:hidden}.br-url svg{opacity:0;flex:none;width:12px;height:12px}.br-live{color:#7fe3c4;transform-origin:100%;background:#35d29a24;border-radius:999px;flex:none;align-items:center;gap:7px;margin-left:auto;padding:5px 11px;font-size:.76rem;font-weight:700;display:flex}.br-live i{background:#35d29a;border-radius:50%;width:8px;height:8px;animation:1.6s infinite ping;box-shadow:0 0 #35d29a99}@keyframes ping{70%{box-shadow:0 0 0 9px #35d29a00}to{box-shadow:0 0 #35d29a00}}.br-view{aspect-ratio:16/10.4;font-family:var(--body);color:#1f3b2e;background-color:#1d0d40;background-image:linear-gradient(#d9c8ff12 1px,#0000 1px),linear-gradient(90deg,#d9c8ff12 1px,#0000 1px);background-size:24px 24px;grid-template-rows:auto 1fr auto;grid-template-columns:1.15fr 1fr;gap:2cqi;padding:3cqi;display:grid;position:relative}.br-code{z-index:4;color:#cbb8ff;background:#0c0420;flex-direction:column;justify-content:center;width:100%;padding:3cqi 3cqi 3cqi 6cqi;font:500 max(7px,1.45cqi)/1.7 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;display:flex;position:absolute;top:0;bottom:0;right:0}.br-code .in{padding-left:2.2em}.br-code div{white-space:pre;min-height:1.7em}.br-code .t{color:var(--flame)}.br-code .a{color:#7fe3c4}@container br (max-width:540px){.br-view{aspect-ratio:auto;height:clamp(300px,calc(100svh - var(--hdr) - 330px),480px);grid-template-rows:auto auto 1fr auto;grid-template-columns:minmax(0,1fr);gap:3cqi;padding:4cqi}.br-code{width:100%;padding:5cqi;font-size:max(8px,2.9cqi)}.br-live{padding:4px 9px;font-size:.7rem}}@media (max-width:900px){.build-in{grid-template-columns:minmax(0,1fr);align-content:start;gap:22px;min-height:0;padding-block:clamp(64px,14vw,96px)}.build-copy .h2{margin-bottom:12px;font-size:clamp(1.9rem,8.4vw,2.6rem)}.stage p{font-size:.92rem}.stages{height:132px}.stage{opacity:0;border-top:0;padding:0;position:absolute;inset:0 0 auto}.stage.on{opacity:1}}.build-ctl{display:none}@media (max-width:900px){.browser{touch-action:pan-y}.build-ctl{justify-content:space-between;align-items:center;gap:12px;display:flex}.build-ctl button{cursor:pointer;background:var(--ink-3);color:#fff;width:48px;height:48px;transition:background-color .25s,color .25s,opacity .25s,transform .2s var(--ease);border:0;border-radius:50%;flex:none;place-items:center;padding:0;display:grid}.build-ctl .next{background:var(--flame);color:var(--ink)}.build-ctl button:active:not(:disabled){transform:scale(.92)}.build-ctl button:disabled{opacity:.3;cursor:default}.build-ctl button svg{width:20px;height:20px}.build-ctl .prev svg{transform:rotate(180deg)}.build-ctl-lbl{color:var(--mute);text-align:center;font-size:.95rem}.build-ctl-lbl b{color:#fff;font-family:var(--display);font-variation-settings:"wdth" 100,"wght" 800;margin-right:2px}.build-bar i{transition:transform .6s var(--ease)}}.mq{background:var(--violet);color:#fff;padding-block:clamp(36px,6vw,64px);overflow:hidden}.mq-row{will-change:transform;width:max-content;display:flex}.mq-row+.mq-row{margin-top:6px}.mq-row span{font-family:var(--display);font-variation-settings:"wdth" 118,"wght" 850;white-space:nowrap;align-items:center;gap:clamp(18px,3vw,40px);padding-right:clamp(18px,3vw,40px);font-size:clamp(2rem,6vw,5.2rem);line-height:1.05;display:flex}.mq-row.out span{color:#0000;-webkit-text-stroke:1.5px #ffffffbf}.mq-row svg{flex:none;width:.6em;height:.6em}.drows{border-top:1px solid var(--sheet-line);margin-top:clamp(40px,6vw,72px)}.drow{border-bottom:1px solid var(--sheet-line);grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 44px;align-items:center;gap:24px;padding:clamp(20px,3vw,34px) 0;text-decoration:none;display:grid;position:relative}.drow-t{font-family:var(--display);font-variation-settings:"wdth" var(--dw,90),"wght" 800;font-size:clamp(1.5rem,3.6vw,3rem);line-height:1;transition:color .3s}.drow-d{color:var(--sheet-mute);max-width:30em;font-size:1rem}.drow-go{width:44px;height:44px;box-shadow:inset 0 0 0 1.5px var(--sheet-line);border-radius:50%;place-items:center;transition:background-color .3s,box-shadow .3s;display:grid}.drow-go svg{width:18px;height:18px}.drow:hover .drow-t{color:var(--sheet-accent)}.drow:hover .drow-go{background:var(--flame);box-shadow:none;color:var(--ink)}@media (max-width:760px){.drow{grid-template-columns:1fr 44px}.drow-d{grid-area:2/1/auto/2}.drow-go{grid-area:1/2/3}.dprev{display:none}}.ba{aspect-ratio:16/9.4;--pos:50%;box-shadow:0 0 0 1px var(--ink-line);-webkit-user-select:none;user-select:none;border-radius:20px;margin-top:clamp(36px,5vw,60px);position:relative;overflow:hidden;container:ba/inline-size}.ba-side{position:absolute;inset:0}.ba-new{clip-path:inset(0 0 0 var(--pos))}@media (max-width:700px){.ba{aspect-ratio:3/4.4}}.ba-old{color:#000;background:#c3c3c3;padding:clamp(10px,2vw,22px);font-family:Times New Roman,Times,serif;overflow:hidden}.ba-old .o-head{color:#ff0;text-align:center;background:navy;border:3px outset #fff;padding:6px;font-size:clamp(.8rem,2vw,1.6rem);font-weight:700}.ba-old .o-mq{color:red;white-space:nowrap;background:#fff;margin:6px 0;padding:3px 0;font-size:clamp(.55rem,1vw,.85rem);overflow:hidden}.ba-old .o-mq span{padding-left:100%;animation:9s linear infinite om;display:inline-block}@keyframes om{to{transform:translate(-100%)}}.ba-old table{border-collapse:collapse;width:100%;font-size:clamp(.5rem,1vw,.9rem)}.ba-old td{vertical-align:top;background:#e6e6e6;border:2px solid gray;padding:6px}.ba-old td:first-child{width:28%}.ba-old a{color:#00e;text-decoration:underline;display:block}.ba-old .o-img{aspect-ratio:4/3;color:#555;background:#999;border:2px inset #fff;place-items:center;width:100%;font-size:clamp(.5rem,.9vw,.8rem);display:grid}.ba-old .o-foot{text-align:center;margin-top:6px;font-size:clamp(.45rem,.8vw,.7rem)}.ba-old .o-count{color:#0f0;background:#000;margin:0 4px;padding:1px 6px;font-family:monospace;display:inline-block}.ba-new{background:#fcf8f9}.ba-shot{object-fit:cover;object-position:top left;width:100%;height:100%;position:absolute;inset:0}@media (min-width:701px){.ba{aspect-ratio:1644/800}}.ba-tag{z-index:3;color:#fff;background:#12072adb;border-radius:8px;padding:7px 12px;font-size:.8rem;font-weight:700;position:absolute;bottom:14px}.ba-tag.l{left:14px}.ba-tag.r{background:var(--violet);right:14px}.ba-handle{top:0;bottom:0;left:var(--pos);z-index:4;pointer-events:none;background:#fff;width:3px;margin-left:-1.5px;position:absolute}.ba-handle i{background:var(--flame);border-radius:50%;place-items:center;width:54px;height:54px;margin:-27px 0 0 -27px;display:grid;position:absolute;top:50%;left:50%;box-shadow:0 10px 30px #00000059}.ba-handle svg{width:24px;height:24px;color:var(--ink)}.ba-range{opacity:0;cursor:ew-resize;z-index:5;appearance:none;width:100%;height:100%;margin:0;position:absolute;inset:0}.ba-range:focus-visible+.ba-handle i{outline-offset:3px;outline:3px solid #fff}.br-view.is-shot{aspect-ratio:1280/705;height:auto;padding:0;display:block}.is-shot>.wf{z-index:1;border:1.5px dashed var(--lilac);background:#d9c8ff0f;border-radius:1.2cqi;position:absolute}.br-shot{z-index:2;clip-path:inset(0 100% 0 0);position:absolute;inset:0;overflow:hidden}.br-shot img{object-fit:cover;object-position:top left}.ms.is-shot{background:var(--ink-2);outline-offset:-1px;outline:1px solid #ffffff14;gap:0;padding:0}.ms.is-shot img{object-fit:cover;object-position:top center}@media (min-width:901px){.hero-in{grid-template-rows:1fr auto auto 1fr;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);column-gap:clamp(24px,4vw,64px);display:grid}.hero-title{grid-area:2/1;font-size:5.4cqi}.hero-foot{grid-area:3/1;grid-template-columns:minmax(0,1fr);gap:28px}.hero-stage{grid-area:1/2/5;align-self:center;width:100%;height:clamp(380px,58vh,560px);position:relative;top:auto;right:auto}.ms{width:clamp(170px,15.5vw,250px)}.ms-a{top:9%;left:0}.ms-b{top:0;left:40%}.ms-c{top:33%;left:17%}.hero-orbit{bottom:4%;right:-2%}}.br-paper{z-index:0;opacity:0;background:#f6f6f4;position:absolute;inset:0}.is-shot>.cf{z-index:1;clip-path:inset(0 100% 0 0);display:flex;position:absolute}.cf i{flex:none;display:block}.cf-nav{background:#ffc400;justify-content:space-between;align-items:center;padding:0 9% 0 12%;box-shadow:0 .4cqi 1.4cqi #00000014}.cf-nav .lg{background:linear-gradient(#141414 0 58%,#e3202a 58% 100%);border-radius:.4cqi;width:8%;height:48%}.cf-nav .mn{background:repeating-linear-gradient(90deg,#1414148c 0 15%,#0000 15% 20%);border-radius:999px;width:33%;height:22%}.cf-nav .bt{background:#141414;border-radius:999px;width:6.8%;height:42%}.cf-pill{background:#fff;border-radius:999px;align-items:center;gap:6%;padding:0 5%;box-shadow:0 0 0 1px #e4e4e0}.cf-pill i:first-child{background:#ffc400;border-radius:999px;width:30%;height:56%}.cf-pill i:last-child{background:#9a9a96;border-radius:999px;width:50%;height:30%}.cf-title{flex-direction:column;justify-content:space-between;padding:1% 0}.cf-title i{background:#141414;border-radius:.7cqi;height:24%}.cf-title i:first-child{width:77%}.cf-title i:nth-child(2){width:81%}.cf-title i:nth-child(3){width:100%;box-shadow:0 .9cqi 0 -.2cqi #ffc400}.cf-text{flex-direction:column;justify-content:space-evenly}.cf-text i{background:#c9c9c4;border-radius:999px;height:14%}.cf-text i:first-child{width:92%}.cf-text i:nth-child(2){width:100%}.cf-text i:nth-child(3){width:58%}.cf-btns{background:#ffc400;border-radius:999px;justify-content:flex-end;align-items:center;padding-right:3%;box-shadow:0 1cqi 2cqi -1cqi #a078008c}.cf-btns i:first-child{opacity:.85;background:#141414;border-radius:999px;width:60%;height:24%;position:absolute;left:8%}.cf-btns i:last-child{aspect-ratio:1;background:#141414;border-radius:50%;height:78%}.cf-img{background:linear-gradient(#3b3e44 0 44%,#6d737b 44% 100%);border-radius:2.2cqi;overflow:hidden;box-shadow:0 1.6cqi 3cqi -1.2cqi #00000059}.cf-img .car{background:#ededea;border-radius:40% 45% 12% 12%/60% 60% 14% 14%;height:44%;position:absolute;bottom:12%;left:8%;right:0}.cf-img .stripe{background:#ffc400;border-radius:.8cqi;height:11%;position:absolute;bottom:27%;left:12%;right:4%}.browser-col{flex-direction:column;align-items:center;min-width:0;display:flex}.browser-col>.browser{align-self:stretch}.build-hint{box-shadow:inset 0 0 0 1px var(--ink-line);color:var(--lilac);opacity:0;visibility:hidden;background:#d9c8ff0f;border-radius:999px;align-items:center;gap:12px;margin-top:20px;padding:9px 16px 9px 12px;font-size:.92rem;font-weight:600;display:inline-flex}.build-hint .mouse{width:18px;height:27px;box-shadow:inset 0 0 0 1.5px var(--lilac);border-radius:10px;flex:none;position:relative}.build-hint .mouse i{background:var(--flame);width:2.5px;height:6px;animation:wheel 1.6s var(--ease)infinite;border-radius:2px;margin-left:-1.25px;position:absolute;top:6px;left:50%}@keyframes wheel{0%{opacity:1;transform:translateY(0)}70%{opacity:0;transform:translateY(8px)}to{opacity:0;transform:translateY(0)}}@media (max-width:900px){.build-hint{display:none}}