@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap";:root{font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}:root{--background: #0a0a0f;--card: #12121a;--border: #1e1e2e;--primary: #22c55e;--primary-dim: rgba(34, 197, 94, .15);--accent: #3b82f6;--foreground: #f0f0f5;--muted: #71717a;--font-mono: "JetBrains Mono", "Fira Code", monospace}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,sans-serif;background:var(--background);color:var(--foreground);line-height:1.6;overflow-x:hidden}.app{min-height:100vh;position:relative;max-width:1000px;margin:0 auto;padding:2rem}.grid-bg{position:fixed;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:50px 50px;pointer-events:none;z-index:0}.gradient-overlay{position:fixed;inset:0;background:linear-gradient(to bottom,var(--background),transparent 30%,transparent 70%,var(--background));pointer-events:none;z-index:1}.glow-orb{position:fixed;border-radius:50%;filter:blur(100px);pointer-events:none;z-index:0}.glow-orb-1{width:400px;height:400px;background:var(--primary-dim);top:10%;left:20%}.glow-orb-2{width:300px;height:300px;background:#3b82f61a;bottom:20%;right:20%}.hero{position:relative;z-index:10;text-align:center;padding:4rem 0 3rem}.terminal-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--card);border:1px solid var(--border);border-radius:50px;font-family:var(--font-mono);font-size:.8rem;color:var(--muted);margin-bottom:1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.terminal-badge svg{color:var(--primary)}.hero h1{font-size:clamp(2.5rem,6vw,4rem);font-weight:700;line-height:1.1;margin-bottom:1.5rem;letter-spacing:-1px}.text-primary{color:var(--primary)}.glow-text{text-shadow:0 0 30px rgba(34,197,94,.5),0 0 60px rgba(34,197,94,.3)}.hero-subtitle{font-size:1.15rem;color:var(--muted);max-width:500px;margin:0 auto 2rem}.hero-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-bottom:2rem}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:8px;font-family:var(--font-mono);font-size:.9rem;font-weight:500;text-decoration:none;cursor:pointer;transition:all .3s ease;border:none}.btn-primary{background:var(--primary);color:#000}.btn-primary:hover{background:#16a34a}.glow-primary{box-shadow:0 0 20px #22c55e66,0 0 40px #22c55e33}.btn-outline{background:transparent;color:var(--foreground);border:1px solid var(--border)}.btn-outline:hover{border-color:var(--primary);background:var(--primary-dim)}.star-count{display:flex;align-items:center;gap:.25rem;margin-left:.5rem;color:var(--primary)}.tech-badges{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.tech-badge{padding:.4rem .8rem;background:var(--card);border:1px solid var(--border);border-radius:6px;font-family:var(--font-mono);font-size:.75rem;color:var(--muted)}.tabs{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin:2rem 0;position:relative;z-index:10}.tab{display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;background:transparent;border:1px solid var(--border);border-radius:8px;color:var(--muted);font-size:.85rem;cursor:pointer;transition:all .3s ease}.tab:hover{border-color:var(--primary);color:var(--foreground)}.tab.active{background:var(--primary);border-color:var(--primary);color:#000}.tab svg{width:16px;height:16px}.content{position:relative;z-index:10}.panel{display:none;animation:fadeIn .4s ease}.panel.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.section-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem}.section-header h2{font-size:1.5rem;font-weight:600}.panel p{color:var(--muted);margin-bottom:1rem}.highlight{color:var(--primary);font-weight:500}.feature-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-top:1.5rem}.feature-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1.25rem;text-align:center;transition:all .3s ease}.feature-card:hover{border-color:var(--primary);transform:translateY(-3px)}.feature-icon{font-size:1.5rem;margin-bottom:.5rem}.feature-card strong{display:block;font-size:.9rem;margin-bottom:.25rem}.feature-card span{font-size:.8rem;color:var(--muted)}.features-list{display:flex;flex-direction:column;gap:.75rem}.feature-item{display:flex;gap:.75rem;padding:1rem;background:var(--card);border:1px solid var(--border);border-radius:10px}.feature-item div strong{display:block;margin-bottom:.25rem}.feature-item p{margin:0;font-size:.9rem}.architecture-box{margin-top:1.5rem;padding:1.25rem;background:var(--card);border:1px solid var(--border);border-radius:10px}.architecture-box h3{display:flex;align-items:center;gap:.5rem;font-size:.9rem;margin-bottom:1rem;color:var(--primary)}.flow-steps{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:center}.flow-step{padding:.5rem .75rem;background:var(--primary-dim);border:1px solid var(--primary);border-radius:6px;font-family:var(--font-mono);font-size:.75rem;color:var(--primary)}.flow-arrow{color:var(--muted);font-family:var(--font-mono)}.tech-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:1.5rem}.tech-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1.25rem;text-align:center;transition:all .3s ease}.tech-card:hover{border-color:var(--primary)}.tech-icon{font-size:2rem;display:block;margin-bottom:.5rem}.tech-card strong{display:block;margin-bottom:.25rem}.tech-card span{font-size:.8rem;color:var(--muted)}.dependencies-box{padding:1rem;background:var(--card);border:1px solid var(--border);border-radius:10px}.dependencies-box h3{font-size:.9rem;margin-bottom:.75rem;color:var(--muted)}.dep-list{display:flex;gap:.5rem;flex-wrap:wrap}.dep-list code{padding:.3rem .6rem;background:var(--primary-dim);border-radius:4px;font-family:var(--font-mono);font-size:.8rem;color:var(--primary)}.terminal-window{background:#0d0d12;border:1px solid var(--border);border-radius:12px;overflow:hidden}.terminal-header{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:var(--card);border-bottom:1px solid var(--border)}.terminal-dots{display:flex;gap:.4rem}.terminal-dots span{width:12px;height:12px;border-radius:50%;background:var(--border)}.terminal-dots span:nth-child(1){background:#ff5f56}.terminal-dots span:nth-child(2){background:#ffbd2e}.terminal-dots span:nth-child(3){background:#27c93f}.terminal-title{flex:1;text-align:center;font-family:var(--font-mono);font-size:.75rem;color:var(--muted)}.terminal-body{padding:1rem}.command-line{margin-bottom:1rem}.command-line:last-child{margin-bottom:0}.comment{display:block;font-family:var(--font-mono);font-size:.8rem;color:var(--muted);margin-bottom:.25rem}.command{display:flex;align-items:center;gap:.5rem;padding:.6rem .75rem;background:#ffffff08;border-radius:6px}.prompt{color:var(--primary);font-family:var(--font-mono);font-weight:700}.command code{flex:1;font-family:var(--font-mono);font-size:.85rem;color:var(--foreground);background:none}.copy-btn{background:none;border:none;color:var(--muted);cursor:pointer;padding:.25rem;transition:color .2s}.copy-btn:hover{color:var(--primary)}.note-box{margin-top:1.5rem;padding:1rem;background:var(--primary-dim);border-left:3px solid var(--primary);border-radius:0 8px 8px 0;font-size:.9rem}.note-box code{background:#0000004d;padding:.15rem .4rem;border-radius:4px;font-family:var(--font-mono);font-size:.85rem}.footer{text-align:center;padding:2rem 0;color:var(--muted);font-size:.85rem;position:relative;z-index:10}@media(max-width:600px){.app{padding:1rem}.hero h1{font-size:2rem}.hero-buttons{flex-direction:column;align-items:center}.btn{width:100%;justify-content:center}.tab{padding:.5rem .75rem;font-size:.8rem}.flow-arrow{display:none}.flow-steps{flex-direction:column}}
