.fretboard{border-top:1px solid #373a40;border-bottom:1px solid #373a40;transition:border-color .3s;display:flex}.fret{border-left:1px solid #373a40;flex-direction:column;flex:1;transition:border-color .3s;display:flex}.note{text-align:center;color:#000;background-color:#fff;border-bottom:1px solid #373a40;padding:4px;font-size:.8rem;transition:all .3s}.note.open{color:#fff;background-color:#303033;font-weight:700}.note.scale{color:#fff;background-color:#303033}.note.highlight{color:#000;background-color:gold;font-weight:700}.note.highlight-p0{background-color:#e6c200}.note.highlight-p1{background-color:#cca800}.note.highlight-p2{background-color:#b38f00}.note.highlight-p3{background-color:#d4b800}.fretboard-wrapper{overflow-x:auto}