/* BUNDLE clubos-music.css · R119R4ADESK5CFIX15P3 */

/* ===== SOURCE: music-track-reactions.css ===== */
.music-track-reaction-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.music-track-reaction-picker {
    position: absolute;
    z-index: 6800;
    left: 50%;
    bottom: calc(100% + .45rem);
    display: flex;
    gap: .22rem;
    width: max-content;
    padding: .4rem .48rem;
    border: 1px solid var(--site-border);
    border-radius: 999px;
    background: var(--site-surface);
    box-shadow: 0 14px 34px rgba(15, 23, 42, .2);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 5px) scale(.96);
    transition: opacity 120ms ease, transform 120ms ease, visibility 120ms ease;
}
.music-track-reaction-wrap.is-open .music-track-reaction-picker,
.music-track-reaction-wrap:focus-within .music-track-reaction-picker {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, 0) scale(1);
}
@media (hover: hover) and (pointer: fine) {
    .music-track-reaction-wrap:hover .music-track-reaction-picker {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, 0) scale(1);
    }
}
.music-track-reaction-choice {
    display: inline-grid;
    width: 36px;
    height: 36px;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: transparent;
    font-size: 1.12rem;
    line-height: 1;
    transition: transform 120ms ease, background-color 120ms ease;
}
.music-track-reaction-choice:hover,
.music-track-reaction-choice:focus-visible,
.music-track-reaction-choice.is-active {
    background: color-mix(in srgb, var(--site-link) 13%, transparent);
    transform: translateY(-2px) scale(1.12);
    outline: none;
}
.music-track-reaction-wrap .music-btn-like .music-track-action-icon {
    font-size: 1rem;
}
:root[data-theme="dark"] .music-track-reaction-picker {
    box-shadow: 0 16px 38px rgba(0, 0, 0, .4);
}
@media (max-width: 767.98px) {
    .music-track-reaction-picker {
        left: 0;
        transform: translate(0, 5px) scale(.96);
    }
    .music-track-reaction-wrap.is-open .music-track-reaction-picker,
    .music-track-reaction-wrap:focus-within .music-track-reaction-picker {
        transform: translate(0, 0) scale(1);
    }
}
@media (prefers-reduced-motion: reduce) {
    .music-track-reaction-picker,
    .music-track-reaction-choice { transition: none; }
}

@media (max-width: 767.98px) {
    .music-mobile-track-quick-actions > .music-track-reaction-wrap--mobile-quick {
        display: inline-flex;
        flex: 0 0 auto;
    }
    .music-track-reaction-wrap--mobile-quick .music-track-reaction-picker {
        left: 0;
        right: auto;
    }
}

/* ===== SOURCE: music-shell-runtime.css ===== */
/* ClubOS Music Shell Runtime — externalized by R103 FIX11 FIX4 FIX3.
 * Single CSS source for native /music and lazy player bootstrap from Blog.
 */
:root {
    --music-bg-start: var(--site-bg);
    --music-bg-end: var(--site-bg);
    --music-card: var(--site-surface);
    --music-card-soft: var(--site-surface-2);
    --music-border: var(--site-border);
    --music-text: var(--site-text);
    --music-muted: var(--site-text-muted);
    --music-accent: var(--site-accent);
    --music-accent-soft: var(--site-accent);
}

body.music-page-shell {
    min-height: 100vh;
    background: var(--site-bg-gradient);
    color: var(--music-text);
}

body.music-page-shell .site-shell {
    max-width: 1180px;
}

.navbar.music-navbar {
    position: sticky;
    top: 0;
    z-index: 1200;
    background: rgba(8, 12, 22, .88);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(107, 123, 159, .28);
}

.music-shell-main {
    position: relative;
    z-index: 1;
}

.music-context-sticky {
    position: sticky;
    top: calc(var(--music-nav-height, 72px) - 16px);
    z-index: 1180;
    margin-top: 0 !important;
}

.music-context-bar {
    padding: .75rem .9rem;
    border: 1px solid rgba(86, 103, 136, .45);
    background: linear-gradient(180deg, rgba(13, 20, 33, .96), rgba(10, 16, 27, .92));
    backdrop-filter: blur(10px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .22);
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: .85rem;
    border-bottom-right-radius: .85rem;
}

.navbar.music-navbar .navbar-brand,
.navbar.music-navbar .nav-link,
.navbar.music-navbar .btn-link {
    color: var(--music-text);
}

.music-page-shell .card {
    background: linear-gradient(180deg, rgba(21, 28, 45, .96), rgba(15, 21, 34, .96));
    color: var(--music-text);
    border: 1px solid rgba(70, 84, 114, .35) !important;
}

.album-card {
    border-radius: 1rem;
    overflow: hidden;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.album-card:hover {
    transform: translateY(-6px);
    border-color: rgba(54, 200, 255, .55) !important;
    box-shadow: 0 18px 36px rgba(0, 0, 0, .42);
}

.album-cover-link {
    overflow: hidden;
    border-radius: .95rem .95rem 0 0;
}

.album-cover,
.album-detail-cover {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: .75rem;
    border: 1px solid rgba(106, 124, 157, .35);
}

.album-cover {
    border-radius: 0;
    transition: transform .35s ease;
}

.album-card:hover .album-cover {
    transform: scale(1.04);
}

.placeholder-cover {
    background: linear-gradient(135deg, rgba(35, 46, 67, .9), rgba(20, 28, 43, .95));
}

.playlist-cover-placeholder {
    background: radial-gradient(circle at 20% 20%, rgba(46, 224, 255, .35), transparent 45%),
        radial-gradient(circle at 80% 80%, rgba(148, 83, 255, .3), transparent 45%),
        linear-gradient(135deg, rgba(28, 38, 62, .96), rgba(13, 22, 39, .98));
    border-bottom: 1px solid rgba(106, 124, 157, .3);
}

.playlist-cover-content {
    color: rgba(226, 240, 255, .96);
    text-shadow: 0 8px 20px rgba(0, 0, 0, .35);
}

.playlist-cover-icon {
    font-size: 2.1rem;
    line-height: 1;
    margin-bottom: .3rem;
}

.playlist-cover-label {
    font-size: .72rem;
    letter-spacing: .18em;
    font-weight: 700;
    opacity: .9;
}

.playlist-empty-icon {
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(191, 225, 255, .95);
    font-size: 1.5rem;
    background: linear-gradient(135deg, rgba(37, 121, 191, .45), rgba(118, 74, 209, .38));
    border: 1px solid rgba(114, 149, 204, .45);
}

.music-playlist-card {
    transition: transform .16s ease, box-shadow .16s ease;
}

.music-playlist-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 32px rgba(4, 10, 22, .3);
}

.music-playlist-card-description {
    min-height: 2.6rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.music-playlist-detail-header .card-body {
    padding-bottom: 1.35rem;
}

.music-playlist-detail-title-row .music-btn {
    margin-top: .1rem;
}

.music-playlist-tracks-card .card-body > .p-3 {
    padding-top: .82rem !important;
    padding-bottom: .82rem !important;
}

.music-playlist-empty-state {
    border-top: 1px solid rgba(106, 124, 157, .22);
}

.music-page-shell .text-secondary {
    color: var(--music-muted) !important;
}

.music-page-shell .btn-primary {
    background: linear-gradient(120deg, var(--music-accent) 0%, #29a7ff 100%);
    color: #0b1221;
    border: none;
    font-weight: 600;
}

.music-page-shell .btn-primary:hover {
    color: #0b1221;
    filter: brightness(1.04);
}

.music-btn {
    border-radius: .72rem;
    font-weight: 600;
    letter-spacing: .01em;
    transition: all .16s ease;
    line-height: 1.2;
    min-height: 1.84rem;
    padding: .24rem .52rem;
    box-shadow: 0 3px 10px rgba(3, 10, 20, .16);
}

.music-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 16px rgba(3, 10, 20, .22);
}

.music-btn:disabled {
    opacity: .55;
    transform: none;
    cursor: not-allowed;
}

.music-btn-primary {
    box-shadow: 0 8px 20px rgba(30, 215, 96, .18);
}

.music-btn-ghost {
    border-color: rgba(112, 131, 168, .6);
    background: rgba(12, 18, 30, .45);
}

.music-btn-ghost:hover {
    border-color: rgba(143, 163, 204, .8);
    background: rgba(28, 39, 61, .7);
}

#global-player-toggle {
    color: #e9f1ff;
    border-color: rgba(150, 176, 220, .72);
    background: linear-gradient(180deg, rgba(22, 32, 50, .96), rgba(16, 24, 39, .96));
}

#global-player-toggle:hover,
#global-player-toggle:focus-visible {
    color: #f8fbff !important;
    border-color: rgba(181, 206, 245, .95);
    background: linear-gradient(180deg, rgba(36, 52, 80, .98), rgba(26, 39, 62, .98));
    box-shadow: 0 0 0 .2rem rgba(122, 171, 236, .24);
}

#global-player-toggle:disabled {
    color: rgba(206, 220, 246, .72);
    border-color: rgba(109, 130, 166, .5);
    background: rgba(16, 24, 39, .72);
    box-shadow: none;
}

#global-player-toggle,
#global-player-prev,
#global-player-next,
#global-player-shuffle,
#global-player-volume {
    width: 2.45rem;
    min-width: 2.45rem;
    height: 2.45rem;
    padding: 0;
    border-radius: 999px;
    position: relative;
}

#global-player-loop {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.45rem;
    min-width: 2.45rem;
    height: 2.45rem;
    padding: 0;
    border-radius: 999px;
}

#global-player-loop .music-loop-badge {
    position: absolute;
    right: .24rem;
    bottom: .2rem;
    min-width: .74rem;
    height: .74rem;
    padding: 0 .14rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 214, 122, .55);
    background: rgba(255, 199, 79, .2);
    color: #ffd777;
    font-size: .56rem;
    font-weight: 700;
    line-height: .66rem;
    text-align: center;
    opacity: 0;
    transform: scale(.8);
    transition: opacity .16s ease, transform .16s ease;
}

.music-btn-subtle {
    border-color: rgba(112, 131, 168, .45);
    color: #d5dceb;
}

.music-btn-comment {
    border-color: rgba(95, 198, 255, .55);
    color: #bce8ff;
    background: rgba(20, 53, 84, .3);
}

.music-btn-comment:hover {
    color: #e6f6ff;
    background: rgba(31, 86, 131, .45);
    border-color: rgba(120, 219, 255, .8);
}

.music-btn-comments {
    min-width: 2.4rem;
}

.music-track-play-btn,
.music-track-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .2rem;
}

.music-track-play-btn {
    width: 1.95rem;
    min-width: 1.95rem;
    height: 1.95rem;
    padding: 0;
    border-radius: 999px;
    border-color: rgba(143, 163, 204, .82);
    background: rgba(22, 34, 54, .68);
    color: #e9f2ff;
    box-shadow: 0 3px 10px rgba(3, 10, 20, .22);
}

.music-track-play-btn:hover,
.music-track-play-btn:focus-visible {
    border-color: rgba(176, 199, 240, .95);
    background: rgba(39, 57, 87, .9);
    color: #f8fbff !important;
}

.music-track-play-btn.is-playing {
    border-color: rgba(255, 203, 102, .92);
    background: linear-gradient(120deg, rgba(255, 198, 94, .95), rgba(255, 150, 96, .95));
    color: #2a1f08;
    box-shadow: 0 6px 16px rgba(255, 174, 92, .3);
}

.music-track-play-btn .music-track-play-icon {
    font-size: .92rem;
    line-height: 1;
    transform: translateX(.03rem);
}

.music-track-action-btn {
    min-width: 1.3rem;
    height: 1.6rem;
    padding: 0 .14rem;
    border-radius: .42rem;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.music-track-action-btn:hover,
.music-track-action-btn:focus-visible {
    background: rgba(58, 84, 121, .28);
    box-shadow: none;
    transform: none;
}

.music-track-action-icon {
    font-size: .95rem;
    line-height: 1;
    opacity: .9;
}

.music-track-icon-svg {
    width: .98rem;
    height: .98rem;
    display: block;
    fill: currentColor;
}

.music-track-action-icon-mp3 {
    font-size: .56rem;
    font-weight: 800;
    letter-spacing: .04em;
    border: 1px solid currentColor;
    border-radius: .22rem;
    padding: .08rem .18rem;
    line-height: 1.05;
}

.music-track-action-btn.music-btn-comment {
    color: #93ddff;
}

.music-track-action-btn.music-btn-comment.is-empty {
    color: #808080;
    opacity: .5;
}

.music-track-action-btn.music-btn-comment.is-open {
    color: #f4c27c;
}

.music-track-comment-count {
    font-size: .66rem;
    font-weight: 600;
    color: #9fb7da;
    margin-left: .05rem;
}

.music-track-action-btn.music-btn-like {
    color: #f3adbe;
    gap: .1rem;
}

.music-track-action-btn.music-btn-like .music-track-action-icon {
    font-size: .9rem;
}

.music-track-like-count {
    font-size: .68rem;
    font-weight: 600;
    color: #b6c6df;
    min-width: 1ch;
}

.music-track-action-btn.music-btn-favorite {
    color: #808080 !important;
    filter: none;
}

.music-track-action-btn.music-btn-favorite.is-active {
    color: #f5c400 !important;
    filter: drop-shadow(0 0 4px rgba(245, 196, 0, .45)) drop-shadow(0 1px 1px rgba(0, 0, 0, .18));
}

:root[data-theme="light"] .music-track-action-btn.music-btn-comment.is-empty {
    color: #808080;
    opacity: .5;
}

.music-track-action-btn.music-btn-comment.is-empty:hover,
.music-track-action-btn.music-btn-comment.is-empty:focus-visible {
    opacity: .72;
}

:root[data-theme="light"] .music-track-action-btn.music-btn-favorite {
    color: #808080 !important;
}

:root[data-theme="light"] .music-track-action-btn.music-btn-favorite.is-active {
    color: #f5c400 !important;
    filter: drop-shadow(0 0 4px rgba(245, 196, 0, .5)) drop-shadow(0 1px 1px rgba(0, 0, 0, .22));
}

.music-track-action-btn.js-track-playlist-add {
    color: #b7c8e5;
}

.music-track-action-btn.music-btn-download {
    color: #9ddba5;
}

.music-album-actions {
    padding-top: .2rem;
}

.js-music-play-trigger.btn-warning {
    border-color: rgba(255, 203, 102, .9);
    color: #1b1212;
    background: linear-gradient(120deg, rgba(255, 198, 94, .95), rgba(255, 150, 96, .95));
    box-shadow: 0 6px 16px rgba(255, 174, 92, .28);
}

.js-music-play-trigger:not(.btn-warning):hover,
.js-music-play-trigger:not(.btn-warning):focus-visible {
    color: #f4f8ff !important;
    background: rgba(29, 44, 69, .88);
    border-color: rgba(155, 182, 229, .85);
}

.js-music-play-trigger.btn-warning:hover,
.js-music-play-trigger.btn-warning:focus-visible {
    color: #2a1f08 !important;
    filter: brightness(1.03);
}

.music-track-table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--music-text);
    --bs-table-border-color: rgba(73, 90, 123, .45);
    --bs-table-striped-bg: rgba(255, 255, 255, 0.02);
    --bs-table-hover-bg: rgba(54, 200, 255, 0.07);
}

.music-track-table > :not(caption) > * > * {
    padding-top: .48rem;
    padding-bottom: .48rem;
    border-bottom-color: rgba(73, 90, 123, .4);
    font-size: .93rem;
}

.music-track-row {
    transition: background-color .16s ease;
}

.music-track-row:hover {
    background: rgba(43, 69, 103, .22);
}

.music-track-row.is-track-playing {
    background: linear-gradient(90deg, rgba(33, 78, 122, .42), rgba(23, 49, 80, .28)) !important;
    box-shadow: inset 0 0 0 1px rgba(118, 214, 255, .28);
}

.music-track-row.is-track-paused {
    background: linear-gradient(90deg, rgba(33, 78, 122, .2), rgba(23, 49, 80, .14)) !important;
    box-shadow: inset 0 0 0 1px rgba(118, 214, 255, .16);
}

.music-track-row.is-track-targeted {
    animation: musicTrackPulse 1.25s ease;
}

.music-track-row .fw-semibold {
    font-size: .94rem;
    line-height: 1.2;
}

.music-track-row .badge {
    font-size: .62rem;
    padding: .2rem .38rem;
}

@keyframes musicTrackPulse {
    0% { box-shadow: inset 0 0 0 1px rgba(36, 225, 123, .7); }
    100% { box-shadow: inset 0 0 0 1px rgba(36, 225, 123, 0); }
}

.music-track-actions {
    justify-content: flex-end;
    row-gap: .3rem !important;
    column-gap: .35rem !important;
    flex-wrap: nowrap !important;
    white-space: nowrap;
}

.track-cover-thumb {
    width: 38px;
    height: 38px;
    border-radius: .4rem;
    object-fit: cover;
    border: 1px solid rgba(106, 124, 157, .45);
}

.track-cover-placeholder {
    background: rgba(35, 46, 67, .85);
}

.music-page-shell .access-cta {
    border-left: 4px solid var(--music-accent-soft);
    background: rgba(34, 48, 74, .65);
    color: var(--music-text);
}

.music-page-shell .alert-secondary {
    background: rgba(34, 48, 74, .65);
    color: var(--music-text);
    border: 1px solid rgba(86, 103, 136, .45);
}

:root[data-theme="light"] .music-page-shell .alert-secondary {
    background: #f6faff;
    color: #0d2542;
    border: 1px solid #c3d8f3;
}

:root[data-theme="light"] .music-page-shell .alert-secondary .btn-outline-light {
    color: #0a5495;
    border-color: #7daadd;
    background: #ffffff;
}

:root[data-theme="light"] .music-page-shell .alert-secondary .btn-outline-light:hover,
:root[data-theme="light"] .music-page-shell .alert-secondary .btn-outline-light:focus-visible {
    color: #083f6f;
    border-color: #5e92ce;
    background: #eef6ff;
}

.music-page-shell a {
    color: #9ad5ff;
}

.music-page-shell a:hover {
    color: #c4e7ff;
}

.music-page-shell {
    --music-nav-height: 72px;
    --music-sticky-offset-total: 132px;
    padding-bottom: 136px;
}
#site-shell-root {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
#site-shell-main {
    flex: 1 1 auto;
}
#site-shell-content {
    position: relative;
}
#site-shell-player-zone {
    position: relative;
    z-index: 1100;
}

@media (min-width: 768px) {
    .global-music-player[hidden] { display: none !important; }
}

.global-music-player {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1100;
    background: linear-gradient(180deg, rgba(8, 13, 24, .94), rgba(6, 10, 18, .98));
    border-top: 1px solid rgba(86, 103, 136, .5);
    backdrop-filter: blur(10px);
    box-shadow: 0 -14px 34px rgba(0, 0, 0, .42);
}

.global-music-player__inner {
    width: 100%;
    box-sizing: border-box;
}

.global-music-player__main {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin-bottom: 0;
    flex-wrap: nowrap;
}

.global-music-player__meta {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: .55rem;
    flex: 0 1 186px;
    max-width: 196px;
}

.global-music-player__transport {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: nowrap;
    flex: 0 0 auto;
}

.global-music-player__timeline {
    display: flex;
    align-items: center;
    gap: .42rem;
    min-width: 0;
    flex: 1 1 auto;
    position: relative;
}

.global-music-player__actions {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: nowrap;
    flex: 0 0 auto;
    max-width: max-content;
}

.global-music-player__dock-header {
    display: none;
}

#global-player-undock {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    width: 100%;
    border-radius: .72rem;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .01em;
}

#global-player-undock svg {
    width: .95rem;
    height: .95rem;
    fill: currentColor;
}

.global-music-player__cover {
    width: 44px;
    height: 44px;
    border-radius: .5rem;
    object-fit: cover;
    border: 1px solid rgba(106, 124, 157, .45);
    background: rgba(35, 46, 67, .85);
}

.global-music-player__title {
    font-weight: 600;
    color: var(--music-text);
    line-height: 1.2;
    overflow: hidden;
    white-space: nowrap;
}

.global-music-player__subtitle {
    color: var(--music-muted);
    font-size: .82rem;
    line-height: 1.2;
    overflow: hidden;
    white-space: nowrap;
}

.global-music-player__meta-text {
    min-width: 0;
    flex: 1 1 auto;
}

.global-music-player__text-scroll {
    display: inline-block;
    min-width: 100%;
    white-space: nowrap;
    transform: translateX(0);
    will-change: transform;
}

.global-music-player__title.is-marquee .global-music-player__text-scroll,
.global-music-player__subtitle.is-marquee .global-music-player__text-scroll {
    animation: global-player-marquee 8.5s linear infinite;
}

@keyframes global-player-marquee {
    0%, 14% {
        transform: translateX(0);
    }
    86%, 100% {
        transform: translateX(calc(-1 * var(--marquee-shift, 0px)));
    }
}

.global-music-player__seek {
    width: 1px;
    height: 1px;
    margin: 0;
    --seek-progress: 0%;
    --seek-played: #f28b4f;
    --seek-unplayed: rgba(95, 126, 176, .54);
    --seek-thumb: #e85f38;
    --seek-thumb-ring: #f8efe7;
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.global-music-player__seek:disabled {
    cursor: default;
    opacity: .65;
}

.global-music-player__seek::-webkit-slider-runnable-track {
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--seek-played) 0%, var(--seek-played) var(--seek-progress), var(--seek-unplayed) var(--seek-progress), var(--seek-unplayed) 100%);
}

.global-music-player__seek::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid var(--seek-thumb-ring);
    background: var(--seek-thumb);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .28);
    margin-top: -5px;
}

.global-music-player__seek::-moz-range-track {
    height: 4px;
    border-radius: 999px;
    background: var(--seek-unplayed);
}

.global-music-player__seek::-moz-range-progress {
    height: 4px;
    border-radius: 999px;
    background: var(--seek-played);
}

.global-music-player__seek::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid var(--seek-thumb-ring);
    background: var(--seek-thumb);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .28);
}

.global-music-player__times {
    font-size: .78rem;
    color: var(--music-muted);
    min-width: 86px;
    text-align: right;
    white-space: nowrap;
    margin: 0;
    font-variant-numeric: tabular-nums;
    letter-spacing: .01em;
}

.music-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.music-icon-btn svg {
    width: 1rem;
    height: 1rem;
    fill: currentColor;
    display: block;
}

#global-player-toggle .music-icon-pause {
    display: none;
}

#global-player-toggle[data-playing="1"] .music-icon-play {
    display: none;
}

#global-player-toggle[data-playing="1"] .music-icon-pause {
    display: block;
}

#global-player-loop .music-icon-loop {
    width: 1rem;
    height: 1rem;
    fill: currentColor;
    flex: 0 0 auto;
}

#global-player-loop[data-loop-mode="track"] .music-loop-badge,
#global-player-loop[data-loop-mode="album"] .music-loop-badge {
    opacity: 1;
    transform: scale(1);
}

#global-player-loop[data-loop-mode="none"] {
    color: #9cb0cf;
    border-color: rgba(108, 126, 160, .6);
}

#global-player-loop[data-loop-mode="track"] {
    color: #ffca6f;
    border-color: rgba(255, 205, 116, .92);
    background: rgba(255, 185, 61, .14);
    box-shadow: 0 0 0 1px rgba(255, 203, 111, .24) inset;
}

#global-player-loop[data-loop-mode="album"] {
    color: #88dcff;
    border-color: rgba(128, 225, 255, .9);
    background: rgba(66, 161, 204, .2);
    box-shadow: 0 0 0 1px rgba(116, 214, 251, .24) inset;
}

#global-player-shuffle {
    position: relative;
    isolation: isolate;
}

#global-player-shuffle::after {
    content: attr(data-shuffle-badge);
    position: absolute;
    top: -.34rem;
    right: -.3rem;
    min-width: .98rem;
    height: .98rem;
    padding: 0 .18rem;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: transparent;
    font-size: .54rem;
    font-weight: 700;
    line-height: .9rem;
    text-align: center;
    letter-spacing: .02em;
    opacity: 0;
    transform: scale(.82);
    transition: opacity .16s ease, transform .16s ease, border-color .16s ease, background-color .16s ease, color .16s ease;
    pointer-events: none;
}

#global-player-shuffle[data-shuffle-mode="local"] {
    color: #ffca6f;
    border-color: rgba(255, 205, 116, .92);
    background: rgba(255, 185, 61, .14);
    box-shadow: 0 0 0 1px rgba(255, 203, 111, .24) inset;
}

#global-player-shuffle[data-shuffle-mode="local"]::after {
    border-color: rgba(255, 214, 139, .58);
    background: rgba(255, 199, 79, .24);
    color: #ffd67e;
    opacity: 1;
    transform: scale(1);
}

#global-player-shuffle[data-shuffle-mode="global"] {
    color: #9ce9ff;
    border-color: rgba(129, 224, 255, .88);
    background: rgba(61, 159, 199, .2);
    box-shadow: 0 0 0 1px rgba(117, 212, 247, .24) inset;
}

#global-player-shuffle[data-shuffle-mode="global"]::after {
    border-color: rgba(128, 225, 255, .56);
    background: rgba(63, 171, 214, .22);
    color: #9ce6ff;
    opacity: 1;
    transform: scale(1);
}

.global-music-player .music-btn-like::before,
.global-music-player .music-btn-favorite::before,
.global-music-player #global-player-playlist::before {
    content: none !important;
}

.music-btn-like-icon,
.music-btn-favorite-icon,
.music-btn-playlist-icon {
    width: .95rem;
    height: .95rem;
    fill: currentColor;
    display: inline-block;
    vertical-align: -.1rem;
    margin-right: .34rem;
}

#global-player-favorite,
#global-player-playlist {
    width: 2.45rem;
    min-width: 2.45rem;
    height: 2.45rem;
    padding: 0;
    border-radius: 999px;
    justify-content: center;
}

#global-player-favorite .music-btn-favorite-icon,
#global-player-playlist .music-btn-playlist-icon {
    margin-right: 0;
}

.music-btn-like-icon {
    color: #ff7f9a;
}

.music-btn-favorite-icon {
    color: #9aa7c2;
    transition: color .16s ease, filter .16s ease;
}

#global-player-favorite.is-active .music-btn-favorite-icon {
    color: #ffcf67;
    filter: drop-shadow(0 0 6px rgba(255, 207, 103, .4));
}

.global-music-player__volume-wrap {
    position: relative;
    display: inline-flex;
}

.global-music-player__volume-popover {
    position: absolute;
    right: 0;
    bottom: calc(100% + .55rem);
    width: 2.65rem;
    padding: .48rem 0;
    border-radius: .8rem;
    border: 1px solid rgba(86, 103, 136, .62);
    background: linear-gradient(180deg, rgba(9, 15, 25, .96), rgba(8, 13, 23, .98));
    box-shadow: 0 16px 28px rgba(0, 0, 0, .36);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 8;
}

.global-music-player__volume-slider {
    width: 1rem;
    height: 7rem;
    margin: 0;
    writing-mode: vertical-lr;
    direction: rtl;
    accent-color: #ff8c55;
    cursor: pointer;
}

#global-player-volume[data-volume-level="muted"] {
    color: #8ea2c0;
}

