.chord-loop-control-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr) minmax(0,.8fr) minmax(0,1.1fr);align-items:center;padding-block:.2rem}.chord-loop-control-grid :is(.chord-loop-action,input,.custom-select-trigger){height:var(--menu-settings-control-height)}#chord-loop-bars .custom-select-trigger{display:grid;grid-template-columns:minmax(0,1fr) .65rem;column-gap:.12rem;padding:0 .18rem 0 .08rem}#chord-loop-bars .custom-select-value{white-space:normal;word-break:keep-all;overflow-wrap:anywhere;text-overflow:clip;line-height:1.05}#chord-loop-bars .custom-select-trigger:after{position:static;grid-column:2;grid-row:1;justify-self:center;transform:rotate(45deg)}#chord-loop-bars[data-open=true] .custom-select-trigger:after{transform:rotate(225deg)}#chord-progression-library-toggle{--progression-chevron-size: .75rem;display:inline-flex;align-items:center;justify-content:flex-start;gap:.2rem;padding:calc((var(--menu-settings-control-height) - var(--progression-chevron-size)) / 2);background:var(--brand-warm-white);color:var(--brand-charcoal);font-size:clamp(.48rem,1vw,.62rem)}.chord-progression-chevron{width:var(--progression-chevron-size);height:var(--progression-chevron-size);flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}#chord-progression-library-toggle[aria-expanded=true] .chord-progression-chevron{transform:rotate(180deg)}#chord-progression-library-toggle[aria-expanded=true]{background:var(--brand-pink);color:var(--brand-charcoal)}#chord-loop-metronome,#chord-loop-count-in{align-self:center;padding-inline:.15rem;font-size:clamp(.38rem,.8vw,.49rem)}.chord-loop-timeline-header strong{display:flex;min-width:0;overflow:hidden;white-space:nowrap}#chord-progression-current-name{overflow:hidden;text-overflow:ellipsis}.chord-loop-timeline-header output{flex-shrink:0;margin-left:.4rem}.chord-progression-library{position:fixed;z-index:130;display:flex;flex-direction:column;box-sizing:border-box;gap:.3rem;padding:.3rem;border:1px solid rgb(255 255 255 / 22%);border-radius:.55rem;background:#18151bf5;color:var(--brand-warm-white);box-shadow:0 .5rem 1.8rem #00000052;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-size:clamp(.48rem,1vw,.62rem);line-height:1.2;-webkit-user-select:none;user-select:none}.chord-progression-library[hidden]{display:none}.chord-progression-library .floating-menu-heading{flex-shrink:0;padding:.08rem .12rem}.chord-progression-library button{font:inherit;cursor:pointer;touch-action:manipulation}.chord-progression-library .floating-menu-close{width:1rem;height:1rem;flex-basis:1rem}#chord-progression-new{flex-shrink:0;box-sizing:border-box;height:2.3rem;border:1px dashed rgb(255 255 255 / 28%);border-radius:.55rem;background:transparent;color:#ffffffbf;padding:.25rem .2rem}.chord-progression-list{display:flex;flex-direction:column;gap:.28rem;min-height:0;padding:.08rem;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / 25%) transparent}.chord-progression-row{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.22rem;flex-shrink:0;align-items:center}.chord-progression-capsule{display:flex;box-sizing:border-box;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;min-width:0;height:2.3rem;min-height:2.3rem;border:1px solid rgb(255 255 255 / 12%);border-radius:.55rem;padding:.2rem .5rem;background:#ffffff0f;color:#ffffffdb;touch-action:pan-y!important}.chord-progression-capsule span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chord-progression-capsule small{color:#ffffff70;font-size:.8em}.chord-progression-capsule[aria-current=true]{border-color:var(--brand-pink);background:color-mix(in srgb,var(--brand-pink) 22%,transparent)}.chord-progression-delete{position:absolute;top:.22rem;left:.22rem;width:1rem;height:1rem;padding:0;border:0;border-radius:50%;color:#ffffff8c;background:#302a31}.chord-progression-row:has(.chord-progression-delete) .chord-progression-capsule{padding-inline:1.35rem}.chord-progression-save{border:0;border-radius:.35rem;padding:.32rem .18rem;background:transparent;color:var(--brand-pink);white-space:nowrap;font-size:.94em!important}.chord-progression-library button:focus-visible,.chord-progression-dialog button:focus-visible{outline:2px solid var(--brand-pink);outline-offset:2px}#chord-progression-library-error{margin:0;color:#ffb2a6;font-size:inherit}.chord-progression-dialog{position:fixed;box-sizing:border-box;width:min(18rem,calc(100vw - 2rem));max-height:calc(100dvh - 2rem);overflow:auto;padding:2rem .75rem .7rem;border:1px solid rgb(255 255 255 / 20%);border-radius:.65rem;background:#211c23;color:var(--brand-warm-white);font-size:.68rem;box-shadow:0 1rem 3rem #0006}.chord-progression-dialog::backdrop{background:#00000061}.chord-progression-dialog h2{margin:0 0 .6rem;font-size:.75rem;overflow-wrap:anywhere}.chord-progression-dialog button{font:inherit;cursor:pointer;touch-action:manipulation}.chord-progression-dialog-cancel{position:absolute;top:.4rem;right:.45rem;border:0;background:transparent;color:#bcb2bd;font-size:.62rem!important;padding:.2rem}.chord-progression-dialog input{width:100%;box-sizing:border-box;padding:.4rem;border:1px solid rgb(255 255 255 / 30%);border-radius:.4rem;background:#312a33;color:#fff;font:inherit;-webkit-user-select:text;user-select:text}.chord-progression-dialog [role=status]{color:#ffb2a6;font-size:inherit}.chord-progression-dialog [role=status]:empty{display:none}.chord-progression-dialog-actions{display:flex;gap:.3rem;margin-top:.6rem}.chord-progression-dialog-actions button{flex:1;padding:.45rem;border:1px solid rgb(255 255 255 / 20%);border-radius:.35rem;color:#fff;background:#39313c}.chord-progression-dialog-actions button.is-primary{background:var(--brand-pink);color:#211c23;border-color:transparent}