*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:system-ui,-apple-system,sans-serif;line-height:1.6;color:#1e293b;background:#f8fafc;font-size:16px}@media (min-width: 768px){body{font-size:17px}}.top-nav{position:sticky;top:0;z-index:100;background:#fffc;backdrop-filter:blur(10px);border-bottom:1px solid #e2e8f0;box-shadow:0 1px 3px #0000000d;transition:all .3s ease}.top-nav.transparent{background:#fff0;backdrop-filter:none;border-bottom-color:transparent;box-shadow:none}.top-nav.transparent .logo{opacity:0;transform:translateY(-100%)}.top-nav.transparent .nav-links a{opacity:.7}.nav-container{max-width:1104px;margin:0 auto;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center}@media (min-width: 768px){.nav-container{padding:1rem 2rem}}.logo{font-size:1.25rem;font-weight:800;background:linear-gradient(90deg,#4a9eff,#7a8ef7 40%,#ff85c1,#9b7ef7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-decoration:none;transition:all .3s ease;padding-left:80px;padding-right:80px;margin-left:-80px;margin-right:-80px}.nav-links{display:flex;gap:1.5rem;align-items:center}.nav-links a{color:#64748b;text-decoration:none;font-weight:500;transition:all .3s ease;font-size:.9375rem}.nav-links a:hover{color:#7a8ef7}body{position:relative;overflow-x:hidden}body:before{content:"";position:fixed;top:-100px;right:-100px;width:300px;height:300px;background:radial-gradient(circle,rgba(255,133,193,.15) 0%,rgba(255,133,193,.08) 40%,transparent 70%);border-radius:50%;pointer-events:none;z-index:0}.container{max-width:1200px;margin:0 auto;padding:1rem;position:relative;z-index:1}@media (min-width: 768px){.container{padding:2rem}}header{text-align:center;padding:3rem 1rem .5rem;margin:0 auto}@media (min-width: 768px){header{padding:4rem 1rem 3rem}}header>h1,header>.tagline{max-width:680px;margin-left:auto;margin-right:auto}h1{font-size:2.5rem;font-weight:800;background:linear-gradient(90deg,#4a9eff,#7a8ef7 40%,#ff85c1,#9b7ef7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}@media (min-width: 768px){h1{font-size:4rem;margin-bottom:.75rem}}.tagline{font-size:1.1875rem;color:#64748b;margin-bottom:1.25rem;font-weight:500;line-height:1.5}.tagline a{color:inherit;text-decoration:none;transition:color .2s ease}.tagline a:first-of-type:hover{color:#7a8ef7}.tagline a:last-of-type:hover{color:#e879b9}@media (min-width: 768px){.tagline{font-size:1.625rem;margin-bottom:1.5rem}}.hero-comparison{margin-top:2.5rem;background:#1e1b29;border-radius:12px;box-shadow:0 4px 6px #0000001a;overflow:hidden;margin-left:-1rem;margin-right:-1rem}@media (min-width: 768px){.hero-comparison{margin-top:3rem;margin-left:0;margin-right:0}}.hero-description{margin-top:2rem;font-size:1.125rem;line-height:1.7;color:#475569;max-width:680px;margin-left:auto;margin-right:auto}.hero-description a{color:#6366f1;text-decoration:none;border-bottom:1px solid #c7d2fe;transition:border-color .2s ease,color .2s ease}.hero-description a:hover{color:#4f46e5;border-bottom-color:#6366f1}@media (min-width: 768px){.hero-description{margin-top:2.5rem;font-size:1.25rem}}.alpha-disclaimer{margin-top:1.5rem;font-size:1rem;color:#64748b;max-width:680px;margin-left:auto;margin-right:auto;font-weight:500;display:flex;align-items:center;justify-content:center;gap:.625rem}.alpha-badge{display:inline-block;padding:.25rem .625rem;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-radius:6px;box-shadow:0 1px 3px #fbbf244d}@media (min-width: 768px){.alpha-disclaimer{font-size:1.125rem;margin-top:1.75rem}.alpha-badge{font-size:.8125rem;padding:.3125rem .75rem}}.hero-actions{display:flex;flex-direction:row;flex-wrap:wrap;gap:.75rem;margin-top:2.5rem;align-items:center;justify-content:center}@media (min-width: 640px){.hero-actions{gap:1rem}}.install-cta{display:inline-block;padding:.75rem 1.75rem;background:linear-gradient(135deg,#7a8ef7,#9483f7 70%,#b87ed8);color:#fff;text-decoration:none;border-radius:8px;font-weight:700;font-size:1.125rem;letter-spacing:.01em;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 1px #ffffff40 inset,0 -1px #0000001a inset,0 0 0 1px #7a8ef74d,0 2px 4px #7a8ef759,0 3px 6px #0000001a;border:none;position:relative}.install-cta:hover{background:linear-gradient(135deg,#7384e7,#8d7ce7 70%,#b175d1);box-shadow:0 1px #ffffff4d inset,0 -1px #0000001f inset,0 0 0 1px #7a8ef766,0 3px 6px #7a8ef766,0 4px 8px #0000001f}.install-cta:active{background:linear-gradient(135deg,#6a7ee5,#8473e5 70%,#a86ec8);box-shadow:0 0 0 1px #7a8ef780,0 1px 2px #0003 inset,0 2px 4px #00000026;transform:translateY(1px)}.star-btn{display:inline-flex;align-items:center;gap:.625rem;padding:.75rem 1.75rem;background:linear-gradient(180deg,#fff,#f8fafc);color:#334155;text-decoration:none;border-radius:8px;font-weight:700;font-size:1.125rem;letter-spacing:.01em;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 1px #fff9 inset,0 -1px #0000000d inset,0 0 0 1px #cbd5e1,0 2px 4px #00000014,0 3px 6px #0000000d;border:none}.star-btn:hover{background:linear-gradient(180deg,#fff,#f5f5f5);color:#1e293b;box-shadow:0 1px #ffffffb3 inset,0 -1px #0000000f inset,0 0 0 1px #94a3b8,0 3px 6px #0000001a,0 4px 8px #00000012}.star-btn:active{background:linear-gradient(180deg,#f5f5f5,#e5e7eb);box-shadow:0 0 0 1px #94a3b8,0 1px 2px #00000026 inset,0 2px 4px #00000014;transform:translateY(1px)}.star-icon{font-size:1.125rem;color:#fbbf24}@media (min-width: 768px){.install-cta{padding:.875rem 2.25rem;font-size:1.3125rem}.star-btn{padding:.875rem 2rem;font-size:1.3125rem}.star-icon{font-size:1.375rem}}.separator{height:1px;background:linear-gradient(to right,transparent,#e2e8f0 20%,#e2e8f0 80%,transparent);margin:4rem 0;border:none}@media (min-width: 768px){.separator{margin:5rem 0}}.install-section{margin:0;padding:0;scroll-margin-top:5rem}.install-section h2{text-align:left;font-size:1.75rem;margin-bottom:2rem;color:#1e293b;font-weight:700;max-width:700px;margin-left:auto;margin-right:auto}.install-notice{padding:1rem 1.5rem;background:linear-gradient(135deg,#fefce8,#fef3c7);border:2px solid #f59e0b;border-radius:10px;text-align:left}.notice-text{margin:0;font-size:1.0625rem;line-height:1.5;font-weight:700;color:#92400e}.install-grid{display:grid;grid-template-columns:1fr;gap:2.5rem;max-width:700px;margin:0 auto;padding:0}.install-step{position:relative;overflow:hidden}@media (min-width: 768px){.install-step{overflow:visible}}.step-number{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;background:linear-gradient(135deg,#7a8ef7,#ff85c1);color:#fff;border-radius:50%;font-weight:700;font-size:.9375rem;margin-bottom:1rem}.step-content{width:100%}@media (min-width: 768px){.step-number{position:absolute;left:-4rem;top:.125rem;width:2.5rem;height:2.5rem;font-size:1rem;margin-bottom:0}}.step-content h3{font-size:1.25rem;margin:0 0 1.25rem;color:#1e293b;font-weight:600}.step-content h3 a{color:inherit;text-decoration:none;border-bottom:1px solid #cbd5e1;transition:border-color .2s ease,color .2s ease}.step-content h3 a:hover{color:#6366f1;border-bottom-color:#6366f1}.step-description{margin-top:1rem;font-size:1rem;color:#64748b;line-height:1.7}.step-description a{color:#6366f1;text-decoration:none;border-bottom:1px solid #c7d2fe;transition:border-color .2s ease,color .2s ease}.step-description a:hover{color:#4f46e5;border-bottom-color:#6366f1}.install-box{background:#1e1b29;border-radius:8px;overflow:hidden;margin:0}.install-box-with-link{position:relative}.install-playground-link{position:absolute;top:.75rem;right:.75rem;z-index:10;display:inline-flex;align-items:center;justify-content:center;color:#94a3b8;transition:all .2s ease;text-decoration:none;opacity:.4;padding:.125rem}.install-playground-link:hover{color:#c7d2fe;opacity:1}.install-playground-link svg{width:1rem;height:1rem}.install-box+.step-description{margin-top:1.25rem}.install-box pre{margin:0;padding:.875rem 1rem;overflow-x:auto;background:transparent!important}.install-box code{font-family:Monaco,Menlo,monospace;font-size:.75rem!important;line-height:1.6}.install-box pre code,.install-box pre code *{font-size:inherit!important}@media (min-width: 768px){.install-section h2{font-size:2rem;margin-bottom:2rem}.install-notice{padding:1.5rem 2rem;border-width:2px}.notice-text{font-size:1.1875rem}.install-grid{gap:3.5rem}.step-content h3{font-size:1.375rem;margin-bottom:1.5rem}.step-description{font-size:1.0625rem}.install-box pre{padding:1rem 1.25rem}.install-box code{font-size:.8125rem!important}}.comparison,.hero-comparison{background:#1e1b29;border-radius:12px;box-shadow:0 4px 6px #0000001a;overflow:hidden}.comparison{margin:0 auto 2rem;max-width:100%}.comparison-content{position:relative;padding:.75rem;display:grid;grid-template-columns:1fr;gap:1.5rem}@media (min-width: 768px){.comparison-content{padding:1rem;grid-template-columns:1fr 1fr;gap:2rem}}.code-panel,.hero-panel{position:relative;min-width:0;overflow:hidden;text-align:left}.code-header,.hero-header{padding:.5rem 1rem;background:#252231;border-radius:8px 8px 0 0;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin:0;color:#94a3b8;display:flex;align-items:center;justify-content:space-between}.code-playground-link{display:inline-flex;align-items:center;justify-content:center;color:#94a3b8;transition:all .2s ease;text-decoration:none;opacity:.4;padding:.125rem}.code-playground-link:hover{color:#c7d2fe;opacity:1}.code-playground-link svg{width:1rem;height:1rem}.code-header a,.hero-header a{color:#94a3b8;text-decoration:none;transition:color .2s ease}.code-header a:hover,.hero-header a:hover{color:#cbd5e1}@media (min-width: 768px){.code-header,.hero-header{font-size:.8125rem;padding:.625rem 1rem}}.code-block,.hero-code{position:relative;text-align:left}.code-panel:last-child .code-block,.hero-panel:last-child .hero-code{overflow-y:auto;max-height:400px;-webkit-mask-image:linear-gradient(to bottom,black calc(100% - 100px),transparent 100%);mask-image:linear-gradient(to bottom,black calc(100% - 100px),transparent 100%)}body.outer-scrolling .code-panel:last-child .code-block,body.outer-scrolling .hero-panel:last-child .hero-code{pointer-events:none;overflow-y:hidden}@media (min-width: 768px){.code-panel:first-child,.hero-panel:first-child{position:relative;z-index:1}.code-panel:last-child,.hero-panel:last-child{position:absolute;top:1rem;bottom:1rem;right:1rem;left:calc(50% + 1rem)}.code-panel:last-child .code-block,.hero-panel:last-child .hero-code{max-height:none;height:100%;padding-bottom:1.5rem;-webkit-mask-image:linear-gradient(to bottom,black calc(100% - 150px),transparent 100%);mask-image:linear-gradient(to bottom,black calc(100% - 150px),transparent 100%)}body.outer-scrolling .code-panel:last-child .code-block,body.outer-scrolling .hero-panel:last-child .hero-code{pointer-events:none;overflow-y:hidden}}.code-block pre,.hero-code pre{margin:0;padding:1rem;background:transparent!important;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;max-width:100%}@media (min-width: 768px){.code-block pre,.hero-code pre{padding:1.5rem}}.code-block code,.hero-code code{font-family:Monaco,Menlo,monospace;font-size:.75rem!important;line-height:1.6;white-space:pre;text-align:left}@media (min-width: 768px){.code-block code,.hero-code code{font-size:.875rem!important}}.code-block pre code,.code-block pre code *,.hero-code pre code,.hero-code pre code *{font-size:inherit!important}section{margin:3rem 0 0}section h2{font-size:1.5rem;margin-bottom:1.5rem;text-align:left;color:#1e293b;font-weight:700;max-width:700px;margin-left:auto;margin-right:auto}@media (min-width: 768px){section{margin:4rem 0 0}section h2{font-size:2rem;margin-bottom:2.5rem}.code-playground-link svg{width:1.125rem;height:1.125rem}}.playground-section{margin:0}.playground-button{display:inline-block;padding:.875rem 2rem;background:linear-gradient(135deg,#7a8ef7,#9483f7 70%,#b87ed8);color:#fff;text-decoration:none;border-radius:8px;font-weight:700;font-size:1.0625rem;letter-spacing:.01em;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 1px #ffffff40 inset,0 -1px #0000001a inset,0 0 0 1px #7a8ef74d,0 2px 4px #7a8ef759,0 3px 6px #0000001a;border:none}.playground-button:hover{background:linear-gradient(135deg,#7384e7,#8d7ce7 70%,#b175d1);box-shadow:0 1px #ffffff4d inset,0 -1px #0000001f inset,0 0 0 1px #7a8ef766,0 3px 6px #7a8ef766,0 4px 8px #0000001f;transform:translateY(-1px)}.playground-button:active{background:linear-gradient(135deg,#6a7ee5,#8473e5 70%,#a86ec8);box-shadow:0 0 0 1px #7a8ef780,0 1px 2px #0003 inset,0 2px 4px #00000026;transform:translateY(1px)}@media (min-width: 768px){.playground-button{font-size:1.125rem;padding:1rem 2.5rem}}footer{text-align:center;padding:4rem 1rem 3rem;color:#64748b;margin-top:4rem}@media (min-width: 768px){footer{padding:5rem 1rem 4rem;margin-top:5rem}}