.song-archive-picker { position: relative; }
.song-archive-picker__control { position: relative; border: 1px solid var(--bs-border-color); border-radius: .75rem; background: var(--bs-body-bg); transition: border-color .15s, box-shadow .15s; }
.song-archive-picker__control:focus-within { border-color: var(--bs-primary); box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .2); }
.song-archive-picker__search { display: flex; align-items: center; gap: .35rem; min-height: 3rem; padding: .25rem .4rem .25rem .8rem; }
.song-archive-picker__search > .bi-search { color: var(--bs-secondary-color); }
.song-archive-picker__search .form-control { min-width: 0; border: 0; background: transparent; box-shadow: none; }
.song-archive-picker__clear, .song-archive-picker__edit { color: var(--bs-secondary-color); border: 0; }
.song-archive-picker__clear:hover, .song-archive-picker__edit:hover { color: var(--bs-body-color); background: var(--bs-tertiary-bg); }
.song-archive-picker [data-song-archive-spinner] { display: none; }
.song-archive-picker.is-loading [data-song-archive-spinner] { display: inline-block; }
.song-archive-picker__list { position: absolute; z-index: 1050; top: calc(100% + .35rem); right: 0; left: 0; max-height: 25rem; overflow-y: auto; padding: .4rem; border: 1px solid var(--bs-border-color); border-radius: .75rem; background: var(--bs-body-bg); box-shadow: 0 .75rem 2rem rgba(0,0,0,.3); }
.song-archive-picker__option { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .5rem; padding: .75rem; border: 1px solid transparent; border-radius: .6rem; cursor: pointer; }
.song-archive-picker__option:hover, .song-archive-picker__option.is-active { border-color: rgba(var(--bs-primary-rgb),.45); background: rgba(var(--bs-primary-rgb),.1); }
.song-archive-picker__option[aria-selected="true"] { border-color: var(--bs-primary); background: rgba(var(--bs-primary-rgb),.16); }
.song-archive-picker__option.is-unavailable { opacity: .58; cursor: not-allowed; }
.song-archive-picker__option-head { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.song-archive-picker__title { overflow: hidden; color: var(--bs-body-color); font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.song-archive-picker__badge { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .3rem; padding: .15rem .45rem; border-radius: 999px; font-size: .72rem; font-weight: 700; }
.song-archive-picker__badge.is-original { color: #9eeaf9; background: rgba(13,202,240,.16); }
.song-archive-picker__badge.is-master { color: #e7c6ff; background: rgba(160,80,255,.2); }
.song-archive-picker__badge:focus-visible { outline: 2px solid var(--bs-primary); outline-offset: 2px; }
.song-archive-picker__primary-meta, .song-archive-picker__secondary-meta { display: flex; flex-wrap: wrap; gap: .25rem .9rem; margin-top: .3rem; color: var(--bs-secondary-color); font-size: .82rem; }
.song-archive-picker__primary-meta span:not(:last-child)::after { margin-left: .9rem; content: "·"; }
.song-archive-picker__secondary-meta { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .75rem; }
.song-archive-picker__availability { display: inline-flex; align-items: center; gap: .3rem; align-self: start; color: var(--bs-danger); font-size: .72rem; }
.song-archive-picker__availability.is-available { color: var(--bs-success); }
.song-archive-picker__availability .bi { font-size: .45rem; }
.song-archive-picker__summary { display: flex; align-items: center; gap: .5rem; min-height: 3rem; padding: .55rem .4rem .55rem .8rem; }
.song-archive-picker__selected-content { min-width: 0; flex: 1; }
.song-archive-picker__state { display: grid; justify-items: center; gap: .35rem; padding: 2rem 1rem; color: var(--bs-secondary-color); text-align: center; }
.song-archive-picker__state > .bi { font-size: 1.5rem; }
.song-archive-picker__state strong { color: var(--bs-body-color); }
@media (max-width: 575.98px) {
    .song-archive-picker__list { max-height: min(22rem, 60vh); }
    .song-archive-picker__option { grid-template-columns: 1fr; }
    .song-archive-picker__availability { grid-row: 2; }
    .song-archive-picker__primary-meta { gap: .2rem .55rem; }
    .song-archive-picker__primary-meta span:not(:last-child)::after { margin-left: .55rem; }
}