#global-player-volume[data-volume-level="low"] {
    color: #ffd09a;
}

#global-player-volume[data-volume-level="high"] {
    color: #8ddfff;
}

.music-track-comments {
    background: linear-gradient(180deg, rgba(18, 27, 43, .64), rgba(13, 21, 34, .76));
    border: 1px solid rgba(73, 90, 123, .48);
    border-radius: .75rem;
}

.music-track-comments-row > td {
    padding-top: .2rem;
    padding-bottom: .65rem;
}

.music-comment-item {
    border: 1px solid rgba(73, 90, 123, .45);
    border-radius: .65rem;
    background: rgba(10, 16, 26, .68);
    padding: .7rem .75rem;
    margin-bottom: .55rem;
}

.music-comment-avatar {
    width: 1.95rem;
    height: 1.95rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(95, 117, 153, .55);
    background: rgba(46, 95, 178, .3);
    color: #d8e6ff;
    font-size: .74rem;
    font-weight: 700;
    line-height: 1;
    flex: 0 0 auto;
}

.music-comment-avatar[data-profile-hover-trigger="1"] {
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.music-comment-avatar[data-profile-hover-trigger="1"]:hover,
.music-comment-avatar[data-profile-hover-trigger="1"]:focus-visible {
    border-color: rgba(144, 190, 255, .95);
    box-shadow: 0 0 0 2px rgba(96, 165, 250, .25);
    transform: translateY(-1px);
    outline: none;
}

.music-comment-avatar-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.music-comment-avatar-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    text-transform: uppercase;
}

.music-author-meta {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    min-width: 0;
    max-width: 100%;
}

.music-author-meta-compact {
    font-size: .88rem;
}

.music-author-avatar {
    width: 2.05rem;
    height: 2.05rem;
    font-size: .78rem;
}

.music-author-name {
    color: inherit;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    border-radius: .45rem;
    padding: .05rem .22rem;
}

.music-author-name[data-profile-hover-trigger="1"] {
    cursor: pointer;
    transition: color .15s ease, background-color .15s ease;
}

.music-author-name[data-profile-hover-trigger="1"]:hover,
.music-author-name[data-profile-hover-trigger="1"]:focus-visible {
    color: #dbeafe;
    background: rgba(59, 130, 246, .16);
    outline: none;
}

.music-author-separator {
    opacity: .6;
}

.music-comment-item.is-highlighted {
    border-color: rgba(30, 215, 96, .8);
    box-shadow: 0 0 0 1px rgba(30, 215, 96, .35) inset;
}

.music-comment-replies {
    margin-left: 1rem;
    padding-left: .8rem;
    border-left: 1px dashed rgba(86, 103, 136, .5);
}

.music-comment-ts {
    cursor: pointer;
    color: #90d7ff;
    text-decoration: none;
}

.music-comment-reactions .btn {
    --bs-btn-padding-y: .1rem;
    --bs-btn-padding-x: .4rem;
    --bs-btn-font-size: .75rem;
    border-radius: .55rem;
}

.music-track-comments .form-control,
.music-track-comments .form-control:focus {
    background: rgba(9, 15, 25, .84);
    border-color: rgba(86, 103, 136, .55);
    color: var(--music-text);
    box-shadow: none;
}

.js-track-comments-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.music-track-comments .input-group .btn {
    border-radius: .55rem;
}

:root[data-theme="light"] .music-comment-avatar {
    border-color: rgba(123, 147, 189, .45);
    background: rgba(59, 130, 246, .14);
    color: #1f3a73;
}

:root[data-theme="light"] .music-comment-avatar[data-profile-hover-trigger="1"]:hover,
:root[data-theme="light"] .music-comment-avatar[data-profile-hover-trigger="1"]:focus-visible {
    border-color: rgba(59, 130, 246, .8);
    box-shadow: 0 0 0 2px rgba(59, 130, 246, .18);
}

:root[data-theme="light"] .music-author-name[data-profile-hover-trigger="1"]:hover,
:root[data-theme="light"] .music-author-name[data-profile-hover-trigger="1"]:focus-visible {
    color: #1d4ed8;
    background: rgba(37, 99, 235, .12);
}

.music-playlist-edit-modal {
    position: fixed;
    inset: 0;
    z-index: 2200;
    background: rgba(8, 12, 20, .62);
    padding: 1rem;
    overflow-y: auto;
}

.music-playlist-edit-modal__panel {
    width: min(560px, 100%);
    margin: 4vh auto;
    border: 1px solid rgba(86, 103, 136, .55);
    border-radius: .9rem;
    background: linear-gradient(180deg, rgba(15, 23, 37, .98), rgba(11, 18, 30, .98));
    box-shadow: 0 24px 44px rgba(0, 0, 0, .42);
    padding: 1rem;
    color: var(--music-text);
}

.music-playlist-edit-modal .form-control {
    background: rgba(9, 15, 25, .86);
    border-color: rgba(86, 103, 136, .6);
    color: var(--music-text);
}

.music-playlist-edit-modal .form-control:focus {
    border-color: rgba(115, 186, 255, .82);
    box-shadow: 0 0 0 .2rem rgba(115, 186, 255, .2);
    background: rgba(9, 15, 25, .95);
    color: var(--music-text);
}

.music-playlist-edit-modal .form-check-input {
    border-color: rgba(115, 186, 255, .6);
    background-color: rgba(9, 15, 25, .9);
}

.music-playlist-edit-modal .form-check-input:checked {
    background-color: var(--music-accent);
    border-color: var(--music-accent);
}

:root[data-theme="light"] .music-playlist-edit-modal {
    background: rgba(12, 18, 30, .35);
}

:root[data-theme="light"] .music-playlist-card:hover {
    box-shadow: 0 16px 26px rgba(35, 58, 94, .18);
}

:root[data-theme="light"] .music-playlist-detail-header {
    border: 1px solid rgba(184, 199, 224, .8) !important;
    background: linear-gradient(180deg, #ffffff, #f7faff);
}

:root[data-theme="light"] .music-playlist-tracks-card {
    border: 1px solid rgba(184, 199, 224, .8) !important;
    background: #ffffff;
}

:root[data-theme="light"] .music-playlist-empty-state {
    border-top-color: rgba(172, 192, 224, .6);
}

:root[data-theme="light"] .music-playlist-edit-modal__panel {
    background: linear-gradient(180deg, #ffffff, #f6f9ff);
    border-color: rgba(176, 188, 211, .92);
    box-shadow: 0 24px 44px rgba(39, 60, 95, .2);
    color: #1f2c43;
}

:root[data-theme="light"] .music-playlist-edit-modal .form-control {
    background: #ffffff;
    border-color: #c6d4eb;
    color: #1f2c43;
}

:root[data-theme="light"] .music-playlist-edit-modal .form-control:focus {
    border-color: #67a7ff;
    box-shadow: 0 0 0 .2rem rgba(103, 167, 255, .2);
    background: #ffffff;
    color: #1f2c43;
}

:root[data-theme="light"] .music-playlist-edit-modal .form-check-label {
    color: #31435f;
}

.playlist-track-remove-inline {
    opacity: 0;
    pointer-events: none;
    transform: translateY(2px);
    transition: opacity .14s ease, transform .14s ease;
}

.music-track-row[data-playlist-track-row="1"]:hover .playlist-track-remove-inline,
.music-track-row[data-playlist-track-row="1"]:focus-within .playlist-track-remove-inline,
.playlist-track-remove-inline:focus-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

@media (max-width: 992px) {
    .playlist-track-remove-inline {
        opacity: 1;
        pointer-events: auto;
        transform: none;
    }
}

.music-playlist-track-remove-modal {
    position: fixed;
    inset: 0;
    z-index: 2250;
    background: rgba(8, 12, 20, .62);
    padding: 1rem;
    overflow-y: auto;
}

.music-playlist-track-remove-modal__panel {
    width: min(460px, 100%);
    margin: 14vh auto;
    border: 1px solid rgba(86, 103, 136, .55);
    border-radius: .9rem;
    background: linear-gradient(180deg, rgba(15, 23, 37, .98), rgba(11, 18, 30, .98));
    box-shadow: 0 24px 44px rgba(0, 0, 0, .42);
    padding: 1rem;
    color: var(--music-text);
}

:root[data-theme="light"] .music-playlist-track-remove-modal {
    background: rgba(12, 18, 30, .35);
}

:root[data-theme="light"] .music-playlist-track-remove-modal__panel {
    background: linear-gradient(180deg, #ffffff, #f6f9ff);
    border-color: rgba(176, 188, 211, .92);
    box-shadow: 0 24px 44px rgba(39, 60, 95, .2);
    color: #1f2c43;
}

.js-track-comments-toggle {
    min-width: 3.1rem;
}

.js-track-like-toggle.is-active,
#global-player-like.is-active {
    border-color: rgba(255, 99, 132, .95);
    color: #ffd2dd;
    background: rgba(255, 99, 132, .22);
    box-shadow: 0 0 0 1px rgba(255, 99, 132, .28) inset;
}

#global-player-favorite.is-active {
    border-color: rgba(255, 209, 102, .9);
    color: #ffe8ad;
    background: rgba(255, 209, 102, .22);
    box-shadow: 0 0 0 1px rgba(255, 209, 102, .2) inset;
}

.music-comment-reactions .btn.is-active {
    border-color: rgba(30, 215, 96, .9);
    color: #dfffea;
    background: rgba(30, 215, 96, .2);
}

.global-music-player__wave-wrap {
    position: relative;
    height: 54px;
    flex: 1 1 auto;
    min-width: 280px;
    max-width: none;
    border: 1px solid rgba(73, 90, 123, .52);
    border-radius: .6rem;
    background: linear-gradient(180deg, rgba(8, 14, 24, .82), rgba(8, 14, 24, .72));
    overflow: hidden;
    cursor: pointer;
}

.global-music-player__overflow {
    display: none;
    position: relative;
    z-index: 9;
}

#global-player-overflow-toggle {
    width: 2.45rem;
    min-width: 2.45rem;
    height: 2.45rem;
    padding: 0;
    border-radius: 999px;
}

#global-player-overflow-toggle svg {
    width: 1rem;
    height: 1rem;
    fill: currentColor;
}

.global-music-player__overflow-popover {
    position: absolute;
    right: 0;
    bottom: calc(100% + .55rem);
    min-width: 210px;
    border-radius: .72rem;
    border: 1px solid rgba(86, 103, 136, .62);
    background: linear-gradient(180deg, rgba(9, 15, 25, .97), rgba(8, 13, 23, .98));
    box-shadow: 0 16px 28px rgba(0, 0, 0, .36);
    padding: .36rem;
    opacity: 0;
    transform: translateY(6px);
    pointer-events: none;
    transition: opacity .26s ease, transform .24s ease;
}

.global-music-player__overflow-popover.is-open {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.global-music-player__overflow-item {
    width: 100%;
    display: flex;
    align-items: center;
    gap: .45rem;
    border: 1px solid rgba(89, 108, 145, .5);
    background: rgba(13, 22, 36, .8);
    color: #e0ebff;
    border-radius: .55rem;
    padding: .28rem .46rem;
    font-size: .78rem;
    line-height: 1.2;
    text-align: left;
}

.global-music-player__overflow-item + .global-music-player__overflow-item {
    margin-top: .24rem;
}

.global-music-player__overflow-item:hover {
    border-color: rgba(123, 147, 192, .75);
    background: rgba(22, 36, 58, .9);
    color: #f2f7ff;
}

.global-music-player__overflow-item.is-active {
    border-color: rgba(255, 204, 120, .72);
    background: rgba(255, 188, 79, .16);
    color: #ffe4b3;
}

.global-music-player__overflow-item svg {
    width: .92rem;
    height: .92rem;
    fill: currentColor;
    flex: 0 0 auto;
}

.global-music-player__overflow-item .global-music-player__overflow-label {
    flex: 1 1 auto;
    min-width: 0;
}

.global-music-player__overflow-item[data-overflow-target="global-player-loop"] .global-music-player__overflow-loop-state {
    margin-left: auto;
    min-width: 1.2rem;
    height: 1.06rem;
    padding: 0 .36rem;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: inherit;
    font-size: .62rem;
    font-weight: 700;
    line-height: .98rem;
    letter-spacing: .03em;
    text-transform: uppercase;
    text-align: center;
    opacity: 0;
    transform: scale(.9);
    transition: opacity .16s ease, transform .16s ease, background-color .16s ease, border-color .16s ease, color .16s ease;
    pointer-events: none;
}

.global-music-player__overflow-item[data-overflow-target="global-player-loop"][data-loop-mode="track"] {
    border-color: rgba(255, 204, 120, .72);
    background: rgba(255, 188, 79, .16);
    color: #ffe4b3;
}

.global-music-player__overflow-item[data-overflow-target="global-player-loop"][data-loop-mode="track"] .global-music-player__overflow-loop-state {
    border-color: rgba(255, 214, 139, .58);
    background: rgba(255, 199, 79, .24);
    color: #ffd67e;
    opacity: 1;
    transform: scale(1);
}

.global-music-player__overflow-item[data-overflow-target="global-player-loop"][data-loop-mode="album"] {
    border-color: rgba(122, 221, 255, .72);
    background: rgba(78, 168, 206, .2);
    color: #d6f3ff;
}

.global-music-player__overflow-item[data-overflow-target="global-player-loop"][data-loop-mode="album"] .global-music-player__overflow-loop-state {
    border-color: rgba(128, 225, 255, .56);
    background: rgba(63, 171, 214, .22);
    color: #9ce6ff;
    opacity: 1;
    transform: scale(1);
}

.global-music-player__overflow-item[data-overflow-target="global-player-shuffle"] .global-music-player__overflow-shuffle-state {
    margin-left: auto;
    min-width: 2.5rem;
    height: 1.06rem;
    padding: 0 .36rem;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: inherit;
    font-size: .6rem;
    font-weight: 700;
    line-height: .98rem;
    letter-spacing: .03em;
    text-transform: uppercase;
    text-align: center;
    opacity: 0;
    transform: scale(.9);
    transition: opacity .16s ease, transform .16s ease, background-color .16s ease, border-color .16s ease, color .16s ease;
    pointer-events: none;
}

.global-music-player__overflow-item[data-overflow-target="global-player-shuffle"][data-shuffle-mode="local"] {
    border-color: rgba(255, 204, 120, .72);
    background: rgba(255, 188, 79, .16);
    color: #ffe4b3;
}

.global-music-player__overflow-item[data-overflow-target="global-player-shuffle"][data-shuffle-mode="local"] .global-music-player__overflow-shuffle-state {
    border-color: rgba(255, 214, 139, .58);
    background: rgba(255, 199, 79, .24);
    color: #ffd67e;
    opacity: 1;
    transform: scale(1);
}

.global-music-player__overflow-item[data-overflow-target="global-player-shuffle"][data-shuffle-mode="global"] {
    border-color: rgba(122, 221, 255, .72);
    background: rgba(78, 168, 206, .2);
    color: #d6f3ff;
}

.global-music-player__overflow-item[data-overflow-target="global-player-shuffle"][data-shuffle-mode="global"] .global-music-player__overflow-shuffle-state {
    border-color: rgba(128, 225, 255, .56);
    background: rgba(63, 171, 214, .22);
    color: #9ce6ff;
    opacity: 1;
    transform: scale(1);
}

.global-music-player__wave {
    width: 100%;
    height: 100%;
    display: block;
}

.global-music-player__markers {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.global-music-player__marker {
    position: absolute;
    top: 0;
    width: 2px;
    height: 100%;
    background: rgba(128, 217, 255, .9);
    transform: translateX(-50%);
    pointer-events: auto;
    cursor: pointer;
}

.global-music-player__wave-hover {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: rgba(255, 255, 255, .28);
    transform: translateX(-50%);
    pointer-events: none;
    opacity: 0;
    transition: opacity .12s ease;
}

.global-music-player__wave-time {
    position: absolute;
    top: 4px;
    left: 0;
    transform: translateX(-50%);
    background: rgba(8, 13, 24, .93);
    color: #eef4ff;
    border: 1px solid rgba(112, 132, 170, .55);
    border-radius: .35rem;
    padding: .08rem .35rem;
    font-size: .69rem;
    line-height: 1.2;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    transition: opacity .12s ease;
    z-index: 4;
    font-variant-numeric: tabular-nums;
}

.global-music-player__tooltip {
    position: absolute;
    bottom: calc(100% + 6px);
    left: 0;
    transform: translateX(-50%);
    background: rgba(8, 12, 22, .95);
    border: 1px solid rgba(86, 103, 136, .6);
    border-radius: .35rem;
    color: #e6ebf5;
    font-size: .72rem;
    line-height: 1.2;
    padding: .3rem .4rem;
    max-width: 220px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    z-index: 5;
}

.music-elevated-panel {
    box-shadow: 0 12px 24px rgba(0, 0, 0, .25);
}

.js-track-comments-toggle.is-open {
    border-color: rgba(120, 219, 255, .9);
    background: rgba(31, 86, 131, .55);
    color: #e6f6ff;
}

.global-music-player.is-loading #global-player-toggle {
    pointer-events: none;
    opacity: .8;
}

.music-ui-toast {
    position: fixed;
    right: 16px;
    bottom: 108px;
    z-index: 1300;
    max-width: min(360px, calc(100vw - 32px));
    padding: .55rem .7rem;
    border-radius: .65rem;
    font-size: .84rem;
    color: #dce8f8;
    background: rgba(9, 14, 24, .9);
    border: 1px solid rgba(86, 103, 136, .65);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .35);
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
    transition: opacity .16s ease, transform .16s ease;
}

.music-ui-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.music-ui-toast.is-error {
    border-color: rgba(255, 129, 129, .75);
    color: #ffd8d8;
}

.music-ui-toast.is-success {
    border-color: rgba(113, 231, 154, .75);
    color: #e1ffe9;
}

.global-music-player__visualizer {
    position: relative;
    width: 142px;
    height: 54px;
    border: 1px solid rgba(74, 99, 142, .5);
    border-radius: .58rem;
    background: radial-gradient(circle at 24% 22%, rgba(73, 154, 230, .22), rgba(9, 16, 30, .9));
    overflow: hidden;
    flex: 0 0 142px;
}

.global-music-player__visualizer-canvas {
    display: block;
    width: 100%;
    height: 100%;
}

.global-music-player__visualizer-empty {
    position: absolute;
    inset: auto 0 .26rem 0;
    text-align: center;
    font-size: .62rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: rgba(200, 220, 255, .8);
    pointer-events: none;
}

#global-player-display-toggle {
    width: 2.45rem;
    min-width: 2.45rem;
    height: 2.45rem;
    padding: 0;
    border-radius: 999px;
}

#global-player-display-toggle .music-icon-undock,
#global-player-display-toggle .global-music-player__dock-return-label {
    display: none;
}

#global-player-display-toggle .global-music-player__dock-return-label {
    margin-left: .35rem;
    font-size: .76rem;
    font-weight: 600;
    letter-spacing: .01em;
    white-space: nowrap;
}

#global-player-display-toggle[data-display-mode="dock-right"] {
    color: #9ce9ff;
    border-color: rgba(124, 214, 244, .86);
    background: rgba(52, 140, 179, .22);
}

.global-music-player__overflow-item[data-player-display-mode] .global-music-player__overflow-display-state {
    margin-left: auto;
    min-width: 2.2rem;
    height: 1.06rem;
    padding: 0 .32rem;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: inherit;
    font-size: .56rem;
    font-weight: 700;
    line-height: .98rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    text-align: center;
    opacity: .7;
}

.global-music-player__overflow-item[data-player-display-mode].is-active {
    border-color: rgba(120, 209, 255, .74);
    background: rgba(55, 147, 185, .18);
    color: #d8f2ff;
}

.global-music-player__overflow-item[data-player-display-mode].is-active .global-music-player__overflow-display-state {
    border-color: rgba(120, 209, 255, .52);
    background: rgba(68, 169, 214, .2);
    opacity: 1;
}

#site-shell-root[data-player-display-mode="dock-right"] {
    padding-right: 344px;
    padding-bottom: 24px;
}

#site-shell-root[data-player-display-mode="dock-right"] .music-ui-toast {
    right: 352px;
    bottom: 24px;
}

