@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{--primary-color:#10b981;--secondary-color:#f59e0b;--accent-color:#6366f1;--dark-bg:#0a0a0f;--darker-bg:#050508;--light-bg:#f9f9f9;--card-bg:#ffffff08;--text-primary:#fff;--text-secondary:#ffffffb3;--border-color:#ffffff1a;--glow-color:#10b9814d;--nav-item-height:42px}html{scroll-behavior:smooth}body{background:var(--dark-bg);color:var(--text-primary);font-family:Space Grotesk,sans-serif;line-height:1.6;overflow:hidden auto}code{font-family:JetBrains Mono,monospace}body:not(.loaded) *{animation-play-state:paused!important}#app{min-height:100vh}.animated-bg{z-index:-1;background:linear-gradient(135deg,var(--darker-bg)0%,var(--dark-bg)50%,#1a0a2e 100%);background-size:400% 400%;width:100%;height:100%;animation:15s infinite gradientShift;position:fixed;top:0;left:0}@keyframes gradientShift{0%,to{background-position:0%}50%{background-position:100%}}.animated-bg:before{content:"";background:radial-gradient(circle at 20%,#10b9811a 0%,#0000 50%),radial-gradient(circle at 80% 80%,#6366f11a 0%,#0000 50%),radial-gradient(circle at 40% 20%,#f59e0b1a 0%,#0000 50%);width:100%;height:100%;animation:8s ease-in-out infinite pulse;position:absolute}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.main-nav{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:1000;border-bottom:1px solid var(--border-color);contain:layout style;background:#0a0a0ff2;justify-content:space-between;align-items:center;width:100%;padding:1.5rem 3rem;display:flex;position:fixed;top:0}.nav-logo{align-items:center;gap:.75rem;display:flex}.nav-logo .logo-icon{flex-shrink:0;width:28px;height:28px}.nav-logo .logo-text{background:linear-gradient(135deg,var(--primary-color),var(--accent-color));-webkit-text-fill-color:transparent;letter-spacing:.1em;-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:700}.nav-menu{align-items:center;gap:2rem;list-style:none;display:flex}.nav-menu>li{height:var(--nav-item-height);align-items:center;display:flex}.nav-menu a{height:100%;color:var(--text-secondary);align-items:center;font-weight:500;text-decoration:none;transition:all .3s;display:inline-flex;position:relative}.nav-menu a:after{content:"";background:var(--primary-color);width:0;height:2px;transition:width .3s;position:absolute;bottom:-5px;left:0}.nav-menu a:hover{color:var(--text-primary)}.nav-menu a:hover:after{width:100%}.nav-menu a.active{color:var(--primary-color)}.nav-menu a.active:after{background:var(--primary-color);width:100%}.nav-download{margin-left:.5rem}.nav-download-btn{border:1px solid var(--primary-color);color:var(--primary-color);height:var(--nav-item-height);border-radius:999px;align-items:center;gap:.25rem;padding:0 1.1rem;font-size:.85rem;font-weight:600;text-decoration:none;transition:all .25s;display:inline-flex;position:relative;overflow:hidden}.nav-download-btn:before{content:"";background:linear-gradient(135deg,var(--primary-color),var(--accent-color));opacity:0;z-index:-1;transition:opacity .25s;position:absolute;inset:0}.nav-download-btn:hover{color:var(--dark-bg);box-shadow:0 10px 25px var(--glow-color)}.nav-download-btn:hover:before{opacity:1}.nav-download-btn span{letter-spacing:.02em}.nav-github{border-left:1px solid var(--border-color);margin-left:1rem;padding-left:1rem}.nav-github a{color:var(--text-secondary);align-items:center;padding:.25rem;transition:all .3s;display:flex}.nav-github a:after{display:none}.nav-github a:hover{color:var(--text-primary);transform:scale(1.1)}.nav-github svg{width:20px;height:20px;transition:all .3s}.menu-toggle{cursor:pointer;background:0 0;border:none;flex-direction:column;gap:5px;display:none}.menu-toggle span{background:var(--text-primary);width:25px;height:2px;transition:all .3s}.hero{justify-content:space-between;align-items:center;min-height:100vh;padding:8rem 4rem 4rem;display:flex;position:relative;overflow:visible}.hero-content{z-index:2;flex:1;min-width:300px;max-width:900px;padding:2rem 4rem 2rem 2rem;overflow:visible}.hero-title{word-wrap:break-word;width:100%;margin-bottom:2rem;padding:2rem 1rem;font-size:clamp(3rem,8vw,8rem);font-weight:700;line-height:1.2;position:relative;overflow:visible}.hero-content h2{width:100%;margin-top:1rem;margin-bottom:1rem;padding:1rem;font-size:clamp(2rem,6vw,5rem);font-weight:700;line-height:1.2;position:relative;overflow:visible}.hero-content h2 .title-line{background:linear-gradient(135deg,var(--primary-color),var(--accent-color),var(--secondary-color));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;width:fit-content;min-width:max-content;margin:.25rem 0;padding:.5rem 1rem;display:block}.title-line{background:linear-gradient(135deg,var(--primary-color),var(--accent-color),var(--secondary-color));-webkit-text-fill-color:transparent;opacity:0;white-space:nowrap;-webkit-background-clip:text;background-clip:text;width:fit-content;min-width:max-content;margin:.25rem 0;padding:.5rem 1rem;animation:.8s forwards fadeInUp;display:block;position:relative;overflow:visible}.title-line:first-child{animation-delay:.1s}.title-line:nth-child(2){animation-delay:.3s}.title-line:nth-child(3){animation-delay:.5s}.title-line.rotated{transform-origin:50%;transform-box:fill-box;margin-top:.5rem;margin-bottom:.5rem;margin-left:2rem;padding:.75rem 2rem;display:inline-block;position:relative;overflow:visible;transform:rotate(-2deg)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.hero-subtitle{color:var(--text-secondary);opacity:0;margin-bottom:3rem;font-size:1.25rem;animation:.8s .7s forwards fadeInUp}.cta-button{border:2px solid var(--primary-color);color:var(--primary-color);opacity:0;background:0 0;padding:1rem 2.5rem;font-size:1.1rem;font-weight:600;text-decoration:none;transition:all .3s;animation:.8s .9s forwards fadeInUp;display:inline-block;position:relative;overflow:hidden}.cta-button:before{content:"";background:var(--primary-color);z-index:-1;width:100%;height:100%;transition:left .3s;position:absolute;top:0;left:-100%}.cta-button:hover{color:var(--light-bg);box-shadow:0 10px 30px var(--glow-color);transform:translateY(-3px)}.cta-button:hover:before{left:0}.hero-visual{flex:1;min-width:0;height:500px;position:relative;overflow:visible}.floating-shapes{--mouse-x:0;--mouse-y:0;width:100%;height:100%;position:relative;overflow:visible}.shape{filter:blur(50px);opacity:.6;mix-blend-mode:screen;will-change:transform;pointer-events:none;--scroll-y:0;transform:translate(calc(var(--mouse-x,0)*var(--mouse-multiplier,15)*1px),calc(var(--mouse-y,0)*var(--mouse-multiplier,15)*1px + var(--scroll-y,0)));contain:layout style paint;border-radius:50%;transition:none;position:absolute}.shape-1{background:linear-gradient(135deg,var(--primary-color),var(--accent-color));--mouse-multiplier:20;width:350px;height:350px;animation:8s ease-in-out infinite float-1;top:5%;right:5%;box-shadow:0 0 40px #10b9814d}.shape-2{background:linear-gradient(135deg,var(--accent-color),var(--secondary-color));--mouse-multiplier:15;width:250px;height:250px;animation:10s ease-in-out infinite reverse float-2;bottom:15%;right:25%;box-shadow:0 0 30px #6366f14d}.shape-3{background:linear-gradient(135deg,var(--secondary-color),var(--primary-color));--mouse-multiplier:18;width:300px;height:300px;animation:9s ease-in-out infinite float-3;top:45%;right:45%;box-shadow:0 0 35px #f59e0b4d}.shape-4{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));opacity:.5;--mouse-multiplier:12;width:180px;height:180px;animation:7s ease-in-out infinite float-4;top:25%;right:60%;box-shadow:0 0 25px #10b98133}.shape-5,.shape-6,.shape-7,.shape-8{display:none}@keyframes float-1{0%,to{transform:translate(0)}50%{transform:translate(30px,-30px)}}@keyframes float-2{0%,to{transform:translate(0)}50%{transform:translate(-35px,35px)}}@keyframes float-3{0%,to{transform:translate(0)}50%{transform:translate(25px,25px)}}@keyframes float-4{0%,to{transform:translate(0)}50%{transform:translate(35px,-35px)}}.particle-container{pointer-events:none;z-index:1;contain:layout paint;width:100%;height:100%;position:absolute;top:0;left:0;overflow:visible}.particle-container.particles-paused .particle{opacity:.25;animation-play-state:paused}.particle{opacity:.55;will-change:transform,opacity;filter:blur(20px);--float-x:20px;--float-y:-120px;--mid-x:calc(var(--float-x)*.5);--mid-y:calc(var(--float-y)*.6);--start-scale:.8;--mid-scale:.9;--end-scale:1;background:radial-gradient(circle,#10b981cc 0%,#6366f159 55%,#6366f100 100%);border-radius:50%;transition:opacity .3s ease-out;animation:linear infinite particle-float;position:absolute;transform:translateZ(0)}.particle-pattern{filter:blur(25px);opacity:.7;background:radial-gradient(circle,#10b981e6 0%,#6366f180 50%,#f59e0b4d 70%,#6366f100 100%)}@keyframes particle-float{0%{transform:translate3d(0,0,0)scale(var(--start-scale));opacity:0}20%{opacity:.65;transform:translate3d(calc(var(--mid-x,0)*.3),calc(var(--mid-y,0)*.3),0)scale(calc(var(--start-scale)*1.1))}50%{transform:translate3d(var(--mid-x,calc(var(--float-x)*.5)),var(--mid-y,calc(var(--float-y)*.6)),0)scale(var(--mid-scale));opacity:.9}80%{opacity:.4;transform:translate3d(calc(var(--float-x)*.8),calc(var(--float-y)*.8),0)scale(calc(var(--end-scale)*.95))}to{transform:translate3d(var(--float-x),var(--float-y),0)scale(var(--end-scale));opacity:0}}@media (prefers-reduced-motion:reduce){.particle{opacity:.2;animation:none}}section{padding:6rem 3rem;position:relative}.section-title{background:linear-gradient(135deg,var(--primary-color),var(--accent-color));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:1rem;font-size:clamp(2.5rem,5vw,4rem);font-weight:700}.section-description{color:var(--text-secondary);font-size:1.2rem}.apps-section{background:#0003}.apps-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;max-width:1400px;margin:0 auto;display:grid}.app-card{background:var(--card-bg);border:1px solid var(--border-color);text-align:center;isolation:isolate;border-radius:20px;padding:2.5rem;transition:transform .3s,border-color .3s,box-shadow .3s,background .3s;position:relative;overflow:hidden}.app-card:before{content:"";opacity:0;pointer-events:none;z-index:-1;background:linear-gradient(135deg,#10b98114,#6366f114);border-radius:20px;transition:opacity .3s;position:absolute;inset:0}.app-card:hover{border-color:var(--primary-color);box-shadow:0 20px 60px var(--glow-color),inset 0 0 60px #10b9810d;background:#ffffff14;transform:translateY(-10px)scale(1.02)}.app-card:hover:before{opacity:1}.app-icon{filter:drop-shadow(0 0 10px #10b9814d);z-index:1;margin-bottom:1rem;font-size:4rem;transition:transform .3s;position:relative}.app-card:hover .app-icon{transform:scale(1.2)rotate(5deg)}.app-name{color:var(--text-primary);z-index:1;margin-bottom:.5rem;font-size:1.8rem;font-weight:700;position:relative}.app-description{color:var(--text-secondary);z-index:1;margin-bottom:1rem;font-size:1rem;position:relative}.app-port{color:var(--primary-color);opacity:.8;z-index:1;margin-bottom:1.5rem;font-family:JetBrains Mono,monospace;font-size:.9rem;position:relative}.app-link{border:1px solid var(--primary-color);color:var(--primary-color);z-index:1;background:0 0;border-radius:50px;padding:.75rem 2rem;font-weight:600;text-decoration:none;transition:all .3s;display:inline-block;position:relative;overflow:hidden}.app-link:before{content:"";background:var(--primary-color);z-index:-1;border-radius:50%;width:0;height:0;transition:width .6s,height .6s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.app-link:hover{color:var(--dark-bg);border-color:var(--primary-color)}.app-link:hover:before{width:300px;height:300px}.ecosystem-section{background:#0000004d}.ecosystem-diagram{max-width:1200px;margin:0 auto 4rem}.ecosystem-flow{background:var(--card-bg);border:1px solid var(--border-color);border-radius:30px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:2rem;padding:3rem;display:flex}.flow-step{text-align:center;background:#10b9810d;border:1px solid #10b98133;border-radius:20px;flex:1;min-width:200px;padding:2rem;transition:all .3s}.flow-step:hover{border-color:var(--primary-color);box-shadow:0 10px 30px var(--glow-color);transform:scale(1.05)}.step-icon{margin-bottom:1rem;font-size:3rem}.flow-step h4{color:var(--primary-color);margin-bottom:.5rem;font-size:1.2rem}.flow-step p{color:var(--text-secondary);font-size:.9rem}.flow-arrow{color:var(--primary-color);font-size:2rem;animation:2s ease-in-out infinite pulseArrow}@keyframes pulseArrow{0%,to{opacity:.5;transform:translate(0)}50%{opacity:1;transform:translate(10px)}}.interconnection-details{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:1400px;margin:0 auto;display:grid}.detail-card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:15px;padding:2rem;transition:all .3s}.detail-card:hover{border-color:var(--accent-color);transform:translateY(-5px);box-shadow:0 10px 30px #6366f133}.detail-card h4{color:var(--primary-color);margin-bottom:1rem;font-size:1.2rem}.detail-card p{color:var(--text-secondary);line-height:1.8}.tutorial-section{background:#0003}.tutorial-container{max-width:1000px;margin:0 auto}.tutorial-step{background:var(--card-bg);border:1px solid var(--border-color);border-radius:20px;gap:2rem;margin-bottom:4rem;padding:2rem;transition:all .3s;display:flex;position:relative;overflow:hidden}.tutorial-step:before{content:"";background:linear-gradient(180deg,var(--primary-color),var(--accent-color));opacity:0;width:4px;height:100%;transition:opacity .3s;position:absolute;top:0;left:0}.tutorial-step:hover{border-color:var(--primary-color);transform:translate(10px)}.tutorial-step:hover:before{opacity:1}.step-number{background:linear-gradient(135deg,var(--primary-color),var(--accent-color));-webkit-text-fill-color:transparent;text-align:center;-webkit-background-clip:text;background-clip:text;min-width:80px;font-family:JetBrains Mono,monospace;font-size:3rem;font-weight:700}.step-content{flex:1}.step-content h3{color:var(--text-primary);margin-bottom:1rem;font-size:1.8rem}.step-content p{color:var(--text-secondary);margin-bottom:1rem;line-height:1.8}.step-content ul{margin:1rem 0;padding-left:0;list-style:none}.step-content ul li{color:var(--text-secondary);margin-bottom:.5rem;padding-left:1.5rem;position:relative}.step-content ul li:before{content:"→";color:var(--primary-color);position:absolute;left:0}.step-content pre{border:1px solid var(--border-color);background:#00000080;border-radius:10px;margin:1rem 0;padding:1rem;overflow-x:auto}.step-content code{color:var(--primary-color);font-size:.9rem}.step-content code .code-comment{color:#ffffff80;font-style:italic}.step-content strong{color:var(--primary-color)}body.details-page .hero{min-height:auto;padding:9rem 4rem 3rem}body.details-page .hero-content{max-width:720px;padding:2rem 0}body.details-page .hero-title{padding:0}.details-section{border:1px solid var(--border-color);background:#ffffff05;border-radius:24px;max-width:1200px;margin:3rem auto;padding:3rem;box-shadow:0 10px 40px #00000040}.details-section:first-of-type{margin-top:2rem}.detail-list{flex-direction:column;gap:1.25rem;display:flex}.detail-item{background:#0000004d;border:1px solid #ffffff0d;border-radius:16px;align-items:flex-start;gap:1rem;padding:1.5rem;display:flex}.detail-item span{width:32px;height:32px;color:var(--primary-color);background:#10b98133;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-family:JetBrains Mono,monospace;font-weight:600;display:flex}.detail-grid,.details-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;display:grid}.info-card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:20px;padding:1.75rem;position:relative;overflow:hidden}.info-card:before{content:"";opacity:.6;pointer-events:none;background:radial-gradient(circle,#10b98126,#0000 70%);width:60%;height:60%;position:absolute;top:-30%;right:-30%}.info-card h3,.info-card h4{color:var(--text-primary);margin-bottom:1rem}.info-card ul{color:var(--text-secondary);flex-direction:column;gap:.5rem;padding-left:0;font-size:.95rem;list-style:none;display:flex}.info-card ul li{padding-left:1rem;position:relative}.info-card ul li:before{content:"•";color:var(--primary-color);position:absolute;top:0;left:0}.info-card pre{border:1px solid var(--border-color);color:var(--text-secondary);background:#ffffff05;border-radius:16px;padding:1rem;font-family:JetBrains Mono,monospace;font-size:.85rem;overflow-x:auto}.info-card ol{color:var(--text-secondary);flex-direction:column;gap:.75rem;padding-left:1rem;display:flex}.integration-table-wrapper{margin-bottom:2rem;overflow-x:auto}.integration-table{border-collapse:collapse;width:100%;min-width:640px}.integration-table th,.integration-table td{border:1px solid var(--border-color);text-align:left;color:var(--text-secondary);padding:.85rem 1rem;font-size:.9rem}.integration-table th{color:var(--text-primary);background:#ffffff0a;font-weight:600}@media (max-width:768px){.details-section{padding:2rem}.detail-item{flex-direction:column}body.details-page .hero{padding:8rem 2rem 2rem}}.doom-section{background:#0000004d;position:relative;overflow:visible}.doom-container{max-width:1200px;margin:0 auto;padding:2rem;position:relative}.doom-glow{filter:blur(60px);z-index:0;pointer-events:none;background:radial-gradient(circle at 30% 30%,#10b9814d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#6366f14d 0%,#0000 50%),radial-gradient(circle,#f59e0b33 0%,#0000 60%);width:120%;height:120%;animation:4s ease-in-out infinite doom-glow-pulse;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes doom-glow-pulse{0%,to{opacity:.6;transform:translate(-50%,-50%)scale(1)}50%{opacity:1;transform:translate(-50%,-50%)scale(1.1)}}.doom-wrapper{z-index:1;contain:layout style paint;background:#000000d9;border:2px solid #10b9814d;border-radius:20px;padding:2rem;transition:border-color .3s,box-shadow .3s;position:relative;box-shadow:0 0 30px #10b9814d}.doom-wrapper:hover{border-color:#10b98199;box-shadow:0 0 40px #10b98166}.doom-canvas-container{aspect-ratio:4/3;background:#000;border-radius:10px;width:100%;max-width:800px;margin:0 auto;position:relative;overflow:hidden;box-shadow:0 0 40px #10b98180,inset 0 0 30px #000c}.doom-game-container{flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:1200px;margin:0 auto;display:flex}.doom-canvas{visibility:visible;opacity:1;background:#000;border:none;border-radius:10px;width:100%;max-width:1200px;height:600px;min-height:400px;display:block;box-shadow:0 0 40px #10b98180,inset 0 0 30px #000c}.doom-output{width:100%;max-width:640px;display:none}.doom-loading-state{text-align:center;color:var(--primary-color);z-index:10;background:#000000e6;border:1px solid #10b9814d;border-radius:10px;padding:2rem;display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 20px #10b9814d}.doom-loading-state p{margin-bottom:1rem;font-family:JetBrains Mono,monospace;font-size:1.2rem}.doom-game-container.doom-loading-active{cursor:progress}.doom-game-container{flex-direction:column;align-items:center;width:100%;display:flex;position:relative}.doom-start-button{z-index:11;width:100%;height:100%;color:var(--text-primary);cursor:pointer;letter-spacing:.05em;text-transform:uppercase;background:#000000e6;border:1px solid #10b98180;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;font-family:JetBrains Mono,monospace;font-size:1.2rem;transition:all .3s;display:flex;position:absolute;top:0;left:0}.doom-start-button:hover{border-color:#10b981cc;box-shadow:0 0 40px #10b98166}.doom-start-button.hidden{opacity:0;pointer-events:none;transform:scale(.98)}.doom-start-subtitle{text-transform:none;letter-spacing:normal;color:var(--text-secondary);font-size:.85rem}.doom-focushint{color:var(--text-secondary);text-align:center;opacity:.8;padding:.5rem;font-family:JetBrains Mono,monospace;font-size:.9rem}.doom-stats{color:var(--text-secondary);opacity:.7;flex-wrap:wrap;justify-content:center;gap:1.5rem;font-family:JetBrains Mono,monospace;font-size:.85rem;display:flex}.doom-stats span{gap:.25rem;display:flex}.doom-wrapper{justify-content:center;align-items:center;width:100%;max-width:1200px;margin:0 auto;padding:2rem;display:flex}.doom-loading{text-align:center;color:var(--primary-color);z-index:10;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.doom-loading p{margin-bottom:1rem;font-family:JetBrains Mono,monospace;font-size:1.2rem}.loading-spinner{border:3px solid #10b9814d;border-top-color:var(--primary-color);border-radius:50%;width:40px;height:40px;margin:0 auto;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.doom-controls{text-align:center;margin-top:1.5rem}.doom-hint{color:var(--text-secondary);opacity:.8;font-family:JetBrains Mono,monospace;font-size:.9rem}.ripple{pointer-events:none;background:#ffffff4d;border-radius:50%;animation:.6s ease-out ripple-animation;position:absolute;transform:scale(0)}@keyframes ripple-animation{to{opacity:0;transform:scale(4)}}.footer{text-align:center;border-top:1px solid var(--border-color);background:#00000080;padding:3rem}.footer-content p{color:var(--text-secondary);margin-bottom:1rem}.footer-links{flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;display:flex}.footer-links a{color:var(--primary-color);text-decoration:none;transition:all .3s}.footer-links a:hover{color:var(--accent-color);text-decoration:underline}.footer-links span{color:var(--text-secondary)}@media (max-width:968px){.hero{text-align:center;flex-direction:column;padding:6rem 2rem 2rem;overflow:visible}.hero-content{max-width:100%;padding:1rem 2rem;overflow:visible}.hero-title{width:100%;padding:2rem 1.5rem;font-size:clamp(2.5rem,10vw,6rem);overflow:visible}.hero-content h2{padding:1rem 1.5rem;font-size:clamp(1.5rem,8vw,4rem)}.title-line{width:fit-content;margin:.5rem 0;padding:.5rem 1rem;display:block}.title-line.rotated{margin-left:1rem;padding:.75rem 1.5rem;display:inline-block;transform:rotate(-1deg)}.hero-visual{height:300px;margin-top:2rem}.nav-menu{border-top:1px solid var(--border-color);background:#0a0a0ffa;flex-direction:column;width:100%;padding:2rem;transition:right .3s;position:fixed;top:70px;right:-100%}.nav-menu.active{right:0}.nav-github{border-left:none;border-top:1px solid var(--border-color);margin-top:1rem;margin-left:0;padding-top:1rem;padding-left:0}.nav-download{width:100%}.nav-download-btn{justify-content:center;width:100%;height:auto}.nav-menu>li,.nav-menu a{height:auto}.menu-toggle{display:flex}.ecosystem-flow{flex-direction:column}.flow-arrow{transform:rotate(90deg)}.tutorial-step{flex-direction:column}.step-number{min-width:auto}section{padding:4rem 2rem}}@media (max-width:640px){.hero{padding:5rem 1.5rem 2rem}.hero-title{padding:1.5rem 1rem;font-size:clamp(2rem,10vw,4rem)}.hero-content h2{padding:.75rem 1rem;font-size:clamp(1.2rem,7vw,3rem)}.title-line{margin:.3rem 0;padding:.4rem .8rem}.title-line.rotated{margin-left:.5rem;padding:.5rem 1rem;transform:rotate(-.5deg)}.apps-grid,.interconnection-details{grid-template-columns:1fr}.main-nav{padding:1rem 1.5rem}.doom-container,.doom-wrapper{padding:1rem}.doom-canvas{max-width:100%;height:400px;min-height:300px}}@keyframes slideInFromBottom{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.app-card,.detail-card,.tutorial-step{opacity:0;animation:.6s forwards slideInFromBottom}.app-card:first-child{animation-delay:.1s}.app-card:nth-child(2){animation-delay:.2s}.app-card:nth-child(3){animation-delay:.3s}.app-card:nth-child(4){animation-delay:.4s}.app-card:nth-child(5){animation-delay:.5s}.app-card:nth-child(6){animation-delay:.6s}.app-card:nth-child(7){animation-delay:.7s}*,:before,:after,::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 #0000;--un-ring-shadow:0 0 #0000;--un-shadow-inset: ;--un-shadow:0 0 #0000;--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:#93c5fd80;--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.section-header{text-align:center;margin-bottom:2rem}.block{display:block}