:root{--bg-dark: #0a0a0f;--text-main: #f0f0f5;--text-muted: #a0a0b0;--primary: #e50914;--primary-glow: rgba(229, 9, 20, .4);--secondary: #6b21a8;--secondary-glow: rgba(107, 33, 168, .4);--glass-bg: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Outfit,sans-serif;background-color:var(--bg-dark);color:var(--text-main);line-height:1.6;overflow-x:hidden;position:relative}.background-effects{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:-1;overflow:hidden;pointer-events:none}.glow{position:absolute;border-radius:50%;filter:blur(100px);opacity:.5;animation:float 20s infinite ease-in-out alternate}.glow-1{top:-10%;left:-10%;width:50vw;height:50vw;background:var(--primary-glow)}.glow-2{bottom:-10%;right:-10%;width:40vw;height:40vw;background:var(--secondary-glow);animation-delay:-5s}.glow-3{top:40%;left:40%;width:30vw;height:30vw;background:#2dd4bf33;animation-duration:25s}@keyframes float{0%{transform:translate(0) scale(1)}to{transform:translate(5%,10%) scale(1.1)}}.glass{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:0 8px 32px #0000004d}.gradient-text{background:linear-gradient(to right,#ff4b4b,#ff7e5f);-webkit-background-clip:text;background-clip:text;color:transparent}.navbar{position:fixed;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem 5%;z-index:100}.logo{display:flex;align-items:center;gap:.5rem;font-weight:800;font-size:1.25rem;letter-spacing:-.5px}.logo-icon{display:flex;align-items:center;justify-content:center}.logo-text{background:#fff;-webkit-background-clip:text;background-clip:text;color:transparent}.nav-links{display:flex;gap:2rem}.nav-links a{color:var(--text-muted);text-decoration:none;font-weight:600;transition:color .3s ease}.nav-links a:hover{color:var(--text-main)}.github-link{display:flex;align-items:center}.hero{min-height:100vh;display:flex;align-items:center;justify-content:space-between;padding:8rem 5% 4rem;max-width:1400px;margin:0 auto;gap:4rem}.hero-content{flex:1;max-width:600px}.hero-title{font-size:clamp(2.5rem,5vw,3.5rem);font-weight:800;line-height:1.1;margin-bottom:1.5rem;letter-spacing:-2px}.hero-subtitle{font-size:1.25rem;color:var(--text-muted);margin-bottom:2.5rem;font-weight:300}.cta-group{display:flex;gap:1rem}.btn{padding:.875rem 1.5rem;border-radius:.75rem;font-weight:600;font-size:1rem;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer}.btn-primary{background:var(--primary);color:#fff;border:none;box-shadow:0 4px 14px 0 var(--primary-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #e5091499}.btn-secondary{color:#fff}.btn-secondary:hover{transform:translateY(-2px);background:#ffffff1a}.hero-visual{flex:1;perspective:1000px}.browser-mockup{border-radius:12px;overflow:hidden;box-shadow:0 25px 50px -12px #00000080;transition:transform .3s ease,box-shadow .3s ease}.browser-header{background:#00000080;padding:1rem;display:flex;gap:.5rem;border-bottom:1px solid var(--glass-border)}.dot{width:12px;height:12px;border-radius:50%}.dot.red{background:#ff5f56}.dot.yellow{background:#ffbd2e}.dot.green{background:#27c93f}.browser-body{background:#000;aspect-ratio:16/9;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:flex-start}.video-placeholder{width:100%;aspect-ratio:16/9;height:auto;background:radial-gradient(circle at center,#2a2a2a,#141414);position:relative;flex-shrink:0;overflow:hidden;container-type:inline-size}.mock-netflix-ui{position:absolute;top:0;left:0;width:100%;height:100%;padding:3cqi 4cqi;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(to bottom,rgba(0,0,0,.4) 0%,transparent 15%,transparent 70%,rgba(0,0,0,.85) 100%);pointer-events:none}.mock-top-controls{display:flex;align-items:center}.mock-back{width:24px;height:24px;color:#fff;opacity:.9}.mock-bottom-controls{display:flex;flex-direction:column;gap:.75rem}.mock-progress-bar{width:100%;height:3px;background:#ffffff4d;position:relative;border-radius:2px}.mock-progress-fill{width:45%;height:100%;background:#e50914;border-radius:2px}.mock-progress-handle{position:absolute;top:50%;left:45%;transform:translate(-50%,-50%);width:12px;height:12px;background:#e50914;border-radius:50%}.mock-controls-row{display:flex;justify-content:space-between;align-items:center}.mock-controls-left,.mock-controls-right{display:flex;gap:.5rem;align-items:center}.mock-icon{width:20px;height:20px;color:#fff;display:flex;align-items:center;justify-content:center}.danmaku-layer{position:absolute;inset:0;pointer-events:none;z-index:10;animation:fadeTrackFlow 15s infinite}.danmaku-track{position:absolute;white-space:nowrap;font-weight:600;font-size:1.2rem;text-shadow:1px 1px 2px black,-1px -1px 2px black,1px -1px 2px black,-1px 1px 2px black;animation:slide 8s linear infinite;transform:translate(0);left:100%}.t1{top:10%}.t2{top:25%}.t3{top:15%}.t4{top:35%}@keyframes slide{0%{left:100%;transform:translate(0)}to{left:0%;transform:translate(-100%)}}footer{text-align:center;padding:2rem 5%;margin-top:4rem;border-top:1px solid var(--glass-border);color:var(--text-muted)}.footer-content{display:flex;flex-direction:column;align-items:center;gap:.75rem}.footer-links{display:flex;gap:1.5rem}.footer-links a{color:var(--text-muted);text-decoration:none;font-size:.875rem;font-weight:500;display:flex;align-items:center;gap:.375rem;transition:color .3s ease}.footer-links a:hover{color:var(--text-main)}.skip-link{position:absolute;top:-100%;left:1rem;padding:.5rem 1rem;background:var(--primary);color:#fff;border-radius:.5rem;text-decoration:none;font-weight:600;z-index:200;transition:top .2s}.skip-link:focus{top:1rem}@media(max-width:968px){.hero{flex-direction:column;text-align:center;padding-top:8rem}.hero-content{max-width:100%;display:flex;flex-direction:column;align-items:center}.cta-group{justify-content:center}.hero-visual{width:100%;max-width:600px}.browser-mockup{transform:none}.browser-mockup:hover{transform:translateY(-5px)}.hero-title{font-size:clamp(2rem,8vw,3.5rem)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.flow-browser-wrapper{position:relative;width:100%;max-width:100%}.animated-browser{position:relative}.mock-extension-layer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:50;pointer-events:none}.mock-panel-icon{position:absolute;bottom:80px;right:32px;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;background:#0f0f0fd9;border:1px solid rgba(255,255,255,.15);box-shadow:0 4px 12px #00000080;animation:iconVis 15s infinite}.mock-pointer-cursor{position:absolute;bottom:80px;right:32px;width:24px;height:24px;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" stroke="black" stroke-width="1"><path d="M7 2l12 11.2h-5.8l3.3 7.3-2.2.9-3.2-7.4-4.4 4.7z"/></svg>');background-size:contain;z-index:60;animation:cursorFlow 15s infinite;opacity:0}.nd-input-panel-mock{position:absolute;bottom:80px;right:32px;display:flex;gap:16px;background:#0f0f0ff2;padding:8px 16px;border-radius:30px;align-items:center;box-sizing:border-box;width:320px;height:48px;border:1px solid rgba(255,255,255,.15);box-shadow:0 10px 30px #000000b3;z-index:20;opacity:0;animation:panelFlow 15s infinite}.typing-text{opacity:1;min-height:20px;display:inline-block;color:var(--text-primary)}.typing-text:before{content:"​";animation:typingFlow 15s cubic-bezier(.1,.7,1,.1) infinite}.mock-enter-key{position:absolute;right:70px;top:50%;transform:translateY(-50%) scale(.8);background:#ffffffe6;color:#111;font-size:11px;font-weight:700;padding:4px 8px;border-radius:4px;box-shadow:0 3px #999;letter-spacing:.5px;z-index:10;opacity:0;animation:enterFlow 15s infinite}.nd-sidebar-mock{position:absolute;top:0;right:0;bottom:0;background:#0f0f0ff2;border-left:1px solid rgba(255,255,255,.1);overflow:hidden;display:flex;flex-direction:column;width:250px;height:100%;text-align:left;box-shadow:-5px 0 20px #00000080;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:0 0 12px;transform:translate(100%);opacity:1;animation:sidebarFlow 15s infinite}.new-item{opacity:0;animation:msgPopFlow 15s cubic-bezier(.175,.885,.32,1.275) infinite}.nd-color-picker-mock{display:flex;align-items:center}.nd-current-color-mock{width:18px;height:18px;border-radius:50%;border:2px solid #ffffff;cursor:pointer}.nd-input-field-mock{flex:1;border-bottom:1px solid rgba(255,255,255,.2);font-size:14px;padding-bottom:2px;text-align:left;white-space:pre;overflow:hidden;text-overflow:clip;display:flex;align-items:flex-end}.nd-divider-mock{width:1px;height:24px;background:#fff3;margin:0 4px}.nd-btn-mock,.nd-btn-sidebar-mock,.nd-btn-danmaku-mock{display:flex;align-items:center;justify-content:center;color:#fff;opacity:.8;padding:4px;border-radius:50%}.nd-btn-sidebar-mock{animation:sidebarHoverFlow 15s infinite}.nd-btn-danmaku-mock{animation:toggleHoverFlow 15s infinite}.nd-sidebar-header-mock{padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:space-between}.nd-sidebar-mode-pill-mock{display:flex;align-items:center;background:#ffffff14;border-radius:20px;padding:2px}.nd-sidebar-mode-pill-mock span{color:var(--text-muted);padding:3px 10px;border-radius:16px;font-size:12px;font-weight:500}.nd-sidebar-mode-pill-mock span.active{background:#ffffff2e;color:#fff}.nd-sidebar-close-mock{color:var(--text-muted);display:flex;align-items:center}.nd-sidebar-list-mock{flex:1;padding:12px;display:flex;flex-direction:column;gap:8px}.nd-sidebar-item-mock{display:flex;gap:8px;font-size:13px;line-height:1.4;opacity:1}.nd-sidebar-time-mock{color:#fff6;font-family:monospace;flex-shrink:0}.nd-sidebar-text-mock{word-break:break-word}@keyframes iconVis{0%,14%{opacity:1;transform:scale(1)}15%,95%{opacity:0;transform:scale(.8)}98%,to{opacity:1;transform:scale(1)}}@keyframes cursorFlow{0%,6%{opacity:0;transform:translate(-300px,-200px)}8%{opacity:1;transform:translate(-300px,-200px)}12%{opacity:1;transform:translate(0) scale(1)}14%{opacity:1;transform:translate(0) scale(.8)}16%{opacity:1;transform:translate(0) scale(1)}20%{opacity:1;transform:translate(-62px) scale(1)}22%{opacity:1;transform:translate(-62px) scale(.8)}24%{opacity:1;transform:translate(-62px) scale(1)}28%,62%{opacity:0;transform:translate(50px,30px)}65%{opacity:1;transform:translate(50px,30px)}70%{opacity:1;transform:translate(-18px) scale(1)}72%{opacity:1;transform:translate(-18px) scale(.8)}74%{opacity:1;transform:translate(-18px) scale(1)}78%,to{opacity:0;transform:translate(-18px,30px)}}@keyframes panelFlow{0%,14%{opacity:0;transform:scaleX(.2) scaleY(.2);transform-origin:right center}16%,95%{opacity:1;transform:scaleX(1) scaleY(1);transform-origin:right center}96%,to{opacity:0;transform:scaleX(.2) scaleY(.2)}}@keyframes sidebarHoverFlow{0%,19%{background:transparent;opacity:.8}20%,25%{background:#fff3;opacity:1}26%,to{background:transparent;opacity:.8}}@keyframes toggleHoverFlow{0%,69%{background:transparent;opacity:.8}70%,75%{background:#fff3;opacity:1;color:var(--accent-color, white)}76%,to{background:transparent;opacity:.4}}.nd-toast-mock{position:absolute;top:10%;left:50%;margin-left:-125px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f0f0ff2;color:#fff;padding:12px 24px;border-radius:8px;border:1px solid rgba(255,255,255,.15);box-shadow:0 4px 20px #0009;font-size:14px;font-weight:500;z-index:1000;pointer-events:none;display:flex;align-items:center;justify-content:center;gap:8px;opacity:0;animation:toastFlow 15s infinite}@keyframes toastFlow{0%,72%{opacity:0;transform:translateY(-20px)}74%,85%{opacity:1;transform:translateY(0)}90%,to{opacity:0;transform:translateY(-20px)}}.flow-browser-wrapper .video-placeholder{animation:videoShrinkFlow 15s cubic-bezier(.25,1,.5,1) infinite}@keyframes sidebarFlow{0%,24%{transform:translate(100%)}28%,95%{transform:translate(0)}98%,to{transform:translate(100%)}}@keyframes videoShrinkFlow{0%,24%{width:100%}28%,95%{width:calc(100% - 250px)}98%,to{width:100%}}@keyframes typingFlow{0%,28%{content:"​"}29%{content:"L"}30%{content:"LMA"}32%{content:"LMAO "}33%{content:"LMAO t"}35%{content:"LMAO tha"}36%{content:"LMAO that "}38%{content:"LMAO that sc"}40%{content:"LMAO that scen"}41%,45%{content:"LMAO that scene 🤣"}46%,to{content:"​"}}@keyframes enterFlow{0%,40%{opacity:0;transform:translateY(-50%) scale(.8);box-shadow:0 3px #999}42%{opacity:1;transform:translateY(-50%) scale(1);box-shadow:0 3px #999}44%{opacity:1;transform:translateY(-45%) scale(.95);box-shadow:0 0 #999}46%,to{opacity:0;transform:translateY(-50%) scale(.8);box-shadow:0 3px #999}}@keyframes msgPopFlow{0%,45%{opacity:0;transform:translateY(20px) scale(.9)}46%,95%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(20px) scale(.9)}}.flow-browser-wrapper .danmaku-synced{animation:slideSyncFlow 15s linear infinite;left:100%;right:auto;transform:translate(0)}@keyframes slideSyncFlow{0%,45%{left:100%;transform:translate(0);opacity:0}46%{left:100%;transform:translate(0);opacity:1}90%{left:0%;transform:translate(-100%);opacity:1}91%,to{left:0%;transform:translate(-100%);opacity:0}}@keyframes fadeTrackFlow{0%,74%{opacity:1;visibility:visible}75%,to{opacity:0;visibility:hidden}}
