.repeat-badge{position:absolute;right:2px;top:0;font-size:9px;font-weight:600;line-height:12px}.transport .icon-button{position:relative}.volume #mute{padding:0;min-width:19px;min-height:22px}.volume #mute[aria-pressed=true]{opacity:.55}.retry-audio{position:absolute;right:22px;top:-31px;font-size:10px;background:#e9eddf;color:#6a533f;padding:7px 12px;border:1px solid #d0d7c2;border-radius:5px;box-shadow:0 3px 15px #0001}.queue-panel{width:410px;max-width:calc(100vw - 32px);max-height:70vh;padding:22px}.queue-summary{font-size:11px;color:#6a7d58;line-height:1.6;margin:0 0 10px}.queue-clear{background:transparent;color:#8a664e;font-size:10px;padding:6px 0 13px;text-decoration:underline;text-underline-offset:3px}.queue-entry{display:flex;align-items:center;gap:5px;border-bottom:1px solid #cbd6bd;padding:9px 0}.queue-track{background:none;text-align:left;display:flex;align-items:center;gap:10px;min-width:0;flex:1;padding:0;color:#596f47}.queue-track>img{width:39px;height:39px;border-radius:4px;flex-shrink:0}.queue-track>span{min-width:0}.queue-track strong{display:block;font-size:11px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.queue-track small{display:block;font-size:9px;color:#82966e;margin-top:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.queue-entry.active .queue-track{color:#9d5d42}.queue-actions{display:flex;gap:1px;flex-shrink:0}.queue-actions .icon-button{min-width:25px;min-height:29px;padding:4px}.queue-actions .icon{width:15px;height:15px}.queue-up .icon{transform:rotate(90deg)}.queue-down .icon{transform:rotate(90deg)}.fs-queue-link{margin-top:23px;font-size:10px}.track-actions-dialog{max-width:360px;padding:25px}.track-actions-dialog h2{font-size:20px;line-height:1.4;margin:0 0 20px}.track-action{width:100%;background:transparent;display:flex;align-items:center;gap:12px;padding:13px 4px;border-bottom:1px solid #c6d6b5;text-align:left;font-size:12px;color:#6b8452}.track-action .icon{width:18px;height:18px}.track-action:hover:not(:disabled){color:#a46547;background:#d2dfc522}.track-actions-dialog>.button{margin-top:20px}.track-detail-menu{margin-left:9px}.track-detail-menu .icon{width:17px;height:17px}.card-menu{position:absolute;top:9px;right:9px;width:29px;height:29px;background:#f1efe9e8;color:#556745;display:grid;place-items:center;border-radius:4px;opacity:0;transition:opacity .2s,transform .2s;box-shadow:0 2px 7px #0002}.card-menu .icon{width:16px;height:16px}.music-card:hover .card-menu,.card-menu:focus-visible{opacity:1}.track-menu .icon{width:17px;height:17px}
[data-theme=dark] .queue-summary,[data-theme=dark] .queue-track small{color:#a4b992}[data-theme=dark] .queue-track{color:#c9ddb5}[data-theme=dark] .queue-entry{border-color:#435332}[data-theme=dark] .queue-entry.active .queue-track{color:#e1a287}[data-theme=dark] .queue-clear{color:#c99778}[data-theme=dark] .retry-audio{background:#35472b;border-color:#5c7448;color:#e0c1a4}[data-theme=dark] .track-action{color:#c0d4a9;border-color:#4c623b}[data-theme=dark] .track-action:hover:not(:disabled){color:#e6b896}
@media(max-width:760px){.track-row{grid-template-columns:16px 36px minmax(40px,1fr) 28px 24px 25px;gap:7px}.track-row .track-menu{display:inline-flex;min-width:24px;padding:4px}.queue-panel{max-height:calc(100dvh - 170px);bottom:142px;right:10px;max-width:calc(100vw - 20px);padding:20px}.queue-actions .icon-button{min-width:24px;padding:3px}.card-menu{opacity:1;width:26px;height:26px;top:7px;right:7px}.card-menu .icon{width:14px;height:14px}.retry-audio{right:9px;top:-29px;font-size:9px}.track-detail-menu{margin:8px 0 0 7px}.queue-track strong{font-size:10px}.queue-track small{font-size:8px}}
.player-shortcuts{font-size:9px;line-height:1.8;color:#7b8f68;margin:18px 0 0}[data-theme=dark] .player-shortcuts{color:#a0b38d}
.fs-status{font-size:10px;line-height:1.6;min-height:16px;color:#8b644e;margin:12px 0}.fs-retry{margin:0 0 17px;font-size:10px}[data-theme=dark] .fs-status{color:#c7a183}
@media(hover:none){.card-menu,.card-play:not(:disabled){opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.card-menu{transition:none}}

/* Range controls must not inherit the text-field padding from dialog forms. */
#fullscreen-player{overflow-x:hidden;max-height:90dvh;margin-top:3dvh}
#fullscreen-player input[type=range]{padding:0;border:0;border-radius:4px;height:3px;min-width:0;background:#667556;display:block}
#fullscreen-player .fs-volume-label input{width:110px;margin:0}
.playlist-editor textarea{display:block;width:100%;resize:vertical;padding:12px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--text);margin-top:7px;line-height:1.6}
.page-intro .lead{white-space:pre-wrap;overflow-wrap:anywhere}.playlist-editor h2{font-size:25px}

.collection-tools{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:24px 0 14px;font-size:11px}.collection-search{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:7px;padding:10px 12px;flex:1;min-width:180px}.collection-search input{background:none;border:0;color:var(--text);width:100%;min-width:0;font-size:12px}.collection-search .icon{width:17px;height:17px;flex-shrink:0}.collection-sort{display:flex;align-items:center;gap:8px;color:var(--muted)}.collection-sort select{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:9px;font-size:11px}.collection-available{display:flex;align-items:center;gap:7px;white-space:nowrap;color:var(--muted)}.collection-available input{accent-color:var(--accent)}
@media(max-width:760px){.collection-tools{gap:12px}.collection-search{flex-basis:100%}.collection-sort{flex:1}.collection-sort select{max-width:175px}}

.account-security{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}.account-security .form-card{width:100%;max-width:none}.account-security .lead{font-size:12px}@media(max-width:760px){.account-security{grid-template-columns:1fr;gap:0}}

.history-date{display:block;color:var(--muted);font-size:9px;margin-top:5px;line-height:1.5}

.admin-track-editor{display:grid;grid-template-columns:90px minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start;padding:20px 0;border-bottom:1px solid var(--line)}.admin-track-editor>img{width:90px;height:90px;border-radius:7px;object-fit:cover}.admin-track-editor .request-row{padding:0;border:0}.admin-track-editor label{display:block;font-size:12px;line-height:1.6}.admin-track-editor input{max-width:100%}.admin-track-editor .lead{font-size:11px}@media(max-width:760px){.admin-track-editor{grid-template-columns:64px minmax(0,1fr)}.admin-track-editor>img{width:64px;height:64px}.admin-track-editor form:last-child{grid-column:2}}

.release-search{display:flex;align-items:center;gap:12px;max-width:650px;margin:20px 0}.release-search .collection-search{min-width:0}

.album-position{display:flex;gap:12px;max-width:300px;margin:12px 0}.album-position label{flex:1;min-width:0}.album-position input{width:100%}

.directory-cards.artists .cover-wrap{border-radius:50%}.directory-cards .cover-wrap img{object-fit:cover}
.detail-hero .button{margin:4px 8px 4px 0}

/* Keep modal scrolling inside the dialog; the page behind it stays still. */
html:has(dialog[open]){overflow:hidden}
@media(max-width:760px){
  .mobile-nav{height:calc(54px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}
  .player{bottom:calc(58px + env(safe-area-inset-bottom));grid-template-columns:minmax(0,1fr) 96px}
  .player .transport{gap:4px}
  .player .transport>.icon-button,.player .play-main{min-width:44px;min-height:44px}
  .card-play,.card-menu{width:44px;height:44px;opacity:1}
  .track-row .track-menu,.track-row>.icon-button{min-width:36px;min-height:44px;padding:4px}
  .track-row{grid-template-columns:16px 36px minmax(0,1fr) 31px 36px 36px;gap:6px}
  #fullscreen-player{margin:12px auto;padding:44px 24px 24px;max-height:calc(100dvh - 24px);width:calc(100% - 24px);max-width:440px}
  #fullscreen-player .eyebrow{margin:0 0 20px}
  #fullscreen-player img{width:min(100%,240px,32dvh)}
  #fullscreen-player h2{font-size:24px;margin:18px 0 8px;overflow-wrap:anywhere}
  #fullscreen-player #fs-artist{margin:8px 0}
  #fullscreen-player .fs-status{margin:8px 0}
  #fullscreen-player .transport{gap:8px}
  #fullscreen-player .transport>button{min-width:44px;min-height:44px}
  #fullscreen-player .fs-queue-link{margin-top:16px;min-height:44px;font-size:12px}
  #fullscreen-player .fs-volume-label{margin-top:12px}
  #fullscreen-player .player-shortcuts{display:none}
  #fullscreen-player .close-dialog{min-width:44px;min-height:44px;right:8px;top:4px}
}

.lyrics-lines{max-width:850px;line-height:1.8;white-space:pre-wrap}.lyrics-lines button{display:block;border:0;background:transparent;color:inherit;opacity:.55;text-align:left;font:inherit;padding:8px 0;transition:opacity .2s,color .2s}.lyrics-lines button.is-active{opacity:1;color:var(--accent,#75e5ad);font-weight:700}.lyrics-lines button:focus-visible{outline:2px solid currentColor}dialog.form-card{width:min(680px,92vw);max-height:90vh;overflow:auto}dialog.form-card textarea{width:100%;box-sizing:border-box;resize:vertical}

#fs-lyrics-panel{margin:24px 0;text-align:left}#fs-lyrics-panel summary{cursor:pointer;padding:12px 0;font-weight:600}#fs-lyrics-content{max-height:40vh;overflow:auto;font-size:15px}#fs-lyrics-content .lyrics-lines button{width:100%;min-height:44px}

/* Quick controls share the single audio element and retain the current queue. */
.track-row{position:relative}
.track-cover-button{position:relative;width:44px;height:44px;padding:0;border:0;background:transparent;border-radius:6px;overflow:hidden;cursor:pointer}
.track-cover-button img{display:block;width:100%;height:100%;object-fit:cover}
.track-cover-button>span{position:absolute;inset:0;display:grid;place-items:center;background:#0008;color:white;opacity:0;transition:opacity .18s}
.track-cover-button:hover>span,.track-cover-button:focus-visible>span,.is-current .track-cover-button>span{opacity:1}
.track-quick-controls{grid-column:3/-1;display:flex;align-items:center;gap:8px;max-height:0;opacity:0;overflow:hidden;pointer-events:none;transition:max-height .2s,opacity .2s}
.track-row:hover .track-quick-controls,.track-row:focus-within .track-quick-controls,.track-row.is-current .track-quick-controls{max-height:52px;opacity:1;pointer-events:auto}
.track-quick-controls .icon-button{min-width:40px;min-height:40px}
.quick-volume{display:flex;align-items:center;gap:10px;font-size:11px;max-width:240px}
.quick-volume input{width:110px;min-width:60px;padding:0;accent-color:var(--accent,#a9c28b)}
.track-row.is-current{background:color-mix(in srgb,currentColor 5%,transparent);border-radius:8px}
#fullscreen-player{box-sizing:border-box;position:fixed;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;border:0;border-radius:0;padding:48px max(28px,calc((100vw - 900px)/2));overflow:auto}
#fullscreen-player::backdrop{background:#111e11ed;backdrop-filter:blur(22px)}
#fullscreen-player #fs-cover{width:min(330px,40vh);height:min(330px,40vh);object-fit:cover;box-shadow:0 28px 80px #0005}
#fullscreen-player #fs-lyrics-content{max-height:32vh}
#fullscreen-player .close-dialog{position:fixed;top:20px;right:24px;min-width:44px;min-height:44px}
@media(hover:none),(pointer:coarse){.track-quick-controls{max-height:52px;opacity:1;pointer-events:auto}.quick-volume span{display:none}}
@media(max-width:760px){.track-cover-button{width:36px;height:36px}.track-quick-controls{gap:4px}.quick-volume{max-width:120px}.quick-volume input{width:80px}#fullscreen-player{padding:48px 24px 28px}#fullscreen-player #fs-cover{width:min(260px,32vh);height:min(260px,32vh)}#fullscreen-player .close-dialog{right:12px;top:8px}}
@media(prefers-reduced-motion:reduce){.track-quick-controls,.track-cover-button>span{transition:none}}

.hero-cover-button{position:relative;padding:0;background:transparent;border:0;width:220px;height:220px;flex-shrink:0;border-radius:12px;overflow:hidden}.hero-cover-button img{width:100%;height:100%;object-fit:cover}.hero-cover-button>span{position:absolute;inset:0;background:#0005;display:grid;place-items:center;opacity:0;transition:opacity .2s}.hero-cover-button .icon{width:32px;height:32px;color:white}.hero-cover-button:hover>span,.hero-cover-button:focus-visible>span{opacity:1}@media(max-width:760px){.hero-cover-button{width:150px;height:150px}}

#fullscreen-player{width:100%;max-inline-size:100%;overflow-x:hidden}