:root{--bg-color: #000000;--text-primary: #ffffff;--text-secondary: #94a3b8;--accent-purple: #8b5cf6;--accent-cyan: #06b6d4;--accent-gradient: linear-gradient(135deg, #8b5cf6 0%, #06b6d4 100%)}*{box-sizing:border-box}body{margin:0;overflow-x:hidden;overflow-y:auto;background-color:var(--bg-color);color:var(--text-primary);font-family:Inter,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{background:#333;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#555}#canvas-container{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:0;transition:opacity 1s ease;background:#000}.hud{position:fixed;z-index:100;pointer-events:none;mix-blend-mode:difference}.logo{top:40px;left:60px;font-weight:600;letter-spacing:2px;font-size:14px;opacity:.8;pointer-events:auto;display:flex;align-items:center}.logo a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;transition:opacity .2s;margin-right:8px;border-bottom:1px solid transparent}.logo a:hover{opacity:1;border-bottom:1px solid rgba(255,255,255,.5)}.logo svg{width:12px;height:12px;margin-left:4px;transform:translateY(-1px)}#text-layer{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;padding-left:10%;z-index:10;pointer-events:none;background:transparent}.slide{position:absolute;opacity:0;transform:translateY(30px);transition:all 1.2s cubic-bezier(.16,1,.3,1);max-width:600px;padding:0;margin-left:0;text-shadow:0 2px 20px rgba(0,0,0,1)}.slide h1{font-weight:300}.slide p{color:#cbd5e1;font-weight:300}.slide.active{opacity:1;transform:translateY(0)}.slide.exit{opacity:0;transform:translateY(-30px)}h1{font-weight:200;font-size:4rem;margin:0 0 20px;letter-spacing:-1px;line-height:1.1}h2{font-weight:400;font-size:1.5rem;margin:0 0 15px;color:#c4b5fd;letter-spacing:1px;text-transform:uppercase}p{font-weight:200;font-size:1.1rem;line-height:1.7;color:var(--text-secondary);margin-bottom:30px}.highlight{color:#fff;font-weight:600;background-image:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.meta{font-size:.8rem;color:#64748b;text-transform:uppercase;letter-spacing:2px;margin-bottom:10px;display:block}#deep-dive-layer{position:relative;z-index:20;width:100%;margin-top:100vh;padding-bottom:20vh;pointer-events:none}.comparison-container{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:100%;margin-top:30px}.comparison-card{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:25px;display:flex;flex-direction:column;transition:transform .3s ease,border-color .3s ease}.comparison-card.standard{border-left:4px solid #64748b}.comparison-card.nvm{border-left:4px solid #8b5cf6;background:linear-gradient(145deg,#8b5cf60d,#05050c33);box-shadow:0 10px 30px #8b5cf61a}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;font-family:JetBrains Mono,monospace;font-size:.8rem;text-transform:uppercase;letter-spacing:1px}.badge{padding:4px 8px;border-radius:4px;font-size:.7rem;font-weight:600}.badge.standard{background:#64748b33;color:#94a3b8}.badge.nvm{background:#8b5cf633;color:#c4b5fd;border:1px solid rgba(139,92,246,.3)}.card-body{font-family:Inter,sans-serif;font-size:1rem;line-height:1.6;color:#e2e8f0;margin-bottom:20px;flex-grow:1}.card-meta{font-family:JetBrains Mono,monospace;font-size:.75rem;color:#64748b;border-top:1px solid rgba(255,255,255,.05);padding-top:15px}.meta-item{display:flex;align-items:center;margin-bottom:6px}.meta-icon{margin-right:8px;width:12px;height:12px;border-radius:50%}.meta-icon.off{background:#334155}.meta-icon.on{background:#06b6d4;box-shadow:0 0 8px #06b6d4}@media(max-width:768px){.comparison-container{grid-template-columns:1fr}}.content-block{min-height:auto;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;opacity:0;transition:opacity .8s ease,transform .8s ease;transform:translateY(40px);max-width:800px;margin:0 auto 150px;padding:0 40px;pointer-events:auto}.content-block.visible{opacity:1;transform:translateY(0)}.content-block h3{font-size:2.5rem;font-weight:300;margin-bottom:2rem;color:#fff;letter-spacing:-.5px;border-bottom:1px solid rgba(139,92,246,.2);padding-bottom:20px;width:100%}.content-block h4{font-size:1.2rem;color:#22d3ee;margin-top:2rem;margin-bottom:1rem;font-weight:500}.content-block p{font-size:1.1rem;color:var(--text-secondary);line-height:1.8;margin-bottom:1.5rem}.content-block ul{margin-bottom:1.5rem;padding-left:20px;color:var(--text-secondary)}.content-block li{margin-bottom:10px;line-height:1.6}.content-block strong{color:#fff;font-weight:600}.code-block{background:#ffffff0d;padding:20px;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:.9rem;color:#ccc;overflow-x:auto;margin:20px 0;border:1px solid rgba(255,255,255,.1)}.chapter{display:block;font-size:.75rem;color:#a78bfa;text-transform:uppercase;letter-spacing:3px;margin-bottom:20px;opacity:.8}.end-marker{text-align:center;align-items:center;margin-top:200px}.end-marker h3{background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;border:none;text-align:center}@media(max-width:768px){h1{font-size:2.5rem;margin-bottom:15px}h2{font-size:1.2rem}p{font-size:1rem;line-height:1.5}.logo{top:20px;left:20px;font-size:12px}#text-layer{display:block;padding:0;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,transparent 50%)}.slide{left:0;bottom:12vh;width:100%;padding:0 30px;box-sizing:border-box;text-shadow:0 2px 4px rgba(0,0,0,.9)}.content-block{padding:0 25px;margin-bottom:60px}.content-block h3{font-size:2rem}}