.harmony-helper{flex-direction:column;display:flex;position:relative}.hh-overlay{z-index:2;pointer-events:none;--hh-bracket-tick:8px;line-height:1.3;position:absolute;inset:0}.hh-band{position:absolute;left:0;right:0}.hh-band--keys,.hh-band--insert{pointer-events:auto}.hh-plus{color:#888;opacity:0;pointer-events:none;background:#fff;border:1px solid #d0d0d0;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;font-size:.875rem;font-weight:300;line-height:1;transition:opacity .12s,border-color .12s,color .12s;display:flex;position:absolute;top:50%;transform:translate(-50%,-50%)}.hh-plus.is-visible{opacity:1}.hh-band--insert:hover .hh-plus.is-visible{color:#1a1a1a;border-color:#1a1a1a}.hh-chord-actions{opacity:0;pointer-events:none;gap:.2rem;transition:opacity .12s;display:flex;position:absolute;top:50%;transform:translate(-50%,-50%)}.hh-chord-actions.is-visible{opacity:1;pointer-events:auto}.hh-chord-action{color:#888;cursor:pointer;background:#fff;border:1px solid #d0d0d0;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;padding:0;transition:border-color .12s,color .12s;display:flex}.hh-chord-action svg{width:11px;height:11px;display:block}.hh-chord-action:hover,.hh-chord-action:focus-visible{color:#1a1a1a;border-color:#1a1a1a}.hh-bracket{height:100%;position:absolute;top:0}.hh-bracket-line{height:var(--hh-bracket-tick);border:1px solid #d0d0d0;border-bottom:none;position:absolute;bottom:0;left:0;right:0}.hh-bracket-head{white-space:nowrap;pointer-events:auto;background:#fff;align-items:center;gap:.1rem;padding:0 .3rem;display:flex;position:absolute;top:0;left:50%;transform:translate(-50%)}.hh-key-field{align-items:center;display:inline-flex;position:relative}.hh-key-label{text-transform:uppercase;letter-spacing:.09em;white-space:nowrap;color:#666;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23888' stroke-width='1' fill='none'/%3E%3C/svg%3E");background-position:right 0 center;background-repeat:no-repeat;padding-right:.9rem;font-size:.6875rem;font-weight:400;transition:color .15s}select.hh-key{opacity:0;cursor:pointer;width:100%;height:100%;font:inherit;border:none;border-radius:0;margin:0;padding:0;position:absolute;inset:0}.hh-key-field:hover .hh-key-label,select.hh-key:focus-visible+.hh-key-label{color:#1a1a1a}select.hh-key:focus-visible+.hh-key-label{outline-offset:2px;outline:1px solid #1a1a1a}.hh-key-remove{color:#ccc;cursor:pointer;background:0 0;border:none;padding:0 .1rem;font-family:inherit;font-size:.75rem;line-height:1;transition:color .12s}.hh-key-remove:hover{color:#1a1a1a}.hh-key-add{color:#bbb;cursor:pointer;background:0 0;border:none;padding:0 .15rem;font-family:inherit;font-size:.8125rem;line-height:1;transition:color .12s}.hh-key-add:hover:not(:disabled){color:#1a1a1a}.hh-key-add:disabled{opacity:.35;cursor:default}.hh-boundary{touch-action:none;cursor:col-resize;opacity:0;pointer-events:auto;background:0 0;border:none;width:18px;padding:0;transition:opacity .12s;position:absolute;top:18px;bottom:0;transform:translate(-50%)}.hh-boundary:before{content:"";width:1px;height:var(--hh-bracket-tick);background:#bbb;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.hh-band--keys:hover .hh-boundary,.hh-boundary:focus-visible{opacity:1}.hh-boundary:hover:before{background:#1a1a1a}.hh-overlay.is-dragging-boundary{cursor:col-resize}.hh-overlay.is-dragging-boundary .hh-boundary{opacity:1}.hh-overlay.is-dragging-boundary .hh-boundary:before{background:#1a1a1a}.hh-band--labels{pointer-events:none}.hh-label{white-space:nowrap;pointer-events:auto;cursor:grab;touch-action:none;position:absolute;top:0;transform:translate(-50%)}.hh-label.is-preview{cursor:default}.hh-label.is-dragging{cursor:grabbing}.hh-label.is-dragging .hh-label-name{color:#3d5a80}.hh-overlay.is-dragging-chord{cursor:grabbing}.hh-label-name{color:#1a1a1a;letter-spacing:.01em;font-size:.875rem;font-weight:300}.hh-label.is-preview .hh-label-name{color:#3d5a80;opacity:.6}.harmony-canvas .music-canvas__note[data-note-id=harmony-preview]{opacity:.45}.harmony-canvas .music-canvas__note[data-note-id=harmony-preview] text{fill:#3d5a80}.hh-popover{z-index:20;background:#fff;border:1px solid #d0d0d0;width:272px;padding:.5rem;position:absolute;box-shadow:0 6px 24px #00000014}.hh-popover[hidden]{display:none}.hh-search{color:#1a1a1a;background:#fff;border:none;border-bottom:1px solid #d0d0d0;border-radius:0;outline:none;width:100%;padding:.4rem 0;font-family:inherit;font-size:.8125rem;font-weight:300;transition:border-color .15s}.hh-search:focus{border-bottom-color:#1a1a1a}.hh-search::placeholder{color:#bbb}.hh-results{scrollbar-width:thin;max-height:240px;margin-top:.35rem;overflow-y:auto}.hh-result{text-align:left;cursor:pointer;background:0 0;border:none;align-items:baseline;gap:.5rem;width:100%;padding:.35rem .4rem;font-family:inherit;display:flex}.hh-result.is-highlighted{background:#f4f4f4}.hh-result-name{color:#1a1a1a;flex:none;font-size:.8125rem;font-weight:300}.hh-result-desc{text-overflow:ellipsis;white-space:nowrap;color:#888;flex:auto;min-width:0;font-size:.75rem;font-weight:300;overflow:hidden}.hh-result-hint{color:#bbb;flex:none;font-size:.6875rem;font-weight:300}.hh-results-empty{color:#888;padding:.5rem .4rem;font-size:.75rem;font-weight:300}.harmony-analysis{min-height:8rem;margin-top:2.5rem}.harmony-analysis-title{text-transform:uppercase;letter-spacing:.09em;color:#1a1a1a;margin-bottom:1rem;font-size:.6875rem;font-weight:400}.harmony-analysis-message{color:#888;font-size:.8125rem;font-weight:300}.harmony-analysis-list{border-bottom:1px solid #d0d0d0}.harmony-item{border-top:1px solid #f0f0f0;grid-template-columns:1.25rem 1.25rem minmax(0,1fr) 6.5rem 5rem 8.5rem 1.25rem;align-items:center;gap:.35rem .75rem;padding:.85rem 0;display:grid}.harmony-item[data-chord-index]{grid-template-rows:auto auto}.harmony-item[data-chord-index]>.harmony-item-handle,.harmony-item[data-chord-index]>.harmony-item-replace,.harmony-item[data-chord-index]>.harmony-item-remove{grid-row:1/-1;align-self:center}.harmony-item[data-chord-index]>.harmony-item-handle{grid-column:1}.harmony-item[data-chord-index]>.harmony-item-replace{grid-column:2}.harmony-item[data-chord-index]>.harmony-item-remove{grid-column:7}.harmony-item.is-dragging{background:#fafafa}.harmony-analysis-list.is-dragging-row{cursor:grabbing;user-select:none}.harmony-item-handle,.harmony-item-replace,.harmony-item-remove{color:#d5d5d5;background:0 0;border:none;justify-content:center;align-items:center;width:1.25rem;height:1.25rem;padding:0;transition:color .12s;display:inline-flex}.harmony-item-handle svg,.harmony-item-replace svg,.harmony-item-remove svg,.harmony-add svg{width:12px;height:12px;display:block}button.harmony-item-handle{cursor:grab;touch-action:none}button.harmony-item-replace,button.harmony-item-remove{cursor:pointer}.harmony-item.is-dragging button.harmony-item-handle{cursor:grabbing}button.harmony-item-handle:hover,button.harmony-item-replace:hover,button.harmony-item-remove:hover,button.harmony-item-handle:focus-visible,button.harmony-item-replace:focus-visible,button.harmony-item-remove:focus-visible{color:#1a1a1a}.harmony-item--add{justify-content:center;padding:.6rem 0;display:flex}.harmony-add{color:#bbb;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:1.5rem;height:1.5rem;padding:0;transition:color .12s;display:inline-flex}.harmony-add:hover,.harmony-add:focus-visible{color:#1a1a1a}.harmony-item--search{grid-template-columns:1.25rem 1.25rem minmax(0,1fr);row-gap:0}.harmony-item--search .hh-search,.harmony-item--search .hh-results{grid-column:3}.harmony-item--head{border-top:1px solid #d0d0d0;padding:.5rem 0}.harmony-item-column{text-transform:uppercase;letter-spacing:.09em;color:#888;font-size:.6875rem;font-weight:400}.harmony-item-chord{align-items:baseline;gap:.6rem;min-width:0;display:flex}.harmony-item-name{color:#1a1a1a;font-size:.875rem;font-weight:300}.harmony-item-display{text-overflow:ellipsis;white-space:nowrap;color:#888;font-size:.75rem;font-weight:300;overflow:hidden}.harmony-item-key,.harmony-item-role{color:#666;font-size:.75rem;font-weight:300}.harmony-item-numeral{color:#1a1a1a;font-size:.875rem;font-weight:400}.harmony-item-detail{color:#999;grid-column:3/7;font-size:.75rem;font-weight:300;line-height:1.6}@media (width<=760px){.harmony-item{grid-template-columns:1.25rem 1.25rem auto minmax(0,1fr) 1.25rem;row-gap:.25rem}.harmony-item--head,.harmony-item-key{display:none}.harmony-item-chord{grid-column:3/5}.harmony-item-numeral{grid-column:3}.harmony-item-role{grid-column:4}.harmony-item[data-chord-index]{grid-template-rows:auto auto auto}.harmony-item[data-chord-index]>.harmony-item-remove{grid-column:5}.harmony-item-detail{grid-column:3/5}.harmony-item--search{grid-template-columns:1.25rem 1.25rem minmax(0,1fr)}.harmony-item--search .hh-search,.harmony-item--search .hh-results{grid-column:3}}