:root{font-synthesis:none;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:#000;margin:0}a{color:inherit;text-decoration:none}.inline-link{text-underline-offset:3px;text-decoration:underline}button,select{font:inherit}.site-shell{transition:background-color .25s,color .25s;background-color:var(--showcase-background)!important;color:var(--showcase-text)!important}.site-shell[data-theme=red]{--showcase-accent:#a81d1d;--showcase-background:#fff;--showcase-text:#000}.site-shell[data-theme=blue]{--showcase-accent:#10106b;--showcase-background:#fff;--showcase-text:#000}.site-shell[data-theme=red_dark]{--showcase-accent:#fc2b2b;--showcase-background:#000;--showcase-text:#fff}.site-shell[data-theme=blue_dark]{--showcase-accent:#2323f7;--showcase-background:#000;--showcase-text:#fff}.brand-mark,.accent-text,.eyebrow,.kicker,.section-heading>span{color:var(--showcase-accent)}.nav{z-index:20;border-bottom:1px solid color-mix(in srgb, currentColor 14%, transparent);background:color-mix(in srgb, currentColor 3%, transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);grid-template-columns:1fr auto 1fr;align-items:center;min-height:72px;padding:12px clamp(20px,5vw,76px);display:grid;position:sticky;top:0}.brand{letter-spacing:-.03em;justify-self:start;align-items:center;gap:10px;font-weight:700;display:flex}.brand-mark{border:1px solid;border-radius:50%;place-items:center;width:34px;height:34px;font-size:12px;display:grid}nav{gap:28px;font-size:13px;display:flex}nav a{opacity:.66}nav a:hover{opacity:1}.theme-select{text-transform:uppercase;letter-spacing:.1em;justify-self:end;align-items:center;gap:8px;font-size:12px;display:flex}.theme-select select{color:inherit;border:2px solid var(--showcase-accent);background:0 0;border-radius:999px;padding:8px 12px}.section{width:min(1180px,100% - 40px);margin:0 auto;padding:110px 0}.hero{align-content:center;gap:28px;min-height:800px;display:grid;position:relative;overflow:hidden}.hero:after{content:"";border:1px solid color-mix(in srgb,currentColor 14%,transparent);width:600px;height:600px;box-shadow:0 0 0 80px color-mix(in srgb,currentColor 2%,transparent),0 0 0 160px color-mix(in srgb,currentColor 2%,transparent);pointer-events:none;border-radius:50%;position:absolute;top:60px;right:-180px}.eyebrow,.kicker,.section-heading>span{text-transform:uppercase;letter-spacing:.16em;opacity:.7;font-size:11px;font-weight:700}.eyebrow{align-items:center;gap:10px;display:flex}.pulse{background:var(--showcase-accent);width:8px;height:8px;box-shadow:0 0 0 5px color-mix(in srgb,var(--showcase-accent) 18%,transparent);border-radius:50%}.hero h1{letter-spacing:-.075em;z-index:2;max-width:860px;margin:0;font-size:clamp(64px,10vw,126px);line-height:.88;position:relative}.accent-text{opacity:1}.hero-copy{max-width:600px;font-size:19px;line-height:1.6}.hero-card{border-top:1px solid color-mix(in srgb,currentColor 18%,transparent);grid-template-columns:1fr 1.3fr;gap:30px;margin-top:30px;padding-top:22px;display:grid}.hero-card-grid{grid-template-columns:auto 1fr;align-content:start;gap:6px 14px;display:grid}.hero-card-grid span{font-size:24px;font-weight:700}.hero-card-grid small{text-transform:uppercase;letter-spacing:.12em;opacity:.55;align-self:center}.forced-theme,.theme-card{border-style:solid;border-width:1px;border-radius:20px;gap:12px;padding:24px}.section-heading{border-bottom:1px solid color-mix(in srgb,currentColor 18%,transparent);grid-template-columns:1fr 2fr;align-items:end;margin-bottom:38px;padding-bottom:20px;display:grid}.section-heading h2{margin:0}.component-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.demo-card{border:1px solid color-mix(in srgb,var(--showcase-accent) 42%,transparent);background:color-mix(in srgb,var(--showcase-accent) 5%,var(--showcase-background));border-radius:24px;flex-direction:column;gap:20px;min-width:0;padding:clamp(22px,4vw,42px);display:flex}.demo-card.wide{grid-column:span 2;grid-template-columns:1fr 1.4fr;align-items:center;display:grid}.demo-copy{flex-direction:column;align-items:flex-start;gap:20px;display:flex}.icon-row{color:var(--showcase-accent);gap:14px;display:flex}.type-ramp{align-items:start!important}.type-ramp>*{margin:0}pre{color:#e8e9ee;white-space:pre-wrap;background:#0c0e13;border:1px solid #282c36;border-radius:14px;margin:0;padding:18px;font:12px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;overflow:auto}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em}.theme-grid{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.theme-card{flex-direction:column;height:100%;display:flex}.swatches{display:flex}.swatch{border:2px solid;border-radius:50%;width:32px;height:32px;margin-right:-6px}.swatch.surface{background:var(--surface)}.swatch.accent{background:var(--accent)}.swatch.ink{background:var(--color)}.install-grid,.publish-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.install-grid article,.publish-grid>div{border:1px solid color-mix(in srgb,currentColor 16%,transparent);border-radius:20px;flex-direction:column;gap:18px;padding:26px;display:flex}.example-label{letter-spacing:.12em;text-transform:uppercase;color:var(--showcase-accent);margin-top:8px;font-size:11px;font-weight:700}.install-grid pre{max-height:420px}.publish-grid{grid-template-columns:repeat(3,1fr)}ol{margin:0;padding-left:20px;line-height:1.8}footer{border-top:1px solid color-mix(in srgb,currentColor 16%,transparent);opacity:.65;justify-content:space-between;padding:30px clamp(20px,5vw,76px);font-size:12px;display:flex}@media (width<=900px){.nav{grid-template-columns:1fr auto}.nav nav{display:none}.hero-card,.demo-card.wide,.section-heading{grid-template-columns:1fr}.theme-grid{grid-template-columns:1fr 1fr}.publish-grid{grid-template-columns:1fr}.hero:after{opacity:.4}}@media (width<=640px){.theme-select span{display:none}.section{padding:72px 0}.hero{min-height:680px}.hero h1{font-size:clamp(54px,18vw,78px)}.component-grid,.install-grid,.theme-grid{grid-template-columns:1fr}.demo-card.wide{grid-column:auto}.nav{padding-inline:20px}.brand>span:last-child{display:none}footer{flex-direction:column;gap:12px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}