*{box-sizing:border-box}body{color:orange;background-image:linear-gradient(#00000080,#00000080),url(/lain-sdr-chall/assets/lain_background-Co1QNTqQ.jpg);background-repeat:repeat;background-size:cover;min-width:320px;margin:0;padding:1rem}.app{max-width:1200px;margin:0 auto}.content{grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:1rem;display:grid}.metrics-list{margin:.5rem 0;padding-left:1.25rem}.metrics-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.canvas-wrap{border:1px solid #999;position:relative}.spectrogram-canvas{width:100%;height:26rem;display:block}.overlay-top,.overlay-bottom{pointer-events:none;padding:.5rem;font-size:.875rem;position:absolute;left:0;right:0}.overlay-top{justify-content:space-between;display:flex;top:0}.overlay-bottom{bottom:0}.hover-tooltip{z-index:20;pointer-events:none;white-space:nowrap;background:#fff;border:1px solid #666;padding:.25rem .5rem;font-size:.75rem;position:absolute}@media (width<=900px){.content,.metrics-columns{grid-template-columns:1fr}}