.global-music-player__volume-zone {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.global-music-player__dock-queue {
    display: none;
}

.global-music-player[data-display-mode="dock-right"] {
    left: auto;
    right: 14px;
    top: calc(var(--player-dock-top-offset, var(--music-sticky-offset-total)) + 8px);
    bottom: 14px;
    width: 324px;
    border-radius: 1.05rem;
    border: 1px solid rgba(88, 109, 148, .65);
    box-shadow: 0 20px 38px rgba(0, 0, 0, .46);
    overflow: hidden;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__inner {
    height: 100%;
    width: 100%;
    max-width: 100%;
    padding: .88rem .9rem !important;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__main {
    height: 100%;
    flex: 1 1 auto;
    min-height: 0;
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: .58rem;
    overflow-x: hidden;
    overflow-y: hidden;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__dock-header {
    display: flex;
    order: 1 !important;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__transport {
    order: 2 !important;
    justify-content: flex-start;
    gap: .5rem;
    padding-top: .08rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__transport .global-music-player__volume-wrap {
    margin-left: auto;
}

.global-music-player[data-display-mode="dock-right"] #global-player-toggle {
    width: 2.9rem;
    min-width: 2.9rem;
    height: 2.9rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__visualizer {
    order: 4 !important;
    width: 100%;
    flex: 0 0 auto;
    min-height: 108px;
    height: clamp(108px, 16vh, 138px);
    border-radius: .78rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__timeline {
    order: 3 !important;
    width: 100%;
    display: block;
    position: relative;
    /* On fixe explicitement la hauteur pour garder le même alignement partout. */
    flex: 0 0 34px;
    height: 34px;
    min-height: 34px;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__seek {
    display: none;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__wave-wrap {
    display: block;
    flex: 0 0 auto;
    min-width: 0;
    width: 100%;
    height: 34px;
    border-radius: .52rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__times {
    position: absolute;
    inset: 0;
    z-index: 3;
    min-width: 0;
    height: 34px;
    margin: 0;
    text-align: initial;
    pointer-events: none;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__times-sep {
    display: none;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__time-current {
    position: absolute;
    left: .34rem;
    /* On ancre les timings au bas du spectrum pour éviter les décalages de contexte. */
    top: auto;
    bottom: -.46rem;
    transform: translateY(-50%);
    min-width: 0;
    color: #ffd8b2;
    font-weight: 600;
    font-size: .66rem;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
    padding: .05rem .28rem;
    border-radius: .35rem;
    background: rgba(8, 15, 28, .5);
    border: 1px solid rgba(113, 138, 179, .42);
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__time-duration {
    position: absolute;
    right: .34rem;
    /* Même ancrage que le timing courant, pour rester parfaitement symétrique. */
    top: auto;
    bottom: -.46rem;
    transform: translateY(-50%);
    min-width: 0;
    color: #a9c3ea;
    font-size: .66rem;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
    padding: .05rem .28rem;
    border-radius: .35rem;
    background: rgba(8, 15, 28, .5);
    border: 1px solid rgba(113, 138, 179, .42);
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__meta {
    order: 6 !important;
    flex: 0 0 auto;
    max-width: none;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
    gap: .5rem;
    border: 1px solid rgba(88, 109, 148, .45);
    border-radius: .8rem;
    background: linear-gradient(180deg, rgba(13, 20, 34, .84), rgba(11, 18, 30, .74));
    padding: .62rem .56rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__cover {
    width: 146px;
    height: 146px;
    border-radius: .8rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__meta-text {
    width: 100%;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__title {
    font-size: .95rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__subtitle {
    font-size: .8rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__volume-zone {
    order: 5 !important;
    display: none;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__volume-popover {
    right: 0;
    left: auto;
    transform: none;
    top: calc(100% + .46rem);
    bottom: auto;
    z-index: 24;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__actions {
    order: 7 !important;
    width: 100%;
    justify-content: center;
    gap: .28rem;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__actions > .btn,
.global-music-player[data-display-mode="dock-right"] .global-music-player__actions > .global-music-player__overflow {
    min-width: 0;
    width: 100%;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__actions > .btn {
    border-radius: .7rem;
    height: 2.12rem;
    padding: .16rem .16rem;
    justify-content: center;
    align-items: center;
}

.global-music-player[data-display-mode="dock-right"] #global-player-comments,
.global-music-player[data-display-mode="dock-right"] #global-player-like,
.global-music-player[data-display-mode="dock-right"] #global-player-favorite,
.global-music-player[data-display-mode="dock-right"] #global-player-playlist {
    display: inline-flex !important;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__actions #global-player-playlist,
.global-music-player[data-display-mode="dock-right"] .global-music-player__actions #global-player-favorite,
.global-music-player[data-display-mode="dock-right"] .global-music-player__actions #global-player-overflow-toggle {
    width: 100%;
    min-width: 0;
    height: 2.12rem;
    border-radius: .7rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__actions #global-player-display-toggle {
    display: none !important;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__actions #global-player-like .music-like-count {
    display: none;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__actions .global-music-player__overflow {
    display: none !important;
}

.global-music-player[data-display-mode="dock-right"] #global-player-comments::after,
.global-music-player[data-display-mode="dock-right"] #global-player-like::after,
.global-music-player[data-display-mode="dock-right"] #global-player-favorite::after,
.global-music-player[data-display-mode="dock-right"] #global-player-playlist::after {
    display: inline-block;
    margin-left: .28rem;
    font-size: .66rem;
    line-height: 1;
    letter-spacing: .01em;
    vertical-align: middle;
}

.global-music-player[data-display-mode="dock-right"] #global-player-comments::after {
    content: "Com";
}

.global-music-player[data-display-mode="dock-right"] #global-player-like::after {
    content: none;
    display: none;
}

.global-music-player[data-display-mode="dock-right"] #global-player-favorite::after {
    content: "Fav";
}

.global-music-player[data-display-mode="dock-right"] #global-player-playlist::after {
    content: "List";
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue {
    order: 8 !important;
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1 1 auto;
    margin-top: auto;
    overflow: hidden;
    border: 1px solid rgba(82, 104, 143, .48);
    border-radius: .72rem;
    background: linear-gradient(180deg, rgba(11, 17, 30, .82), rgba(10, 16, 27, .74));
    padding: .52rem;
    gap: .45rem;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__main > * {
    max-width: 100%;
}

.global-music-player__dock-queue-header {
    font-size: .7rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: rgba(195, 214, 248, .86);
}

.global-music-player__dock-queue-empty {
    font-size: .76rem;
    color: rgba(163, 186, 225, .76);
    line-height: 1.25;
}

.global-music-player__dock-queue-list {
    display: flex;
    flex-direction: column;
    gap: .28rem;
    flex: 1 1 auto;
    min-height: 0;
    max-height: 100%;
    overflow-y: auto;
    padding-right: .16rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(126, 160, 210, .45) transparent;
}

.global-music-player__dock-queue-list::-webkit-scrollbar {
    width: 8px;
}

.global-music-player__dock-queue-list::-webkit-scrollbar-track {
    background: transparent;
}

.global-music-player__dock-queue-list::-webkit-scrollbar-thumb {
    background: rgba(126, 160, 210, .45);
    border-radius: 999px;
}

.global-music-player__dock-queue-item {
    border: 1px solid rgba(86, 107, 144, .56);
    border-radius: .58rem;
    background: rgba(15, 24, 40, .82);
    color: #e6f0ff;
    text-align: left;
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .34rem .46rem;
    line-height: 1.2;
}

.global-music-player__dock-queue-role {
    min-width: 2.1rem;
    height: 1rem;
    padding: 0 .24rem;
    border-radius: 999px;
    border: 1px solid rgba(123, 149, 190, .55);
    background: rgba(45, 67, 101, .48);
    color: #bddcff;
    font-size: .56rem;
    line-height: .92rem;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .04em;
    flex: 0 0 auto;
}

.global-music-player__dock-queue-mode {
    min-width: 2.5rem;
    height: 1rem;
    padding: 0 .24rem;
    border-radius: 999px;
    border: 1px solid rgba(110, 138, 184, .45);
    background: rgba(28, 45, 74, .42);
    color: rgba(196, 218, 251, .88);
    font-size: .53rem;
    line-height: .9rem;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .03em;
    flex: 0 0 auto;
}

.global-music-player__dock-queue-item:hover {
    border-color: rgba(132, 170, 227, .72);
    background: rgba(24, 37, 60, .9);
    color: #f2f7ff;
}

.global-music-player__dock-queue-item.is-active {
    border-color: rgba(255, 191, 116, .78);
    background: linear-gradient(180deg, rgba(255, 194, 116, .8), rgba(255, 168, 92, .72));
    color: #2e1a08;
}

.global-music-player__dock-queue-item.is-history {
    opacity: .74;
    border-color: rgba(93, 113, 147, .52);
    background: rgba(13, 21, 36, .64);
}

.global-music-player__dock-queue-item.is-locked {
    opacity: .82;
    border-color: rgba(157, 132, 90, .62);
    background: rgba(41, 32, 18, .54);
    color: rgba(255, 225, 180, .9);
    cursor: default;
}

.global-music-player__dock-queue-index {
    width: 1.3rem;
    min-width: 1.3rem;
    text-align: center;
    font-size: .7rem;
    opacity: .84;
}

.global-music-player__dock-queue-text {
    min-width: 0;
    flex: 1 1 auto;
}

.global-music-player__dock-queue-title,
.global-music-player__dock-queue-subtitle {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.global-music-player__dock-queue-title {
    font-size: .78rem;
    color: inherit;
}

.global-music-player__dock-queue-subtitle {
    font-size: .68rem;
    color: rgba(173, 197, 234, .78);
}

.global-music-player__dock-queue-item.is-active .global-music-player__dock-queue-role {
    border-color: rgba(173, 95, 23, .58);
    background: rgba(255, 232, 208, .72);
    color: #7b3e06;
}

.global-music-player__dock-queue-item.is-active .global-music-player__dock-queue-subtitle {
    color: rgba(71, 44, 18, .78);
}

.global-music-player__dock-queue-item:not(.is-active):not(.is-history) {
    border-color: rgba(104, 127, 166, .66);
    background: rgba(26, 39, 61, .82);
    color: #eaf2ff;
}

.global-music-player[data-display-mode="dock-right"] .global-music-player__overflow-popover {
    right: 0;
    left: auto;
    min-width: 188px;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__meta {
    border-color: rgba(132, 166, 205, .58);
    background: linear-gradient(180deg, rgba(243, 249, 255, .98), rgba(232, 243, 255, .96));
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__title {
    color: #14375f;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__subtitle {
    color: #4d6f95;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__time-current {
    color: #a64f12;
    background: rgba(252, 244, 233, .95);
    border-color: rgba(210, 155, 109, .48);
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__time-duration {
    color: #4f78a4;
    background: rgba(232, 242, 252, .95);
    border-color: rgba(142, 173, 210, .58);
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__wave-wrap {
    border-color: rgba(145, 178, 216, .66);
    background: linear-gradient(180deg, rgba(241, 248, 255, .98), rgba(229, 241, 255, .94));
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__visualizer {
    border-color: rgba(145, 178, 216, .66);
    background: radial-gradient(circle at 24% 22%, rgba(95, 169, 232, .34), rgba(227, 240, 255, .95));
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__visualizer-empty {
    color: rgba(72, 109, 148, .88);
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__volume-popover {
    border-color: rgba(145, 178, 216, .72);
    background: linear-gradient(180deg, rgba(246, 251, 255, .98), rgba(231, 242, 255, .96));
    box-shadow: 0 14px 24px rgba(31, 74, 122, .2);
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__wave-time {
    background: rgba(248, 252, 255, .98);
    border-color: rgba(145, 178, 216, .72);
    color: #2b537f;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue {
    border-color: rgba(145, 178, 216, .6);
    background: linear-gradient(180deg, rgba(241, 248, 255, .98), rgba(230, 242, 255, .95));
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-header {
    color: #4d6f95;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-empty {
    color: #6b88ab;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-role {
    border-color: rgba(138, 172, 210, .66);
    background: rgba(215, 232, 250, .9);
    color: #4f78a4;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-mode {
    border-color: rgba(155, 181, 214, .72);
    background: rgba(224, 238, 253, .9);
    color: #476f99;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-item {
    border-color: rgba(146, 177, 214, .72);
    background: rgba(235, 245, 255, .96);
    color: #1e3e63;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-item:not(.is-active):not(.is-history) {
    border-color: rgba(142, 173, 210, .78);
    background: rgba(229, 241, 255, .96);
    color: #1f456d;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-item.is-history {
    border-color: rgba(165, 188, 216, .68);
    background: rgba(243, 249, 255, .86);
    color: #5b7799;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-item.is-active {
    border-color: rgba(218, 138, 68, .78);
    background: linear-gradient(180deg, rgba(255, 216, 175, .96), rgba(255, 191, 138, .92));
    color: #4b2200;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-item.is-locked {
    border-color: rgba(215, 174, 110, .76);
    background: rgba(255, 236, 206, .88);
    color: #75420f;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-item .global-music-player__dock-queue-subtitle {
    color: #6287b2;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] .global-music-player__dock-queue-item.is-active .global-music-player__dock-queue-subtitle {
    color: #8a4a16;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] #global-player-comments {
    color: #0a5f89 !important;
    border-color: #70afd5 !important;
    background: rgba(238, 247, 255, .96) !important;
}

:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] #global-player-comments:hover,
:root[data-theme="light"] .global-music-player[data-display-mode="dock-right"] #global-player-comments:focus-visible {
    color: #08496a !important;
    border-color: #4e93c1 !important;
    background: rgba(222, 240, 255, .98) !important;
}

@media (max-width: 1240px) {
    #site-shell-root[data-player-display-mode="dock-right"] {
        padding-right: 0;
        padding-bottom: 136px;
    }

    #site-shell-root[data-player-display-mode="dock-right"] .music-ui-toast {
        right: 16px;
        bottom: 108px;
    }
}

@media (max-width: 767.98px) {
    .music-page-shell {
        padding-bottom: 186px;
    }

    .global-music-player__times {
        min-width: 70px;
    }

    .music-track-actions {
        justify-content: flex-start;
    }

    .global-music-player__main {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .global-music-player__transport {
        margin-left: 0;
    }

    .global-music-player__timeline {
        order: 3;
        width: 100%;
    }

    .global-music-player__wave-wrap {
        min-width: 0;
        max-width: none;
        height: 48px;
    }

    .global-music-player__actions {
        margin-left: 0;
    }

    .global-music-player__cover {
        width: 48px;
        height: 48px;
    }

    .music-ui-toast {
        right: 10px;
        bottom: 170px;
        max-width: calc(100vw - 20px);
    }
}

.global-music-player[data-secondary-collapsed="1"]:not([data-display-mode="dock-right"]) #global-player-shuffle,
.global-music-player[data-secondary-collapsed="1"]:not([data-display-mode="dock-right"]) #global-player-loop,
.global-music-player[data-secondary-collapsed="1"]:not([data-display-mode="dock-right"]) #global-player-comments,
.global-music-player[data-secondary-collapsed="1"]:not([data-display-mode="dock-right"]) #global-player-favorite,
.global-music-player[data-secondary-collapsed="1"]:not([data-display-mode="dock-right"]) #global-player-playlist {
    display: none !important;
}

/* MOB22 : maintien du Like desktop identique au CSS player persistant. */
@media (max-width: 767.98px) {
    .global-music-player[data-secondary-collapsed="1"]:not([data-display-mode="dock-right"]) #global-player-like {
        display: none !important;
    }
}

.global-music-player[data-secondary-collapsed="1"]:not([data-display-mode="dock-right"]) .global-music-player__overflow {
    display: inline-flex;
}

.global-music-player[data-layout-mode="medium"] .global-music-player__main {
    gap: .5rem;
}

.global-music-player[data-layout-mode="medium"] .global-music-player__transport,
.global-music-player[data-layout-mode="medium"] .global-music-player__actions {
    gap: .28rem;
}

.global-music-player[data-layout-mode="medium"] .global-music-player__timeline {
    gap: .34rem;
}

.global-music-player[data-layout-mode="medium"] .global-music-player__meta {
    flex-basis: 168px;
    max-width: 178px;
}

.global-music-player[data-layout-mode="medium"] .global-music-player__cover {
    width: 40px;
    height: 40px;
}

.global-music-player[data-layout-mode="compact"] .global-music-player__main {
    gap: .42rem;
}

.global-music-player[data-layout-mode="compact"] .global-music-player__transport,
.global-music-player[data-layout-mode="compact"] .global-music-player__actions {
    gap: .22rem;
}

.global-music-player[data-layout-mode="compact"] .global-music-player__timeline {
    gap: .28rem;
}

.global-music-player[data-layout-mode="compact"] .global-music-player__wave-wrap {
    min-width: 240px;
}

.global-music-player[data-layout-mode="compact"] .global-music-player__meta {
    flex-basis: 150px;
    max-width: 158px;
}

.global-music-player[data-layout-mode="compact"] .global-music-player__cover {
    width: 36px;
    height: 36px;
}

.global-music-player[data-layout-mode="bridge"] .global-music-player__main {
    flex-wrap: wrap;
    row-gap: .42rem;
    column-gap: .35rem;
}

.global-music-player[data-layout-mode="bridge"] .global-music-player__transport {
    order: 1;
    flex: 0 0 auto;
    gap: .22rem;
}

.global-music-player[data-layout-mode="bridge"] .global-music-player__timeline {
    order: 2;
    flex: 1 1 290px;
    min-width: 250px;
    gap: .28rem;
}

.global-music-player[data-layout-mode="bridge"] .global-music-player__meta {
    order: 3;
    flex: 1 1 auto;
    max-width: calc(100% - 82px);
    flex-basis: 142px;
}

.global-music-player[data-layout-mode="bridge"] .global-music-player__cover {
    width: 34px;
    height: 34px;
}

.global-music-player[data-layout-mode="bridge"] .global-music-player__actions {
    order: 4;
    flex: 0 0 auto;
    margin-left: auto;
    gap: .2rem;
}

.global-music-player[data-layout-mode="tight"] .global-music-player__main {
    flex-wrap: wrap;
    row-gap: .42rem;
    column-gap: .38rem;
}

.global-music-player[data-layout-mode="tight"] .global-music-player__transport {
    order: 1;
    flex: 0 0 auto;
}

.global-music-player[data-layout-mode="tight"] .global-music-player__timeline {
    order: 2;
    flex: 1 1 260px;
    min-width: 220px;
}

.global-music-player[data-layout-mode="tight"] .global-music-player__meta {
    order: 3;
    flex: 1 1 auto;
    max-width: calc(100% - 74px);
    flex-basis: 128px;
}

.global-music-player[data-layout-mode="tight"] .global-music-player__cover {
    width: 32px;
    height: 32px;
}

.global-music-player[data-layout-mode="tight"] .global-music-player__actions {
    order: 4;
    flex: 0 0 auto;
    margin-left: auto;
}

@media (max-width: 1320px) and (min-width: 768px) {
    .global-music-player__main {
        gap: .5rem;
    }

    .global-music-player__transport,
    .global-music-player__actions {
        gap: .28rem;
    }

    .global-music-player__timeline {
        gap: .36rem;
    }

    .global-music-player__meta {
        flex-basis: 218px;
        max-width: 232px;
    }

    .global-music-player__cover {
        width: 40px;
        height: 40px;
    }
}


/* R103 FIX14 — signalétique admin des brouillons et partage désactivé. */
.music-admin-draft-badge {
    letter-spacing: .055em;
    font-weight: 800;
}

.cab-music-share-button[data-music-share-disabled="1"],
.cab-music-share-page-button[data-music-share-disabled="1"] {
    opacity: .36 !important;
    filter: grayscale(.8) saturate(.55);
    cursor: not-allowed !important;
    box-shadow: none !important;
}


/* ==========================================================================
 * R119.4A DESK5B FIX3 — desktop player micro-fixes
 * ========================================================================== */
@media (min-width: 768px) {
    #site-shell-player-zone[data-volume-popover-open="1"] { z-index: 1760 !important; }
    .global-music-player[data-volume-popover-open="1"] { z-index: 1760 !important; }
    .global-music-player[data-volume-popover-open="1"] .global-music-player__volume-popover { z-index: 1770 !important; }

    :is(body.music-page-shell, body.music-player-persistent) .global-music-player .music-track-reaction-wrap--global {
        position: relative; flex: 0 0 2.45rem; width: 2.45rem; min-width: 2.45rem; height: 2.45rem;
    }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player #global-player-like {
        position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
        width: 2.45rem !important; min-width: 2.45rem !important; max-width: 2.45rem !important; height: 2.45rem !important;
        padding: 0 !important; gap: 0 !important; border-radius: 999px !important; border-width: 1px !important; border-color: currentColor !important; overflow: visible !important;
    }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player #global-player-like .music-track-action-icon {
        display: inline-flex; align-items: center; justify-content: center; margin: 0 !important;
    }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player #global-player-like .music-social-like-svg { width: 1rem; height: 1rem; }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player #global-player-like .music-like-count {
        position: absolute; top: -.34rem; right: -.28rem; display: inline-flex; align-items: center; justify-content: center;
        min-width: 1.05rem; height: 1.05rem; padding: 0 .2rem; border: 1px solid rgba(255,255,255,.86); border-radius: 999px;
        background: #fff3f6; color: #b4234b; box-shadow: 0 1px 5px rgba(15,23,42,.24); font-size: .58rem; font-weight: 800; line-height: 1; z-index: 3; pointer-events: none;
    }
    :root[data-theme="dark"] :is(body.music-page-shell, body.music-player-persistent) .global-music-player #global-player-like .music-like-count {
        border-color: rgba(255,255,255,.62); background: #321724; color: #ffb7ca;
    }

    .global-music-player__inner { padding-right: 3.65rem !important; }
    #global-player-minimize {
        position: absolute; top: 50%; right: .5rem; display: inline-flex; align-items: center; justify-content: center;
        width: 2.45rem; min-width: 2.45rem; height: 2.45rem; padding: 0; border-radius: 999px; transform: translateY(-50%); z-index: 18;
        transition: width .16s ease, height .16s ease, border-radius .16s ease, background-color .16s ease, color .16s ease;
    }
    #global-player-minimize svg { width: 1rem; height: 1rem; fill: currentColor; }
    #global-player-minimize .global-music-player__minimize-restore { display: none; }

    .global-music-player[data-player-minimized="1"] {
        left: auto !important; right: 0 !important; top: auto !important; bottom: 0 !important; width: 20px !important; min-width: 20px !important; max-width: 20px !important;
        height: var(--club-player-minimized-height, 64px) !important; min-height: 0 !important; overflow: hidden !important;
        border-left: 1px solid rgba(86,103,136,.62); border-top-left-radius: 10px; box-shadow: -8px 0 20px rgba(0,0,0,.18);
    }
    .global-music-player[data-player-minimized="1"] .global-music-player__inner {
        visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; width: 20px !important; height: 100% !important; padding: 0 !important; overflow: hidden !important;
    }
    .global-music-player[data-player-minimized="1"] #global-player-minimize {
        inset: 0 !important; width: 20px !important; min-width: 20px !important; max-width: 20px !important; height: 100% !important; padding: 0 !important;
        border-width: 0 0 0 1px !important; border-radius: 10px 0 0 10px !important; transform: none !important; background: rgba(246,250,255,.98) !important; color: #245b9e !important; box-shadow: none !important;
    }
    :root[data-theme="dark"] .global-music-player[data-player-minimized="1"] #global-player-minimize { background: rgba(12,20,34,.98) !important; color: #9fd6ff !important; }
    .global-music-player[data-player-minimized="1"] #global-player-minimize .global-music-player__minimize-close { display: none; }
    .global-music-player[data-player-minimized="1"] #global-player-minimize .global-music-player__minimize-restore { display: block; width: .8rem; height: .8rem; }
}
@media (max-width: 767.98px) { #global-player-minimize { display: none !important; } }

/* ===== SOURCE: music-common.css ===== */
/*
 * ClubOS — socle visuel Musique partagé.
 *
 * Ce fichier contient uniquement les tokens et composants communs au mobile
 * et au desktop. Les media queries de géométrie restent dans les fichiers
 * music-mobile-complete.css et music-desktop.css.
 */
body.music-page-shell {
    --music-accent: var(--site-accent, #0f8278);
    --music-accent-strong: color-mix(in srgb, var(--music-accent) 82%, #052b33);
    --music-accent-soft: color-mix(in srgb, var(--music-accent) 13%, transparent);
    --music-surface: var(--site-surface, #ffffff);
    --music-surface-raised: color-mix(in srgb, var(--site-surface, #ffffff) 96%, var(--music-accent) 4%);
    --music-surface-elevated: var(--music-surface-raised);
    --music-surface-selected: color-mix(in srgb, var(--music-accent) 9%, var(--site-surface, #ffffff));
    --music-border-soft: color-mix(in srgb, var(--site-border, #d6dde8) 72%, transparent);
    --music-border: var(--music-border-soft);
    --music-text-main: var(--site-text, #172033);
    --music-text: var(--music-text-main);
    --music-text-secondary: var(--site-text-muted, #64748b);
    --music-text-muted: var(--music-text-secondary);
    --music-control-hover: color-mix(in srgb, var(--music-accent) 10%, transparent);
}

:root[data-theme="dark"] body.music-page-shell,
:root[data-bs-theme="dark"] body.music-page-shell {
    --music-accent-strong: color-mix(in srgb, var(--music-accent) 72%, #ffffff);
    --music-surface-raised: color-mix(in srgb, var(--site-surface, #101b2d) 92%, var(--music-accent) 8%);
    --music-surface-selected: color-mix(in srgb, var(--music-accent) 14%, var(--site-surface, #101b2d));
    --music-border-soft: color-mix(in srgb, var(--site-border, #31435f) 78%, transparent);
}

/* Le HTML serveur fournit ces classes. Le JS ne fait plus que les compléter. */
body.music-page-shell .music-track-cover-cell,
body.music-page-shell .music-track-number-cell,
body.music-page-shell .music-track-title-cell,
body.music-page-shell .music-track-duration-cell,
body.music-page-shell .music-track-actions-cell {
    min-width: 0;
}

body.music-page-shell .music-mobile-track-meta {
    display: none;
}

/* Composeur commun : toujours lisible, même avant toute réhydratation JS. */
body.music-page-shell .music-comment-composer {
    margin-top: .55rem;
    color: var(--music-text-main);
}

body.music-page-shell .music-comment-composer__main {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    gap: .55rem;
}

body.music-page-shell .music-comment-composer__avatar {
    display: inline-flex;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    background: var(--music-accent-soft);
    color: var(--music-accent-strong);
    font-size: .78rem;
    font-weight: 850;
}

body.music-page-shell .music-comment-composer__avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

body.music-page-shell .music-comment-composer__field {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
}

body.music-page-shell .music-comment-composer .js-track-comment-content {
    width: 100%;
    min-height: 44px;
    max-height: 8.5rem;
    padding: .68rem .85rem;
    border: 1px solid var(--music-border-soft);
    border-radius: 16px;
    background: var(--music-surface);
    color: var(--music-text-main);
    resize: none;
    line-height: 1.42;
    overflow-y: hidden;
    box-shadow: none;
}

body.music-page-shell .music-comment-composer .js-track-comment-content:focus {
    border-color: color-mix(in srgb, var(--music-accent) 62%, var(--music-border-soft));
    outline: 2px solid color-mix(in srgb, var(--music-accent) 25%, transparent);
    outline-offset: 1px;
}

body.music-page-shell .music-comment-composer__tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .55rem;
    margin-top: .45rem;
}

body.music-page-shell .music-comment-composer__secondary {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .35rem;
}

body.music-page-shell .music-comment-composer__tool,
body.music-page-shell .music-comment-composer__clear-time,
body.music-page-shell .music-comment-reply-cancel {
    border: 1px solid var(--music-border-soft);
    border-radius: 999px;
    background: transparent;
    color: var(--music-text-muted);
    font: inherit;
}

body.music-page-shell .music-comment-composer__tool {
    min-height: 36px;
    padding: .28rem .62rem;
}

body.music-page-shell .music-comment-composer__tool:hover,
body.music-page-shell .music-comment-composer__tool:focus-visible,
body.music-page-shell .music-comment-reply-cancel:hover,
body.music-page-shell .music-comment-reply-cancel:focus-visible {
    background: var(--music-control-hover);
    color: var(--music-text-main);
}

body.music-page-shell .music-comment-composer__tool[aria-pressed="true"] {
    border-color: color-mix(in srgb, var(--music-accent) 42%, var(--music-border-soft));
    background: var(--music-accent-soft);
    color: var(--music-accent-strong);
}

body.music-page-shell .music-comment-composer__submit,
body.music-page-shell .music-comment-reply-submit {
    min-height: 38px;
    padding: .34rem .9rem;
    border: 0;
    border-radius: 999px;
    background: var(--music-accent);
    color: #fff;
    font: inherit;
    font-weight: 820;
}

body.music-page-shell .music-comment-composer__submit:disabled,
body.music-page-shell .music-comment-reply-submit:disabled {
    opacity: .45;
    cursor: default;
}

body.music-page-shell .music-comment-composer__time {
    display: flex;
    align-items: center;
    gap: .4rem;
    min-height: 1.35rem;
    margin-top: .32rem;
    color: var(--music-accent-strong);
    font-size: .75rem;
}

body.music-page-shell .music-comment-composer__clear,
body.music-page-shell .music-comment-composer__clear-time {
    border: 0;
    background: transparent;
    color: var(--music-text-muted);
}

body.music-page-shell .music-comment-composer__clear {
    display: none;
}

body.music-page-shell .music-comment-emoji-wrap {
    position: relative;
}

body.music-page-shell .music-comment-emoji-picker {
    position: absolute;
    z-index: 6800;
    left: 0;
    bottom: calc(100% + .4rem);
    display: grid;
    grid-template-columns: repeat(6, 40px);
    gap: .2rem;
    max-height: min(17rem, 55vh);
    padding: .4rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid var(--music-border-soft);
    border-radius: 16px;
    background: var(--music-surface-raised);
    box-shadow: 0 12px 30px rgba(15, 23, 42, .18);
}

body.music-page-shell .music-comment-emoji-picker[hidden] {
    display: none !important;
}

body.music-page-shell .music-comment-emoji-picker button {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    font-size: 1.1rem;
}

body.music-page-shell .music-comment-emoji-picker button:hover,
body.music-page-shell .music-comment-emoji-picker button:focus-visible {
    background: var(--music-control-hover);
}

body.music-page-shell .music-comment-reply-form__label {
    display: block;
    margin-bottom: .35rem;
    color: var(--music-text-muted);
    font-size: .78rem;
    font-weight: 720;
}

body.music-page-shell .music-comment-reply-cancel {
    min-height: 34px;
    padding: .28rem .65rem;
}

body.music-page-shell .music-comment-link {
    color: var(--music-accent-strong);
    overflow-wrap: anywhere;
    text-decoration: underline;
    text-underline-offset: .14em;
}

body.music-page-shell .music-comment-sortbar {
    display: flex;
    justify-content: flex-end;
    margin: 0 0 .45rem;
}

body.music-page-shell .music-comment-sortbar__label {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: var(--music-text-muted);
    font-size: .76rem;
    font-weight: 720;
}

body.music-page-shell .music-comment-sortbar__select {
    min-height: 34px;
    padding: .28rem 2rem .28rem .65rem;
    border: 1px solid var(--music-border-soft);
    border-radius: 10px;
    background: var(--music-surface);
    color: var(--music-text-main);
    font: inherit;
}

body.music-page-shell .music-comment-composer__feedback {
    margin: .35rem 0 0 2.9rem;
    color: var(--music-accent-strong);
    font-size: .78rem;
    font-weight: 700;
}

body.music-page-shell .music-comment-composer__feedback.is-error {
    color: #b42318;
}

:root[data-theme="dark"] body.music-page-shell .music-comment-composer__feedback.is-error,
:root[data-bs-theme="dark"] body.music-page-shell .music-comment-composer__feedback.is-error {
    color: #ff9b8f;
}

@media (max-width: 767.98px) {
    body .clubos-mobile-player-progress {
        /* MOB4: 36px de zone tactile, mais centre du thumb ramené dans le player. */
        inset: -9px 0 auto;
        height: 36px;
        display: flex;
        align-items: center;
        touch-action: none;
        pointer-events: auto;
    }

    body .clubos-mobile-player-progress > input[type="range"] {
        width: 100%;
        height: 36px;
        margin: 0;
        touch-action: none;
        pointer-events: auto;
    }
}

/* 8.15.8.1.3 — visiteur public : lecture sans exposition des mécaniques sociales. */
.music-page-shell.music-guest .music-btn-like,
.music-page-shell.music-guest .music-btn-favorite,
.music-page-shell.music-guest [data-overflow-target="global-player-like"],
.music-page-shell.music-guest [data-overflow-target="global-player-favorite"]{display:none!important}
.music-track-actions-heading{text-align:center!important}
.music-track-actions-cell .music-track-actions{justify-content:center}
.music-page-shell.music-guest .music-track-actions-heading{width:92px!important}

/* 8.15.8.1.5.1 — défense en profondeur côté invité : même si un ancien runtime
   recrée temporairement les actions mobiles, aucune mécanique membre n'est visible. */
.music-page-shell.music-guest .music-mobile-player-action[data-source-id="global-player-like"],
.music-page-shell.music-guest .music-mobile-player-action[data-source-id="global-player-favorite"],
.music-page-shell.music-guest .music-mobile-player-action[data-source-id="global-player-playlist"],
.music-page-shell.music-guest [data-overflow-target="global-player-playlist"]{display:none!important}

/* ===== SOURCE: music-album-progressive.css ===== */
.music-album-progressive-loader{min-height:74px;margin:24px 0 10px;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--bs-secondary-color,#6c757d);font-size:.92rem;border-radius:18px}.music-album-progressive-spinner{width:22px;height:22px;border-radius:50%;border:3px solid rgba(66,133,244,.18);border-top-color:#4285f4;animation:musicAlbumProgressiveSpin .8s linear infinite}.music-album-progressive-loader.has-error{cursor:pointer;color:#b23a3a;background:rgba(178,58,58,.06);border:1px dashed rgba(178,58,58,.25);padding:14px}.music-album-progressive-loader.has-error .music-album-progressive-spinner{display:none}@keyframes musicAlbumProgressiveSpin{to{transform:rotate(360deg)}}

/* ===== SOURCE: music-desktop.css ===== */
/*
 * ClubOS — géométrie Musique desktop.
 * Chargé après le socle commun et isolé à partir de 768 px.
 */
@media (min-width: 768px) {
    body.music-page-shell .music-track-table {
        width: 100%;
        table-layout: auto;
    }

    body.music-page-shell .music-track-table .music-track-cover-cell {
        width: 62px;
    }

    body.music-page-shell .music-track-table .music-track-number-cell {
        width: 74px;
    }

    body.music-page-shell .music-track-table .music-track-duration-cell {
        width: 92px;
        white-space: nowrap;
    }

    body.music-page-shell .music-track-table .music-track-actions-cell {
        width: 212px;
    }

    body.music-page-shell .music-track-table .music-track-title-cell {
        min-width: 12rem;
    }

    body.music-page-shell .music-track-table .track-cover-thumb {
        width: 46px;
        height: 46px;
        object-fit: cover;
        border-radius: .55rem;
    }

    body.music-page-shell .music-track-table .music-track-actions {
        flex-wrap: nowrap !important;
    }

    body.music-page-shell .music-track-table .music-track-play-btn {
        width: 38px;
        height: 38px;
        min-width: 38px;
        display: inline-grid;
        place-items: center;
        padding: 0;
        border-radius: 50%;
    }

    body.music-page-shell .music-track-table .music-track-play-icon {
        font-size: 0;
        line-height: 0;
    }

    body.music-page-shell .music-track-table .music-track-play-icon::before {
        content: "";
        display: block;
        width: 16px;
        height: 16px;
        background: currentColor;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / contain no-repeat;
    }

    body.music-page-shell .music-track-table .js-music-play-trigger.is-playing .music-track-play-icon::before,
    body.music-page-shell .music-track-table .music-track-row.is-track-playing .music-track-play-icon::before {
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 5h4v14H7zm6 0h4v14h-4z'/%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 5h4v14H7zm6 0h4v14h-4z'/%3E%3C/svg%3E");
    }

    /* Le composeur desktop est un composant à part entière, pas le fallback HTML brut. */
    body.music-page-shell .music-comment-composer {
        max-width: 100%;
        padding: .75rem;
        border: 1px solid var(--music-border-soft);
        border-radius: 16px;
        background: var(--music-surface-raised);
        box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
    }

    body.music-page-shell .music-comment-composer__avatar {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
    }

    body.music-page-shell .music-comment-composer .js-track-comment-content {
        min-height: 46px;
        max-height: 10rem;
        background: var(--music-surface);
    }

    body.music-page-shell .music-comment-composer__tools {
        margin-left: 46px;
    }

    body.music-page-shell .music-comment-composer__time {
        margin-left: 46px;
    }

    body.music-page-shell .music-comment-composer__clear-time {
        min-width: 34px;
        min-height: 34px;
        border: 1px solid var(--music-border-soft);
        border-radius: 50%;
    }

    body.music-page-shell .music-comment-reply-form {
        width: min(100%, 760px);
        padding: .65rem;
        border: 1px solid var(--music-border-soft);
        border-radius: 14px;
        background: var(--music-surface-raised);
    }

    body.music-page-shell .music-comment-reply-form .js-comment-reply-content {
        width: 100%;
        min-height: 58px;
        max-height: 10rem;
        resize: vertical;
        border-color: var(--music-border-soft);
        background: var(--music-surface);
        color: var(--music-text-main);
    }

    body.music-page-shell .music-comment-reply-form__actions {
        display: flex;
        justify-content: flex-end;
        gap: .45rem;
        margin-top: .45rem;
    }
}

/* ========================================================================
 * R119.4A DESK5C FIX14 — Music Room artwork-first parity with Profile media
 * ======================================================================== */
@media (min-width:768px) {
    body.music-page-shell .music-album-grid {
        --bs-gutter-x:0;
        --bs-gutter-y:0;
        display:grid;
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:1rem;
        margin:0;
    }
    body.music-page-shell .music-album-grid > .music-album-grid__item {
        width:auto;
        max-width:none;
        min-width:0;
        padding:0;
    }
    body.music-page-shell .music-album-card--artwork {
        min-width:0;
        border:0!important;
        border-radius:0;
        overflow:visible;
        background:transparent!important;
        color:var(--music-text-main,var(--bs-body-color));
        box-shadow:none!important;
        transform:none!important;
    }
    body.music-page-shell .music-album-artwork-shell {
        position:relative;
        aspect-ratio:1 / 1;
        isolation:isolate;
    }
    body.music-page-shell .music-album-artwork-link {
        position:absolute;
        inset:0;
        z-index:1;
        display:grid;
        place-items:center;
        overflow:hidden;
        border:1px solid rgba(65,101,143,.16);
        border-radius:14px;
        background:linear-gradient(145deg,#eaf2fb,#dce9f7);
        box-shadow:0 8px 22px rgba(18,48,82,.11),0 0 0 1px rgba(255,255,255,.72) inset;
        transition:transform .18s ease,border-color .18s ease,box-shadow .2s ease;
    }
    body.music-page-shell .music-album-artwork-link::after {
        content:"";
        position:absolute;
        inset:0;
        z-index:2;
        opacity:0;
        pointer-events:none;
        background:linear-gradient(180deg,rgba(4,14,29,.04) 22%,rgba(3,13,28,.60) 100%);
        transition:opacity .18s ease;
    }
    body.music-page-shell .music-album-artwork-link .album-cover {
        width:100%;
        height:100%;
        aspect-ratio:1;
        display:block;
        object-fit:cover;
        border:0!important;
        border-radius:0;
        transition:transform .24s ease,filter .24s ease;
    }
    body.music-page-shell .music-album-artwork-fallback {
        display:grid!important;
        place-items:center;
        font-size:2.7rem;
        color:#6d86a4;
    }
    body.music-page-shell .music-album-card--artwork:hover .music-album-artwork-link,
    body.music-page-shell .music-album-card--artwork:focus-within .music-album-artwork-link {
        transform:translateY(-2px);
        border-color:rgba(35,132,244,.38);
        box-shadow:0 18px 38px rgba(15,55,103,.19),0 0 30px rgba(25,132,255,.12),0 0 0 1px rgba(255,255,255,.86) inset;
    }
    body.music-page-shell .music-album-card--artwork:hover .music-album-artwork-link::after,
    body.music-page-shell .music-album-card--artwork:focus-within .music-album-artwork-link::after { opacity:1; }
    body.music-page-shell .music-album-card--artwork:hover .album-cover,
    body.music-page-shell .music-album-card--artwork:focus-within .album-cover { transform:scale(1.022); }

    body.music-page-shell .music-album-artwork-badges {
        position:absolute;
        z-index:5;
        top:.58rem;
        left:.58rem;
        display:flex;
        flex-wrap:wrap;
        gap:.32rem;
        max-width:calc(100% - 1.16rem);
        opacity:0;
        transform:translateY(-4px);
        pointer-events:none;
        transition:opacity .16s ease,transform .16s ease;
    }
    body.music-page-shell .music-album-card--artwork:hover .music-album-artwork-badges,
    body.music-page-shell .music-album-card--artwork:focus-within .music-album-artwork-badges { opacity:1;transform:none; }
    body.music-page-shell .music-album-artwork-badges span {
        display:inline-flex;
        align-items:center;
        min-height:22px;
        padding:.24rem .45rem;
        border:1px solid rgba(255,255,255,.45);
        border-radius:999px;
        background:rgba(11,24,42,.74);
        color:#fff;
        font-size:.58rem;
        font-weight:850;
        line-height:1;
        letter-spacing:.035em;
        box-shadow:0 5px 14px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.14);
        backdrop-filter:blur(9px);
    }
    body.music-page-shell .music-album-artwork-badges .music-album-draft-badge { background:rgba(247,184,20,.92);color:#251a00;border-color:rgba(255,226,135,.86); }
    body.music-page-shell .music-album-artwork-badges .music-album-restricted-badge { background:rgba(191,72,50,.90); }

    body.music-page-shell .music-album-artwork-actions {
        position:absolute;
        z-index:7;
        right:.62rem;
        bottom:.62rem;
        display:flex;
        align-items:center;
        gap:.42rem;
        opacity:0;
        transform:translateY(7px) scale(.97);
        pointer-events:none;
        transition:opacity .16s ease,transform .16s ease;
    }
    body.music-page-shell .music-album-card--artwork:hover .music-album-artwork-actions,
    body.music-page-shell .music-album-card--artwork:focus-within .music-album-artwork-actions {
        opacity:1;
        transform:none;
        pointer-events:auto;
    }
    body.music-page-shell .music-album-hover-play,
    body.music-page-shell .music-album-artwork-actions .music-share-icon-button {
        display:inline-flex!important;
        align-items:center;
        justify-content:center;
        border:1px solid rgba(255,255,255,.72)!important;
        background:linear-gradient(180deg,#1f8cff,#096ee3)!important;
        color:#fff!important;
        box-shadow:0 10px 24px rgba(4,38,92,.35),0 0 22px rgba(39,139,255,.22),inset 0 1px 0 rgba(255,255,255,.30)!important;
        backdrop-filter:blur(8px);
        transition:transform .14s ease,filter .14s ease,box-shadow .16s ease;
    }
    body.music-page-shell .music-album-hover-play:hover,
    body.music-page-shell .music-album-artwork-actions .music-share-icon-button:hover {
        transform:scale(1.055);
        filter:brightness(1.06);
        box-shadow:0 13px 28px rgba(4,38,92,.42),0 0 28px rgba(39,139,255,.30),inset 0 1px 0 rgba(255,255,255,.38)!important;
    }
    body.music-page-shell .music-album-hover-play {
        min-width:46px;
        height:46px;
        padding:0;
        border-radius:999px;
        cursor:pointer;
    }
    body.music-page-shell .music-album-hover-play.is-preview {
        min-width:88px;
        gap:.34rem;
        padding:0 .72rem;
        background:linear-gradient(180deg,#fff,#edf5ff)!important;
        border-color:rgba(255,255,255,.92)!important;
        color:#0d6fd7!important;
        box-shadow:0 10px 24px rgba(4,38,92,.28),0 0 20px rgba(255,255,255,.28),inset 0 1px 0 #fff!important;
        font-size:.72rem;
        font-weight:850;
    }
    body.music-page-shell .music-album-hover-play-svg { width:20px;height:20px;fill:currentColor; }
    body.music-page-shell .music-album-hover-play-svg--pause { display:none; }
    body.music-page-shell .music-album-hover-play[data-icon-state="pause"] .music-album-hover-play-svg--play,
    body.music-page-shell .music-album-hover-play.is-playing .music-album-hover-play-svg--play { display:none; }
    body.music-page-shell .music-album-hover-play[data-icon-state="pause"] .music-album-hover-play-svg--pause,
    body.music-page-shell .music-album-hover-play.is-playing .music-album-hover-play-svg--pause { display:block; }
    body.music-page-shell .music-album-hover-play.is-preview.is-playing .music-album-hover-label { display:none; }
    body.music-page-shell .music-album-artwork-actions .music-share-icon-button {
        width:42px!important;
        min-width:42px!important;
        height:42px!important;
        padding:0!important;
        margin:0!important;
        border-radius:999px!important;
    }
    body.music-page-shell .music-album-artwork-actions .music-share-icon-svg { width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.8; }

    body.music-page-shell .music-album-artwork-meta { min-width:0;padding:.6rem .12rem 0; }
    body.music-page-shell .music-album-artwork-title {
        display:block;
        min-width:0;
        overflow:hidden;
        color:var(--music-text-main,var(--bs-body-color))!important;
        font-size:.9rem;
        font-weight:850;
        line-height:1.2;
        text-decoration:none!important;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
    body.music-page-shell .music-album-artwork-title:hover { color:#0b75dc!important; }
    body.music-page-shell .music-album-artwork-meta > span { display:block;margin-top:.16rem;color:var(--music-text-muted,var(--bs-secondary-color));font-size:.72rem; }
}
@media (min-width:1100px) {
    body.music-page-shell .music-album-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (min-width:1500px) {
    body.music-page-shell .music-album-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
}
@media (hover:none) and (min-width:768px) {
    body.music-page-shell .music-album-artwork-actions,
    body.music-page-shell .music-album-artwork-badges { opacity:1;transform:none;pointer-events:auto; }
}
:root[data-theme="dark"] body.music-page-shell .music-album-artwork-link {
    background:linear-gradient(145deg,#17283f,#101c2e);
    border-color:rgba(105,151,204,.24);
    box-shadow:0 9px 24px rgba(0,0,0,.32),0 0 0 1px rgba(140,187,242,.045) inset;
}
:root[data-theme="dark"] body.music-page-shell .music-album-card--artwork:hover .music-album-artwork-link,
:root[data-theme="dark"] body.music-page-shell .music-album-card--artwork:focus-within .music-album-artwork-link {
    border-color:rgba(67,151,255,.43);
    box-shadow:0 20px 42px rgba(0,0,0,.48),0 0 34px rgba(0,123,255,.15),0 0 0 1px rgba(107,172,255,.08) inset;
}
:root[data-theme="dark"] body.music-page-shell .music-album-artwork-title { color:#edf5ff!important; }
:root[data-theme="dark"] body.music-page-shell .music-album-artwork-meta > span { color:#9fb2ca; }


/* ========================================================================
 * R119.4A DESK5C FIX15P3 — Playlists parity + compact Music library polish
 * ======================================================================== */
@media (min-width:768px) {
    body.music-page-shell .music-library-context-bar {
        padding:.9rem 1rem;
        border:1px solid rgba(58,93,132,.16);
        border-radius:16px;
        background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,252,255,.94));
        box-shadow:0 10px 26px rgba(15,54,96,.09),0 0 0 1px rgba(255,255,255,.72) inset;
    }
    body.music-page-shell .music-playlist-artwork-grid {
        display:grid;
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:1rem;
    }
    body.music-page-shell .music-playlist-artwork-card { min-width:0; }
    body.music-page-shell .music-playlist-artwork-shell {
        position:relative;
        aspect-ratio:1 / 1;
        isolation:isolate;
    }
    body.music-page-shell .music-playlist-artwork-link {
        position:absolute;
        inset:0;
        z-index:1;
        display:grid;
        place-items:center;
        overflow:hidden;
        border:1px solid rgba(65,101,143,.16);
        border-radius:14px;
        background:linear-gradient(145deg,#eaf2fb,#dce9f7);
        box-shadow:0 8px 22px rgba(18,48,82,.11),0 0 0 1px rgba(255,255,255,.72) inset;
        transition:transform .18s ease,border-color .18s ease,box-shadow .2s ease;
    }
    body.music-page-shell .music-playlist-artwork-link::after {
        content:"";
        position:absolute;
        inset:0;
        z-index:2;
        opacity:0;
        pointer-events:none;
        background:linear-gradient(180deg,rgba(4,14,29,.02) 28%,rgba(3,13,28,.64) 100%);
        transition:opacity .18s ease;
    }
    body.music-page-shell .music-playlist-artwork-link img {
        width:100%;height:100%;display:block;object-fit:cover;
        transition:transform .24s ease,filter .24s ease;
    }
    body.music-page-shell .music-playlist-artwork-fallback {
        display:grid;width:100%;height:100%;place-items:center;
        background:linear-gradient(145deg,#e7f1fc,#f7fbff);color:#1684ff;font-size:2.5rem;font-weight:900;
    }
    body.music-page-shell .music-playlist-artwork-card:hover .music-playlist-artwork-link,
    body.music-page-shell .music-playlist-artwork-card:focus-within .music-playlist-artwork-link {
        transform:translateY(-2px);
        border-color:rgba(35,132,244,.40);
        box-shadow:0 18px 38px rgba(15,55,103,.20),0 0 30px rgba(25,132,255,.13),0 0 0 1px rgba(255,255,255,.88) inset;
    }
    body.music-page-shell .music-playlist-artwork-card:hover .music-playlist-artwork-link::after,
    body.music-page-shell .music-playlist-artwork-card:focus-within .music-playlist-artwork-link::after { opacity:1; }
    body.music-page-shell .music-playlist-artwork-card:hover .music-playlist-artwork-link img,
    body.music-page-shell .music-playlist-artwork-card:focus-within .music-playlist-artwork-link img { transform:scale(1.022); }
    body.music-page-shell .music-playlist-artwork-badges {
        position:absolute;z-index:5;top:.58rem;left:.58rem;display:flex;gap:.3rem;flex-wrap:wrap;
        opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .16s ease,transform .16s ease;
    }
    body.music-page-shell .music-playlist-artwork-card:hover .music-playlist-artwork-badges,
    body.music-page-shell .music-playlist-artwork-card:focus-within .music-playlist-artwork-badges { opacity:1;transform:none; }
    body.music-page-shell .music-playlist-artwork-badges span {
        display:inline-flex;align-items:center;min-height:22px;padding:.24rem .45rem;border:1px solid rgba(255,255,255,.45);
        border-radius:999px;background:rgba(11,24,42,.76);color:#fff;font-size:.58rem;font-weight:850;line-height:1;
        box-shadow:0 5px 14px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.14);backdrop-filter:blur(9px);
    }
    body.music-page-shell .music-playlist-artwork-actions {
        position:absolute;z-index:7;right:.62rem;bottom:.62rem;opacity:0;transform:translateY(7px) scale(.97);
        pointer-events:none;transition:opacity .16s ease,transform .16s ease;
    }
    body.music-page-shell .music-playlist-artwork-card:hover .music-playlist-artwork-actions,
    body.music-page-shell .music-playlist-artwork-card:focus-within .music-playlist-artwork-actions { opacity:1;transform:none;pointer-events:auto; }
    body.music-page-shell .music-playlist-artwork-actions .music-share-icon-button {
        width:42px!important;min-width:42px!important;height:42px!important;padding:0!important;margin:0!important;border-radius:999px!important;
        border:1px solid rgba(255,255,255,.72)!important;background:linear-gradient(180deg,#1f8cff,#096ee3)!important;color:#fff!important;
        box-shadow:0 10px 24px rgba(4,38,92,.35),0 0 22px rgba(39,139,255,.22),inset 0 1px 0 rgba(255,255,255,.30)!important;
    }
    body.music-page-shell .music-playlist-artwork-meta { min-width:0;padding:.58rem .12rem 0; }
    body.music-page-shell .music-playlist-artwork-title {
        display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--music-text-main,var(--bs-body-color))!important;
        font-size:.9rem;font-weight:850;line-height:1.2;text-decoration:none!important;
    }
    body.music-page-shell .music-playlist-artwork-title:hover { color:#0b75dc!important; }
    body.music-page-shell .music-playlist-artwork-meta > span,
    body.music-page-shell .music-playlist-artwork-meta > small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:.16rem;color:var(--music-text-muted,var(--bs-secondary-color));font-size:.71rem; }
    body.music-page-shell .music-playlist-artwork-meta > small { opacity:.9; }
    body.music-page-shell .music-library-empty-state { padding:2.2rem;text-align:center;border:1px solid var(--music-border-soft);border-radius:16px;background:var(--music-surface);box-shadow:0 10px 25px rgba(17,52,90,.07); }

    /* Playlist detail keeps the existing track table/actions but loses the giant hero proportions. */
    body.music-page-shell .music-playlist-detail-header .card-body { padding:1rem!important; }
    body.music-page-shell .music-playlist-detail-header .row { --bs-gutter-x:1rem;--bs-gutter-y:.75rem;align-items:center!important; }
    body.music-page-shell .music-playlist-detail-header .album-detail-cover { width:150px;max-width:100%;aspect-ratio:1;object-fit:cover; }
    body.music-page-shell .music-playlist-detail-header h1 { font-size:clamp(1.35rem,2.1vw,2rem)!important;line-height:1.08; }
}
@media (min-width:1100px) { body.music-page-shell .music-playlist-artwork-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (min-width:1500px) { body.music-page-shell .music-playlist-artwork-grid { grid-template-columns:repeat(5,minmax(0,1fr)); } }
@media (hover:none) and (min-width:768px) {
    body.music-page-shell .music-playlist-artwork-actions,
    body.music-page-shell .music-playlist-artwork-badges { opacity:1;transform:none;pointer-events:auto; }
}
:root[data-theme="dark"] body.music-page-shell .music-library-context-bar,
:root[data-theme="dark"] body.music-page-shell .music-library-empty-state {
    background:linear-gradient(180deg,#14243a,#101d31);border-color:rgba(86,139,202,.30);box-shadow:0 12px 30px rgba(0,0,0,.30),0 0 0 1px rgba(121,181,255,.04) inset;
}
:root[data-theme="dark"] body.music-page-shell .music-playlist-artwork-link {
    background:linear-gradient(145deg,#17283f,#101c2e);border-color:rgba(105,151,204,.24);box-shadow:0 9px 24px rgba(0,0,0,.32),0 0 0 1px rgba(140,187,242,.045) inset;
}
:root[data-theme="dark"] body.music-page-shell .music-playlist-artwork-card:hover .music-playlist-artwork-link,
:root[data-theme="dark"] body.music-page-shell .music-playlist-artwork-card:focus-within .music-playlist-artwork-link {
    border-color:rgba(72,154,255,.52);box-shadow:0 20px 42px rgba(0,0,0,.48),0 0 30px rgba(0,119,255,.15),0 0 0 1px rgba(144,193,255,.07) inset;
}

/* ===== SOURCE: music-mobile-polish.css ===== */
/* ClubOS 8.14.0-B.1.3 — Music Room mobile compacte, sans modifier le rendu desktop. */
.music-playlists-label-short { display: none; }

@media (max-width: 767.98px) {
    body.music-page-shell .music-context-sticky {
        position: static;
        top: auto;
        z-index: auto;
        margin-bottom: .7rem !important;
    }

    body.music-page-shell .music-context-bar {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center !important;
        gap: .55rem !important;
        padding: .68rem .72rem;
        border-radius: .95rem;
        box-shadow: 0 5px 15px rgba(15, 23, 42, .1);
    }

    body.music-page-shell .music-context-bar h1 {
        margin: 0 0 .12rem !important;
        font-size: 1.08rem !important;
        line-height: 1.15;
    }

    body.music-page-shell .music-context-bar p {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: .22rem;
        font-size: .72rem !important;
        line-height: 1.25;
    }

    body.music-page-shell .music-context-bar p .badge {
        margin-left: .1rem !important;
        font-size: .58rem;
    }

    body.music-page-shell .music-playlists-label-full { display: none; }
    body.music-page-shell .music-playlists-label-short { display: inline; }
    body.music-page-shell .music-playlists-link {
        min-height: 2.25rem;
        padding: .38rem .58rem;
        border-radius: .72rem;
        white-space: nowrap;
        font-size: .73rem;
    }

    body.music-page-shell .music-album-grid {
        --bs-gutter-x: 0;
        --bs-gutter-y: 0;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .62rem;
        margin: 0;
    }

    body.music-page-shell .music-album-grid > .music-album-grid__item {
        width: auto;
        max-width: none;
        min-width: 0;
        padding: 0;
    }

    body.music-page-shell .music-album-card {
        min-width: 0;
        border-radius: .9rem;
        overflow: hidden;
        box-shadow: 0 5px 16px rgba(15, 23, 42, .12) !important;
    }

    body.music-page-shell .music-album-card:hover {
        transform: none;
    }

    body.music-page-shell .music-album-card .album-cover-link {
        display: block;
        width: 100%;
        aspect-ratio: 1 / 1;
        border-radius: 0;
    }

    body.music-page-shell .music-album-card .album-cover {
        display: block;
        width: 100%;
        height: 100%;
        aspect-ratio: 1 / 1;
        object-fit: cover;
        border: 0 !important;
    }

    body.music-page-shell .music-album-card .card-body {
        min-width: 0;
        padding: .62rem !important;
    }

    body.music-page-shell .music-album-badges {
        position: absolute;
        z-index: 2;
        top: .42rem;
        left: .42rem;
        right: .42rem;
        gap: .22rem !important;
        margin: 0 !important;
        pointer-events: none;
    }

    body.music-page-shell .music-album-badges .badge {
        max-width: 100%;
        overflow: hidden;
        padding: .2rem .34rem;
        font-size: .53rem;
        line-height: 1.1;
        text-overflow: ellipsis;
        white-space: nowrap;
        box-shadow: 0 2px 8px rgba(0, 0, 0, .24);
    }

    body.music-page-shell .music-album-title {
        min-height: 2.2em;
        margin-bottom: .22rem !important;
        font-size: .88rem !important;
        line-height: 1.16;
    }

    body.music-page-shell .music-album-title > a {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        overflow-wrap: anywhere;
    }

    body.music-page-shell .music-album-subtitle {
        overflow: hidden;
        margin-bottom: .3rem !important;
        font-size: .7rem !important;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.music-page-shell .music-album-author {
        width: 100%;
        gap: .34rem;
        margin-bottom: .48rem !important;
        font-size: .69rem;
    }

    body.music-page-shell .music-album-author .music-author-avatar {
        width: 1.38rem;
        height: 1.38rem;
        font-size: .6rem;
    }

    body.music-page-shell .music-album-author .music-author-name {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.music-page-shell .music-album-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr);
        gap: .32rem !important;
        width: 100%;
        padding-top: .05rem;
    }

    /* La pochette et le titre ouvrent déjà l’album : on garde le seul contrôle indispensable. */
    body.music-page-shell .music-album-open-action {
        display: none !important;
    }

    body.music-page-shell .music-album-play-action {
        width: 100%;
        min-width: 0;
        min-height: 2.15rem;
        padding: .36rem .42rem;
        font-size: .72rem;
        line-height: 1.1;
    }

    body.music-page-shell .music-album-grid .alert {
        grid-column: 1 / -1;
    }
}

@media (max-width: 359.98px) {
    body.music-page-shell .music-album-grid { gap: .46rem; }
    body.music-page-shell .music-album-card .card-body { padding: .52rem !important; }
    body.music-page-shell .music-album-title { font-size: .82rem !important; }
    body.music-page-shell .music-album-author { font-size: .64rem; }
    body.music-page-shell .music-context-bar { padding: .58rem .62rem; }
}

/* FIX14 — artwork-first album cards remain usable on touch/mobile. */
@media (max-width:767.98px) {
    body.music-page-shell .music-album-card--artwork { position:relative;min-width:0;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible; }
    body.music-page-shell .music-album-artwork-shell { position:relative;aspect-ratio:1 / 1; }
    body.music-page-shell .music-album-artwork-link { position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;border-radius:12px;background:#eaf1f8;border:1px solid rgba(60,92,130,.12); }
    body.music-page-shell .music-album-artwork-link .album-cover { width:100%;height:100%;display:block;object-fit:cover;border:0!important;border-radius:0; }
    body.music-page-shell .music-album-artwork-fallback { display:grid!important;place-items:center;font-size:2rem;color:#6e86a2; }
    body.music-page-shell .music-album-artwork-badges { position:absolute;z-index:5;top:.4rem;left:.4rem;display:flex;gap:.25rem;max-width:calc(100% - .8rem); }
    body.music-page-shell .music-album-artwork-badges span { display:inline-flex;align-items:center;min-height:20px;padding:.2rem .36rem;border-radius:999px;background:rgba(10,25,44,.72);color:#fff;font-size:.52rem;font-weight:850;line-height:1;box-shadow:0 3px 10px rgba(0,0,0,.2); }
    body.music-page-shell .music-album-artwork-actions { position:absolute;z-index:7;right:.42rem;bottom:.42rem;display:flex;align-items:center;gap:.3rem; }
    body.music-page-shell .music-album-hover-play,body.music-page-shell .music-album-artwork-actions .music-share-icon-button { display:inline-flex!important;align-items:center;justify-content:center;border-radius:999px!important;border:1px solid rgba(255,255,255,.72)!important;background:#1375f5!important;color:#fff!important;box-shadow:0 6px 16px rgba(7,48,105,.28)!important; }
    body.music-page-shell .music-album-hover-play { width:40px;height:40px;min-width:40px;padding:0; }
    body.music-page-shell .music-album-hover-play.is-preview { width:auto;min-width:72px;padding:0 .55rem;gap:.26rem;background:#fff!important;color:#0d6fd7!important;font-size:.65rem;font-weight:850; }
    body.music-page-shell .music-album-hover-play-svg { width:17px;height:17px;fill:currentColor; }
    body.music-page-shell .music-album-hover-play-svg--pause { display:none; }
    body.music-page-shell .music-album-hover-play[data-icon-state="pause"] .music-album-hover-play-svg--play,body.music-page-shell .music-album-hover-play.is-playing .music-album-hover-play-svg--play { display:none; }
    body.music-page-shell .music-album-hover-play[data-icon-state="pause"] .music-album-hover-play-svg--pause,body.music-page-shell .music-album-hover-play.is-playing .music-album-hover-play-svg--pause { display:block; }
    body.music-page-shell .music-album-artwork-actions .music-share-icon-button { width:36px!important;min-width:36px!important;height:36px!important;padding:0!important;margin:0!important; }
    body.music-page-shell .music-album-artwork-meta { min-width:0;padding:.42rem .08rem 0; }
    body.music-page-shell .music-album-artwork-title { display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--bs-body-color);font-size:.83rem;font-weight:850;text-decoration:none; }
    body.music-page-shell .music-album-artwork-meta>span { display:block;margin-top:.1rem;color:var(--bs-secondary-color);font-size:.68rem; }
}

/* ===== SOURCE: music-mobile-complete.css ===== */
/* ClubOS 8.14.0-B.2 — Musique mobile complète.
 * Tous les sélecteurs sont gardés par le viewport mobile afin de préserver le desktop.
 */

@media (max-width: 767.98px) {
    body.music-page-shell,
    body.clubos-mobile-active {
        --music-mobile-surface: var(--site-surface, #fff);
        --music-mobile-surface-2: var(--site-surface-2, #f2f6fc);
        --music-mobile-text: var(--site-text, #162033);
        --music-mobile-muted: var(--site-text-muted, #64748b);
        --music-mobile-border: var(--site-border, rgba(82, 103, 137, .24));
        --music-mobile-accent: var(--site-accent, #1677ff);
        --music-mobile-danger: #dc3545;
    }

    body.music-page-shell #music-shell-content {
        padding-bottom: calc(var(--clubos-mobile-nav-height, 64px) + var(--clubos-mobile-player-height, 0px) + env(safe-area-inset-bottom, 0px) + 1rem);
    }

    .music-mobile-hub {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: .38rem;
        margin: 0 0 .72rem;
        padding: .38rem;
        border: 1px solid var(--music-mobile-border);
        border-radius: .9rem;
        background: var(--music-mobile-surface);
        box-shadow: 0 5px 14px rgba(15, 23, 42, .08);
    }

    .music-mobile-hub__item {
        display: flex;
        min-width: 0;
        min-height: 2.55rem;
        align-items: center;
        justify-content: center;
        gap: .28rem;
        padding: .34rem .2rem;
        border: 0;
        border-radius: .7rem;
        background: transparent;
        color: var(--music-mobile-muted);
        font: inherit;
        font-size: .67rem;
        font-weight: 750;
        line-height: 1.05;
        text-align: center;
        text-decoration: none;
    }

    .music-mobile-hub__item.is-active,
    .music-mobile-hub__item:active {
        background: color-mix(in srgb, var(--music-mobile-accent) 14%, transparent);
        color: var(--music-mobile-accent);
    }

    .music-mobile-hub__icon {
        flex: 0 0 auto;
        font-size: .92rem;
    }

    .music-mobile-album-actions {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .48rem;
        margin: -.2rem 0 .72rem;
        padding: .58rem;
        border: 1px solid var(--music-mobile-border);
        border-radius: .9rem;
        background: var(--music-mobile-surface);
    }

    .music-mobile-album-actions button {
        min-width: 0;
        min-height: 2.55rem;
        border: 1px solid var(--music-mobile-border);
        border-radius: .72rem;
        background: var(--music-mobile-surface-2);
        color: var(--music-mobile-text);
        font: inherit;
        font-size: .72rem;
        font-weight: 750;
    }

    .music-mobile-album-actions button:first-child {
        border-color: var(--music-mobile-accent);
        background: var(--music-mobile-accent);
        color: #fff;
    }

    /* En-têtes album et playlist. */
    body.music-page-shell .album-header,
    body.music-page-shell .music-playlist-detail-header {
        margin-bottom: .72rem !important;
        border-radius: 1rem !important;
    }

    body.music-page-shell .album-header .card-body,
    body.music-page-shell .music-playlist-detail-header .card-body {
        padding: .78rem !important;
    }

    body.music-page-shell .album-header .row,
    body.music-page-shell .music-playlist-detail-header .row {
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr);
        gap: .72rem !important;
        align-items: start !important;
    }

    body.music-page-shell .album-header .row > [class*="col-"],
    body.music-page-shell .music-playlist-detail-header .row > [class*="col-"] {
        width: auto;
        max-width: none;
        padding: 0;
    }

    body.music-page-shell .album-header .album-detail-cover,
    body.music-page-shell .music-playlist-detail-header .album-detail-cover {
        width: 92px;
        height: 92px;
        aspect-ratio: 1 / 1;
        border-radius: .78rem !important;
    }

    body.music-page-shell .album-header h1,
    body.music-page-shell .music-playlist-detail-header h1 {
        display: -webkit-box;
        overflow: hidden;
        margin-bottom: .22rem !important;
        font-size: 1.18rem !important;
        line-height: 1.08;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    body.music-page-shell .album-header .lead,
    body.music-page-shell .music-playlist-detail-header .lead,
    body.music-page-shell .music-playlist-detail-header #music-playlist-detail-description {
        display: -webkit-box;
        overflow: hidden;
        margin-bottom: .28rem !important;
        font-size: .76rem !important;
        line-height: 1.25;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    body.music-page-shell .album-header p:not(.lead),
    body.music-page-shell .music-playlist-detail-header p {
        font-size: .72rem;
        line-height: 1.35;
    }

    /* Playlists : même densité que les albums. */
    body.music-page-shell .music-playlist-card-grid,
    body.music-page-shell [data-music-mobile-playlist-grid="1"] {
        --bs-gutter-x: 0;
        --bs-gutter-y: 0;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .62rem;
        margin: 0;
    }

    body.music-page-shell .music-playlist-card-grid > [class*="col-"],
    body.music-page-shell [data-music-mobile-playlist-grid="1"] > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        padding: 0;
    }

    body.music-page-shell .music-playlist-card {
        min-width: 0;
        border-radius: .9rem;
        overflow: hidden;
    }

    body.music-page-shell .music-playlist-card .card-body {
        padding: .68rem !important;
    }

    body.music-page-shell .music-playlist-card h2,
    body.music-page-shell .music-playlist-card h3 {
        display: -webkit-box;
        overflow: hidden;
        min-height: 2.15em;
        font-size: .86rem !important;
        line-height: 1.12;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    body.music-page-shell .music-playlist-card-description {
        min-height: 2.4em;
        font-size: .68rem;
        line-height: 1.2;
    }

    /* Table des pistes convertie en liste mobile. */
    body.music-page-shell .music-track-table {
        display: block;
        width: 100%;
        margin: 0;
        background: transparent !important;
    }

    body.music-page-shell .music-track-table thead {
        display: none;
    }

    body.music-page-shell .music-track-table tbody {
        display: grid;
        gap: .42rem;
        padding: .5rem;
    }

    body.music-page-shell .music-track-table .music-track-row {
        position: relative;
        display: grid;
        grid-template-columns: 3rem minmax(0, 1fr) auto;
        grid-template-areas:
            "cover title more"
            "cover meta more";
        gap: .1rem .58rem;
        min-width: 0;
        padding: .48rem;
        border: 1px solid var(--music-mobile-border);
        border-radius: .82rem;
        background: var(--music-mobile-surface);
        color: var(--music-mobile-text);
    }

    body.music-page-shell .music-track-table .music-track-row > td {
        display: block;
        width: auto !important;
        min-width: 0;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        color: inherit;
    }

    body.music-page-shell .music-track-table .music-mobile-track-cover-cell {
        grid-area: cover;
    }

    body.music-page-shell .music-track-table .music-mobile-track-number-cell {
        display: none;
    }

    body.music-page-shell .music-track-table .music-mobile-track-title-cell {
        grid-area: title;
        align-self: end;
        padding-right: .25rem !important;
    }

    body.music-page-shell .music-track-table .music-mobile-track-title-cell > .fw-semibold {
        overflow: hidden;
        font-size: .82rem;
        line-height: 1.15;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.music-page-shell .music-track-table .music-mobile-track-duration-cell {
        grid-area: meta;
        align-self: start;
        font-size: .67rem;
        color: var(--music-mobile-muted) !important;
    }

    body.music-page-shell .music-track-table .music-mobile-track-actions-cell {
        grid-area: more;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    body.music-page-shell .music-track-table .track-cover-thumb {
        width: 3rem;
        height: 3rem;
        border-radius: .62rem;
        object-fit: cover;
    }

    body.music-page-shell .music-track-table .music-track-actions {
        display: contents !important;
    }

    body.music-page-shell .music-track-table .music-track-actions > * {
        display: none !important;
    }

    .music-mobile-track-more {
        display: inline-flex;
        width: 2.25rem;
        height: 2.25rem;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--music-mobile-border);
        border-radius: 999px;
        background: var(--music-mobile-surface-2);
        color: var(--music-mobile-text);
        font-size: 1.05rem;
        font-weight: 800;
    }

    body.music-page-shell .music-track-comments-row {
        display: block;
        min-width: 0;
    }

    body.music-page-shell .music-track-comments-row.d-none {
        display: none !important;
    }

    body.music-page-shell .music-track-comments-row > td {
        display: block;
        width: 100%;
        padding: 0 !important;
        border: 0 !important;
    }

    body.music-page-shell .music-track-comments {
        margin: 0 !important;
        border-radius: .82rem;
    }

    /* Dialogues plein écran : player, bibliothèque et feuilles d'actions. */
    .music-mobile-dialog,
    .music-mobile-library-dialog,
    .music-mobile-track-sheet {
        width: 100dvw;
        max-width: none;
        height: 100dvh;
        max-height: none;
        margin: 0;
        padding: 0;
        border: 0;
        background: var(--music-mobile-surface, #fff);
        color: var(--music-mobile-text, #162033);
    }

    .music-mobile-dialog::backdrop,
    .music-mobile-library-dialog::backdrop,
    .music-mobile-track-sheet::backdrop {
        background: rgba(3, 8, 20, .72);
        backdrop-filter: blur(7px);
    }

    .music-mobile-dialog[open],
    .music-mobile-library-dialog[open] {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
    }

    .music-mobile-dialog__header,
    .music-mobile-library__header {
        display: grid;
        grid-template-columns: 2.7rem minmax(0, 1fr) 2.7rem;
        align-items: center;
        min-height: calc(3.5rem + env(safe-area-inset-top, 0px));
        padding: env(safe-area-inset-top, 0px) .55rem 0;
        border-bottom: 1px solid var(--music-mobile-border);
        background: color-mix(in srgb, var(--music-mobile-surface) 94%, transparent);
        backdrop-filter: blur(14px);
    }

    .music-mobile-dialog__header h2,
    .music-mobile-library__header h2 {
        overflow: hidden;
        margin: 0;
        font-size: 1rem;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-mobile-icon-button {
        display: inline-flex;
        width: 2.55rem;
        height: 2.55rem;
        align-items: center;
        justify-content: center;
        border: 0;
        border-radius: 999px;
        background: transparent;
        color: var(--music-mobile-text);
        font-size: 1.35rem;
    }

    .music-mobile-dialog__body {
        display: grid;
        grid-template-rows: minmax(0, 1fr) auto;
        min-height: 0;
        overflow: hidden;
        padding: .8rem .92rem calc(.8rem + env(safe-area-inset-bottom, 0px));
        background:
            radial-gradient(circle at 50% 15%, color-mix(in srgb, var(--music-mobile-accent) 18%, transparent), transparent 35%),
            var(--music-mobile-surface);
    }

    .music-mobile-player-main {
        display: flex;
        min-height: 0;
        flex-direction: column;
        justify-content: center;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .music-mobile-player-cover-wrap {
        width: min(78vw, 21rem);
        margin: 0 auto .85rem;
        aspect-ratio: 1 / 1;
        border-radius: 1.2rem;
        overflow: hidden;
        background: var(--music-mobile-surface-2);
        box-shadow: 0 20px 50px rgba(0, 0, 0, .28);
    }

    .music-mobile-player-cover {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .music-mobile-player-cover.is-empty {
        opacity: .18;
    }

    .music-mobile-player-meta {
        min-width: 0;
        margin-bottom: .72rem;
        text-align: center;
    }

    .music-mobile-player-title {
        overflow: hidden;
        font-size: 1.18rem;
        font-weight: 800;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-mobile-player-subtitle {
        overflow: hidden;
        color: var(--music-mobile-muted);
        font-size: .82rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-mobile-player-seek {
        width: 100%;
        accent-color: var(--music-mobile-accent);
    }

    .music-mobile-player-times {
        display: flex;
        justify-content: space-between;
        margin-top: -.12rem;
        color: var(--music-mobile-muted);
        font-size: .67rem;
    }

    .music-mobile-player-controls {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: center;
        gap: .38rem;
        margin: .55rem 0 .68rem;
    }

    .music-mobile-player-control {
        display: inline-flex;
        min-width: 0;
        height: 2.75rem;
        align-items: center;
        justify-content: center;
        border: 0;
        border-radius: 999px;
        background: transparent;
        color: var(--music-mobile-text);
        font-size: 1.15rem;
    }

    .music-mobile-player-control.is-primary {
        width: 3.65rem;
        height: 3.65rem;
        justify-self: center;
        background: var(--music-mobile-accent);
        color: #fff;
        font-size: 1.35rem;
        box-shadow: 0 10px 24px color-mix(in srgb, var(--music-mobile-accent) 36%, transparent);
    }

    .music-mobile-player-control.is-active {
        color: var(--music-mobile-accent);
        background: color-mix(in srgb, var(--music-mobile-accent) 12%, transparent);
    }

    .music-mobile-player-actions {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: .35rem;
        padding: .45rem 0;
    }

    .music-mobile-player-action {
        display: flex;
        min-width: 0;
        min-height: 2.7rem;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: .1rem;
        border: 0;
        border-radius: .65rem;
        background: transparent;
        color: var(--music-mobile-muted);
        font-size: .58rem;
    }

    .music-mobile-player-action > span:first-child {
        font-size: 1rem;
    }

    .music-mobile-player-action.is-active {
        color: var(--music-mobile-accent);
    }

    .music-mobile-player-volume {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: .55rem;
        color: var(--music-mobile-muted);
        font-size: .75rem;
    }

    .music-mobile-player-volume input {
        width: 100%;
        accent-color: var(--music-mobile-accent);
    }

    .music-mobile-queue {
        display: none;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: .3rem 0;
    }

    .music-mobile-dialog.is-queue-open .music-mobile-player-main {
        display: none;
    }

    .music-mobile-dialog.is-queue-open .music-mobile-dialog__body {
        display: block;
        min-height: 0;
    }

    .music-mobile-dialog.is-queue-open .music-mobile-queue {
        display: block;
        width: 100%;
        height: 100%;
    }

    .music-mobile-queue__empty,
    .music-mobile-library__state {
        padding: 2.2rem 1rem;
        color: var(--music-mobile-muted);
        text-align: center;
    }

    .music-mobile-queue__item,
    .music-mobile-library__item {
        display: grid;
        width: 100%;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: .7rem;
        min-width: 0;
        padding: .66rem .25rem;
        border: 0;
        border-bottom: 1px solid var(--music-mobile-border);
        background: transparent;
        color: var(--music-mobile-text);
        text-align: left;
    }

    .music-mobile-queue__item.is-active {
        color: var(--music-mobile-accent);
        font-weight: 750;
    }

    .music-mobile-queue__index {
        width: 1.7rem;
        color: var(--music-mobile-muted);
        text-align: center;
    }

    .music-mobile-queue__text,
    .music-mobile-library__text {
        min-width: 0;
    }

    .music-mobile-queue__title,
    .music-mobile-library__title,
    .music-mobile-queue__subtitle,
    .music-mobile-library__subtitle {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-mobile-queue__subtitle,
    .music-mobile-library__subtitle {
        color: var(--music-mobile-muted);
        font-size: .7rem;
    }

    .music-mobile-library__body {
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: .55rem .82rem calc(4.4rem + env(safe-area-inset-bottom, 0px));
    }

    .music-mobile-library__tabs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .4rem;
        position: sticky;
        top: 0;
        z-index: 2;
        padding: .45rem 0 .58rem;
        background: var(--music-mobile-surface);
    }

    .music-mobile-library__tabs button {
        min-height: 2.45rem;
        border: 1px solid var(--music-mobile-border);
        border-radius: .72rem;
        background: var(--music-mobile-surface-2);
        color: var(--music-mobile-text);
        font: inherit;
        font-size: .76rem;
        font-weight: 750;
    }

    .music-mobile-library__tabs button.is-active {
        border-color: var(--music-mobile-accent);
        background: var(--music-mobile-accent);
        color: #fff;
    }

    .music-mobile-library__cover {
        width: 3.25rem;
        height: 3.25rem;
        border-radius: .68rem;
        object-fit: cover;
        background: var(--music-mobile-surface-2);
    }

    .music-mobile-library__listen {
        display: inline-flex;
        min-width: 2.55rem;
        min-height: 2.55rem;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: var(--music-mobile-accent);
        color: #fff;
        text-decoration: none;
    }

    .music-mobile-track-sheet {
        height: auto;
        max-height: min(78dvh, 42rem);
        margin-top: auto;
        border-radius: 1.15rem 1.15rem 0 0;
        overflow: hidden;
    }

    .music-mobile-track-sheet[open] {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
    }

    .music-mobile-track-sheet__header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 2.7rem;
        align-items: center;
        gap: .5rem;
        padding: .82rem .72rem .62rem;
        border-bottom: 1px solid var(--music-mobile-border);
    }

    .music-mobile-track-sheet__title {
        overflow: hidden;
        font-weight: 800;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-mobile-track-sheet__actions {
        min-height: 0;
        overflow-y: auto;
        padding: .35rem .55rem calc(.65rem + env(safe-area-inset-bottom, 0px));
    }

    .music-mobile-track-sheet__action {
        display: flex;
        width: 100%;
        min-height: 3.2rem;
        align-items: center;
        gap: .7rem;
        padding: .55rem .62rem;
        border: 0;
        border-bottom: 1px solid var(--music-mobile-border);
        background: transparent;
        color: var(--music-mobile-text);
        font: inherit;
        font-size: .84rem;
        text-align: left;
    }

    .music-mobile-track-sheet__action.is-danger {
        color: var(--music-mobile-danger);
    }

    body.music-mobile-dialog-open {
        overflow: hidden !important;
    }
}

@media (max-width: 359.98px) {
    .music-mobile-hub__item { font-size: .61rem; }
    body.music-page-shell .album-header .row,
    body.music-page-shell .music-playlist-detail-header .row { grid-template-columns: 82px minmax(0, 1fr); }
    body.music-page-shell .album-header .album-detail-cover,
    body.music-page-shell .music-playlist-detail-header .album-detail-cover { width: 82px; height: 82px; }
    .music-mobile-player-cover-wrap { width: min(72vw, 18rem); }
}

/* ClubOS 8.14.0-B.2.4 — stabilisation du player riche inférieur. */
@media (max-width: 767.98px) {
    body.clubos-mobile-active #global-player-display-toggle,
    body.clubos-mobile-active .global-music-player__overflow-item[data-player-display-mode] {
        display: none !important;
    }

    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) {
        width: 100% !important;
        max-width: 100% !important;
        max-height: none !important;
        overflow: visible !important;
        box-sizing: border-box;
    }

    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) > .global-music-player__inner {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden;
        box-sizing: border-box;
    }

    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) .global-music-player__main,
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) .global-music-player__timeline,
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) .global-music-player__meta,
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) .global-music-player__actions {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    body.clubos-mobile-active .global-music-player__overflow-popover:not([hidden]),
    body.clubos-mobile-active .global-music-player__overflow-popover.is-open {
        position: fixed !important;
        left: max(.55rem, env(safe-area-inset-left, 0px)) !important;
        right: max(.55rem, env(safe-area-inset-right, 0px)) !important;
        bottom: calc(var(--clubos-mobile-nav-height, 64px) + var(--clubos-mobile-safe-bottom, 0px) + .55rem) !important;
        top: auto !important;
        width: auto !important;
        max-width: none !important;
        max-height: min(68dvh, 28rem);
        overflow-y: auto;
        padding: .5rem;
        border-radius: 1rem;
        border: 1px solid var(--music-mobile-border);
        background: var(--music-mobile-surface);
        box-shadow: 0 18px 46px rgba(0, 0, 0, .28);
        z-index: 3200;
        box-sizing: border-box;
    }

    body.clubos-mobile-active .global-music-player__overflow-item {
        display: flex;
        width: 100%;
        min-height: 3rem;
        align-items: center;
        gap: .7rem;
        padding: .65rem .75rem;
        border: 1px solid var(--music-mobile-border);
        border-radius: .8rem;
        background: var(--music-mobile-surface-2);
        color: var(--music-mobile-text);
        text-align: left;
        box-sizing: border-box;
    }

    body.clubos-mobile-active .global-music-player__overflow-item + .global-music-player__overflow-item {
        margin-top: .35rem;
    }

    body.clubos-mobile-active .global-music-player__overflow-item[data-music-mobile-open-fullscreen] {
        display: flex !important;
    }

    body.clubos-mobile-active .global-music-player__overflow-item[data-music-mobile-open-fullscreen] svg {
        width: 1.1rem;
        height: 1.1rem;
        flex: 0 0 auto;
        fill: currentColor;
    }
}


/* ClubOS 8.14.0-B.2.5 — interface musique mobile unifiée.
 * Ce bloc est strictement limité au téléphone. Il ne modifie ni la géométrie
 * ni l'apparence du lecteur desktop.
 */
@media (max-width: 767.98px) {
    body.music-page-shell,
    body.clubos-mobile-active {
        --music-accent: var(--site-accent, #0f8278);
        --music-accent-strong: color-mix(in srgb, var(--music-accent) 84%, #001b19);
        --music-accent-soft: color-mix(in srgb, var(--music-accent) 13%, transparent);
        --music-surface: var(--site-surface, #fff);
        --music-surface-raised: color-mix(in srgb, var(--site-surface, #fff) 97%, var(--music-accent) 3%);
        --music-surface-selected: color-mix(in srgb, var(--music-accent) 9%, var(--site-surface, #fff));
        --music-border-soft: color-mix(in srgb, var(--site-border, #d6dde8) 70%, transparent);
        --music-text-main: var(--site-text, #172033);
        --music-text-secondary: var(--site-text-muted, #64748b);
    }

    .music-mobile-svg {
        display: block;
        width: 1.25rem;
        height: 1.25rem;
        flex: 0 0 auto;
        fill: currentColor;
        pointer-events: none;
    }

    /* Navigation et actions d'album : une seule action primaire. */
    .music-mobile-hub {
        box-shadow: none;
        border-color: var(--music-border-soft);
        background: var(--music-surface);
    }

    .music-mobile-hub__icon {
        display: inline-grid;
        place-items: center;
        line-height: 0;
    }

    .music-mobile-hub__icon .music-mobile-svg {
        width: 1.05rem;
        height: 1.05rem;
    }

    .music-mobile-album-actions {
        gap: .5rem;
        padding: .5rem;
        border-color: var(--music-border-soft);
        box-shadow: none;
    }

    .music-mobile-album-actions button {
        display: inline-flex;
        min-height: 2.75rem;
        align-items: center;
        justify-content: center;
        gap: .4rem;
        padding: .45rem .5rem;
        border-color: var(--music-border-soft);
        background: transparent;
        color: var(--music-text-main);
        line-height: 1.05;
    }

    .music-mobile-album-actions button .music-mobile-svg {
        width: 1.05rem;
        height: 1.05rem;
    }

    .music-mobile-album-actions button.is-primary,
    .music-mobile-album-actions button:first-child {
        border-color: var(--music-accent);
        background: var(--music-accent);
        color: #fff;
        box-shadow: 0 8px 18px color-mix(in srgb, var(--music-accent) 20%, transparent);
    }

    /* Titres : liste dense, sans cartes empilées ni métadonnées superposées. */
    body.music-page-shell .music-track-table tbody {
        display: block;
        padding: .25rem .45rem .55rem;
    }

    body.music-page-shell .music-track-table .music-track-row {
        position: relative;
        display: grid;
        grid-template-columns: 3.25rem minmax(0, 1fr) 2.75rem;
        grid-template-areas: "cover title more";
        align-items: center;
        gap: .65rem;
        min-height: 4.65rem;
        padding: .55rem .1rem .55rem .35rem;
        border: 0;
        border-bottom: 1px solid var(--music-border-soft);
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        cursor: default;
        transition: background-color 140ms ease, color 140ms ease;
    }

    body.music-page-shell .music-track-table .music-track-row.is-mobile-track-tappable {
        cursor: pointer;
    }

    body.music-page-shell .music-track-table .music-track-row:active {
        background: var(--music-accent-soft);
    }

    body.music-page-shell .music-track-table .music-track-row.is-track-playing,
    body.music-page-shell .music-track-table .music-track-row.is-track-paused {
        background: var(--music-surface-selected);
    }

    body.music-page-shell .music-track-table .music-track-row.is-track-playing::before,
    body.music-page-shell .music-track-table .music-track-row.is-track-paused::before {
        content: "";
        position: absolute;
        inset: .65rem auto .65rem -.45rem;
        width: 3px;
        border-radius: 999px;
        background: var(--music-accent);
    }

    body.music-page-shell .music-track-table .music-mobile-track-cover-cell {
        position: relative;
        grid-area: cover;
        width: 3.25rem;
        height: 3.25rem;
    }

    body.music-page-shell .music-track-table .track-cover-thumb {
        width: 3.25rem;
        height: 3.25rem;
        border-radius: .62rem;
        background: var(--music-surface-raised);
    }

    body.music-page-shell .music-track-table .music-mobile-track-title-cell {
        grid-area: title;
        align-self: center;
        min-width: 0;
        padding: 0 !important;
    }

    body.music-page-shell .music-track-table .music-mobile-track-title-cell > .fw-semibold {
        display: -webkit-box;
        overflow: hidden;
        color: var(--music-text-main);
        font-size: .84rem;
        font-weight: 780;
        line-height: 1.18;
        text-overflow: clip;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    body.music-page-shell .music-track-table .music-track-row.is-track-playing .music-mobile-track-title-cell > .fw-semibold,
    body.music-page-shell .music-track-table .music-track-row.is-track-paused .music-mobile-track-title-cell > .fw-semibold {
        color: var(--music-accent-strong);
    }

    body.music-page-shell .music-mobile-track-meta {
        display: block;
        overflow: hidden;
        margin-top: .25rem;
        color: var(--music-text-secondary);
        font-size: .69rem;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.music-page-shell .music-track-table .music-mobile-track-title-cell > .small.text-secondary {
        display: none !important;
    }

    body.music-page-shell .music-track-table .music-mobile-track-duration-cell {
        display: none !important;
    }

    body.music-page-shell .music-track-table .music-mobile-track-actions-cell {
        grid-area: more;
        align-self: center;
        justify-self: end;
    }

    body.music-page-shell .music-track-table .music-track-actions > .js-music-play-trigger {
        display: inline-grid !important;
        position: absolute;
        left: 2.05rem;
        top: 2.55rem;
        bottom: auto;
        z-index: 2;
        width: 1.72rem;
        height: 1.72rem;
        min-width: 1.72rem;
        place-items: center;
        padding: 0;
        border: 1px solid rgba(255, 255, 255, .72) !important;
        border-radius: 999px;
        background: rgba(7, 24, 29, .78) !important;
        color: #fff !important;
        box-shadow: 0 3px 10px rgba(0, 0, 0, .22);
        transform: none;
        backdrop-filter: blur(4px);
    }

    body.music-page-shell .music-track-table .music-track-actions > .js-music-play-trigger:hover,
    body.music-page-shell .music-track-table .music-track-actions > .js-music-play-trigger:focus-visible,
    body.music-page-shell .music-track-table .music-track-actions > .js-music-play-trigger.btn-warning,
    body.music-page-shell .music-track-table .music-track-actions > .js-music-play-trigger.is-playing {
        border-color: color-mix(in srgb, var(--music-accent) 45%, #fff) !important;
        background: var(--music-accent) !important;
        color: #fff !important;
    }

    body.music-page-shell .music-track-table .music-track-play-icon {
        display: block;
        width: .76rem;
        height: .76rem;
        overflow: hidden;
        color: transparent;
        font-size: 0;
        line-height: 0;
    }

    body.music-page-shell .music-track-table .music-track-play-icon::before {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        background: currentColor;
        color: #fff;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / contain no-repeat;
    }

    body.music-page-shell .music-track-table .js-music-play-trigger.is-playing .music-track-play-icon::before,
    body.music-page-shell .music-track-table .music-track-row.is-track-playing .music-track-play-icon::before {
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 5h4v14H7zm6 0h4v14h-4z'/%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 5h4v14H7zm6 0h4v14h-4z'/%3E%3C/svg%3E");
    }

    .music-mobile-track-more {
        width: 2.5rem;
        height: 2.5rem;
        border: 0;
        background: transparent;
        color: var(--music-text-secondary);
        box-shadow: none;
    }

    .music-mobile-track-more .music-mobile-svg {
        width: 1.25rem;
        height: 1.25rem;
    }

    .music-mobile-track-more:focus-visible,
    .music-mobile-track-more:active {
        background: var(--music-accent-soft);
        color: var(--music-accent-strong);
        outline: none;
    }

    /* Panneau de commentaires rattaché au titre, sans carte grise fantôme. */
    body.music-page-shell .music-track-comments-row {
        margin: 0 0 .45rem;
    }

    body.music-page-shell .music-track-comments-row > td {
        padding: 0 !important;
        background: transparent !important;
    }

    body.music-page-shell .music-track-comments {
        margin: 0 !important;
        border: 1px solid var(--music-border-soft) !important;
        border-top: 0 !important;
        border-radius: 0 0 .9rem .9rem !important;
        background: var(--music-surface-raised) !important;
        box-shadow: none !important;
    }

    body.music-page-shell .music-track-row.has-open-comments {
        border-radius: .9rem .9rem 0 0;
        border: 1px solid var(--music-border-soft);
        border-bottom-color: transparent;
        background: var(--music-surface-raised);
    }

    body.music-page-shell .music-track-comments > .p-3 {
        padding: .7rem .75rem .8rem !important;
    }

    .music-mobile-comments-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .7rem;
        margin-bottom: .65rem;
        color: var(--music-text-main);
        font-size: .82rem;
    }

    .music-mobile-comments-heading button {
        display: inline-flex;
        min-height: 2.25rem;
        align-items: center;
        gap: .28rem;
        padding: .25rem .55rem;
        border: 0;
        border-radius: 999px;
        background: var(--music-accent-soft);
        color: var(--music-accent-strong);
        font: inherit;
        font-size: .69rem;
        font-weight: 720;
    }

    .music-mobile-comments-heading .music-mobile-svg {
        width: .95rem;
        height: .95rem;
    }

    body.music-page-shell .music-track-comments .js-track-comments-status {
        min-height: 0;
        margin-bottom: .6rem !important;
        padding: 0;
        border: 0;
        background: transparent;
    }

    body.music-page-shell .music-track-comments .form-control {
        min-height: 3.25rem;
        border-color: var(--music-border-soft);
        background: var(--music-surface);
        box-shadow: none;
    }

    /* Plein écran : calme visuel, états actifs nets et aucun volume permanent. */
    .music-mobile-dialog__body {
        padding: .7rem 1rem calc(.8rem + env(safe-area-inset-bottom, 0px));
        background: var(--music-surface);
    }

    .music-mobile-player-main {
        justify-content: center;
        scrollbar-width: none;
    }

    .music-mobile-player-main::-webkit-scrollbar {
        display: none;
    }

    .music-mobile-player-cover-wrap {
        width: min(76vw, 20rem);
        margin-bottom: .9rem;
        border-radius: 1.15rem;
        box-shadow: 0 14px 34px rgba(15, 23, 42, .18);
    }

    .music-mobile-player-title {
        display: -webkit-box;
        overflow: hidden;
        font-size: 1.15rem;
        line-height: 1.18;
        text-overflow: clip;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    .music-mobile-player-subtitle:empty {
        display: none;
    }

    .music-mobile-player-seek {
        min-height: 2rem;
        margin: 0;
        accent-color: var(--music-accent);
        cursor: pointer;
    }

    .music-mobile-player-controls {
        gap: .3rem;
        margin: .5rem 0 .65rem;
    }

    .music-mobile-player-control {
        width: 2.75rem;
        min-width: 2.75rem;
        height: 2.75rem;
        justify-self: center;
        color: var(--music-text-main);
    }

    .music-mobile-player-control .music-mobile-svg {
        width: 1.35rem;
        height: 1.35rem;
    }

    .music-mobile-player-control.is-primary {
        width: 3.9rem;
        height: 3.9rem;
        background: var(--music-accent);
        color: #fff;
        box-shadow: 0 10px 24px color-mix(in srgb, var(--music-accent) 30%, transparent);
    }

    .music-mobile-player-control.is-primary .music-mobile-svg {
        width: 1.65rem;
        height: 1.65rem;
    }

    .music-mobile-player-control.is-active {
        background: var(--music-accent-soft);
        color: var(--music-accent-strong);
    }

    .music-mobile-player-control:focus-visible,
    .music-mobile-player-action:focus-visible,
    .music-mobile-icon-button:focus-visible {
        outline: 2px solid color-mix(in srgb, var(--music-accent) 65%, #fff);
        outline-offset: 2px;
    }

    .music-mobile-player-actions {
        gap: .25rem;
        padding: .35rem 0 0;
    }

    .music-mobile-player-action {
        min-height: 3.4rem;
        gap: .18rem;
        padding: .35rem .12rem;
        color: var(--music-text-secondary);
        font-size: .58rem;
        line-height: 1.05;
    }

    .music-mobile-player-action__icon {
        display: inline-grid;
        width: 2rem;
        height: 2rem;
        place-items: center;
        border-radius: 999px;
    }

    .music-mobile-player-action__icon .music-mobile-svg,
    .music-mobile-player-action > span:first-child .music-mobile-svg {
        width: 1.12rem;
        height: 1.12rem;
    }

    .music-mobile-player-action.is-active {
        background: var(--music-accent-soft);
        color: var(--music-accent-strong);
        font-weight: 760;
    }

    .music-mobile-player-action.is-active .music-mobile-player-action__icon {
        background: color-mix(in srgb, var(--music-accent) 16%, transparent);
    }

    .music-mobile-player-volume {
        display: none !important;
    }

    .music-mobile-icon-button .music-mobile-svg {
        width: 1.35rem;
        height: 1.35rem;
    }

    .music-mobile-library__listen {
        border: 0;
        background: var(--music-accent);
        color: #fff;
        box-shadow: none;
    }

    .music-mobile-library__listen .music-mobile-svg {
        width: 1.05rem;
        height: 1.05rem;
    }

    .music-mobile-queue__go .music-mobile-svg {
        width: 1rem;
        height: 1rem;
    }

    .music-mobile-track-sheet__action {
        grid-template-columns: 2.6rem minmax(0, 1fr);
        min-height: 3.35rem;
        border-radius: .8rem;
    }

    .music-mobile-track-sheet__action-icon {
        display: inline-grid;
        width: 2.25rem;
        height: 2.25rem;
        place-items: center;
        border-radius: 999px;
        background: var(--music-accent-soft);
        color: var(--music-accent-strong);
    }

    .music-mobile-track-sheet__action-icon .music-mobile-svg {
        width: 1.1rem;
        height: 1.1rem;
    }

    .music-mobile-track-sheet__action.is-active {
        background: var(--music-accent-soft);
        color: var(--music-accent-strong);
        font-weight: 760;
    }

    /* Player historique riche inférieur : harmonisation visuelle mobile uniquement. */
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-prev,
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-next,
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-shuffle,
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-loop,
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-toggle {
        border-color: transparent !important;
        background: transparent !important;
        color: var(--music-text-main) !important;
        box-shadow: none !important;
    }

    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-toggle {
        background: var(--music-accent) !important;
        color: #fff !important;
        box-shadow: 0 8px 20px color-mix(in srgb, var(--music-accent) 26%, transparent) !important;
    }

    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-shuffle[data-shuffle-mode]:not([data-shuffle-mode="off"]),
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-loop[data-loop-mode]:not([data-loop-mode="none"]),
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-like.is-active,
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-favorite.is-active {
        border-color: transparent !important;
        background: var(--music-accent-soft) !important;
        color: var(--music-accent-strong) !important;
    }

    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-like.is-active .music-btn-like-icon,
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-favorite.is-active .music-btn-favorite-icon {
        fill: currentColor !important;
    }
}

@media (max-width: 359.98px) {
    .music-mobile-player-actions {
        gap: .1rem;
    }

    .music-mobile-player-action {
        font-size: .54rem;
    }

    .music-mobile-album-actions button {
        gap: .25rem;
        padding-inline: .25rem;
        font-size: .67rem;
    }
}

@media (max-width: 767.98px) and (prefers-reduced-motion: reduce) {
    .music-track-row,
    .music-mobile-player-control,
    .music-mobile-player-action {
        transition: none !important;
    }
}

/* ClubOS 8.14.0-B.2.6 — actions musicales directes et palette sémantique.
 * Périmètre exclusif téléphone : aucune règle n'est active à partir de 768 px.
 */
@media (max-width: 767.98px) {
    body.music-page-shell,
    body.clubos-mobile-active {
        --music-action-neutral: var(--music-text-secondary, #64748b);
        --music-action-pressed: color-mix(in srgb, var(--music-text-main, #162033) 8%, transparent);
        --music-like: #c93856;
        --music-like-soft: color-mix(in srgb, #c93856 12%, transparent);
        --music-favorite: #9a6700;
        --music-favorite-soft: color-mix(in srgb, #c18400 14%, transparent);
    }

    :root[data-theme="dark"] body.music-page-shell,
    :root[data-theme="dark"] body.clubos-mobile-active {
        --music-like: #ff7188;
        --music-like-soft: color-mix(in srgb, #ff7188 15%, transparent);
        --music-favorite: #f3bd4e;
        --music-favorite-soft: color-mix(in srgb, #f3bd4e 14%, transparent);
        --music-action-pressed: rgba(255, 255, 255, .07);
    }

    /* Sous-ligne de métadonnées : durée et auteur à gauche, J'aime/Favori à droite. */
    .music-mobile-track-subrow {
        display: flex;
        min-width: 0;
        align-items: center;
        justify-content: space-between;
        gap: .25rem;
        margin-top: .16rem;
    }

    .music-mobile-track-subrow .music-mobile-track-meta {
        flex: 1 1 auto;
        min-width: 0;
        margin-top: 0;
    }

    .music-mobile-track-quick-actions {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        gap: .05rem;
        margin: -.35rem -.15rem -.35rem 0;
    }

    .music-mobile-track-quick-action {
        display: inline-grid;
        width: 2.35rem;
        height: 2.35rem;
        min-width: 2.35rem;
        place-items: center;
        padding: 0;
        border: 0;
        border-radius: 999px;
        background: transparent;
        color: var(--music-action-neutral);
        box-shadow: none;
        transition: color 140ms ease, background-color 140ms ease, transform 120ms ease;
        -webkit-tap-highlight-color: transparent;
    }

    .music-mobile-track-quick-action .music-mobile-track-quick-glyph,
    .music-mobile-track-quick-action .music-mobile-svg {
        display: inline-grid;
        width: 1.18rem;
        height: 1.18rem;
        place-items: center;
    }

    .music-mobile-track-quick-action .is-filled {
        display: none;
    }

    .music-mobile-track-quick-action.is-active .is-outline {
        display: none;
    }

    .music-mobile-track-quick-action.is-active .is-filled {
        display: inline-grid;
    }

    .music-mobile-track-quick-action.is-like.is-active {
        background: var(--music-like-soft);
        color: var(--music-like);
    }

    .music-mobile-track-quick-action.is-favorite.is-active {
        background: var(--music-favorite-soft);
        color: var(--music-favorite);
    }

    .music-mobile-track-quick-action:active:not(:disabled) {
        background: var(--music-action-pressed);
        transform: scale(.94);
    }

    .music-mobile-track-quick-action:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: 1px;
    }

    .music-mobile-track-quick-action:disabled {
        opacity: .38;
        cursor: not-allowed;
    }

    /* Le menu reste secondaire : aucun disque bleu permanent autour des actions. */
    .music-mobile-track-more {
        border-color: transparent;
        background: transparent;
        color: var(--music-action-neutral);
    }

    .music-mobile-track-more:focus-visible,
    .music-mobile-track-more:active {
        background: var(--music-action-pressed);
        color: var(--music-text-main);
    }

    .music-mobile-track-sheet__actions {
        gap: 0;
        padding: .12rem .85rem calc(.8rem + env(safe-area-inset-bottom, 0px));
    }

    .music-mobile-track-sheet__action {
        grid-template-columns: 2.25rem minmax(0, 1fr) 1.35rem;
        min-height: 3.45rem;
        gap: .55rem;
        padding: .4rem .15rem;
        border: 0;
        border-bottom: 1px solid var(--music-border-soft);
        border-radius: 0;
        background: transparent;
        color: var(--music-text-main);
        box-shadow: none;
        text-align: left;
    }

    .music-mobile-track-sheet__action:last-child {
        border-bottom: 0;
    }

    .music-mobile-track-sheet__action:active:not(:disabled) {
        background: var(--music-action-pressed);
    }

    .music-mobile-track-sheet__action-icon {
        width: 2.25rem;
        height: 2.25rem;
        border-radius: 0;
        background: transparent;
        color: var(--music-action-neutral);
    }

    .music-mobile-track-sheet__action-icon .music-mobile-svg {
        width: 1.2rem;
        height: 1.2rem;
    }

    .music-mobile-track-sheet__action-label {
        overflow: hidden;
        color: inherit;
        font-weight: 620;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-mobile-track-sheet__action-state {
        display: inline-grid;
        width: 1.25rem;
        height: 1.25rem;
        place-items: center;
        color: var(--music-action-neutral);
    }

    .music-mobile-track-sheet__action-state .music-mobile-svg {
        width: 1rem;
        height: 1rem;
    }

    .music-mobile-track-sheet__action.is-active {
        background: transparent;
        color: var(--music-text-main);
        font-weight: inherit;
    }

    .music-mobile-track-sheet__action.is-like.is-active .music-mobile-track-sheet__action-icon,
    .music-mobile-track-sheet__action.is-like.is-active .music-mobile-track-sheet__action-state {
        color: var(--music-like);
    }

    .music-mobile-track-sheet__action.is-favorite.is-active .music-mobile-track-sheet__action-icon,
    .music-mobile-track-sheet__action.is-favorite.is-active .music-mobile-track-sheet__action-state {
        color: var(--music-favorite);
    }

    .music-mobile-track-sheet__action.is-danger,
    .music-mobile-track-sheet__action.is-danger .music-mobile-track-sheet__action-icon {
        color: var(--music-danger, #dc3545);
    }

    /* Les mêmes couleurs sémantiques sont utilisées dans le lecteur plein écran. */
    .music-mobile-player-action[data-source-id="global-player-like"].is-active {
        background: var(--music-like-soft);
        color: var(--music-like);
    }

    .music-mobile-player-action[data-source-id="global-player-like"].is-active .music-mobile-player-action__icon {
        background: transparent;
    }

    .music-mobile-player-action[data-source-id="global-player-favorite"].is-active {
        background: var(--music-favorite-soft);
        color: var(--music-favorite);
    }

    .music-mobile-player-action[data-source-id="global-player-favorite"].is-active .music-mobile-player-action__icon {
        background: transparent;
    }

    /* Player riche inférieur : cœur corail et étoile dorée, sans pavé bleu uniforme. */
    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-like.is-active {
        background: var(--music-like-soft) !important;
        color: var(--music-like) !important;
    }

    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-favorite.is-active {
        background: var(--music-favorite-soft) !important;
        color: var(--music-favorite) !important;
    }
}

@media (max-width: 339.98px) {
    .music-mobile-track-quick-action {
        width: 2.2rem;
        height: 2.2rem;
        min-width: 2.2rem;
    }

    .music-mobile-track-table .music-mobile-track-title-cell > .fw-semibold {
        font-size: .8rem;
    }
}

@media (max-width: 767.98px) {
    body.music-page-shell .music-track-table .music-mobile-track-number-cell {
        display: none !important;
    }

    .music-mobile-track-quick-action > .music-track-like-count,
    .music-mobile-track-quick-action > .music-track-action-icon.visually-hidden {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        clip-path: inset(50%) !important;
    }
}

/* ClubOS 8.14.0-B.2.7 — stabilité tactile et transport mobile. */
@media (max-width: 767.98px) {
    body.clubos-mobile-active #global-player-prev,
    body.clubos-mobile-active #global-player-next,
    .music-mobile-player-control[data-source-id="global-player-prev"],
    .music-mobile-player-control[data-source-id="global-player-next"] {
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }

    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) #global-player-next {
        margin-right: .2rem;
    }
}

/* ClubOS 8.14.0-B.3 — visualiseur immersif, panneaux et mixage explicite.
 * Toutes les règles restent strictement sous la largeur téléphone.
 */
@media (max-width: 767.98px) {
    body.clubos-mobile-active .global-music-player__overflow {
        z-index: 40 !important;
    }

    body.clubos-mobile-active .global-music-player__overflow-popover:not([hidden]),
    body.clubos-mobile-active .global-music-player__overflow-popover.is-open {
        z-index: 4300 !important;
    }

    body.clubos-mobile-active .global-music-player:not(.is-clubos-mobile-compact) > .clubos-mobile-player-expanded-actions {
        z-index: 8 !important;
    }

    .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode="local"] {
        border-color: color-mix(in srgb, var(--music-accent) 48%, transparent);
        background: var(--music-accent-soft);
        color: var(--music-accent-strong);
    }

    .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode="global"] {
        border-color: color-mix(in srgb, #7c5ce7 48%, transparent);
        background: color-mix(in srgb, #7c5ce7 13%, transparent);
        color: color-mix(in srgb, #6a45dc 88%, var(--music-text-main));
    }

    .music-mobile-album-actions [data-music-mobile-shuffle] small {
        display: inline-grid;
        place-items: center;
        min-height: 1.15rem;
        padding: 0 .32rem;
        border-radius: 999px;
        font-size: .52rem;
        font-weight: 850;
        letter-spacing: .04em;
        background: color-mix(in srgb, currentColor 12%, transparent);
    }

    .music-mobile-shuffle-status {
        display: inline-flex;
        width: fit-content;
        max-width: 100%;
        min-height: 1.55rem;
        align-items: center;
        gap: .28rem;
        margin-top: .2rem;
        padding: .12rem .46rem;
        border: 0;
        border-radius: 999px;
        background: var(--music-accent-soft);
        color: var(--music-accent-strong);
        font-size: .64rem;
        font-weight: 780;
        line-height: 1;
        touch-action: manipulation;
    }

    .music-mobile-shuffle-status[data-shuffle-mode="global"] {
        background: color-mix(in srgb, #7c5ce7 14%, transparent);
        color: color-mix(in srgb, #7c5ce7 88%, var(--music-text-main));
    }

    .music-mobile-shuffle-status .music-mobile-svg {
        width: .9rem;
        height: .9rem;
        flex: 0 0 auto;
    }

    #global-player-visualizer-wrap {
        touch-action: manipulation;
        -webkit-user-select: none;
        user-select: none;
    }

    #global-player-visualizer-wrap:fullscreen,
    #global-player-visualizer-wrap.is-music-mobile-visualizer-immersive {
        position: fixed !important;
        inset: 0 !important;
        z-index: 9000 !important;
        width: 100vw !important;
        height: 100dvh !important;
        max-width: none !important;
        max-height: none !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: #02050a !important;
        overflow: hidden !important;
        touch-action: none !important;
    }

    body.music-mobile-visualizer-open {
        overflow: hidden !important;
    }

    .music-mobile-visualizer-close {
        position: absolute;
        top: max(.75rem, env(safe-area-inset-top, 0px));
        right: max(.75rem, env(safe-area-inset-right, 0px));
        z-index: 20;
        display: grid;
        width: 2.85rem;
        height: 2.85rem;
        place-items: center;
        padding: 0;
        border: 1px solid rgba(255, 255, 255, .28);
        border-radius: 999px;
        background: rgba(4, 10, 18, .72);
        color: #fff;
        box-shadow: 0 8px 24px rgba(0, 0, 0, .34);
        backdrop-filter: blur(10px);
        touch-action: manipulation;
    }

    .music-mobile-visualizer-close[hidden] {
        display: none !important;
    }

    .music-mobile-visualizer-close .music-mobile-svg {
        width: 1.35rem;
        height: 1.35rem;
    }

    #global-player-visualizer-wrap:fullscreen .global-music-player__visualizer-canvas,
    #global-player-visualizer-wrap.is-music-mobile-visualizer-immersive .global-music-player__visualizer-canvas {
        width: 100% !important;
        height: 100% !important;
    }

    #global-player-visualizer-wrap:fullscreen .global-music-player__visualizer-empty,
    #global-player-visualizer-wrap.is-music-mobile-visualizer-immersive .global-music-player__visualizer-empty {
        color: rgba(255, 255, 255, .72) !important;
    }
}



/* ClubOS 8.14.0-B.3.1 — contraste Day/Night, file d’attente et commentaires.
 * Ce bloc reste strictement limité au téléphone.
 */
@media (max-width: 767.98px) {
    body.clubos-mobile-active {
        --music-mobile-layer-player-rail: 8;
        --music-mobile-layer-player-menu: 4300;
        --music-mobile-layer-sheet: 6200;
        --music-mobile-layer-dialog: 7000;
        --music-mobile-layer-visualizer: 9000;
    }

    body.clubos-mobile-active .global-music-player__overflow-popover:not([hidden]),
    body.clubos-mobile-active .global-music-player__overflow-popover.is-open {
        z-index: var(--music-mobile-layer-player-menu) !important;
    }

    body.clubos-mobile-active .music-mobile-track-sheet,
    body.clubos-mobile-active .music-mobile-library-dialog,
    body.clubos-mobile-active .music-mobile-dialog {
        z-index: var(--music-mobile-layer-dialog);
    }

    /* En mode actif, le bouton est une vraie action primaire : texte, icône et badge blancs. */
    .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode="local"],
    .music-mobile-shuffle-status[data-shuffle-mode="local"] {
        border-color: color-mix(in srgb, var(--music-accent) 82%, #004b62) !important;
        background: var(--music-accent) !important;
        color: #fff !important;
        box-shadow: 0 7px 18px color-mix(in srgb, var(--music-accent) 24%, transparent);
    }

    .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode="global"],
    .music-mobile-shuffle-status[data-shuffle-mode="global"] {
        border-color: #664bc8 !important;
        background: #7158d9 !important;
        color: #fff !important;
        box-shadow: 0 7px 18px rgba(113, 88, 217, .24);
    }

    .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode]:not([data-shuffle-mode="off"]) .music-mobile-svg,
    .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode]:not([data-shuffle-mode="off"]) span,
    .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode]:not([data-shuffle-mode="off"]) small,
    .music-mobile-shuffle-status[data-shuffle-mode] .music-mobile-svg {
        color: inherit !important;
        fill: currentColor !important;
    }

    .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode]:not([data-shuffle-mode="off"]) small {
        border: 1px solid rgba(255, 255, 255, .28);
        background: rgba(255, 255, 255, .17) !important;
        color: #fff !important;
    }

    :root[data-theme="dark"] .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode="local"],
    :root[data-bs-theme="dark"] .music-mobile-album-actions [data-music-mobile-shuffle][data-shuffle-mode="local"],
    :root[data-theme="dark"] .music-mobile-shuffle-status[data-shuffle-mode="local"],
    :root[data-bs-theme="dark"] .music-mobile-shuffle-status[data-shuffle-mode="local"] {
        border-color: #20bee5 !important;
        background: #168eb5 !important;
        color: #fff !important;
    }

    .music-mobile-queue {
        padding: 0;
        background: var(--music-surface);
    }

    .music-mobile-queue__header {
        position: sticky;
        top: 0;
        z-index: 3;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
        padding: .7rem .2rem .72rem;
        border-bottom: 1px solid var(--music-border-soft);
        background: color-mix(in srgb, var(--music-surface) 96%, transparent);
        backdrop-filter: blur(12px);
    }

    .music-mobile-queue__header > div {
        min-width: 0;
    }

    .music-mobile-queue__header strong,
    .music-mobile-queue__header span {
        display: block;
    }

    .music-mobile-queue__header strong {
        color: var(--music-text-main);
        font-size: .96rem;
    }

    .music-mobile-queue__header span {
        margin-top: .12rem;
        color: var(--music-text-muted);
        font-size: .68rem;
    }

    .music-mobile-queue__header button {
        display: inline-flex;
        min-width: 4.9rem;
        min-height: 2.5rem;
        align-items: center;
        justify-content: center;
        gap: .3rem;
        padding: .35rem .65rem;
        border: 1px solid var(--music-border-soft);
        border-radius: 999px;
        background: var(--music-surface-raised);
        color: var(--music-text-main);
        font: inherit;
        font-size: .72rem;
        font-weight: 760;
    }

    .music-mobile-queue__header button .music-mobile-svg {
        width: 1rem;
        height: 1rem;
    }

    .music-mobile-queue__list {
        padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
    }

    .music-mobile-queue__group {
        position: sticky;
        top: 4.15rem;
        z-index: 2;
        padding: .55rem .28rem .32rem;
        background: var(--music-surface);
        color: var(--music-text-muted);
        font-size: .64rem;
        font-weight: 850;
        letter-spacing: .06em;
        text-transform: uppercase;
    }

    .music-mobile-queue__item {
        grid-template-columns: 2rem minmax(0, 1fr) auto;
        min-height: 4.15rem;
        padding: .55rem .28rem;
        border-bottom-color: var(--music-border-soft);
        border-radius: .7rem;
    }

    .music-mobile-queue__item:not(:disabled):active {
        background: var(--music-action-pressed);
    }

    .music-mobile-queue__item.is-active {
        border: 1px solid color-mix(in srgb, var(--music-accent) 33%, transparent);
        background: var(--music-surface-selected);
        color: var(--music-text-main);
    }

    .music-mobile-queue__item.is-history {
        opacity: .72;
    }

    .music-mobile-queue__meta {
        display: flex;
        max-width: 5.4rem;
        flex-direction: column;
        align-items: flex-end;
        gap: .2rem;
    }

    .music-mobile-queue__role,
    .music-mobile-queue__mode {
        display: inline-flex;
        align-items: center;
        min-height: 1.1rem;
        padding: 0 .34rem;
        border-radius: 999px;
        white-space: nowrap;
        font-size: .55rem;
        font-weight: 820;
    }

    .music-mobile-queue__role {
        background: color-mix(in srgb, var(--music-text-muted) 10%, transparent);
        color: var(--music-text-muted);
    }

    .music-mobile-queue__item.is-active .music-mobile-queue__role {
        background: var(--music-accent);
        color: #fff;
    }

    .music-mobile-queue__mode {
        background: color-mix(in srgb, #7158d9 13%, transparent);
        color: color-mix(in srgb, #7158d9 82%, var(--music-text-main));
    }

    .music-mobile-queue__playing {
        display: inline-flex;
        height: 1rem;
        align-items: flex-end;
        gap: 2px;
        color: var(--music-accent);
    }

    .music-mobile-queue__playing i {
        width: 2px;
        border-radius: 2px;
        background: currentColor;
        animation: music-mobile-queue-playing .82s ease-in-out infinite alternate;
    }

    .music-mobile-queue__playing i:nth-child(1) { height: .42rem; }
    .music-mobile-queue__playing i:nth-child(2) { height: .78rem; animation-delay: -.28s; }
    .music-mobile-queue__playing i:nth-child(3) { height: .58rem; animation-delay: -.52s; }

    .music-mobile-comments-heading {
        align-items: flex-start;
    }

    .music-mobile-comments-heading__text {
        min-width: 0;
    }

    .music-mobile-comments-heading__text strong,
    .music-mobile-comments-heading__text span,
    .music-mobile-comments-heading__text small {
        display: block;
    }

    .music-mobile-comments-heading__text span {
        max-width: 13rem;
        margin-top: .08rem;
        overflow: hidden;
        color: var(--music-text-muted);
        font-size: .7rem;
        font-weight: 640;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-mobile-comments-heading__text small {
        margin-top: .22rem;
        color: var(--music-accent-strong);
        font-size: .62rem;
        font-weight: 760;
    }

    .music-mobile-comment-hint {
        margin: 0 0 .48rem;
        color: var(--music-text-muted);
        font-size: .66rem;
        line-height: 1.35;
    }

    body.music-page-shell .music-mobile-comment-composer .d-flex:last-child {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: .45rem !important;
    }

    body.music-page-shell .music-mobile-comment-composer .js-track-comment-use-time {
        min-height: 2.55rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.music-page-shell .music-mobile-comment-composer button[type="submit"] {
        min-width: 5.2rem;
        min-height: 2.55rem;
    }

    @media (prefers-reduced-motion: reduce) {
        .music-mobile-queue__playing i {
            animation: none;
            height: .58rem;
        }
    }
}

@keyframes music-mobile-queue-playing {
    from { transform: scaleY(.45); }
    to { transform: scaleY(1); }
}

/* ClubOS 8.14.0-B.3.3 — accès direct aux commentaires de chaque piste. */
@media (max-width: 767.98px) {
    .music-mobile-track-quick-action.is-comments {
        position: relative;
        border: 1px solid var(--music-border-soft, rgba(82, 103, 137, .18));
        background: color-mix(in srgb, var(--music-surface-2, #eef3f8) 88%, var(--music-action-neutral) 12%);
        color: var(--music-action-neutral);
    }

    .music-mobile-track-quick-action.is-comments.is-open,
    .music-mobile-track-quick-action.is-comments[aria-expanded="true"] {
        background: color-mix(in srgb, var(--music-accent) 13%, transparent);
        color: var(--music-accent);
    }

    .music-mobile-track-comment-total {
        position: absolute;
        top: -.12rem;
        right: -.14rem;
        display: inline-grid;
        min-width: 1.02rem;
        height: 1.02rem;
        place-items: center;
        padding: 0 .2rem;
        border: 2px solid var(--music-surface, var(--site-surface, #fff));
        border-radius: 999px;
        background: #e5484d;
        color: #fff;
        font-size: .53rem;
        font-weight: 900;
        line-height: 1;
        box-sizing: border-box;
        pointer-events: none;
    }

    .music-mobile-track-comment-total[hidden] {
        display: none !important;
    }

    .music-mobile-track-quick-actions {
        gap: .02rem;
    }
}


/* Le socle du composeur est centralisé dans music-common.css. */

/* ClubOS 8.14.0-B.3.3.1 — commentaires Musique mobiles consolidés. */
@media (max-width: 767.98px) {
    body.music-page-shell .music-track-comments > .p-3 {
        padding: .45rem .55rem .6rem !important;
    }

    .music-mobile-comments-heading {
        align-items: center;
        margin-bottom: .28rem;
        padding: .08rem .12rem .32rem;
        border-bottom: 1px solid color-mix(in srgb, var(--music-border-soft) 72%, transparent);
    }

    .music-mobile-comments-heading__text {
        display: inline-flex;
        min-width: 0;
        align-items: center;
        gap: .42rem;
    }

    .music-mobile-comments-heading__text > .music-mobile-svg {
        width: 1.05rem;
        height: 1.05rem;
        color: var(--music-accent-strong);
    }

    .music-mobile-comments-heading__text strong {
        color: var(--music-text-main);
        font-size: .8rem;
        font-weight: 820;
        white-space: nowrap;
    }

    .music-mobile-comments-heading button {
        min-height: 2.35rem;
        padding: .28rem .62rem;
        background: transparent;
        color: var(--music-accent-strong);
        border: 1px solid var(--music-border-soft);
        font-size: .72rem;
    }

    body.music-page-shell .music-track-comments .js-track-comments-status {
        margin: .2rem 0 .3rem !important;
        color: var(--music-text-muted);
        font-size: .72rem;
    }

    body.music-page-shell .music-track-comments .js-track-comments-status:not(.is-empty-state) {
        display: none;
    }

    body.music-page-shell .music-track-comments .js-track-comments-list {
        margin-bottom: .35rem !important;
    }

    body.music-page-shell .music-comment-thread .music-comment-actions {
        margin-top: .08rem;
        margin-bottom: 0;
    }

    body.music-page-shell .music-comment-thread .music-comment-replies-toggle {
        margin-top: .04rem;
        margin-bottom: 0;
        min-height: 34px;
        padding-top: .15rem;
        padding-bottom: .15rem;
    }

    body.music-page-shell .music-comment-thread .c-group {
        margin-top: 0;
    }

    body.music-page-shell .music-comment-thread .c-item {
        padding-top: 4px;
    }

    body.music-page-shell .music-comment-reply-form {
        width: calc(100% - var(--c-avatar-size) - 8px);
        max-width: none;
        margin: .18rem 0 .32rem calc(var(--c-avatar-size) + 8px);
        padding: .5rem;
        border-radius: 14px;
    }

    body.music-page-shell .music-comment-reply-form__label {
        display: block;
        margin: 0 0 .35rem;
        color: var(--music-text-muted);
        font-size: .72rem;
        font-weight: 720;
    }

    body.music-page-shell .music-comment-reply-form .js-comment-reply-content {
        width: 100%;
        min-height: 44px;
        max-height: 7.5rem;
        resize: none;
        line-height: 1.42;
    }

    body.music-page-shell .music-comment-reply-form__actions {
        align-items: center;
        justify-content: flex-end;
        margin-top: .42rem;
    }

    body.music-page-shell .music-comment-reply-cancel,
    body.music-page-shell .music-comment-reply-submit {
        min-height: 40px;
        padding: .38rem .78rem;
        border-radius: 999px;
        font-weight: 800;
    }

    body.music-page-shell .music-comment-reply-cancel {
        border: 0;
        background: transparent;
        color: var(--music-text-muted);
    }

    body.music-page-shell .music-comment-composer {
        position: sticky;
        z-index: 12;
        bottom: calc(var(--clubos-mobile-nav-height, 64px) + var(--clubos-mobile-player-height, 0px) + var(--clubos-mobile-safe-bottom, 0px) + .25rem);
        margin: .25rem -.15rem 0;
        padding: .4rem;
        border: 1px solid var(--music-border-soft);
        border-radius: 18px;
        background: color-mix(in srgb, var(--music-surface-raised) 96%, transparent);
        box-shadow: 0 -8px 24px rgba(15, 23, 42, .08);
        backdrop-filter: blur(14px);
    }

    body.music-page-shell .music-comment-composer__field {
        min-width: 0;
    }

    body.music-page-shell .music-comment-composer .js-track-comment-content {
        width: 100%;
        min-height: 44px;
        max-height: 8.5rem;
        padding: .68rem .85rem;
        border: 0;
        border-radius: 16px;
        background: var(--music-surface);
        resize: none;
        line-height: 1.42;
        overflow-y: hidden;
    }

    body.music-page-shell .music-comment-composer .js-track-comment-content:focus {
        outline: 2px solid color-mix(in srgb, var(--music-accent) 38%, transparent);
        outline-offset: 1px;
    }

    body.music-page-shell .music-comment-composer__tools,
    body.music-page-shell .music-comment-composer__time {
        display: none;
    }

    body.music-page-shell .music-comment-composer.is-expanded .music-comment-composer__tools {
        display: flex;
    }

    body.music-page-shell .music-comment-composer.is-expanded .music-comment-composer__time:not(:empty) {
        display: flex;
    }

    body.music-page-shell .music-comment-composer__tools {
        align-items: center;
        justify-content: space-between;
        gap: .45rem;
        margin-top: .38rem;
    }

    body.music-page-shell .music-comment-composer__secondary {
        display: flex;
        min-width: 0;
        align-items: center;
        gap: .28rem;
    }

    body.music-page-shell .music-comment-composer__tool {
        display: inline-flex;
        min-width: 40px;
        min-height: 40px;
        align-items: center;
        justify-content: center;
        gap: .28rem;
        padding: .3rem .55rem;
        border: 0;
        border-radius: 999px;
        background: transparent;
        color: var(--music-text-muted);
        font: inherit;
        font-size: .75rem;
        font-weight: 760;
    }

    body.music-page-shell .music-comment-composer__tool[aria-pressed="true"] {
        background: var(--music-accent-soft);
        color: var(--music-accent-strong);
    }

    body.music-page-shell .music-comment-composer__submit {
        min-width: 5.3rem;
        min-height: 42px;
        padding: .4rem .9rem;
        border: 0;
        border-radius: 999px;
        background: var(--music-accent);
        color: #fff;
        font: inherit;
        font-weight: 840;
    }

    body.music-page-shell .music-comment-composer__time {
        align-items: center;
        gap: .35rem;
        min-height: 1.25rem;
        margin: .28rem .25rem 0;
        color: var(--music-accent-strong);
        font-size: .7rem;
        font-weight: 720;
    }

    body.music-page-shell .music-comment-composer__clear-time {
        border: 0;
        background: transparent;
        color: var(--music-text-muted);
        font: inherit;
        text-decoration: underline;
    }

    body.music-page-shell .music-comment-emoji-wrap {
        position: relative;
    }

    body.music-page-shell .music-comment-emoji-picker {
        position: absolute;
        z-index: 6800;
        left: 0;
        bottom: calc(100% + .4rem);
        display: grid;
        grid-template-columns: repeat(4, 40px);
        gap: .2rem;
        padding: .4rem;
        border: 1px solid var(--music-border-soft);
        border-radius: 16px;
        background: var(--music-surface-raised);
        box-shadow: 0 12px 30px rgba(15, 23, 42, .18);
    }

    body.music-page-shell .music-comment-emoji-picker[hidden] {
        display: none !important;
    }

    body.music-page-shell .music-comment-emoji-picker button {
        width: 40px;
        height: 40px;
        border: 0;
        border-radius: 10px;
        background: transparent;
        font-size: 1.1rem;
    }

    body.music-page-shell .music-comment-link {
        color: var(--music-accent-strong);
        overflow-wrap: anywhere;
        text-decoration: underline;
        text-underline-offset: .14em;
    }
}

/* La structure commune avatar/champ est centralisée dans music-common.css. */
@media (max-width: 767.98px) {
    body.music-page-shell .music-comment-composer.is-collapsed .music-comment-composer__avatar {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }
}

/* ClubOS 8.14.0-B.3.3.1.1 — album mobile partagé, recherche à la demande et composeur musical fini. */
@media (max-width: 767.98px) {
    body.music-page-shell #music-shell-content.music-mobile-album-detail [data-mobile-redundant-context="1"] {
        display: none !important;
    }
    body.music-page-shell #music-shell-content [data-music-search-launch] { display: none !important; }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .music-mobile-hub {
        margin-top: 0;
        margin-bottom: .62rem;
    }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .album-header {
        margin-bottom: .55rem !important;
    }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .album-header .card-body {
        padding: .65rem !important;
    }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .album-header .row {
        grid-template-columns: 82px minmax(0, 1fr);
        gap: .6rem !important;
    }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .album-header .album-detail-cover {
        width: 82px;
        height: 82px;
    }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .album-header h1 {
        margin-top: .08rem !important;
        font-size: 1.08rem !important;
    }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .album-header .text-secondary.mb-3 {
        margin-bottom: .2rem !important;
    }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .album-header p,
    body.music-page-shell #music-shell-content.music-mobile-album-detail .album-header .d-flex.flex-wrap.gap-2.mt-3 {
        margin-bottom: .2rem !important;
    }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .music-mobile-album-actions {
        grid-template-columns: .82fr 1.22fr 1fr;
        margin-top: 0;
    }
    body.music-page-shell #music-shell-content.music-mobile-album-detail .music-mobile-album-actions button:first-child {
        padding-inline: .3rem;
    }

    body.music-page-shell .music-comment-composer .js-track-comment-content {
        padding-right: 2.8rem;
        border: 1px solid color-mix(in srgb, var(--music-border-soft) 88%, transparent);
        background: color-mix(in srgb, var(--music-surface-raised) 72%, #eef2f7 28%);
    }
    :root[data-theme="dark"] body.music-page-shell .music-comment-composer .js-track-comment-content,
    :root[data-bs-theme="dark"] body.music-page-shell .music-comment-composer .js-track-comment-content {
        border-color: color-mix(in srgb, #41607f 68%, transparent);
        background: color-mix(in srgb, #13233a 88%, #0b1628 12%);
        color: #edf5ff;
    }
    body.music-page-shell .music-comment-composer__field { position: relative; }
    body.music-page-shell .music-comment-composer__clear {
        position: absolute;
        top: 50%;
        right: .35rem;
        width: 36px;
        height: 36px;
        display: none;
        place-items: center;
        padding: 0;
        border: 0;
        border-radius: 50%;
        transform: translateY(-50%);
        background: transparent;
        color: var(--music-text-muted);
        font-size: 1.3rem;
        line-height: 1;
    }
    body.music-page-shell .music-comment-composer.is-expanded .music-comment-composer__clear { display: grid; }
    body.music-page-shell .music-comment-composer__tool.js-track-comment-emoji-toggle {
        min-width: 44px;
        min-height: 44px;
        font-size: 1.15rem;
    }
    body.music-page-shell .music-comment-emoji-picker {
        left: -.25rem;
        width: min(19rem, calc(100vw - 3.5rem));
        max-height: min(15rem, 44dvh);
        grid-template-columns: repeat(7, minmax(36px, 1fr));
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    body.music-page-shell .music-comment-emoji-picker button {
        width: 100%;
        min-width: 36px;
        height: 38px;
        font-size: 1.18rem;
    }
    body.music-page-shell .music-comment-composer__time { display: none !important; }
    body.music-page-shell .music-comment-composer__clear-time {
        width: 36px;
        height: 36px;
        display: inline-grid;
        place-items: center;
        padding: 0;
        border-radius: 50%;
        text-decoration: none;
        font-size: 1rem;
    }
    body.music-page-shell .music-comment-composer__clear-time.d-none { display: none !important; }
    body.music-page-shell .music-comment-composer__timecode[aria-pressed="true"] {
        border: 1px solid color-mix(in srgb, var(--music-accent) 48%, transparent);
        background: color-mix(in srgb, var(--music-accent) 15%, var(--music-surface));
        color: var(--music-accent-strong);
    }
    :root[data-theme="dark"] body.music-page-shell .music-comment-composer__timecode[aria-pressed="true"],
    :root[data-bs-theme="dark"] body.music-page-shell .music-comment-composer__timecode[aria-pressed="true"] {
        background: color-mix(in srgb, var(--music-accent) 24%, #11223a);
        color: #d9f6ff;
    }
}


/* ClubOS 8.14.0-B.3.3.1.1 — commentaires horodatés sous forme d’avatars, téléphone uniquement. */
@media (max-width: 767.98px) {
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player__markers { overflow: visible; }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player__marker {
        top: auto !important;
        bottom: -8px !important;
        width: 22px !important;
        height: 22px !important;
        display: grid !important;
        place-items: center;
        overflow: hidden;
        border: 2px solid var(--music-surface, var(--site-surface, #fff)) !important;
        border-radius: 50%;
        background: var(--music-accent, var(--site-accent, #0f8278)) !important;
        color: #fff;
        box-shadow: 0 1px 6px rgba(15, 23, 42, .34);
        transform: translateX(-50%) !important;
        font-size: .62rem;
        font-weight: 900;
    }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player__marker img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player__marker:focus-visible {
        outline: 3px solid color-mix(in srgb, var(--music-accent, #0f8278) 34%, transparent);
        outline-offset: 2px;
    }
}

/* ===== SOURCE: music-mobile-search.css ===== */
@media (max-width: 767.98px) {
    body.music-page-shell,
    body.clubos-mobile-active {
        --music-search-surface: var(--music-mobile-surface, var(--site-surface, #fff));
        --music-search-surface-2: var(--music-mobile-surface-2, color-mix(in srgb, var(--site-surface, #fff) 94%, var(--site-accent, #1381c4) 6%));
        --music-search-border: var(--music-mobile-border, var(--site-border, #d4deeb));
        --music-search-text: var(--music-mobile-text, var(--site-text, #172033));
        --music-search-muted: var(--music-mobile-muted, var(--site-text-muted, #66758d));
        --music-search-accent: var(--music-mobile-accent, var(--site-accent, #1381c4));
    }

    .music-mobile-search-launch {
        display: grid;
        width: 100%;
        grid-template-columns: 2.4rem minmax(0, 1fr) 1.3rem;
        align-items: center;
        gap: .65rem;
        margin: .55rem 0 .75rem;
        padding: .62rem .72rem;
        border: 1px solid var(--music-search-border);
        border-radius: 1rem;
        background: var(--music-search-surface);
        color: var(--music-search-text);
        box-shadow: 0 5px 16px rgba(26, 45, 72, .06);
        text-align: left;
    }

    .music-mobile-search-launch > svg:first-child {
        width: 1.2rem;
        height: 1.2rem;
        justify-self: center;
        fill: currentColor;
        color: var(--music-search-accent);
    }

    .music-mobile-search-launch > span:nth-child(2) {
        display: grid;
        min-width: 0;
        gap: .08rem;
    }

    .music-mobile-search-launch strong,
    .music-mobile-search-launch small {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-mobile-search-launch strong {
        font-size: .82rem;
        font-weight: 800;
    }

    .music-mobile-search-launch small {
        color: var(--music-search-muted);
        font-size: .66rem;
    }

    .music-mobile-search-launch > span:last-child,
    .music-mobile-search-launch > span:last-child svg {
        width: 1.1rem;
        height: 1.1rem;
        color: var(--music-search-muted);
        fill: currentColor;
    }

    .music-mobile-search-dialog {
        position: fixed;
        inset: 0;
        width: 100%;
        max-width: none;
        height: 100dvh;
        max-height: none;
        margin: 0;
        padding: 0;
        border: 0;
        background: var(--music-search-surface);
        color: var(--music-search-text);
        overflow: hidden;
        z-index: 7100;
    }

    .music-mobile-search-dialog::backdrop {
        background: rgba(4, 12, 26, .54);
        backdrop-filter: blur(5px);
    }

    .music-mobile-search-dialog[open] {
        display: grid;
        grid-template-rows: auto auto minmax(0, 1fr);
    }

    .music-mobile-search__header {
        display: grid;
        grid-template-columns: 2.75rem minmax(0, 1fr);
        align-items: center;
        gap: .45rem;
        padding: calc(.55rem + env(safe-area-inset-top, 0px)) .65rem .55rem;
        border-bottom: 1px solid var(--music-search-border);
        background: var(--music-search-surface);
    }

    .music-mobile-search__close {
        display: inline-grid;
        width: 2.65rem;
        height: 2.65rem;
        place-items: center;
        border: 0;
        border-radius: 999px;
        background: transparent;
        color: var(--music-search-text);
    }

    .music-mobile-search__close svg,
    .music-mobile-search__field svg {
        width: 1.2rem;
        height: 1.2rem;
        fill: currentColor;
    }

    .music-mobile-search__field {
        display: grid;
        grid-template-columns: 1.3rem minmax(0, 1fr);
        align-items: center;
        gap: .45rem;
        min-height: 2.65rem;
        padding: 0 .75rem;
        border: 1px solid var(--music-search-border);
        border-radius: 999px;
        background: var(--music-search-surface-2);
        color: var(--music-search-muted);
    }

    .music-mobile-search__field input {
        width: 100%;
        min-width: 0;
        border: 0;
        outline: 0;
        background: transparent;
        color: var(--music-search-text);
        font: inherit;
        font-size: .86rem;
    }

    .music-mobile-search__tabs {
        display: flex;
        gap: .4rem;
        overflow-x: auto;
        padding: .55rem .65rem;
        border-bottom: 1px solid var(--music-search-border);
        background: var(--music-search-surface);
        scrollbar-width: none;
    }

    .music-mobile-search__tabs::-webkit-scrollbar { display: none; }

    .music-mobile-search__tabs button {
        display: inline-flex;
        min-height: 2.25rem;
        flex: 0 0 auto;
        align-items: center;
        gap: .28rem;
        padding: .4rem .68rem;
        border: 1px solid var(--music-search-border);
        border-radius: 999px;
        background: transparent;
        color: var(--music-search-text);
        font: inherit;
        font-size: .72rem;
        font-weight: 750;
    }

    .music-mobile-search__tabs button.is-active {
        border-color: var(--music-search-accent);
        background: var(--music-search-accent);
        color: #fff;
    }

    .music-mobile-search__tabs small {
        display: inline-grid;
        min-width: 1.1rem;
        min-height: 1.1rem;
        place-items: center;
        padding: 0 .22rem;
        border-radius: 999px;
        background: color-mix(in srgb, currentColor 16%, transparent);
        font-size: .58rem;
    }

    .music-mobile-search__body {
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: .55rem .65rem calc(1rem + env(safe-area-inset-bottom, 0px));
    }

    .music-mobile-search__status {
        padding: .28rem .18rem .62rem;
        color: var(--music-search-muted);
        font-size: .72rem;
    }

    .music-mobile-search__status.is-empty {
        padding-top: 2rem;
        text-align: center;
    }

    .music-mobile-search__results {
        display: grid;
        gap: .45rem;
    }

    .music-mobile-search-result {
        overflow: hidden;
        border: 1px solid var(--music-search-border);
        border-radius: .95rem;
        background: var(--music-search-surface);
    }

    .music-mobile-search-result__main {
        display: grid;
        grid-template-columns: 3.35rem minmax(0, 1fr) 2.45rem;
        align-items: center;
        gap: .65rem;
        min-height: 4.35rem;
        padding: .5rem .55rem;
        color: inherit;
        text-decoration: none;
    }

    .music-mobile-search-result__media,
    .music-mobile-search-result__media img,
    .music-mobile-search__placeholder {
        display: grid;
        width: 3.2rem;
        height: 3.2rem;
        place-items: center;
        border-radius: .75rem;
        object-fit: cover;
        background: var(--music-search-surface-2);
    }

    .music-mobile-search__placeholder svg {
        width: 1.35rem;
        height: 1.35rem;
        fill: currentColor;
        color: var(--music-search-accent);
    }

    .music-mobile-search-result__text {
        display: grid;
        min-width: 0;
        gap: .04rem;
    }

    .music-mobile-search-result__text strong,
    .music-mobile-search-result__text > span:not(.music-mobile-search-result__type),
    .music-mobile-search-result__text small {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-mobile-search-result__text strong {
        font-size: .82rem;
        font-weight: 800;
    }

    .music-mobile-search-result__text > span:not(.music-mobile-search-result__type) {
        color: var(--music-search-muted);
        font-size: .68rem;
    }

    .music-mobile-search-result__text small {
        color: var(--music-search-accent);
        font-size: .58rem;
    }

    .music-mobile-search-result__type {
        width: max-content;
        padding: .08rem .32rem;
        border-radius: .35rem;
        background: color-mix(in srgb, var(--music-search-accent) 12%, transparent);
        color: var(--music-search-accent);
        font-size: .55rem;
        font-weight: 850;
        text-transform: uppercase;
    }

    .music-mobile-search__play,
    .music-mobile-search__arrow {
        display: inline-grid;
        width: 2.35rem;
        height: 2.35rem;
        place-items: center;
        justify-self: end;
        border-radius: 999px;
        color: var(--music-search-text);
    }

    .music-mobile-search__play {
        background: var(--music-search-accent);
        color: #fff;
    }

    .music-mobile-search__play svg,
    .music-mobile-search__arrow svg {
        width: 1.1rem;
        height: 1.1rem;
        fill: currentColor;
    }

    .music-mobile-search__secondary {
        display: block;
        padding: .42rem .65rem .5rem 4.4rem;
        border-top: 1px solid var(--music-search-border);
        color: var(--music-search-accent);
        font-size: .68rem;
        font-weight: 750;
        text-decoration: none;
    }

    .music-mobile-search__more,
    .music-mobile-progressive-tracks {
        display: block;
        width: calc(100% - 1.1rem);
        min-height: 2.75rem;
        margin: .7rem auto;
        border: 1px solid var(--music-search-border);
        border-radius: .85rem;
        background: var(--music-search-surface);
        color: var(--music-search-accent);
        font: inherit;
        font-size: .75rem;
        font-weight: 800;
    }

    .music-mobile-search__skeleton {
        display: grid;
        gap: .5rem;
    }

    .music-mobile-search__skeleton span {
        display: block;
        height: 4.25rem;
        border-radius: .95rem;
        background: linear-gradient(90deg, var(--music-search-surface-2), color-mix(in srgb, var(--music-search-surface-2) 60%, #fff), var(--music-search-surface-2));
        background-size: 220% 100%;
        animation: music-search-shimmer 1.2s linear infinite;
    }

    body.music-mobile-search-open {
        overflow: hidden !important;
    }

    .music-track-row.is-progressively-hidden,
    .music-track-comments-row.is-progressively-hidden {
        display: none !important;
    }
}

@keyframes music-search-shimmer {
    from { background-position: 100% 0; }
    to { background-position: -120% 0; }
}

@media (prefers-reduced-motion: reduce) {
    .music-mobile-search__skeleton span { animation: none; }
}

/* Les attributs hidden doivent toujours gagner sur les styles de bouton. */
@media (max-width: 767.98px) {
    .music-mobile-search__more[hidden],
    .music-mobile-progressive-tracks[hidden] {
        display: none !important;
    }
}

/* Action explicite « Lire ensuite » dans la recherche mobile. */
@media (max-width: 767.98px) {
    .music-mobile-search-result__queue {
        display: flex;
        justify-content: flex-end;
        padding: .42rem .55rem .5rem 4.4rem;
        border-top: 1px solid var(--music-search-border);
    }

    .music-mobile-search-result__queue button {
        display: inline-flex;
        min-height: 2.15rem;
        align-items: center;
        gap: .38rem;
        padding: .36rem .7rem;
        border: 1px solid color-mix(in srgb, var(--music-search-accent) 52%, var(--music-search-border));
        border-radius: 999px;
        background: color-mix(in srgb, var(--music-search-accent) 9%, var(--music-search-surface));
        color: var(--music-search-accent);
        font: inherit;
        font-size: .68rem;
        font-weight: 820;
    }

    .music-mobile-search-result__queue button.is-queued {
        border-color: color-mix(in srgb, #24966f 58%, var(--music-search-border));
        background: color-mix(in srgb, #24966f 12%, var(--music-search-surface));
        color: #187454;
    }

    .music-mobile-search-result__queue button[hidden] {
        display: none !important;
    }

    .music-mobile-search-result__queue svg {
        width: 1rem;
        height: 1rem;
        flex: 0 0 auto;
        fill: currentColor;
    }
}

/* Retrait sûr des seuls éléments futurs, commun au dock et à la file mobile. */
.music-queue-removable-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 2rem;
    align-items: center;
    gap: .25rem;
    min-width: 0;
}

.music-queue-removable-row > .global-music-player__dock-queue-item,
.music-queue-removable-row > .music-mobile-queue__item {
    width: 100%;
    min-width: 0;
}

.music-queue-remove {
    display: inline-grid;
    width: 1.9rem;
    height: 1.9rem;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: currentColor;
    opacity: .62;
}

.music-queue-remove:hover,
.music-queue-remove:focus-visible {
    background: color-mix(in srgb, currentColor 10%, transparent);
    opacity: 1;
}

.music-queue-remove svg {
    width: .95rem;
    height: .95rem;
    fill: currentColor;
}

@media (max-width: 767.98px) {
    .music-mobile-queue__group .music-queue-removable-row {
        grid-template-columns: minmax(0, 1fr) 2.35rem;
        gap: .2rem;
    }

    .music-mobile-queue__group .music-queue-remove {
        width: 2.25rem;
        height: 2.25rem;
        color: var(--music-search-muted, #66758d);
    }
}


.music-mobile-search__queue-notice {
    position: sticky;
    top: 4.25rem;
    z-index: 8;
    margin: .45rem .75rem 0;
    padding: .62rem .75rem;
    border: 1px solid color-mix(in srgb, #15966f 45%, transparent);
    border-radius: .72rem;
    background: color-mix(in srgb, #15966f 12%, var(--music-search-surface, #fff));
    color: #147052;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .1);
    font-size: .78rem;
    font-weight: 820;
}
.music-mobile-search__queue-notice[hidden] { display: none !important; }
.music-mobile-search__queue-notice.is-error {
    border-color: color-mix(in srgb, #dc2626 45%, transparent);
    background: color-mix(in srgb, #dc2626 10%, var(--music-search-surface, #fff));
    color: #b91c1c;
}
.music-mobile-search-result__queue button.is-confirmed {
    animation: musicQueueConfirmed .7s ease;
}
@keyframes musicQueueConfirmed {
    0%, 100% { transform: scale(1); }
    42% { transform: scale(1.035); box-shadow: 0 0 0 4px color-mix(in srgb, #15966f 18%, transparent); }
}
:root[data-theme="dark"] .music-mobile-search__queue-notice { color: #8be0bd; }
:root[data-theme="dark"] .music-mobile-search__queue-notice.is-error { color: #fca5a5; }

/* B.3.8 : longues listes et téléphones modestes. */
@supports (content-visibility: auto) {
    .music-mobile-search-result,
    .music-album-grid__item {
        content-visibility: auto;
        contain-intrinsic-size: auto 150px;
    }
}

.clubos-constrained-network .music-mobile-search-dialog {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

.clubos-constrained-network .music-mobile-search__skeleton span,
.clubos-constrained-network .music-mobile-search-result [data-music-queue-next].is-confirmed,
.clubos-constrained-network .music-mobile-search-result [data-music-queue-last].is-confirmed {
    animation: none !important;
}

/* ===== SOURCE: music-social-parity.css ===== */
/* ClubOS 9.8.0N — parité sociale Blog/Musique et stabilité responsive. */

/* Barre sociale des commentaires Musique : même contrat visuel que le lecteur Blog. */
body.music-page-shell .music-comment-social-toolbar {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    width: calc(100% - var(--c-avatar-size) - 8px);
    margin: .1rem 0 0 calc(var(--c-avatar-size) + 8px);
    padding: 2px 0 6px;
}
body.music-page-shell .music-comment-social-toolbar .music-comment-reaction-wrap { flex: 0 0 auto; }
body.music-page-shell .music-comment-social-tool,
body.music-page-shell .music-comment-social-reaction-types {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 0;
    min-height: 30px;
    padding: 4px 7px;
    border: 0;
    border-radius: 9px;
    color: #55657a;
    background: transparent;
    font: inherit;
    font-size: .79rem;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: color 130ms ease, background-color 130ms ease, transform 130ms ease;
}
body.music-page-shell .music-comment-social-tool:hover,
body.music-page-shell .music-comment-social-tool:focus-visible,
body.music-page-shell .music-comment-social-reaction-types:hover,
body.music-page-shell .music-comment-social-reaction-types:focus-visible {
    color: #1d4ed8;
    background: rgba(37,99,235,.07);
    outline: none;
}
body.music-page-shell .music-comment-social-tool:active { transform: translateY(1px); }
body.music-page-shell .music-comment-social-tool.is-active { color:#2563eb; }
body.music-page-shell .music-comment-social-tool strong {
    color: inherit;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
}
body.music-page-shell .music-comment-social-tool__icon,
body.music-page-shell .music-comment-social-icon {
    display:inline-flex; align-items:center; justify-content:center; min-width:18px; min-height:18px;
}
body.music-page-shell .music-social-like-svg,
body.music-page-shell .music-comment-social-svg {
    width:18px; height:18px; flex:0 0 18px; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round;
}
body.music-page-shell .music-social-like-svg.is-filled { fill:currentColor; stroke-width:1.45; }
body.music-page-shell .music-comment-social-emoji,
body.music-page-shell .music-social-reaction-emoji { font-size:1rem; line-height:1; }
body.music-page-shell .music-comment-social-reaction-types { margin-left:auto; padding-inline:5px; cursor:default; }
body.music-page-shell .music-comment-social-reaction-types .music-comment-reaction-summary { gap:0; }
body.music-page-shell .music-comment-social-reaction-types .music-comment-reaction-summary > strong { display:none; }
body.music-page-shell .music-comment-social-reaction-types .music-comment-reaction-summary__icons { display:inline-flex; align-items:center; padding:0; letter-spacing:0; }
body.music-page-shell .music-comment-social-reaction-types .music-comment-reaction-summary__icons > span {
    display:inline-grid; place-items:center; width:19px; height:19px; margin-left:-3px; border-radius:50%; font-size:.72rem; background:#fff; box-shadow:0 0 0 1.5px #fff;
}
body.music-page-shell .music-comment-social-reaction-types .music-comment-reaction-summary__icons > span:first-child { margin-left:0; }
body.music-page-shell .music-comment-reaction-picker { max-width:min(290px, calc(100vw - 24px)); }
body.music-page-shell .music-comment-reaction-choice.is-active { outline:2px solid #2563eb; outline-offset:1px; background:rgba(37,99,235,.1); }

/* Réaction piste : neutre = pouce contour ; like = pouce bleu rempli ; autres = emoji choisi. */
body.music-page-shell .music-btn-like:not(.is-active) { color:#55657a; border-color:var(--site-border); background:transparent; }
body.music-page-shell .music-btn-like.is-active { color:#2563eb; }
body.music-page-shell .music-track-action-icon .music-social-like-svg { width:18px; height:18px; }
body.music-page-shell .music-mobile-track-quick-reaction-icon { display:inline-flex; align-items:center; justify-content:center; min-width:18px; min-height:18px; font-size:1rem; line-height:1; }
body.music-page-shell .music-mobile-track-quick-reaction-icon .music-mobile-svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }
body.music-page-shell .music-mobile-track-quick-reaction-icon .music-mobile-svg.is-filled { fill:currentColor; stroke-width:1.45; }
body.music-page-shell .music-mobile-track-quick-action.is-like:not(.is-active) { color:#55657a; }
body.music-page-shell .music-mobile-track-quick-action.is-like.is-active { color:#2563eb; }

/* Desktop : la table doit tenir dans sa carte sans ascenseur horizontal. */
@media (min-width:768px) {
    body.music-page-shell .music-track-table-wrap { overflow-x:visible !important; max-width:100%; }
    body.music-page-shell .music-track-table { width:100% !important; max-width:100%; table-layout:fixed !important; }
    body.music-page-shell .music-track-table .music-track-cover-cell { width:62px; }
    body.music-page-shell .music-track-table .music-track-number-cell { width:58px; }
    body.music-page-shell .music-track-table .music-track-duration-cell { width:80px; }
    body.music-page-shell .music-track-table .music-track-actions-cell { width:250px !important; }
    body.music-page-shell .music-track-table .music-track-title-cell { min-width:0 !important; overflow:hidden; text-overflow:ellipsis; }
    body.music-page-shell .music-track-table .music-track-actions { flex-wrap:wrap !important; justify-content:flex-end; gap:.28rem !important; }
}

/* Mobile : zéro défilement horizontal et composeur strictement dans le flux. */
@media (max-width:767.98px) {
    /* Ne jamais transformer la page Musique elle-même en surface gestuelle bloquée. */
    body.music-page-shell { overflow-y:visible; touch-action:auto; }
    body.music-page-shell #site-shell-root,
    body.music-page-shell #site-shell-main,
    body.music-page-shell #site-shell-content,
    body.music-page-shell #music-shell-content { max-width:100%; overflow-x:clip; }
    body.music-page-shell #music-shell-content,
    body.music-page-shell .music-shell-main,
    body.music-page-shell .music-track-table-wrap,
    body.music-page-shell .music-track-table,
    body.music-page-shell .music-track-table tbody,
    body.music-page-shell .music-track-row,
    body.music-page-shell .music-track-comments-row,
    body.music-page-shell .music-track-comments-row > td,
    body.music-page-shell .music-track-comments,
    body.music-page-shell .music-comment-thread,
    body.music-page-shell .music-comment-item,
    body.music-page-shell .music-comment-main,
    body.music-page-shell .music-comment-bubble,
    body.music-page-shell .music-comment-composer,
    body.music-page-shell .music-comment-reply-form {
        min-width:0 !important; max-width:100% !important; box-sizing:border-box !important;
    }
    body.music-page-shell .music-track-table-wrap { overflow-x:clip !important; width:100% !important; }
    body.music-page-shell .music-track-table { width:100% !important; max-width:100% !important; }
    body.music-page-shell .music-track-row { width:100% !important; }
    body.music-page-shell .music-track-comments-row { width:100% !important; }
    body.music-page-shell .music-track-comments-row > td { width:100% !important; padding-inline:.45rem !important; }
    body.music-page-shell .music-track-reaction-wrap--mobile-quick .music-track-reaction-picker {
        left:auto !important; right:0 !important; transform:translate(0,5px) scale(.96) !important;
    }
    body.music-page-shell .music-track-reaction-wrap--mobile-quick.is-open .music-track-reaction-picker,
    body.music-page-shell .music-track-reaction-wrap--mobile-quick:focus-within .music-track-reaction-picker {
        transform:translate(0,0) scale(1) !important;
    }
    body.music-page-shell .music-comment-reaction-picker { left:0 !important; right:auto !important; }
    body.music-page-shell .music-comment-composer {
        position:static !important; z-index:auto !important; inset:auto !important; bottom:auto !important;
        width:100% !important; margin:.55rem 0 0 !important; padding:.5rem !important;
        box-shadow:none !important; backdrop-filter:none !important; transform:none !important;
    }
    body.music-page-shell .music-comment-composer__main,
    body.music-page-shell .music-comment-composer__field,
    body.music-page-shell .music-comment-composer__tools,
    body.music-page-shell .music-comment-composer__secondary,
    body.music-page-shell .music-comment-composer .js-track-comment-content { min-width:0 !important; max-width:100% !important; box-sizing:border-box !important; }
    body.music-page-shell .music-comment-composer__tools,
    body.music-page-shell .music-comment-composer__secondary { flex-wrap:wrap !important; }
    body.music-page-shell .music-comment-reply-form { width:calc(100% - var(--c-avatar-size) - 8px) !important; }
    body.music-page-shell .music-comment-social-toolbar {
        width:calc(100% - var(--c-avatar-size) - 8px); gap:3px;
    }
    body.music-page-shell .music-comment-social-tool,
    body.music-page-shell .music-comment-social-reaction-types { min-height:28px; padding:3px 5px; font-size:.73rem; }
    body.music-page-shell .music-social-like-svg,
    body.music-page-shell .music-comment-social-svg { width:17px; height:17px; flex-basis:17px; }
}

:root[data-theme="dark"] body.music-page-shell .music-comment-social-tool,
:root[data-theme="dark"] body.music-page-shell .music-comment-social-reaction-types { color:#b6c3d7; }
:root[data-theme="dark"] body.music-page-shell .music-comment-social-tool:hover,
:root[data-theme="dark"] body.music-page-shell .music-comment-social-tool:focus-visible { color:#bfdbfe; background:rgba(96,165,250,.13); }
:root[data-theme="dark"] body.music-page-shell .music-comment-social-tool.is-active { color:#60a5fa; }
:root[data-theme="dark"] body.music-page-shell .music-comment-social-reaction-types .music-comment-reaction-summary__icons > span { background:#111a2c; box-shadow:0 0 0 1.5px #111a2c; }

/* Raffinement du bouton piste / lecteur mobile : pas de pastille héritée rouge/jaune. */
body.music-page-shell .music-btn-like,
body.music-page-shell .music-btn-like:not(.is-active),
body.music-page-shell .music-btn-like.is-active {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}
body.music-page-shell .music-mobile-track-quick-action.is-like.is-active {
    background: rgba(37,99,235,.07) !important;
    color: #2563eb !important;
}
body.music-page-shell .music-mobile-player-action[data-source-id="global-player-like"] .music-mobile-svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
}
body.music-page-shell .music-mobile-player-action[data-source-id="global-player-like"] .music-mobile-svg.is-filled {
    fill: currentColor;
    stroke-width: 1.45;
}


/* ClubOS 9.8.0P — player desktop: marqueurs commentaires + picker réactions robuste. */
@media (min-width: 768px) {
    /* Les commentaires horodatés ne doivent plus devenir des bandes verticales qui masquent la waveform. */
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player__markers {
        overflow: visible;
    }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player__marker {
        top: auto !important;
        bottom: -5px !important;
        width: 20px !important;
        height: 20px !important;
        display: grid !important;
        place-items: center;
        overflow: hidden;
        border: 2px solid var(--music-surface, var(--site-surface, #fff)) !important;
        border-radius: 50% !important;
        background: var(--music-accent, var(--site-accent, #0f8278)) !important;
        color: #fff !important;
        box-shadow: 0 1px 5px rgba(15, 23, 42, .28);
        transform: translateX(-50%) !important;
        z-index: 5;
        font-size: .58rem;
        font-weight: 850;
    }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player__marker img {
        width: 100% !important;
        height: 100% !important;
        display: block;
        object-fit: cover;
        border-radius: inherit;
    }
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player__marker:hover,
    :is(body.music-page-shell, body.music-player-persistent) .global-music-player__marker:focus-visible {
        z-index: 12;
        transform: translateX(-50%) scale(1.16) !important;
        outline: 2px solid color-mix(in srgb, var(--music-accent, #0f8278) 35%, transparent);
        outline-offset: 1px;
    }

    /* Pas de trou mort entre le bouton et le picker : on peut réellement monter la souris dessus. */
    body.music-page-shell .music-track-reaction-picker {
        bottom: calc(100% - 2px);
        z-index: 12000;
    }

    /* ClubOS 9.8.0S — le dock droit clippe son contenu avec overflow:hidden.
       Un z-index supérieur ne peut pas traverser ce clipping : on recentre donc
       la palette à l'intérieur du dock, avec assez de marge à droite pour les 6 réactions. */
    body.music-page-shell .global-music-player[data-display-mode="dock-right"] .music-track-reaction-wrap--global {
        z-index: 12010;
    }
    body.music-page-shell .global-music-player[data-display-mode="dock-right"] .music-track-reaction-wrap--global .music-track-reaction-picker {
        left: 50%;
        right: auto;
        width: max-content;
        max-width: none;
        z-index: 32000;
        transform: translate(-40%, 5px) scale(.96);
    }
    body.music-page-shell .global-music-player[data-display-mode="dock-right"] .music-track-reaction-wrap--global.is-open .music-track-reaction-picker,
    body.music-page-shell .global-music-player[data-display-mode="dock-right"] .music-track-reaction-wrap--global:focus-within .music-track-reaction-picker,
    body.music-page-shell .global-music-player[data-display-mode="dock-right"] .music-track-reaction-wrap--global:hover .music-track-reaction-picker {
        transform: translate(-40%, 0) scale(1);
    }
}

/* MOB11: mobile scope only; source view uses artwork-grid (not card-grid). */
@media (max-width:649.98px) {
 body.music-page-shell .music-context-sticky[data-music-context-sticky="1"] {display:none!important;}
 body.music-page-shell .music-playlist-artwork-grid {
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.65rem!important;
  width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;
 }
 body.music-page-shell .music-playlist-artwork-card {min-width:0!important;max-width:100%!important;width:100%!important;}
 body.music-page-shell .music-playlist-artwork-shell {width:100%!important;aspect-ratio:1/1!important;}
 body.music-page-shell .music-playlist-artwork-link {inset:0!important;max-width:100%!important;}
 body.music-page-shell .music-playlist-artwork-link img {width:100%!important;height:100%!important;object-fit:cover!important;}
 body.music-page-shell .music-playlist-artwork-title {font-size:.84rem!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
 body.music-page-shell .music-playlist-artwork-meta {min-width:0!important;}
 body.music-page-shell .music-track-table .music-track-play-icon::before {border-left-color:#fff!important;}
 body.music-page-shell .music-track-table .js-music-play-trigger {color:#fff!important;}
}

/* MOB12 telephone: complete playlist artwork card styles omitted by DESK5's min-width:768 block. */
@media(max-width:649.98px){
 body.music-page-shell .music-playlist-artwork-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.65rem!important;}
 body.music-page-shell .music-playlist-artwork-card{min-width:0!important;width:100%!important;overflow:hidden;}
 body.music-page-shell .music-playlist-artwork-shell{position:relative!important;width:100%!important;aspect-ratio:1/1!important;overflow:hidden!important;border-radius:12px!important;}
 body.music-page-shell .music-playlist-artwork-link{position:absolute!important;inset:0!important;display:block!important;overflow:hidden!important;border-radius:12px!important;}
 body.music-page-shell .music-playlist-artwork-link img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;}
 body.music-page-shell .music-playlist-artwork-badges{position:absolute!important;z-index:3!important;top:6px!important;left:6px!important;display:flex!important;gap:3px!important;flex-wrap:wrap!important;max-width:calc(100% - 12px)!important;}
 body.music-page-shell .music-playlist-artwork-badges span{display:inline-block!important;max-width:100%!important;padding:3px 6px!important;border-radius:8px!important;background:rgba(13,28,48,.82)!important;color:white!important;font-size:9px!important;font-weight:700!important;white-space:nowrap!important;}
 body.music-page-shell .music-playlist-artwork-actions{position:absolute!important;right:7px!important;bottom:7px!important;z-index:4!important;max-width:calc(100% - 14px)!important;}
 body.music-page-shell .music-playlist-artwork-meta{min-width:0!important;width:100%!important;display:flex!important;flex-direction:column!important;gap:3px!important;padding:7px 2px 0!important;}
 body.music-page-shell .music-playlist-artwork-title{display:block!important;min-width:0!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:13px!important;line-height:1.3!important;font-weight:750!important;color:var(--music-text-main,#17243a)!important;text-decoration:none!important;}
 body.music-page-shell .music-playlist-artwork-meta>span,body.music-page-shell .music-playlist-artwork-meta>small{display:block!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:11px!important;color:var(--music-text-muted,#64748b)!important;margin:0!important;}
 .music-mobile-library-dialog .music-mobile-library__listen{background:#168fe4!important;color:#fff!important;border:1px solid rgba(255,255,255,.9)!important;width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;display:inline-grid!important;place-items:center!important;}
 .music-mobile-library-dialog .music-mobile-library__listen svg.music-mobile-svg{width:20px!important;height:20px!important;fill:#fff!important;color:#fff!important;stroke:#fff!important;stroke-width:1.2!important;}
 .music-mobile-library-dialog .music-mobile-library__listen svg.music-mobile-svg *{fill:#fff!important;stroke:#fff!important;}
}

/* MOB13 phone-only playlist action controls: restore visible background, CTA and three-dots. */
@media(max-width:649.98px){
 body.music-page-shell .music-playlist-artwork-grid{align-items:start!important;}
 body.music-page-shell .music-playlist-artwork-card{position:relative!important;min-width:0!important;}
 body.music-page-shell .music-playlist-artwork-shell{position:relative!important;isolation:isolate!important;}
 body.music-page-shell .music-playlist-artwork-actions{display:flex!important;align-items:center!important;gap:6px!important;position:absolute!important;bottom:8px!important;right:8px!important;z-index:30!important;opacity:1!important;transform:none!important;visibility:visible!important;pointer-events:auto!important;}
 body.music-page-shell .music-playlist-artwork-actions .music-share-icon-button{display:inline-flex!important;justify-content:center!important;align-items:center!important;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;border-radius:999px!important;background:#fff!important;color:#182942!important;border:1px solid #d7e1ec!important;box-shadow:0 4px 12px #112d4d40!important;opacity:1!important;pointer-events:auto!important;}
 body.music-page-shell .music-playlist-artwork-actions .music-share-icon-button svg{width:17px!important;height:17px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;}
 body.music-page-shell .music-playlist-artwork-open{display:grid!important;place-items:center!important;width:36px!important;height:36px!important;border:1px solid #fff!important;border-radius:50%!important;background:#147cf4!important;color:white!important;box-shadow:0 4px 12px #102a4d66!important;pointer-events:auto!important;text-decoration:none!important;}
 body.music-page-shell .music-playlist-artwork-open svg{width:18px!important;height:18px!important;fill:currentColor!important;}
 body.music-page-shell .music-playlist-artwork-link{border-radius:12px!important;}
 body.music-page-shell .music-playlist-artwork-meta{padding:7px 1px 0!important;}
 body.music-page-shell .music-playlist-artwork-meta .music-playlist-artwork-title{font-weight:800!important;text-decoration:none!important;}
}


/* MOB14 — playlist cards playback controls + unified white share buttons */
body.music-page-shell .music-playlist-artwork-shell,
body.music-page-shell .music-playlist-artwork-link,
body.music-page-shell .music-album-artwork-link {
    border-radius: 16px !important;
}
body.music-page-shell .music-playlist-artwork-link,
body.music-page-shell .music-album-artwork-link {
    overflow: hidden !important;
}
body.music-page-shell .music-playlist-artwork-link.is-empty-playlist,
body.music-page-shell .music-playlist-artwork-fallback.is-empty-playlist {
    background: linear-gradient(135deg, #cfe6ff 0%, #78b2ff 38%, #e9f5ff 52%, #6fa9ff 72%, #d7ecff 100%) !important;
}
body.music-page-shell .music-playlist-artwork-fallback {
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(135deg, #edf3fb 0%, #d8e6f6 100%) !important;
    color: #147cf4 !important;
}
body.music-page-shell .music-playlist-artwork-fallback-icon {
    font-size: 2.2rem !important;
    line-height: 1 !important;
    filter: drop-shadow(0 4px 10px rgba(20, 124, 244, .18));
}
body.music-page-shell .music-playlist-artwork-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}
body.music-page-shell .music-playlist-artwork-open,
body.music-page-shell .music-album-hover-play {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    border-radius: 999px !important;
    background: #147cf4 !important;
    border: 1px solid rgba(255,255,255,.92) !important;
    color: #ffffff !important;
    box-shadow: 0 6px 16px rgba(16, 42, 77, .28) !important;
}
body.music-page-shell .music-playlist-artwork-open svg,
body.music-page-shell .music-album-hover-play svg {
    width: 18px !important;
    height: 18px !important;
    fill: currentColor !important;
    color: #ffffff !important;
}
body.music-page-shell .music-album-artwork-actions .music-share-icon-button,
body.music-page-shell .music-playlist-artwork-actions .music-share-icon-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #1a2d49 !important;
    border: 1px solid #d9e2ee !important;
    box-shadow: 0 6px 16px rgba(17, 45, 77, .18) !important;
}
body.music-page-shell .music-album-artwork-actions .music-share-icon-button:hover,
body.music-page-shell .music-playlist-artwork-actions .music-share-icon-button:hover {
    background: #f7fbff !important;
    color: #147cf4 !important;
}
body.music-page-shell .music-album-artwork-actions .music-share-icon-button svg,
body.music-page-shell .music-playlist-artwork-actions .music-share-icon-button svg {
    width: 17px !important;
    height: 17px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
}
body.music-page-shell .music-playlist-artwork-card.is-empty-playlist .music-playlist-artwork-actions {
    display: none !important;
}
body.music-page-shell .music-playlist-queue-source-trigger {
    display: none !important;
}
