html,body,#root{width:100%;height:100%;margin:0;padding:0}canvas{display:block}*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sound-bars{display:flex;align-items:flex-end;justify-content:center;gap:3px;height:100%;width:100%}.bar{width:3px;background:linear-gradient(to top,#06b6d4,#0ff);border-radius:2px;animation:sound .6s ease-in-out infinite;opacity:.8}.bar-1{height:20%;animation-delay:0s}.bar-2{height:40%;animation-delay:.1s}.bar-3{height:60%;animation-delay:.2s}.bar-4{height:80%;animation-delay:.3s}@keyframes sound{0%,to{height:20%}25%{height:40%}50%{height:80%}75%{height:50%}}