*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--color-bg: #f5f5f0;--color-bg-alt: #eaeae5;--color-surface: #ffffff;--color-primary: #1a1a1a;--color-accent: #ff6600;--color-text: #1a1a1a;--color-text-muted: #888888;--color-border: #d0d0c8;--font-sans: "Inter", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", "Consolas", monospace;--max-width: 1060px}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);background:var(--color-bg);color:var(--color-text);line-height:1.6;overflow-x:hidden;letter-spacing:.01em}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}.page-wrap{max-width:var(--max-width);margin:3rem auto;background:#fffdfa33;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--color-border);position:relative;z-index:1}.container{padding:0 2rem}.topo-bg{position:fixed;top:0;left:0;z-index:0;pointer-events:none;will-change:transform}.topo-overlay{position:fixed;top:0;left:0;z-index:0;pointer-events:none}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.75rem;font-family:var(--font-mono);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;border:none;transition:background .15s,color .15s}.btn svg{width:16px;height:16px}.btn-accent{background:var(--color-accent);color:#fff}.btn-accent:hover{background:var(--color-primary)}.hero{display:flex;align-items:center;justify-content:center;padding:2.5rem 0}.hero-content{text-align:center;width:100%}.hero-logo{font-family:var(--font-mono);font-size:clamp(2.2rem,7vw,3.5rem);font-weight:700;letter-spacing:.08em;text-transform:uppercase;line-height:1;margin-bottom:.5rem}.hero-cursor{background:var(--color-accent);color:var(--color-surface)}.hero-subtitle{font-family:var(--font-mono);font-size:clamp(.65rem,1.5vw,.8rem);text-transform:uppercase;letter-spacing:.15em;color:var(--color-text-muted);margin-bottom:0}.hero-tg-badge{display:inline-block;font-family:var(--font-mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--color-accent);border:1px solid var(--color-accent);padding:.3rem .8rem;margin-top:.75rem;transition:background .15s,color .15s}.hero-tg-badge:hover{background:var(--color-accent);color:#fff}.section{padding:2rem 0;border-top:1px solid var(--color-border)}.intro-text h2{font-family:var(--font-mono);font-size:1.5rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin-bottom:1.25rem}.intro-text p{font-size:.95rem;color:var(--color-text-muted);line-height:1.7;margin-bottom:1rem}.intro-text p:last-child{margin-bottom:0}.intro-points{margin-top:1.5rem;display:flex;flex-direction:column;gap:1rem}.intro-points .feature-item p{margin-bottom:0}.video-label{font-family:var(--font-mono);font-size:.7rem;color:var(--color-text-muted);margin-top:.5rem;letter-spacing:.05em}.demo-video-wrap{position:relative;background:var(--color-bg-alt);border:1px solid var(--color-border)}.demo-video-wrap:after{content:"";position:absolute;top:50%;left:50%;width:24px;height:24px;margin:-12px 0 0 -12px;border:2px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite}.demo-video-wrap.loaded:after{display:none}@keyframes spin{to{transform:rotate(360deg)}}.demo-video{display:block;width:100%;position:relative;z-index:1}.demo-split{display:grid;grid-template-columns:1fr 1px 1fr;gap:2rem;align-items:stretch}.demo-split:before{content:"";grid-column:2;grid-row:1;border-left:1px solid var(--color-border);margin:-2rem 0}.demo-split>div:has(.demo-video--side){display:flex;flex-direction:column}.demo-split .demo-video--side{object-fit:cover;flex:1;min-height:0}.demo-split--reverse{direction:rtl}.demo-split--reverse>*{direction:ltr}.feature-item{margin-bottom:1.25rem}.feature-item:last-child{margin-bottom:0}.feature-heading{font-family:var(--font-mono);font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin-bottom:.3rem}.feature-heading svg.feature-icon{width:1em;height:1em;vertical-align:-.125em;color:var(--color-accent);stroke-width:2.5}.feature-item p{font-size:.85rem;color:var(--color-text-muted);line-height:1.6}.term{font-family:var(--font-mono);font-weight:600}.showcase{margin-bottom:2rem}.showcase .demo-video{height:500px;min-height:500px;object-fit:cover;object-position:left bottom}.showcase-caption{font-family:var(--font-mono);font-size:.8rem;color:var(--color-text-muted);margin-top:1rem;line-height:1.5;letter-spacing:.02em}.three-keys{border-top:1px solid var(--color-border);margin:0 -2rem;padding:2rem;display:grid;grid-template-columns:1fr 1px 1fr;gap:2rem}.three-keys:before{content:"";grid-column:2;grid-row:1;border-left:1px solid var(--color-border);margin:-2rem 0}.three-keys-left{display:flex;flex-direction:column}.three-keys-header{margin-bottom:1.5rem}.three-keys-header h3{font-family:var(--font-mono);font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin-bottom:.3rem}.three-keys-header p{font-size:.9rem;color:var(--color-text-muted);line-height:1.6;margin-bottom:.75rem}.three-keys-header p:last-child{margin-bottom:0}.tabs-nav{display:inline-flex;border-bottom:1px solid var(--color-border);margin-bottom:1.5rem}.tab-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.6rem 1rem;background:none;border:none;border-bottom:2px solid transparent;font-family:var(--font-mono);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);cursor:pointer;transition:color .15s,border-color .15s}.tab-btn:hover{color:var(--color-text)}.tab-btn.active{color:var(--color-accent);border-bottom-color:var(--color-accent)}.tab-soon{font-size:.6rem;font-weight:400;opacity:.5;letter-spacing:.02em}.tab-btn svg.feature-icon{width:14px;height:14px}.tab-panel{display:none}.tab-panel.active{display:block}.tab-panel p{font-size:.85rem;color:var(--color-text-muted);line-height:1.6}.tab-right{display:flex;flex-direction:column;height:0;min-height:100%}.tab-img-wrap{overflow:hidden;flex:1;min-height:0}.tab-img{width:100%;height:100%;display:block;object-fit:cover;border:1px solid var(--color-border)}.quadtree-block{border-top:1px solid var(--color-border);margin-left:-2rem;margin-right:-2rem;padding:2rem 2rem 0}.quadtree-title{font-family:var(--font-mono);font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin-bottom:.3rem}.quadtree-desc{font-size:.85rem;color:var(--color-text-muted);line-height:1.6;margin-bottom:1.5rem}.quadtree-canvas-full{width:100%;aspect-ratio:2 / 1;background:var(--color-bg);border:1px solid var(--color-text-muted);position:relative}.quadtree-canvas-full canvas{position:absolute;top:0;left:0;width:100%;height:100%}.quadtree-canvas-wrap{position:relative}.qt-hint{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;font-family:var(--font-mono);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);pointer-events:none;animation:qt-pulse 2s ease-in-out infinite;transition:opacity .3s;text-align:center}.qt-hint svg{animation:qt-arrow 1.5s ease-in-out infinite}@keyframes qt-pulse{0%,to{opacity:.5}50%{opacity:1}}@keyframes qt-arrow{0%,to{transform:translate(0)}50%{transform:translate(5px)}}.roadmap{position:relative;padding-left:2rem}.roadmap:before{content:"";position:absolute;left:5px;top:0;bottom:0;border-left:1px solid var(--color-border)}.roadmap-item{position:relative;padding-bottom:1.5rem}.roadmap-item:last-child{padding-bottom:0}.roadmap-marker{position:absolute;left:-2rem;top:.15rem;width:11px;height:11px;border:2px solid var(--color-border);background:var(--color-surface)}.roadmap-item.done .roadmap-marker{border-color:var(--color-accent);background:var(--color-accent)}.roadmap-item.active .roadmap-marker{border-color:var(--color-accent);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{background:transparent}50%{background:var(--color-accent)}}.roadmap-date{font-family:var(--font-mono);font-size:.7rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.roadmap-content h4{font-family:var(--font-mono);font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin:.15rem 0 .3rem}.roadmap-content p{font-size:.8rem;color:var(--color-text-muted);line-height:1.5}.tg-cta-section{background:#ff66000a}.tg-cta-section .container{text-align:center}.tg-cta-text{font-family:var(--font-mono);font-size:.85rem;color:var(--color-text-muted);margin-bottom:1rem}.contact-row{display:flex;gap:2rem;align-items:start}.contact-info{flex:1}.contact-info p{font-size:.85rem;color:var(--color-text-muted);line-height:1.6;margin-top:.5rem}.contact-heading{margin-top:1rem}.contact-avatar{width:192px;height:192px;object-fit:cover;border:1px solid var(--color-border);margin-bottom:1rem}.contact-cta{font-size:.85rem;color:var(--color-text-muted);line-height:1.6;margin-bottom:1rem}.contact-links{display:flex;flex-direction:column;gap:.75rem}.contact-link{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-mono);font-size:.85rem;color:var(--color-text);transition:color .15s}.contact-link:hover{color:var(--color-accent)}.contact-link svg{width:16px;height:16px}.footer{border-top:1px solid var(--color-border);padding:2rem 0}.footer .container{text-align:center}.footer-text{font-family:var(--font-mono);font-size:.8rem;color:var(--color-text-muted)}.footer-accent{color:var(--color-accent);transition:opacity .15s}.footer-accent:hover{opacity:.7}@media(max-width:768px){.page-wrap{margin:1rem auto;max-width:calc(100% - 2rem)}.container{padding:0 1rem}.hero{padding:2rem 0}.demo-split{grid-template-columns:1fr}.demo-split:before{display:none}.demo-split--reverse{direction:ltr}.three-keys{display:block;margin:0;padding:1.5rem 0}.three-keys:before{display:none}.three-keys-left{margin-bottom:1rem}.tab-right{height:auto;min-height:0}.tab-img{height:200px;max-width:100%}.tabs-nav{flex-wrap:wrap}.quadtree-block{margin:0 -1rem;padding:1.5rem 1rem 0}.showcase .demo-video{height:250px;min-height:250px}.contact-row{flex-direction:column}.contact-avatar{width:128px;height:128px;margin-bottom:.5rem}.contact-info{min-width:0;overflow-wrap:break-word}}
