.design-bar{background:#dce3e8;padding:14px 24px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-size:13px;color:#51616e}.design-bar b{font-size:14px;color:#344451}.design-bar label{margin-left:auto;display:flex;gap:8px;align-items:center}.design-bar select{padding:6px 10px;background:#f4f6f8;border:1px solid #bbc5ce;border-radius:6px;color:#344451;font:inherit}.queue-header{margin-bottom:22px}.text-button{font-size:14px;padding:7px 5px;background:transparent;color:#8f3a1a;border-radius:5px}.text-button:hover{text-decoration:underline;text-underline-offset:4px}.library-toolbar{display:flex;gap:16px;align-items:center}.source-select{display:flex;align-items:center;min-width:0;flex:1;padding:7px 13px;border-radius:12px;box-shadow:var(--inset);gap:10px;color:#566675}.source-select select{width:100%;min-width:0;border:0;outline-offset:1px;background:transparent;font:inherit;font-size:16px;color:var(--ink);padding:9px 2px;cursor:pointer}.icon-button{flex-shrink:0;display:grid;place-items:center;padding:0;width:42px;height:42px;border-radius:50%;background:var(--surface);box-shadow:5px 5px 11px #cad0d7,-5px -5px 11px #fff}.icon-button svg{width:20px;height:20px}.library-summary{display:flex;justify-content:space-between;gap:12px;font-size:12px;line-height:1.7;color:var(--muted);margin:18px 2px}.list{max-height:360px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:6px}.track{padding:16px 10px;gap:12px}.track .name{font-size:15px}.track .detail{font-size:12px}.selection-note{font-size:12px;line-height:1.8;margin-top:25px}.library-feedback{border:1px solid #bac6d0;padding:25px 20px;border-radius:16px;text-align:center;line-height:1.8;margin:15px 0}.library-feedback h4{font-size:17px;margin:10px 0 8px;font-weight:600}.library-feedback p{font-size:14px;color:var(--muted);margin:0 0 15px}.solid-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#ae431e;color:white;padding:12px 18px;border-radius:11px;font-size:14px;min-height:44px}.solid-button svg{width:18px;height:18px}.library-feedback .spinner{margin:auto}.error-text{color:#9b3d20!important}.library-feedback[hidden],[hidden]{display:none!important}.current h2{overflow-wrap:anywhere}.disabled-player .current{opacity:.57}.disabled-player .current button{cursor:default}.notice{margin-top:16px}.notice button{min-height:36px}.time{font-size:12px}.track .duration{font-size:12px}.queue{padding-left:30px}.player{gap:45px}dialog{background:var(--surface);color:var(--ink);border:1px solid #f5f8fa;border-radius:24px;padding:30px;width:min(560px,calc(100vw - 36px));max-height:calc(100dvh - 40px);overflow:auto;box-shadow:0 22px 70px #23354255}dialog::backdrop{background:#3444516b;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.dialog-head h2{font-size:24px;letter-spacing:1px;margin:9px 0 0}#directory-rows{margin-top:24px}.directory-row{padding:19px 0;border-top:1px solid #cbd4db}.directory-title{display:flex;align-items:center;gap:14px}.folder-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;box-shadow:5px 5px 12px #cbd2d9,-5px -5px 12px #fff;color:#687783;flex-shrink:0}.directory-copy{flex:1;min-width:0}.alias{display:block;font-size:16px;font-weight:600;overflow-wrap:anywhere}.folder-name{display:block;font-size:12px;color:var(--muted);margin-top:6px}.directory-status{font-size:12px;color:var(--muted);white-space:nowrap}.attention{color:#984220}.row-actions{display:flex;justify-content:flex-end;gap:15px;margin-top:12px}.row-actions .remove{color:#5d6974}.add-area{padding-top:17px;border-top:1px solid #cbd4db}.add-area p{color:var(--muted);font-size:12px;line-height:1.8;margin:16px 0 0}.dialog-message{margin-top:17px;padding:13px 15px;border-radius:10px;background:#dde4e9;font-size:14px;line-height:1.8}.rename-form{margin-top:16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.rename-form label{display:block;width:100%;font-size:13px;color:var(--muted)}.rename-form input{flex:1;min-width:150px;border:1px solid #a4b0bb;background:#f4f7f8;color:var(--ink);font:inherit;border-radius:8px;padding:10px}.rename-form button{font-size:14px}.rename-help{font-size:12px;color:var(--muted);margin:0;width:100%}.row-feedback{font-size:13px;color:#8d381b;margin-top:10px}.folder-empty{padding:22px 0;font-size:14px;color:var(--muted)}@media(max-width:760px){.design-bar{padding:12px 16px;gap:8px}.design-bar span{font-size:12px;width:100%}.design-bar label{margin:3px 0 0}.queue{padding-left:0}.player{gap:32px}.dialog-head h2{font-size:21px}dialog{padding:23px}.directory-title{gap:10px}.row-actions{gap:12px}.list{max-height:360px}.directory-status{font-size:12px}.library-summary{font-size:12px}}

/* Shared searchable Select, themed to the player surface. */
.source-select {
  --text: var(--ink); --text-muted: var(--muted);
  --primary: var(--accent); --primary-light: #eaded7;
  --border: #c3cdd5; --input-bg: #f0f3f5; --bg: var(--surface);
  --card-bg: var(--surface); --ui-select-border: #c3cdd5;
  --ui-select-picker-bg: var(--surface); --ui-select-picker-radius: 14px;
  --ui-select-picker-shadow: 8px 12px 25px #52606e33, inset 1px 1px 1px #fff;
  padding: 7px 13px;
}
.source-select > .ui-select-search { flex: 1; min-width: 0; }
.source-select .ui-select-search-trigger {
  border: 0; padding: 0 2px; background: transparent; box-shadow: none;
  height: 36px; font-size: 16px; border-radius: 5px;
}
.source-select .ui-select-search-trigger:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 3px;
}
.source-select .ui-select-search-icon svg { width: 16px; height: 16px; }
.source-select .ui-select-search-popup { padding: 8px; }
.source-select .ui-select-search-option { border-radius: 8px; }
.source-select .ui-select-search-option:hover:not([aria-disabled=true]) { background: #e0e6eb; }
.source-select .ui-select-search-clear:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }

.track-copy{min-width:0;flex:1}.track .detail{overflow-wrap:anywhere}.library-feedback p:empty{display:none}.library-feedback .solid-button{margin:4px}.source-select .ui-select-search-trigger{cursor:pointer}.directory-status{flex-shrink:0}.directory-row[aria-busy=true]{opacity:.7}.list-sentinel{height:1px;flex-shrink:0}.library-toolbar{position:relative}.notice span{overflow-wrap:anywhere}.folder-name{overflow-wrap:anywhere}.directory-title{flex-wrap:wrap}.rename-form{scroll-margin:20px}.current h2{min-height:1.2em}.player button:disabled{cursor:default}.source-select .ui-select-search-option{scroll-margin:4px}
