*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;font-size:16px}body{font-family:Inter,Helvetica Neue,Arial,sans-serif;background:#0f1318;color:#e2e8f0;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.top-bar{position:fixed;top:0;left:0;right:0;height:4.5rem;z-index:100;display:flex;align-items:center;border-bottom:1px solid rgba(255,255,255,0);transition:background .3s ease,border-color .3s ease,backdrop-filter .3s ease}.top-bar.scrolled{background:#0f1318bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.08)}.nav-container{width:100%;max-width:72rem;margin:0 auto;padding:0 2rem;display:flex;justify-content:space-between;align-items:center}.nav-logo{display:flex;align-items:center;gap:.6rem;text-decoration:none;transition:transform .2s ease}.nav-logo:hover{transform:scale(1.02)}.nav-logo-img{width:24px;height:24px;object-fit:contain;filter:drop-shadow(0 0 4px rgba(255,255,255,.3))}.logo-text{font-weight:700;font-size:1.15rem;letter-spacing:-.01em;color:#fff}.nav-links{display:flex;align-items:center;gap:2rem}.nav-link{color:#94a3b8;text-decoration:none;font-size:.85rem;font-weight:500;letter-spacing:.02em;transition:color .2s ease}.nav-link:hover{color:#00b4d8}.github-btn{display:flex;align-items:center;gap:.4rem;padding:.45rem 1rem;border-radius:2rem;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);color:#e2e8f0;font-size:.8rem;font-weight:600;transition:background .2s ease,border-color .2s ease,color .2s ease}.github-btn:hover{background:#00b4d81f;border-color:#00b4d84d;color:#fff}.github-icon{width:14px;height:14px}.hero{position:relative;width:100%;height:100vh;height:100dvh;overflow:hidden;cursor:crosshair}.hero-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:3rem;pointer-events:none}.scroll-hint{display:flex;flex-direction:column;align-items:center;gap:.5rem;animation:float 2.5s ease-in-out infinite;pointer-events:auto;text-decoration:none}.scroll-hint span{font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:#ffffff59;font-weight:500;transition:color .2s ease}.scroll-hint:hover span{color:#90e0ef}.scroll-hint svg{width:1.25rem;height:1.25rem;stroke:#ffffff59;stroke-width:2;fill:none;transition:stroke .2s ease}.scroll-hint:hover svg{stroke:#90e0ef}@keyframes float{0%,to{transform:translateY(0);opacity:.6}50%{transform:translateY(8px);opacity:1}}.sandbox-slide-btn{position:absolute;right:0;top:50%;transform:translateY(-50%) translate(100%);background:#0f1318d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(0,180,216,.4);border-right:none;border-radius:.75rem 0 0 .75rem;color:#90e0ef;font-family:inherit;font-size:.95rem;font-weight:600;padding:1rem 1.5rem;display:flex;align-items:center;gap:.75rem;cursor:pointer;transition:transform .4s cubic-bezier(.175,.885,.32,1.275),background .2s ease,box-shadow .2s ease;pointer-events:auto;z-index:10}.sandbox-slide-btn.visible{transform:translateY(-50%) translate(0)}.sandbox-slide-btn:hover{background:#00b4d833;box-shadow:-5px 0 20px #00b4d833;color:#fff}.sandbox-slide-btn .btn-arrow{width:18px;height:18px;stroke:currentColor;stroke-width:2.5;fill:none;transition:transform .2s ease}.sandbox-slide-btn:hover .btn-arrow{transform:translate(4px)}.content{position:relative;z-index:1}.section{max-width:72rem;margin:0 auto;padding:7rem 2rem}.section+.section{border-top:1px solid rgba(255,255,255,.05)}.about-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:5rem;align-items:center}.about-label{display:inline-block;font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;color:#00b4d8;font-weight:600;margin-bottom:1rem}.about-heading{font-size:clamp(1.8rem,4vw,3rem);font-weight:700;line-height:1.2;color:#fff;margin-bottom:1.5rem;letter-spacing:-.01em}.about-text{color:#94a3b8;font-size:1.05rem;line-height:1.85;max-width:38rem}.about-stats{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.stat-card{background:#ffffff04;border:1px solid rgba(255,255,255,.05);border-radius:1rem;padding:2.25rem 1.5rem;transition:border-color .3s ease,background .3s ease,transform .3s ease}.stat-card:hover{border-color:#00b4d840;background:#00b4d808;transform:translateY(-2px)}.stat-number{font-size:2.25rem;font-weight:700;background:linear-gradient(135deg,#90e0ef,#00b4d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.25rem}.digit-roll-container{--digit-height: 60px;--roll-one-speed: 10s;display:flex;height:var(--digit-height);line-height:var(--digit-height);overflow:hidden;background:none;-webkit-background-clip:initial;background-clip:initial;-webkit-text-fill-color:initial}.digit-strip{display:flex;flex-direction:column}.digit-strip span{height:var(--digit-height);text-align:center;padding:0 2px;width:40px;background:linear-gradient(135deg,#90e0ef,#00b4d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.thousands{animation:roll-snap-thousands calc(var(--roll-one-speed) * 1000) linear infinite;animation-delay:calc(var(--roll-one-speed)*-328)}.hundreds{animation:roll-snap-hundreds calc(var(--roll-one-speed) * 100) linear infinite;animation-delay:calc(var(--roll-one-speed)*-28)}.tens{animation:roll-snap-tens calc(var(--roll-one-speed) * 10) linear infinite;animation-delay:calc(var(--roll-one-speed)*-8)}.ones{animation:roll-from-0 var(--roll-one-speed) linear infinite}@keyframes roll-from-0{0%{transform:translateY(0)}to{transform:translateY(calc(var(--digit-height) * -10))}}@keyframes roll-snap-tens{0%,9%{transform:translateY(calc(var(--digit-height) * 0))}10%,19%{transform:translateY(calc(var(--digit-height) * -1))}20%,29%{transform:translateY(calc(var(--digit-height) * -2))}30%,39%{transform:translateY(calc(var(--digit-height) * -3))}40%,49%{transform:translateY(calc(var(--digit-height) * -4))}50%,59%{transform:translateY(calc(var(--digit-height) * -5))}60%,69%{transform:translateY(calc(var(--digit-height) * -6))}70%,79%{transform:translateY(calc(var(--digit-height) * -7))}80%,89%{transform:translateY(calc(var(--digit-height) * -8))}90%,99%{transform:translateY(calc(var(--digit-height) * -9))}to{transform:translateY(calc(var(--digit-height) * -10))}}@keyframes roll-snap-hundreds{0%,9.9%{transform:translateY(calc(var(--digit-height) * 0))}10%,19.9%{transform:translateY(calc(var(--digit-height) * -1))}20%,29.9%{transform:translateY(calc(var(--digit-height) * -2))}30%,39.9%{transform:translateY(calc(var(--digit-height) * -3))}40%,49.9%{transform:translateY(calc(var(--digit-height) * -4))}50%,59.9%{transform:translateY(calc(var(--digit-height) * -5))}60%,69.9%{transform:translateY(calc(var(--digit-height) * -6))}70%,79.9%{transform:translateY(calc(var(--digit-height) * -7))}80%,89.9%{transform:translateY(calc(var(--digit-height) * -8))}90%,99.9%{transform:translateY(calc(var(--digit-height) * -9))}to{transform:translateY(calc(var(--digit-height) * -10))}}@keyframes roll-snap-thousands{0%,9.99%{transform:translateY(calc(var(--digit-height) * 0))}10%,19.99%{transform:translateY(calc(var(--digit-height) * -1))}20%,29.99%{transform:translateY(calc(var(--digit-height) * -2))}30%,39.99%{transform:translateY(calc(var(--digit-height) * -3))}40%,49.99%{transform:translateY(calc(var(--digit-height) * -4))}50%,59.99%{transform:translateY(calc(var(--digit-height) * -5))}60%,69.99%{transform:translateY(calc(var(--digit-height) * -6))}70%,79.99%{transform:translateY(calc(var(--digit-height) * -7))}80%,89.99%{transform:translateY(calc(var(--digit-height) * -8))}90%,99.99%{transform:translateY(calc(var(--digit-height) * -9))}to{transform:translateY(calc(var(--digit-height) * -10))}}.stat-label{font-size:.8rem;color:#51637b;text-transform:uppercase;letter-spacing:.1em;font-weight:600}.creators-grid{display:grid;grid-template-columns:1fr;width:100%;gap:20px}.creator-card{background:#ffffff04;border:1px solid rgba(255,255,255,.05);border-radius:1rem;padding:2.25rem 1.5rem;transition:border-color .3s ease,background .3s ease,transform .3s ease}.creator-card:hover{border-color:#00b4d840;background:#00b4d808;transform:translateY(-2px)}.creator-pfp{width:100%;aspect-ratio:1;border-radius:50%}.creator-name{padding:15px;flex-grow:true;text-align:center}@media (min-width: 768px){.creators-grid{grid-template-columns:1fr 1fr}}.project-showcase{background:radial-gradient(circle at 100% 0%,rgba(0,180,216,.06),transparent 50%),#ffffff03;border:1px solid rgba(255,255,255,.05);border-radius:1.5rem;padding:4.5rem 4rem;transition:border-color .3s ease}.project-showcase:hover{border-color:#00b4d826}.showcase-header{margin-bottom:2rem}.project-content{max-width:44rem}.project-desc{font-size:1.1rem;color:#94a3b8;line-height:1.9;margin-bottom:2.5rem}.action-bar{display:flex;gap:1rem}.btn-primary{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2.25rem;font-weight:600;font-size:.95rem;color:#0f1318;background:#90e0ef;border:none;border-radius:.75rem;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.btn-primary:hover{transform:translateY(-2px);background:#00b4d8;box-shadow:0 10px 30px -10px #00b4d866}.btn-arrow{width:16px;height:16px;stroke:currentColor;stroke-width:2.5;fill:none;transition:transform .2s ease}.btn-primary:hover .btn-arrow{transform:translate(4px)}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;padding:.8rem 1.75rem;font-weight:600;font-size:.85rem;color:#e2e8f0;background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:.5rem;text-decoration:none;transition:background .2s ease,border-color .2s ease,transform .2s ease}.btn-secondary:hover{background:#ffffff0f;border-color:#ffffff26;transform:translateY(-1px)}.github-card{background:#ffffff04;border:1px solid rgba(255,255,255,.05);border-radius:1.25rem;padding:2.5rem 2.25rem;display:flex;flex-direction:column;justify-content:space-between;gap:1.5rem;transition:border-color .3s ease,background .3s ease}.github-card:hover{border-color:#ffffff1a;background:#ffffff06}.github-card-header{display:flex;align-items:center;gap:1rem}.github-card-avatar{width:3rem;height:3rem;border-radius:.75rem;background:linear-gradient(135deg,#24292e,#1b1f23);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;color:#fff}.github-org-name{font-weight:600;color:#fff;font-size:1.05rem}.github-org-sub{font-size:.75rem;color:#64748b;margin-top:.1rem}.github-card-desc{font-size:.9rem;color:#94a3b8;line-height:1.6}.site-footer{border-top:1px solid rgba(255,255,255,.05);padding:3.5rem 2rem;text-align:center}.footer-inner{max-width:72rem;margin:0 auto;display:flex;justify-content:space-between;align-items:center}.footer-brand{font-weight:600;font-size:.95rem;color:#e2e8f0}.footer-copy{font-size:.8rem;color:#475569}.visually-hidden{position:absolute;clip-path:inset(50%);overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap}.mailing-list-card{background:radial-gradient(circle at 0% 100%,rgba(255,0,127,.04),transparent 50%),#ffffff04;border:1px solid rgba(255,255,255,.05);border-radius:1.5rem;padding:4.5rem 4rem;transition:border-color .3s ease,background .3s ease;position:relative;overflow:hidden}.mailing-list-card:hover{border-color:#ff007f33}.mailing-list-desc{font-size:1.1rem;color:#94a3b8;line-height:1.9;margin-bottom:2rem;max-width:44rem}.subscribe-form{max-width:36rem}.subscribe-form .form-group{display:flex;gap:1rem;align-items:center;position:relative}.subscribe-form input[type=email]{flex:1;background:#ffffff05;border:1px solid rgba(255,255,255,.08);border-radius:.75rem;padding:.9rem 1.25rem;font-family:inherit;font-size:1rem;color:#fff;outline:none;min-height:48px;transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease}.subscribe-form input[type=email]:focus{border-color:#ff007f;background:#ffffff0a;box-shadow:0 0 0 3px #ff007f26}.subscribe-form input[type=email]::placeholder{color:#475569}.subscribe-form .btn-primary{flex-shrink:0;cursor:pointer;background:#ff007f;color:#fff;min-height:48px;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease}.subscribe-form .btn-primary:hover{background:#f39;box-shadow:0 10px 30px -10px #ff007f66}.subscribe-form .btn-primary:disabled{background:#475569;cursor:not-allowed;transform:none;box-shadow:none}.form-status{margin-top:1rem;font-size:.9rem;min-height:1.5rem;transition:opacity .2s ease}.form-status.success{color:#4ade80}.form-status.error{color:#f87171}@media (max-width: 600px){.subscribe-form .form-group{flex-direction:column;align-items:stretch;gap:1rem}.subscribe-form .btn-primary{width:100%;justify-content:center}}@media (max-width: 992px){.about-grid{grid-template-columns:1fr;gap:3.5rem}}@media (max-width: 768px){.top-bar{height:4rem}.nav-container{padding:0 1.25rem}.nav-links{gap:1.25rem}.section{padding:5rem 1.25rem}.project-showcase{padding:3.5rem 2.25rem}.about-stats{grid-template-columns:1fr 1fr;gap:1rem}.footer-inner{flex-direction:column;gap:1rem}}@media (max-width: 480px){.nav-links{gap:.75rem}.github-btn{padding:.45rem .75rem}.about-stats{grid-template-columns:1fr}.stat-card{padding:1.75rem 1.25rem}}
