body.home{--gutter:24px;--panel-room:340px}@media (max-width:1100px){body.home{--panel-room:24px}}@media (max-width:600px){body.home{--gutter:16px;--panel-room:16px}}.hero{min-height:min(78vh,760px);padding:72px var(--panel-room) 72px var(--gutter);isolation:isolate;background:radial-gradient(120% 90% at 75% 30%, #2a5bd7 0%, #10224f 45%, var(--bg) 85%);flex-direction:column;justify-content:center;display:flex;position:relative;overflow:hidden}.hero-canvas{z-index:-2;width:100%;height:100%;position:absolute;inset:0}.hero:before{content:"";z-index:-1;background:linear-gradient(90deg, #16171ad1 0%, #16171a80 38%, #16171a00 70%), linear-gradient(180deg, #16171a00 60%, var(--bg) 100%);position:absolute;inset:0}.hero-text{max-width:560px;margin-left:max(0px,50% - 520px)}.hero h1{letter-spacing:-.035em;margin:0 0 12px;font-size:clamp(48px,9vw,84px);line-height:1}.hero .lede{color:var(--fg);margin:0 0 12px;font-size:clamp(20px,2.6vw,26px);font-weight:550;line-height:1.3}.hero p{color:#d2d5dc;text-shadow:0 1px 12px #00000080}.cta{flex-wrap:wrap;gap:10px;margin:26px 0 18px;display:flex}.button{height:40px;color:var(--fg);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffff14;border:1px solid #ffffff24;border-radius:8px;align-items:center;padding:0 18px;font-weight:600;display:inline-flex}.button:hover{background:#ffffff24;text-decoration:none}.button.primary{background:var(--accent);color:#0d1220;border-color:#0000}.button.primary:hover{filter:brightness(1.1);background:var(--accent)}.install{border:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#101114b8;border-radius:8px;align-items:center;max-width:100%;display:inline-flex}.install code{white-space:nowrap;overflow-wrap:normal;background:0 0;padding:8px 4px 8px 12px;overflow:auto}.copy{height:28px;color:var(--fg);font:inherit;cursor:pointer;background:#2a2d33;border:0;border-radius:5px;flex:none;margin:4px;padding:0 10px;font-size:13px}.copy:hover{background:#343841}.hero-hint{left:var(--gutter);right:var(--panel-room);margin:0;font-size:12.5px;position:absolute;bottom:18px;color:var(--muted)!important;text-shadow:none!important}.home-main{padding:0 var(--panel-room) 40px var(--gutter)}.home-main>section{max-width:1040px;margin:0 auto}.home-main h2{letter-spacing:-.01em;border-top:0;margin:64px 0 18px;padding:0;font-size:26px}.start{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:start;gap:40px;display:grid}.start h2{margin-top:48px}.start pre.code{tab-size:2;margin-top:48px;font-size:13px}@media (max-width:860px){.start{grid-template-columns:minmax(0,1fr);gap:0}.start pre.code{margin-top:8px}}.feature-groups{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;display:grid}@media (max-width:960px){.feature-groups{grid-template-columns:minmax(0,1fr)}}.feature-group h3{color:var(--faint);letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px;font-size:12px;font-weight:650}.feature{color:inherit;border-radius:8px;margin:0 -12px;padding:10px 12px;display:block}.feature:hover{background:var(--surface);text-decoration:none}.feature b{color:var(--fg);font-weight:600;display:block}.feature span{color:var(--muted);font-size:14px;line-height:1.5;display:block}.feature:hover b{color:var(--accent)}.demo-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;display:grid}.demo{background:var(--surface);border:1px solid var(--line);color:inherit;border-radius:12px;flex-direction:column;gap:6px;padding:0 0 16px;transition:border-color .12s,transform .12s;display:flex;overflow:hidden}.demo:hover{border-color:hsl(var(--hue) 70% 60% / .6);text-decoration:none;transform:translateY(-2px)}.demo>b,.demo>span{padding:0 16px}.demo>b{color:var(--fg);font-size:16px}.demo>span{color:var(--muted);font-size:14px;line-height:1.5}.demo-art{background:radial-gradient(60% 90% at 30% 70%, hsl(var(--hue) 80% 58% / .85), transparent 70%), radial-gradient(50% 70% at 55% 20%, hsl(calc(var(--hue) + 40) 80% 62% / .6), transparent 70%), hsl(var(--hue) 35% 12%);height:112px;margin-bottom:8px;position:relative;padding:0!important}.demo-art:after{content:"";background:linear-gradient(#ffffff2e, #ffffff2e) 10px 12px / 40% 4px no-repeat, linear-gradient(#ffffff1f, #ffffff1f) 10px 26px / 70% 4px no-repeat, linear-gradient(hsl(var(--hue) 80% 65%), hsl(var(--hue) 80% 65%)) 10px 40px / 50% 4px no-repeat, linear-gradient(#ffffff1f, #ffffff1f) 10px 54px / 62% 4px no-repeat, linear-gradient(#ffffff1f, #ffffff1f) 10px 68px / 45% 4px no-repeat, #141518d1;border-radius:6px;width:34%;position:absolute;top:14px;bottom:14px;right:14px;box-shadow:0 6px 18px #00000059}.tags{flex-wrap:wrap;gap:6px;margin-top:auto;display:flex;padding-top:6px!important}.tags i{color:#b9bdc6;background:#2a2d33;border-radius:999px;padding:1px 8px;font-size:12px;font-style:normal}.more{color:var(--muted);margin-top:18px;font-size:14px}.foot{padding:22px var(--panel-room) 32px var(--gutter);border-top:1px solid var(--line);color:var(--faint);flex-wrap:wrap;gap:8px 20px;margin-top:56px;font-size:13.5px;display:flex}.foot span{margin-right:auto}.foot a{color:var(--muted)}@media (max-width:600px){.hero{min-height:0;padding-top:48px;padding-bottom:56px}.install code{white-space:normal;overflow-wrap:anywhere;font-size:12px}.hero-hint{margin-top:18px;position:static}.foot{padding-bottom:55vh}}@media (prefers-reduced-motion:reduce){.demo,.demo:hover{transition:none;transform:none}}
