:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400}body{margin:0;padding:0;overflow:hidden;background-color:#000;background:linear-gradient(135deg,#0a0e2a,#000);background-attachment:fixed;color:#fff;position:relative}body:before,body:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}body:before{background:radial-gradient(circle at 20% 30%,rgba(19,33,93,.2) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(19,33,93,.15) 0%,transparent 50%),radial-gradient(circle at 50% 50%,rgba(19,33,93,.1) 0%,transparent 60%);opacity:.3;animation:fadeAreas1 12s cubic-bezier(.4,0,.6,1) infinite}body:after{background:radial-gradient(circle at 80% 30%,rgba(19,33,93,.2) 0%,transparent 50%),radial-gradient(circle at 20% 70%,rgba(19,33,93,.15) 0%,transparent 50%),radial-gradient(circle at 50% 20%,rgba(19,33,93,.1) 0%,transparent 60%);opacity:.05;animation:fadeAreas2 12s cubic-bezier(.4,0,.6,1) infinite;animation-delay:6s;animation-fill-mode:both}@keyframes fadeAreas1{0%{opacity:.3}20%{opacity:.4}40%{opacity:.15}60%{opacity:.05}80%{opacity:.25}to{opacity:.3}}@keyframes fadeAreas2{0%{opacity:.3}20%{opacity:.2}40%{opacity:.45}60%{opacity:.6}80%{opacity:.3}to{opacity:.3}}#app{width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:1}canvas{display:block}