:root{--font-main: "Fira Code", monospace;--color-bg: #050505;--color-text: #ffffff;--color-text-dim: #888888;--color-accent: #ffffff;--color-border: #333333;--color-card-bg: rgba(20, 20, 20, .6);--color-card-hover: rgba(40, 40, 40, .8);--spacing-container: 1200px;--nav-height: 80px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-main);background-color:var(--color-bg);color:var(--color-text);overflow-x:hidden;line-height:1.6}#matrix-rain{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;opacity:.25}#app{position:relative;z-index:1}a{text-decoration:none;color:inherit;transition:.3s}.text-center{text-align:center}.navbar{position:fixed;top:0;left:0;width:100%;height:var(--nav-height);padding:0 2rem;background:#050505cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;z-index:100}.nav-container{width:100%;max-width:var(--spacing-container);display:flex;justify-content:space-between;align-items:center}.logo{font-weight:700;font-size:1.2rem;letter-spacing:-1px}.cursor{animation:blink 1s step-end infinite}.nav-links{display:flex;gap:2rem}.nav-links a{font-size:.9rem;color:var(--color-text-dim)}.nav-links a:hover,.nav-links a.github-link{color:var(--color-text)}.hero-section{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding-top:var(--nav-height)}.hero-content{max-width:800px;padding:0 1rem}.badge{display:inline-block;padding:4px 12px;border:1px solid var(--color-border);border-radius:20px;font-size:.75rem;margin-bottom:2rem;color:var(--color-text-dim);background:#ffffff0d}h1.glitch{font-size:3.5rem;font-weight:700;margin-bottom:1rem;position:relative;letter-spacing:-2px}.glitch:before,.glitch:after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;background:var(--color-bg)}.glitch:before{left:2px;text-shadow:-1px 0 #fff;clip:rect(24px,550px,90px,0);animation:glitch-anim-2 3s infinite linear alternate-reverse;opacity:.5}.glitch:after{left:-2px;text-shadow:-1px 0 #888;clip:rect(85px,550px,140px,0);animation:glitch-anim 2.5s infinite linear alternate-reverse;opacity:.5}@keyframes glitch-anim{0%{clip:rect(13px,9999px,86px,0)}to{clip:rect(38px,9999px,57px,0)}}@keyframes glitch-anim-2{0%{clip:rect(122px,9999px,6px,0)}to{clip:rect(78px,9999px,51px,0)}}@keyframes blink{50%{opacity:0}}.hero-description{font-size:1.1rem;color:var(--color-text-dim);margin-bottom:3rem;max-width:600px;margin-left:auto;margin-right:auto}.cta-group{display:flex;gap:1rem;justify-content:center}.btn{padding:12px 24px;font-weight:600;border-radius:4px;font-size:.9rem}.btn-primary{background:var(--color-text);color:var(--color-bg);border:1px solid var(--color-text)}.btn-secondary{background:transparent;color:var(--color-text);border:1px solid var(--color-border)}.btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #ffffff1a}section{padding:100px 2rem;max-width:var(--spacing-container);margin:0 auto}.section-header{margin-bottom:4rem;text-align:center}.section-header h2{font-size:2rem;margin-bottom:1rem}.line-separator{width:50px;height:2px;background:var(--color-text);margin:0 auto 1rem}.bento-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.bento-card{background:var(--color-card-bg);border:1px solid var(--color-border);padding:2rem;border-radius:12px;transition:.3s;display:flex;flex-direction:column;justify-content:flex-start}.bento-card:hover{background:var(--color-card-hover);border-color:var(--color-text);transform:translateY(-5px)}.bento-card.large{grid-column:span 2}.bento-card.wide{grid-column:span 3}.card-icon{font-size:2rem;margin-bottom:1rem}.bento-card h3{margin-bottom:.5rem;font-size:1.2rem}.bento-card p{color:var(--color-text-dim);font-size:.9rem}.step-container{display:flex;align-items:center;gap:4rem;margin-bottom:120px}.step-container.reverse{flex-direction:row-reverse}.step-content,.step-visual{flex:1}.step-number{font-size:4rem;font-weight:700;color:#222;display:block;line-height:1;margin-bottom:-10px}.step-content h3{font-size:1.8rem;margin-bottom:1rem}.step-content p{color:var(--color-text-dim)}.terminal-mockup{background:#0f0f0f;border:1px solid var(--color-border);border-radius:8px;overflow:hidden;box-shadow:0 20px 50px #00000080}.term-header{background:#1a1a1a;padding:10px;display:flex;gap:6px}.dot{width:10px;height:10px;border-radius:50%;background:#333}.term-body{padding:20px;font-family:var(--font-main);font-size:.85rem;color:#ccc;line-height:1.6}.accent{color:#fff}.dim{color:#555}.success{color:#fff}.danger{color:#fff;text-decoration:underline;text-decoration-style:wavy}.info{color:#aaa}.install-card{background:var(--color-card-bg);border:1px solid var(--color-border);padding:3rem;border-radius:12px;max-width:700px;margin:0 auto}.code-block{text-align:left;background:#000;padding:15px;border-radius:6px;margin-bottom:1.5rem;border:1px solid #222}.copy-row{display:flex;justify-content:space-between;align-items:center;margin-top:5px}.copy-btn{background:none;border:none;color:#555;cursor:pointer;font-size:1.2rem;transition:color .2s}.copy-btn:hover{color:#fff}footer{border-top:1px solid var(--color-border);padding:4rem 2rem 2rem;background:#000}.footer-content{max-width:var(--spacing-container);margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem;margin-bottom:3rem}.footer-col h4{margin-bottom:1.5rem;font-size:.9rem;letter-spacing:1px;text-transform:uppercase}.footer-col a{display:block;margin-bottom:.8rem;color:var(--color-text-dim);font-size:.9rem}.footer-col a:hover{color:#fff}.footer-bottom{text-align:center;color:#333;font-size:.8rem;padding-top:2rem;border-top:1px solid #111}.scroll-trigger{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}.scroll-trigger.visible{opacity:1;transform:translateY(0)}@media (max-width: 900px){.bento-grid{grid-template-columns:1fr}.bento-card.large,.bento-card.wide{grid-column:span 1}.step-container{flex-direction:column;text-align:left}.step-container.reverse{flex-direction:column}.hero-section h1{font-size:2.5rem}.footer-content{grid-template-columns:1fr}}
