/* Desktop audio inspiration catalogue. Keep the generator on the left and
   expose the inspiration browser in the right workspace column. */
.audio-right-column {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.desktop-audio-catalogue {
    min-width: 0;
    margin: 0;
    padding: 22px;
    border: 1px solid var(--creation-line);
    border-radius: 14px;
    background: var(--creation-panel, #fff);
}
.desktop-audio-catalogue-head,
.desktop-audio-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}
.desktop-audio-catalogue-head h2,
.desktop-audio-section-head h3 { margin: 0; color: var(--creation-ink); }
.desktop-audio-catalogue-head h2 { font-size: 24px; }
.desktop-audio-catalogue-head p { margin: 7px 0 0; color: var(--creation-muted); font-size: 14px; }
.desktop-audio-catalogue-tools { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.desktop-audio-tabs { display: flex; align-items: center; gap: 4px; padding: 3px; border: 1px solid var(--creation-line); border-radius: 9px; background: var(--creation-soft); }
.desktop-audio-tabs button { min-height: 32px; padding: 0 12px; border: 0; border-radius: 6px; background: transparent; color: var(--creation-muted); font: inherit; font-size: 13px; cursor: pointer; }
.desktop-audio-tabs button.active { background: #fff; color: var(--creation-blue); box-shadow: 0 1px 4px rgba(28,49,78,.1); font-weight: 700; }
.desktop-audio-search { width: 220px; min-height: 38px; padding: 0 12px; border: 1px solid var(--creation-line); border-radius: 8px; background: var(--creation-panel, #fff); color: var(--creation-ink); font: inherit; font-size: 13px; }
.desktop-audio-search:focus { outline: 2px solid rgba(11,111,242,.16); border-color: var(--creation-blue); }
.desktop-audio-section { margin-top: 28px; }
.desktop-audio-section-head { align-items: center; margin-bottom: 14px; }
.desktop-audio-section-head h3 { font-size: 18px; }
.desktop-audio-count { color: var(--creation-muted); font-size: 12px; }
.desktop-audio-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.desktop-audio-card { min-width: 0; overflow: hidden; border: 1px solid var(--creation-line); border-radius: 10px; background: var(--creation-panel, #fff); transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.desktop-audio-card:hover { border-color: #a8c8f2; box-shadow: 0 10px 24px rgba(22,70,124,.08); transform: translateY(-1px); }
.desktop-audio-card-art { position: relative; min-height: 142px; padding: 18px 14px; display: flex; align-items: center; overflow: hidden; background: linear-gradient(135deg, var(--creation-soft), #e8f1fc); }
.desktop-audio-wave { width: 100%; height: 72px; display: flex; align-items: center; justify-content: center; gap: 3px; }
.desktop-audio-wave i { width: 3px; min-height: 8px; display: block; border-radius: 5px; background: linear-gradient(180deg, #5798f2, #0b6ff2); opacity: .78; }
.desktop-audio-kind { position: absolute; top: 10px; left: 12px; padding: 4px 7px; border-radius: 5px; background: rgba(255,255,255,.72); color: #37628d; font-size: 10px; line-height: 1; }
.desktop-audio-play { position: absolute; left: 12px; bottom: 11px; width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255,255,255,.94); color: #0b6ff2; cursor: pointer; box-shadow: 0 5px 15px rgba(12,40,75,.18); }
.desktop-audio-play:hover { background: #fff; transform: scale(1.04); }
.desktop-audio-play span { font-size: 13px; line-height: 1; }
.desktop-audio-play.is-playing { background: #0b6ff2; color: #fff; }
.desktop-audio-duration { position: absolute; right: 9px; bottom: 9px; padding: 4px 7px; border-radius: 5px; background: rgba(15,23,42,.68); color: #fff; font-size: 11px; line-height: 1; }
.desktop-audio-card-copy { min-width: 0; padding: 12px 12px 13px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.desktop-audio-card-copy > div { min-width: 0; display: grid; gap: 4px; }
.desktop-audio-card-copy strong { overflow: hidden; color: var(--creation-ink); font-size: 14px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.desktop-audio-card-copy small { overflow: hidden; color: var(--creation-muted); font-size: 11px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.desktop-audio-use { flex: 0 0 auto; min-height: 28px; padding: 0 8px; border: 1px solid #bdd4f2; border-radius: 6px; background: transparent; color: var(--creation-blue); font: inherit; font-size: 11px; cursor: pointer; white-space: nowrap; }
.desktop-audio-use:hover { background: var(--creation-soft); border-color: var(--creation-blue); }
.desktop-audio-empty { grid-column: 1 / -1; margin: 0; padding: 30px; color: var(--creation-muted); text-align: center; }
.desktop-audio-notice { margin: 16px 0 0; padding: 10px 13px; border-radius: 8px; background: var(--creation-soft); color: var(--creation-blue); font-size: 13px; }
.desktop-audio-notice[hidden] { display: none; }
body[data-ui-theme="dark"] .desktop-audio-tabs button.active { background: var(--fuuvo-dark-input); box-shadow: none; }
body[data-ui-theme="dark"] .desktop-audio-search,
body[data-ui-theme="dark"] .desktop-audio-card,
html[data-ui-theme="dark"] .desktop-audio-card { background: #172437 !important; }
body[data-ui-theme="dark"] .desktop-audio-card-art,
html[data-ui-theme="dark"] .desktop-audio-card-art { background: linear-gradient(135deg, #1d3049, #203d61) !important; }
body[data-ui-theme="dark"] .desktop-audio-kind,
html[data-ui-theme="dark"] .desktop-audio-kind { background: rgba(237,245,255,.9); color: #31516f; }
html[data-ui-theme="dark"] .desktop-audio-card-copy strong { color: var(--creation-ink); }
html[data-ui-theme="dark"] .desktop-audio-card-copy small { color: var(--creation-muted); }
html[data-ui-theme="dark"] .desktop-audio-card:hover { border-color: rgba(77,145,255,.48); box-shadow: 0 10px 24px rgba(0,0,0,.34); }
body[data-ui-theme="dark"] .desktop-audio-play { background: rgba(237,245,255,.94); }
body[data-ui-theme="dark"] .desktop-audio-play.is-playing { background: #3b82f6; }
body[data-ui-theme="dark"] .desktop-audio-use { border-color: #5276a5; }
@media (min-width: 921px) {
    html body #creation-app[data-creation-page="audio"].studio-workspace .creation-main { overflow-x: hidden !important; overflow-y: auto !important; }
    html body #creation-app[data-creation-page="audio"].studio-workspace .audio-detail-layout { flex: 0 0 auto; height: var(--studio-control-height, calc(100dvh - 64px)); }
    html body #creation-app[data-creation-page="audio"].studio-workspace .audio-right-column { min-height: var(--studio-control-height, calc(100dvh - 64px)); }
    html body #creation-app[data-creation-page="audio"].studio-workspace .desktop-audio-catalogue { flex: 0 0 auto; }
}
@media (max-width: 1180px) {
    .desktop-audio-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .desktop-audio-catalogue-head { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 920px) {
    .audio-right-column { display: contents; }
    .desktop-audio-catalogue { display: none; }
}
