/* Ma musique (site-nouveau/ma-musique.html, en/ma-musique.html). Se pose sur base.css sans le modifier.
   À plat : aucun arrondi sauf les formes rondes permises (.disque du logo, .vinyle du lecteur, rond de la case
   « rester connecté », disque du cœur, bouton lecture du lecteur plein écran). Les pochettes sont les seuls carrés.
   Un seul jaune : ambre #e8a93b ; en texte sur crème, l'encre sur un trait ou un fond ambre. */

/* --- États de la page --- */
.mm-attente #gate,.mm-attente #app{visibility:hidden}
body:not(.mm-connecte) .mm-menu-compte,body:not(.mm-connecte) .mm-menu-echeance{display:none}
[hidden]{display:none!important}
.mm-evite{position:absolute;left:var(--g);top:-60px;z-index:80;padding:10px 0;background:var(--creme);font-weight:600}
.mm-evite:focus{top:8px}

/* --- En-tête : disque + panier + menu --- */
.mm-entete nav{gap:0}
.mm-menu-btn{width:48px;height:48px;display:grid;place-items:center;margin-right:-8px}
.mm-menu-btn svg{width:30px;height:30px;fill:none;stroke:var(--encre);stroke-width:1.7}
.mm-menu-btn[aria-expanded=true] svg{stroke-width:2.2}
.mm-menu{position:absolute;left:0;right:0;top:118px;z-index:40;background:var(--creme);border-top:1.5px solid var(--encre);border-bottom:1.5px solid var(--encre);padding:6px var(--g) 18px;opacity:0;transform:translateY(-6px);transition:opacity .16s,transform .16s}
.mm-menu.open{opacity:1;transform:none}
.mm-menu nav{display:flex;flex-direction:column}
.mm-menu a,.mm-menu button{display:flex;align-items:center;min-height:46px;font-size:18px;text-decoration:none;text-align:left}
.mm-menu > nav > a:nth-child(-n+2){font-family:var(--titre);font-weight:900;font-size:32px;line-height:1}
.mm-menu-compte{display:flex;flex-direction:column;margin-top:6px;padding-top:6px;border-top:1px solid var(--filet)}
.mm-menu-echeance{margin:8px 0 0;font-size:15px;color:var(--encre-2)}
.mm-menu a:hover,.mm-menu button:hover{text-decoration:underline;text-underline-offset:4px}
@media (max-width:370px){.mm-menu{top:94px}}

/* --- Liens d'action : texte libre et signe, jamais de bouton encadré --- */
.mm-lien{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:600;font-size:16px;text-decoration:none;color:var(--encre);cursor:pointer}
.mm-fl{width:.8em;height:.8em;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;vertical-align:-.04em;transition:transform .2s}
.mm-lien .mm-fl{width:1em;height:1em}.mm-lien-gros .mm-fl{width:.8em;height:.8em;stroke-width:2.4}
.mm-lien:hover .mm-fl,.mm-porte-aide a:hover .mm-fl{transform:translateX(4px)}
.mm-lien:hover{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}
.mm-lien[disabled]{opacity:.35;cursor:not-allowed}
.mm-lien-gros{font-family:var(--titre);font-weight:900;font-size:30px;line-height:1;gap:10px}
.mm-discret{font-weight:400;color:var(--encre-2)}
.mm-lien.is-loading,.mm-lien[aria-busy=true]{opacity:.5;pointer-events:none}
.mm-acts{display:flex;flex-wrap:wrap;align-items:center;gap:0 18px;margin:4px 0 0}
.mm-acts-fin{display:inline-flex;align-items:center;flex-wrap:nowrap;gap:0 18px;white-space:nowrap}
.mm-ic{width:44px;height:44px;display:grid;place-items:center;flex-shrink:0;font-size:28px;line-height:1}
.mm-ic svg{width:26px;height:26px;fill:none;stroke:var(--encre);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mm-ic svg.plein{fill:var(--encre);stroke:none}
/* Réduire : chevron + mot, sans cadre ; aucun fond ni contour au toucher ou à la souris, soulignement fin au clavier. */
.mm-reduire{width:auto;min-width:44px;display:flex;align-items:center;gap:6px;padding:0 8px 0 0;font-size:16px;line-height:1;background:none;border:0;border-radius:0;box-shadow:none;-webkit-tap-highlight-color:transparent}
.mm-reduire:focus:not(:focus-visible){outline:none;box-shadow:none}
.mm-reduire:focus-visible{outline:none;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px}
.mm-np:focus{outline:none}
.mm-croix{font-size:30px;font-weight:300}

/* --- Typographie --- */
.mm-titre{font-size:clamp(64px,19vw,112px);line-height:.9;margin:0}
h1.aff.mm-titre{line-height:.9}
h2.aff.mm-titre{font-size:clamp(44px,11vw,96px);text-transform:none;line-height:.9}
.mm-h2{font-size:clamp(38px,11vw,56px);line-height:.95;margin:0 0 10px}
.mm-surtitre{margin:0 0 4px;font-size:14px;font-weight:600;letter-spacing:.02em}
.mm-meta{margin:2px 0 0;font-size:15px;color:var(--encre-2)}
.mm-petit{margin:6px 0 0;font-size:14px;color:var(--encre-2)}
.mm-nobr{white-space:nowrap}
.mm-nouveau{display:inline-block;margin-left:6px;font:600 12px/1 var(--texte);letter-spacing:.06em;text-transform:uppercase;color:var(--encre);border-bottom:1.5px solid var(--encre);padding-bottom:2px;vertical-align:middle}

/* --- Connexion --- */
.mm-porte{padding-top:22px;padding-bottom:48px}
.mm-porte-texte{margin:16px 0 0;font-size:17px;max-width:34em}
.mm-porte-form{display:flex;flex-direction:column;align-items:flex-start;margin-top:26px}
.mm-porte-form label[for=gateEmail]{font-size:15px;color:var(--encre-2)}
.mm-porte-form input[type=email]{width:100%;height:50px;border:0;border-bottom:1.5px solid var(--encre);border-radius:0;background:transparent;padding:0;font-size:18px;outline:none}
.mm-porte-form input[type=email]:focus{border-bottom-width:2.5px}
.mm-porte-form input::placeholder{color:var(--encre-3)}
.mm-porte-form .mm-lien-gros{margin-top:16px}
.mm-rond{display:flex;align-items:flex-start;gap:12px;margin-top:10px;font-size:15px;line-height:1.35;cursor:pointer}
.mm-rond input{appearance:none;-webkit-appearance:none;flex:0 0 24px;width:24px;height:24px;margin:0;border:1.5px solid var(--encre);border-radius:0;background:transparent;display:grid;place-items:center;cursor:pointer}
.mm-rond input:checked{background:var(--encre)}
.mm-rond input:checked::after{content:"";width:9px;height:5px;border-left:2px solid var(--creme);border-bottom:2px solid var(--creme);transform:rotate(-45deg) translate(1px,-1px)}
.mm-rond small{font-size:14px;color:var(--encre-2)}
.mm-porte-msg{margin:14px 0 0;font-size:16px;min-height:1.4em}
.mm-porte-msg.err{font-weight:600}
.mm-porte-msg a{font-weight:600;text-underline-offset:4px}
.mm-porte-actions{display:flex;flex-direction:column;align-items:flex-start}
.mm-porte-aide{margin-top:36px;padding-top:14px;border-top:1px solid var(--filet);font-size:15px}
.mm-porte-aide p{margin:6px 0}
.mm-porte-aide a{font-weight:600;text-underline-offset:4px}
#gate.is-working .mm-porte-texte::after{content:"";display:block;width:100%;height:2px;margin-top:18px;background:linear-gradient(90deg,var(--encre) 0 30%,transparent 30%) 0 0/200% 100% no-repeat;animation:mm-defile 1.1s linear infinite}

/* --- Espace connecté --- */
.mm-app{padding-bottom:30px}
.mm-tete{padding-top:10px}
.mm-echeance{margin:8px 0 0;font-size:15px;color:var(--encre-2)}
.mm-echeance b{font-weight:600;color:var(--encre)}
.mm-section{margin-top:40px}
.mm-actions{display:flex;flex-direction:column;align-items:flex-start;margin-top:22px}
.mm-actions small{margin:-4px 0 10px;font-size:14px;color:var(--encre-2)}
.mm-actions .mm-lien[disabled]{opacity:.35}

/* Bandeaux (fin du Pass, ex-Pass, avis, annonce, lien expiré) : filet dessus et dessous, aucune boîte */
.mm-bandeaux:empty{display:none}
.mm-bandeau{position:relative;padding:14px 0 10px;border-top:1.5px solid var(--encre);border-bottom:1.5px solid var(--encre);margin-top:14px}
.mm-bandeau + .mm-bandeau{margin-top:-1.5px}
.mm-bandeau-t{margin:0;font-size:17px;line-height:1.3;padding-right:36px}
.mm-bandeau-gros{display:block;font-size:clamp(34px,10vw,48px);line-height:.95}
.mm-bandeau-c{margin:6px 0 0;font-size:15px;line-height:1.45}
.mm-bandeau-a{margin:4px 0 0;display:flex;flex-wrap:wrap;gap:0 18px}
.mm-bandeau .mm-croix,.mm-bandeau .mm-fermer-bandeau{position:absolute;top:4px;right:-10px}
.mm-bandeau .mm-fermer-bandeau{position:static}
.mm-annonce{border-top:0;padding-top:8px;margin-top:0}
.mm-annonce .mm-bandeau-t{font-size:15px}
.mm-section > .mm-bandeau,.mm-app > .mm-bandeau{margin-inline:var(--g)}

/* Reprendre l'écoute */
.mm-reprise{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:start;margin-top:26px}
.mm-reprise-poch{position:relative;width:96px}
.mm-reprise h2{font-size:34px;line-height:.95;margin:0}
.mm-reprise-prog{height:2px;margin-top:10px;background:rgba(30,18,32,.16)}
.mm-reprise-prog i{display:block;height:2px;background:var(--encre)}
.mm-reprise .mm-lien-gros{font-size:24px}

/* La Collection pour toi, avantage −40 % */
.mm-pourtoi{margin-top:26px}
.mm-pourtoi-ligne{margin:0;font-size:17px;line-height:1.45}
.mm-pourtoi-ligne .mm-lien{min-height:0;display:inline;font-size:17px}
.mm-remise{margin:14px 0 0;font-size:clamp(30px,8.6vw,44px);line-height:1}

/* Pochettes : seuls carrés de la page */
.mm-poch{position:relative;display:block;width:100%;aspect-ratio:1;overflow:hidden;background:var(--encre);outline:1px solid var(--filet);outline-offset:-1px}
.mm-poch img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mm-gen{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:9%;color:var(--creme);font-family:var(--titre);font-weight:900;line-height:.95;font-size:clamp(14px,4.4vw,24px);text-align:left}
.mm-gen b{font:600 10px/1 var(--texte);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px;opacity:.8}
.has-img .mm-gen{visibility:hidden}
.mm-signe{position:absolute;right:8px;bottom:8px;width:38px;height:38px;display:grid;place-items:center;background:none;color:#fff;filter:drop-shadow(0 1px 5px rgba(0,0,0,.75));font-size:18px;opacity:0;transform:scale(.9);transition:opacity .18s,transform .18s}
button:hover > .mm-signe,button:focus-visible > .mm-signe{opacity:1;transform:none}

/* Dernière sortie */
.mm-heros{margin-top:36px}
.mm-heros-poch{position:relative;display:block;width:min(100%,360px);margin-top:6px}
.mm-heros-poch .mm-signe{width:54px;height:54px;font-size:20px;opacity:1;transform:none}
.mm-heros-titre{margin:14px 0 0;font-size:clamp(48px,14vw,72px);line-height:.92}

/* Rails horizontaux */
.mm-rail{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding-inline:var(--g);scroll-padding-inline:var(--g)}
.mm-rail::-webkit-scrollbar{display:none}
.mm-rail-liste{list-style:none;margin:0;padding:0;display:flex;gap:16px;width:max-content}
.mm-carte{position:relative;width:148px;scroll-snap-align:start}
.mm-carte-poch{position:relative;display:block;width:148px}
.mm-carte-t{display:block;margin-top:8px;font-family:var(--titre);font-weight:900;font-size:22px;line-height:.95;padding-right:40px}
.mm-carte-s{display:block;margin-top:3px;font-size:13px;color:var(--encre-2)}
.mm-carte-plus{position:absolute;right:-6px;top:150px;width:40px;height:40px;font-size:26px;line-height:1}
.mm-carte-t:hover{text-decoration:underline;text-underline-offset:4px}

/* Bibliothèque : outils */
.mm-outils{display:flex;flex-direction:column;gap:8px}
.mm-recherche{position:relative}
.mm-recherche svg{position:absolute;left:0;top:13px;width:22px;height:22px;fill:none;stroke:var(--encre);stroke-width:1.7}
.mm-recherche input{width:100%;height:50px;padding:0 0 0 32px;border:0;border-bottom:1.5px solid var(--encre);border-radius:0;background:transparent;font-size:18px;outline:none;-webkit-appearance:none;appearance:none}
.mm-recherche input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;width:22px;height:22px;margin:0;cursor:pointer;background:no-repeat center/16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231e1220' stroke-width='2'%3E%3Cpath d='M5 5l14 14M19 5L5 19'/%3E%3C/svg%3E")}
.mm-recherche input:focus{border-bottom-width:2.5px}
.mm-recherche input::placeholder{color:var(--encre-3)}
@media (max-width:420px){.mm-recherche input::placeholder{font-size:15px}}
.mm-vues{display:flex;flex-wrap:wrap;gap:0 18px;margin-inline:calc(-1 * var(--g));padding-inline:var(--g)}
.mm-vues button{flex-shrink:0;min-height:44px;font-size:16px;font-weight:500;color:var(--encre-2);border-bottom:2px solid transparent}
.mm-vues button.active{color:var(--encre);font-weight:600;border-bottom-color:var(--encre)}
.mm-vues button:hover{color:var(--encre)}
.mm-humeurs{display:flex;flex-wrap:wrap;gap:0 16px}
.mm-humeurs[hidden]{display:none}
.mm-humeurs button{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:16px;font-weight:500;color:var(--encre-2);border-bottom:2px solid transparent}
.mm-humeurs button.active{color:var(--encre);font-weight:600;border-bottom-color:var(--encre)}
.mm-humeurs button:hover{color:var(--encre)}
.mm-ry-ic{width:18px;height:18px;flex:none}
.mm-signe svg{width:100%;height:100%;fill:currentColor;display:block;padding:25%;box-sizing:border-box}
.mm-pl{display:inline-flex;width:.8em;height:.8em;vertical-align:-.05em}.mm-pl svg{width:100%;height:100%;fill:currentColor}
.mm-tri{display:inline-flex;align-items:center;gap:8px;font-size:15px;color:var(--encre-2)}
.mm-tri select{height:40px;border:0;border-bottom:1.5px solid var(--encre);border-radius:0;background:transparent;font:inherit;font-size:16px;color:var(--encre);padding:0 2px}
.mm-statut{margin:6px 0 0;font-size:14px;color:var(--encre-2);min-height:1em}

/* Listes à plat : pochette + texte */
.mm-liste{list-style:none;margin:8px 0 0;padding:0 var(--g)}
.mm-ligne{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:start;padding-block:12px}
.mm-ligne-poch{position:relative;display:block;width:96px}
.mm-ligne-txt{min-width:0}
.mm-ligne-txt h3{margin:0;font-size:30px;line-height:.95}
.mm-ligne-txt h3 button{text-align:left}
.mm-ligne-txt h3 button:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.mm-ligne .mm-acts{margin-top:2px}
.mm-ligne.trk.playing h3{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.mm-coeur-disque{display:grid;place-items:center;width:96px;height:96px;background:none;color:var(--encre);font-size:56px}
.mm-vide{margin:14px 0 0;font-size:16px}
.mm-squelette .mm-poch{background:rgba(30,18,32,.08);outline:0;animation:mm-pouls 1.2s ease-in-out infinite}
.mm-squelette i{display:block;height:20px;width:70%;margin-top:8px;background:rgba(30,18,32,.08);animation:mm-pouls 1.2s ease-in-out infinite}
.mm-squelette i + i{width:45%;height:14px}
.mm-resultats section{margin-top:18px}
.mm-resultats .mm-surtitre{margin-bottom:0}
.mm-vide-recherche{margin-top:18px}
.mm-vide-recherche p{font-size:16px}

/* Lignes de titres (fiche, coups de cœur, recherche) */
.mm-pistes{list-style:none;margin:6px 0 0;padding:0}
.mm-piste{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:6px;min-height:56px;border-top:1px solid var(--filet)}
.mm-piste:last-child{border-bottom:1px solid var(--filet)}
.trk-play{position:relative;width:40px;height:44px;display:grid;place-items:center}
.trk-play .mm-num{font-size:15px;color:var(--encre-2);font-variant-numeric:tabular-nums}
.trk-play svg{display:none;width:20px;height:20px;fill:var(--encre)}
.mm-piste:hover .trk-play .mm-num,.mm-piste.playing .trk-play .mm-num,.trk-play:focus-visible .mm-num{display:none}
.mm-piste:hover .trk-play svg,.mm-piste.playing .trk-play svg,.trk-play:focus-visible svg{display:block}
.trk-play.is-loading svg{animation:mm-pouls .9s ease-in-out infinite}
.trk-main{display:flex;flex-direction:column;min-width:0;min-height:48px;justify-content:center}
.trk-t{font-weight:600;font-size:16px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trk-s{font-size:13px;color:var(--encre-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm-piste.playing .trk-t{text-decoration:underline;text-underline-offset:4px}
.trk-acts{display:flex;align-items:center}
.trk-acts .mm-lien{min-width:40px;justify-content:center;font-size:18px}
.trk-acts .mm-lien[data-buy]{font-size:15px}
.trk-fav{color:var(--encre-3);font-size:20px}
.trk-fav,.trk-fav:hover,.trk-fav:focus,.trk-fav:active{text-decoration:none}
.trk-fav span{opacity:.45}
.trk-fav.on span,.fav-toggle.on .mm-coeur{opacity:1;color:var(--encre)}
.fav-toggle .mm-coeur{opacity:.45}

/* Invitations : avis, parrainage */
.mm-invit{margin-top:48px}
.mm-invit p{font-size:16px;line-height:1.5;margin:8px 0 0}
.mm-par-lien a{font-size:17px;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px;word-break:break-all}
.mm-par-acts{display:flex;flex-wrap:wrap;align-items:center;gap:0 18px}

/* --- Voiles, fiche, lecteur plein écran --- */
.mm-voile{position:fixed;inset:0;z-index:43;background:rgba(30,18,32,.35);opacity:0;pointer-events:none;transition:opacity .25s}
.mm-voile.show{opacity:1;pointer-events:auto}
.mm-voile-haut{z-index:47}
.mm-fiche{position:fixed;left:0;right:0;bottom:0;top:6vh;z-index:44;max-width:560px;margin:0 auto;background:var(--creme);border-top:1.5px solid var(--encre);overflow-y:auto;overscroll-behavior:contain;padding:0 var(--g) calc(24px + var(--bandeau) + env(safe-area-inset-bottom,0px));transform:translateY(105%);visibility:hidden;transition:transform .38s cubic-bezier(.2,.8,.2,1),visibility 0s .38s}
.mm-fiche.show{transform:none;visibility:visible;transition:transform .38s cubic-bezier(.2,.8,.2,1)}
.mm-fiche-haut{position:sticky;top:0;z-index:2;display:flex;justify-content:center;background:var(--creme);padding-top:4px}
.mm-fiche-tete{display:grid;grid-template-columns:132px 1fr;gap:16px;align-items:end;margin-top:4px}
.mm-fiche-titre{font-size:clamp(38px,11vw,56px);line-height:.92;margin:0}
.mm-fiche-acts{display:flex;flex-wrap:wrap;align-items:center;gap:0 18px;margin:14px 0 6px}

.mm-np{position:fixed;inset:0;z-index:46;background:var(--creme);display:flex;flex-direction:column;padding:calc(6px + env(safe-area-inset-top,0px)) var(--g) calc(18px + env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior:contain;transform:translateY(105%);visibility:hidden;transition:transform .4s cubic-bezier(.2,.8,.2,1),visibility 0s .4s}
.mm-np.show{transform:none;visibility:visible;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.mm-np > *{width:100%;max-width:520px;margin-inline:auto}
.mm-np-haut{display:flex;align-items:center;justify-content:space-between;min-height:52px}
.mm-np-haut .mm-surtitre{margin:0}
.mm-np{overflow-x:hidden}
.mm-np > .mm-np-art{position:relative;width:min(100%,46vh,400px);margin:10px auto 0;aspect-ratio:1;translate:-7% 0}
@media (max-width:600px){.mm-np > .mm-np-art{width:min(84%,46vh,400px);margin-left:0;translate:0 0}}
.mm-np-poch{position:relative;z-index:1;transform-origin:0 0}
/* Morph de la pochette : le plein écran ne glisse plus, il fond (.25 s) ; la pochette est animée en JS (ma-musique.js, FLIP). */
.mm-np.morph{transform:none;opacity:0;transition:transform .4s cubic-bezier(.2,.8,.2,1),opacity .25s linear,visibility 0s .4s}
.mm-np.morph.show{opacity:1;transition:transform .4s cubic-bezier(.2,.8,.2,1),opacity .25s linear,visibility 0s}
.vinyle{position:absolute;top:4%;bottom:4%;left:8%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,var(--ambre) 0 15%,#1e1220 15.5% 17%,#2b1c2d 17.5%,#1e1220 30%,#2b1c2d 31%,#1e1220 44%,#2b1c2d 45%,#1e1220 58%,#2b1c2d 59%,#120a13 71%);transition:translate .6s cubic-bezier(.2,.8,.2,1)}
.vinyle::after{content:"";position:absolute;inset:48.5%;border-radius:50%;background:var(--creme)}
.mm-np.playing .vinyle{translate:16% 0}
.vinyle.tourne{animation:mm-tourne 3.2s linear infinite}
.mm-np-meta{margin-top:26px;position:relative;z-index:2}
.mm-np-titre{font-size:clamp(40px,12vw,64px);line-height:.92;margin:0;overflow-wrap:anywhere}
.mm-np-temps{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-top:18px;font-size:13px;font-variant-numeric:tabular-nums;color:var(--encre-2)}
.mm-seek{position:relative;height:28px;cursor:pointer;touch-action:none}
/* Plein écran : le geste « tirer vers le bas pour fermer » (dragSheet) n'est plus annulé par le défilement du navigateur (pointercancel) */
#npTop,#npArt,#npMeta{touch-action:none}
.mm-seek::before{content:"";position:absolute;left:0;right:0;top:13px;height:2px;background:rgba(30,18,32,.16)}
.mm-seek i{position:absolute;left:0;top:13px;height:2px;background:var(--encre);width:0}
.mm-seek i::after{content:"";position:absolute;right:-1px;top:-6px;width:3px;height:14px;border-radius:0;background:var(--encre)}
.mm-np-cmd{display:flex;align-items:center;justify-content:space-between;margin-top:12px}
.mm-pp{width:76px;height:76px;display:grid;place-items:center;background:none;transition:transform .15s}
.mm-pp:active{transform:scale(.96)}
.mm-pp svg{width:56px;height:56px;fill:var(--encre)}
.mm-pp.is-loading svg{animation:mm-pouls .9s ease-in-out infinite}
.mm-bascule{position:relative;opacity:.45}
.mm-bascule.on{opacity:1}
.mm-bascule .mm-un{position:absolute;right:4px;top:5px;font:700 10px/1 var(--texte);display:none}
.mm-bascule.un .mm-un{display:block}
.mm-np-extra{display:flex;flex-wrap:wrap;gap:0 18px;margin:14px 0 0}
.mm-np-file{position:absolute;left:0;right:0;bottom:0;max-height:72%;z-index:6;overflow-y:auto;background:var(--creme);border-top:1.5px solid var(--encre);padding:0 var(--g) calc(16px + env(safe-area-inset-bottom,0px));transform:translateY(100%);transition:transform .3s cubic-bezier(.2,.8,.2,1);max-width:none}
.mm-np-file.show{transform:none}
.mm-np-file-haut{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;background:var(--creme);padding-top:8px}
.mm-np-file-haut h3{font-size:32px;margin:0}
.mm-file{list-style:none;margin:0;padding:0}
.mm-file li{display:grid;grid-template-columns:1fr 44px;align-items:center;border-top:1px solid var(--filet)}
.mm-file-saut{display:flex;align-items:center;gap:12px;min-height:50px;text-align:left}
.mm-file-saut .mm-num{width:26px;font-size:14px;color:var(--encre-2);font-variant-numeric:tabular-nums}
.mm-file li.cur .mm-file-t{font-weight:600;text-decoration:underline;text-underline-offset:4px}

/* Barre du bas : bandeau de base.css, branché sur Ma musique */
.mm-lecteur .bandeau{gap:4px}
@media (max-width:899px){.mm-lecteur .bandeau{gap:2px}.mm-lecteur .bandeau .ic{width:36px}.mm-lecteur .bandeau .ic svg{width:22px;height:22px}}
.mm-mini-ouvrir{flex:1 1 auto;min-width:0;height:100%;display:flex;align-items:center;gap:12px;text-align:left}
.mm-mini-poch{flex:0 0 var(--bandeau);width:var(--bandeau);height:var(--bandeau)}
.mm-mini-poch .mm-poch{height:100%}
.mm-mini-poch .mm-gen{font-size:11px;padding:6px}
.mm-mini-poch .mm-gen b{display:none}
.mm-mini-ouvrir .infos{display:block;flex:1 1 auto;min-width:0}
.mm-mini-ouvrir .t,.mm-mini-ouvrir .s{display:block}
.mm-lecteur .ic.is-loading svg{animation:mm-pouls .9s ease-in-out infinite}

/* Ajouter à une playlist */
.mm-ajout{position:fixed;z-index:48;width:260px;max-height:340px;overflow-y:auto;background:var(--creme);border:1.5px solid var(--encre);padding:6px 16px 10px;opacity:0;transform:translateY(6px);transition:opacity .18s,transform .18s}
.mm-ajout.open{opacity:1;transform:none}
.mm-ajout h3{margin:4px 0 2px;font-size:28px}
.mm-ajout ul{list-style:none;margin:0;padding:0}
.mm-ajout li button{display:flex;align-items:center;width:100%;min-height:48px;font-size:17px;border-top:1px solid var(--filet);text-align:left}
.mm-ajout li button:hover{text-decoration:underline;text-underline-offset:4px}
.mm-ajout.as-sheet{left:0;right:0;bottom:0;top:auto;width:auto;max-width:560px;margin:0 auto;max-height:70vh;border:0;border-top:1.5px solid var(--encre);padding:8px var(--g) calc(18px + env(safe-area-inset-bottom,0px));transform:translateY(100%)}
.mm-ajout.as-sheet.open{transform:none}

/* Panneaux (avis, aide, accueil, saisie, confirmation, ZIP) : feuille par le bas, à plat */
.mm-dialogue{position:fixed;left:0;right:0;bottom:0;z-index:49;max-width:560px;max-height:92vh;margin:0 auto;overflow-y:auto;overscroll-behavior:contain;background:var(--creme);border-top:1.5px solid var(--encre);padding:12px var(--g) calc(22px + env(safe-area-inset-bottom,0px));transform:translateY(105%);visibility:hidden;transition:transform .32s cubic-bezier(.2,.8,.2,1),visibility 0s .32s}
.mm-dialogue.show{transform:none;visibility:visible;transition:transform .32s cubic-bezier(.2,.8,.2,1)}
.mm-dialogue p{font-size:16px;line-height:1.5}
.mm-dialogue-haut{display:flex;justify-content:flex-end;margin:-6px -10px 0 0}
.mm-ov-titre{font-size:clamp(40px,12vw,60px);line-height:.92;margin:6px 0 10px}
.mm-ov-msg{font-size:18px!important;margin-top:14px}
.mm-ov-liste{padding-left:18px;margin:0}
.mm-ov-liste li{margin:8px 0;font-size:16px;line-height:1.45}
.mm-ov-repere{list-style:none;padding:0;margin:8px 0 0}
.mm-ov-repere li{display:grid;grid-template-columns:34px 1fr;gap:10px;padding-block:10px;border-top:1px solid var(--filet);font-size:15px;line-height:1.45}
.mm-ov-signe{font-family:var(--titre);font-weight:900;font-size:26px;line-height:1}
.mm-champ{display:block;margin-top:14px}
.mm-champ span{display:block;font-size:15px;color:var(--encre-2)}
.mm-champ input,.mm-champ textarea{font:inherit;font-size:17px;color:inherit;display:block;width:100%;border:0;border-bottom:1.5px solid var(--encre);border-radius:0;background:transparent;padding:6px 0;font-size:17px;outline:none;resize:vertical}
.mm-champ input{height:46px}
.mm-champ input:focus,.mm-champ textarea:focus{border-bottom-width:2.5px}
.rev-stars{display:flex;gap:4px;margin:10px 0 4px}
.rev-star{font-size:42px;line-height:1;width:48px;height:52px;color:var(--encre-3);opacity:.5;transition:transform .12s,color .12s}
.rev-star.on{color:var(--or);opacity:1}
.rev-star:hover{transform:translateY(-2px)}
.rev-chips{list-style:none;margin:6px 0 0;padding:0}
.rev-chip{font-weight:400;font-size:15px;min-height:38px;text-align:left}
.rev-chip.on{font-weight:600;text-decoration:underline;text-underline-offset:4px}
.rev-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.mm-zip-sortie{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:end;margin:8px 0 6px}
.mm-zip-nom{font-size:34px;line-height:.95;margin:0}
.mm-zip-ligne{position:relative;height:2px;margin:14px 0 4px;background:rgba(30,18,32,.16);overflow:hidden}
.mm-zip-ligne i{position:absolute;top:0;bottom:0;left:-40%;width:40%;background:var(--encre);animation:mm-glisse 1.2s ease-in-out infinite}
.mm-ov-zip.pret .mm-zip-ligne i{left:0;width:100%;animation:none}

/* Message bref : filet au-dessus du lecteur, texte encre */
.mm-toast{position:fixed;left:0;right:0;bottom:calc(var(--bandeau) + env(safe-area-inset-bottom,0px) + 8px);z-index:55;max-width:560px;margin:0 auto;padding:10px var(--g);background:var(--creme);border-top:1.5px solid var(--encre);border-bottom:1px solid var(--filet);font-size:15px;line-height:1.4;display:flex;flex-wrap:wrap;align-items:center;gap:0 14px;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .2s,transform .2s}
.mm-toast.show{opacity:1;transform:none;pointer-events:auto}
html:not(.joue) .mm-toast{bottom:calc(14px + env(safe-area-inset-bottom,0px))}

@keyframes mm-tourne{to{rotate:360deg}}
@keyframes mm-pouls{50%{opacity:.4}}
@keyframes mm-glisse{to{left:100%}}
@keyframes mm-defile{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.vinyle.tourne{animation:none}.mm-np.playing .vinyle{translate:16% 0}}

/* Raccourcis d'accueil et commandes de la barre réservées à l'ordinateur */
.mm-raccourcis{display:flex;flex-wrap:wrap;gap:0 18px;margin-top:4px}
.mm-raccourcis .mm-lien{font-weight:500;color:var(--encre-2)}
.mm-mini-plus{display:none}
.mm-mini-plus .mm-coeur{font-size:22px;opacity:.45}
.mm-mini-plus svg.trait{fill:none;stroke:var(--encre);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media (min-width:900px){.mm-mini-plus{display:grid}}
.mm-lecteur .bandeau .mm-mini-plus{display:none}
@media (min-width:900px){.mm-lecteur .bandeau .mm-mini-plus{display:grid}}
/* Barre prune (≥ 900 px) : cœur et téléchargement en crème, sinon invisibles (la règle plus haut les passe en encre) */
@media (min-width:900px){.mm-lecteur .mm-mini-plus svg.trait{stroke:var(--creme)}.mm-lecteur .mm-mini-plus .mm-coeur,.mm-lecteur .fav-toggle.on .mm-coeur{color:var(--creme)}}
@media (max-width:899px){#gatePoch{display:none}}

/* ===================== Ordinateur (≥ 900 px) : Ma musique =====================
   Même grille que le site (12 colonnes, médiane = début de la colonne 7). Le téléphone ne change pas. */
.mm-menu-txt{display:none}
@media (min-width:900px){
  html.joue{--reserve:var(--bandeau)}
  .mm-entete .mm-menu-btn{width:auto;gap:8px;padding-inline:8px;margin-right:-8px;display:inline-flex;align-items:center}
  .mm-menu-btn svg{width:24px;height:24px}
  .mm-menu-txt{display:inline;font-weight:500;font-size:16px}
  .mm-entete nav .sac{margin-left:0}
  .mm-menu{left:auto;right:max(var(--g),calc((100% - var(--contenu))/2));top:calc(var(--entete-pad)*2 + var(--disque) - 1px);width:360px;padding-inline:0;border:1.5px solid var(--encre);border-top:0}
  .mm-menu > nav > a:nth-child(-n+2){display:none}
  .mm-menu > nav > *{padding-inline:20px}

  /* Connexion : « Ma musique » + 3 dernières sorties à gauche, texte et formulaire sur la médiane */
  .mm-porte{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(10,auto) minmax(0,1fr);column-gap:var(--gout);align-items:start;padding-top:var(--r5);padding-bottom:var(--r6)}
  .mm-porte>*{grid-column:7/13;min-width:0}
  .mm-porte>.mm-porte-tete{grid-column:1/6;grid-row:1/-1}
  .mm-porte>.mm-porte-tete+*{margin-top:0}
  .mm-porte-tete .pochettes{margin-top:var(--r4)}
  .mm-porte-form{max-width:480px}
  .mm-porte-form input[type=email]{width:100%}
  .mm-titre{font-size:var(--t-h1);line-height:.92}
  h1.aff.mm-titre{line-height:.92}
  h2.aff.mm-titre{font-size:var(--t-h1);line-height:.92;letter-spacing:-.025em}
  .mm-h2{font-size:var(--t-h2)}

  /* Espace connecté : grille sur les sections existantes */
  .mm-app{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto auto auto auto minmax(0,1fr) auto auto auto auto;column-gap:var(--gout);align-items:start;padding-bottom:0}
  .mm-app>*{grid-column:1/13;min-width:0}
  #mmBandeaux{grid-row:1}
  .mm-tete{grid-column:1/7;grid-row:2;padding-top:var(--r5)}
  .mm-actions{grid-column:7/13;grid-row:2;align-self:end;margin-top:0}
  #heroLatest{grid-column:1/7;grid-row:3/6;margin-top:var(--r5)}
  #continueListening{grid-column:7/13;grid-row:3;margin-top:var(--r5)}
  #mmPourToi{grid-column:7/13;grid-row:4}
  #mmNouv{grid-row:6} #recentSec{grid-row:7} #mmBiblio{grid-row:8}
  #mmAvis{grid-column:1/7;grid-row:9} #mmParrain{grid-column:7/13;grid-row:9}
  #mmAvis[hidden]+#mmParrain{grid-column:1/7}
  .mm-section{margin-top:var(--r6)}
  .mm-invit{margin-top:var(--r6)}
  .mm-section>.mm-bandeau,.mm-app>.mm-bandeau,.mm-bandeaux .mm-bandeau{margin-inline:0}
  .mm-heros-poch{width:min(100%,440px)}
  .mm-heros-titre{font-size:clamp(56px,5.6vw,88px)}
  /* Dernière sortie : pochette à gauche, titre et actions sur la médiane (plus de vide à côté) */
  #continueListening{grid-row:3}
  #mmPourToi{grid-row:4}
  #heroLatest{grid-column:1/13;grid-row:5;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto 1fr auto auto auto;column-gap:var(--gout)}
  #heroLatest>.mm-surtitre{grid-column:1/13;grid-row:1}
  #heroLatest>.mm-heros-poch{grid-column:1/7;grid-row:2/6;margin-top:6px}
  #heroLatest>.mm-heros-titre{grid-column:7/13;grid-row:3;align-self:end;margin-top:0}
  #heroLatest>.mm-meta{grid-column:7/13;grid-row:4}
  #heroLatest>.mm-acts{grid-column:7/13;grid-row:5}
  .gouttiere.mm-bandeaux,.mm-app .gouttiere{padding-inline:0}
  /* Rails : grille de 6, plus de défilement horizontal à la souris */
  .mm-rail{overflow:visible;padding-inline:0;scroll-padding-inline:0}
  .mm-rail-liste{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--r4) var(--gout);width:auto}
  .mm-carte,.mm-carte-poch{width:100%}
  .mm-carte{container-type:inline-size}
  .mm-carte-plus{top:calc(100cqw + 2px)}
  /* Bibliothèque : onglets à gauche, recherche sur la médiane */
  .mm-outils{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gout);align-items:end}
  .mm-vues{grid-column:1/7;grid-row:1;margin-inline:0;padding-inline:0}
  .mm-recherche{grid-column:7/13;grid-row:1}
  .mm-humeurs{grid-column:1/7;grid-row:2}
  .mm-tri{grid-column:7/13;grid-row:2;justify-self:end}
  .mm-liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gout);padding:0}
  .mm-liste-hote .mm-pistes{columns:2;column-gap:var(--gout)}
  .mm-piste{break-inside:avoid}
  .mm-ligne{grid-template-columns:var(--poch-liste) 1fr;padding-block:var(--r2)}
  .mm-ligne-poch{width:var(--poch-liste)}
  .mm-reprise{grid-template-columns:var(--poch-liste) 1fr}
  .mm-reprise-poch{width:var(--poch-liste)}
  .mm-gen{font-size:clamp(14px,1.6vw,24px)}

  /* Barre du bas : la pochette d'une rangée reste carrée */
  .mm-toast{max-width:var(--tiroir);margin:0 max(var(--g),calc((100% - var(--contenu))/2)) 0 auto;bottom:calc(var(--reserve,0px) + 8px)}
  html:not(.joue) .mm-toast{bottom:calc(14px + env(safe-area-inset-bottom,0px))}

  /* Tiroirs : une seule forme, bord droit, filet gauche ; au-dessus du lecteur, jamais dessous */
  .mm-fiche,.mm-dialogue{left:auto;right:0;top:0;bottom:var(--reserve,0px);width:var(--tiroir);max-width:none;max-height:none;margin:0;border-top:0;border-left:1.5px solid var(--encre);padding:0 40px 32px;transform:translateX(105%)}
  .mm-fiche.show,.mm-dialogue.show{transform:none}
  .mm-np>.mm-np-file{grid-column:auto;grid-row:auto}
  .mm-np-file{left:auto;top:0;width:var(--tiroir);max-height:none;border-top:0;border-left:1.5px solid var(--encre);transform:translateX(100%)}
  .mm-np-file.show{transform:none}

  /* Lecteur plein écran : pochette à gauche, informations et commandes sur la médiane */
  .mm-np{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto 1fr auto auto auto auto 1fr;column-gap:var(--gout);padding:var(--r3) max(var(--g),calc((100% - var(--contenu))/2)) var(--r4)}
  .mm-np>*{grid-column:7/13;max-width:none;margin-inline:0}
  .mm-np>.mm-np-haut{grid-column:1/13;grid-row:1}
  .mm-np>.mm-np-art{grid-column:1/6;grid-row:2/8;align-self:center;width:min(100%,62vh);translate:none;margin:0}
  .mm-np-meta{grid-row:3;margin-top:0} .mm-np-temps{grid-row:4} .mm-np-cmd{grid-row:5;justify-content:flex-start;gap:var(--r3)} .mm-np-extra{grid-row:6}
}

/* Téléphone : « Musique · La Collection » restent dans l'en-tête comme sur les autres pages ; le disque se réduit pour laisser la place au sac et au menu. */
@media (max-width:899px){
  .mm-entete{gap:4px}
  .mm-entete nav{gap:0}
  .mm-entete nav a{padding-inline:6px;font-size:15px}
  .mm-entete .sac{width:40px}
  .mm-menu-btn{width:40px;margin-right:-6px}
}
@media (max-width:400px){
  .mm-entete nav a{padding-inline:4px;font-size:14.5px}
}
@media (max-width:340px){
  .mm-entete nav a{padding-inline:3px;font-size:14px}
  .mm-entete .sac,.mm-menu-btn{width:36px}
  .mm-entete{gap:2px}
}

/* ===== Barre réduite du lecteur, téléphone (< 900 px) : maquette S2 =====
   Disque (pochette tout autour, macaron noir au centre = lecture/pause) qui dépasse au-dessus de la barre, anneau de progression ambre (--p posé par ma-musique.js), titre centré dessous, ⏮ à gauche et ⏭ à droite. À plat. */
@media (max-width:899px){
  html.joue{--bandeau:120px}
  .mm-lecteur .bandeau{display:block;position:relative;max-width:none;padding:0 0 env(safe-area-inset-bottom,0px);gap:0}
  .mm-lecteur .bandeau .prog{top:0}
  .mm-lecteur .bandeau .prog .rempli{display:none}
  .mm-lecteur .mm-mini-ouvrir{display:flex;flex-direction:column;align-items:center;gap:0;width:100%;height:calc(var(--bandeau) - 1px);padding:0 56px;text-align:center}
  .mm-lecteur .mm-mini-poch{flex:none;position:relative;width:96px;height:96px;margin-top:-34px;border-radius:50%;padding:5px;background:conic-gradient(var(--ambre) var(--p,0%),var(--filet) 0)}
  .mm-lecteur .mm-mini-poch .mm-poch{width:100%;height:100%;aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--encre)}
  .mm-lecteur .mm-mini-poch .mm-poch img{width:100%;height:100%;object-fit:cover}
  .mm-lecteur .mm-mini-poch.tourne .mm-poch{animation:mm-tourne 3.2s linear infinite}
  .mm-lecteur .mm-mini-ouvrir .infos{flex:none;width:100%;margin-top:6px}
  .mm-lecteur .mm-mini-ouvrir .t{font-size:24px;line-height:1.05;text-transform:uppercase;text-align:center}
  .mm-lecteur .mm-mini-ouvrir .s{font-size:13px;margin-top:1px;text-align:center}
  .mm-lecteur .b-centre,.mm-lecteur .b-droite{display:contents}
  .mm-lecteur .bandeau .ic{position:absolute;width:44px;height:44px}
  .mm-lecteur .bandeau .ic svg{width:26px;height:26px}
  .mm-lecteur .bandeau .mm-mini-prec{left:6px;bottom:calc(env(safe-area-inset-bottom,0px) + 8px)}
  .mm-lecteur .bandeau .js-next{right:6px;bottom:calc(env(safe-area-inset-bottom,0px) + 8px)}
  /* Lecture/pause : le macaron noir, au centre du disque */
  .mm-lecteur .bandeau .js-pp{left:50%;top:-34px;margin:26px 0 0 -22px;width:44px;height:44px;border-radius:50%;background:var(--encre);outline:3px solid var(--creme);outline-offset:-3px}
  .mm-lecteur .bandeau .js-pp svg{width:22px;height:22px;fill:var(--creme)}
}
@media (max-width:899px) and (prefers-reduced-motion:reduce){.mm-lecteur .mm-mini-poch.tourne .mm-poch{animation:none}}

/* Logo de Ma musique : plus de réduction propre à la page, il reprend la taille de l'accueil et de Musique (base.css : 96 px) */
/* Même écart logo → titre que Musique (28 px), écran de connexion comme espace connecté */
@media (max-width:899px){.mm-porte{padding-top:28px}.mm-tete{padding-top:28px}}

/* ===== Téléphone : plein écran S1b, ondes au battement du titre, filtre d'humeurs (modèle de la page Musique) =====
   Tout ce qui est .mm-s1 / .mm-mixonly / .mm-ondes n'existe que sous 900 px ; l'ordinateur garde son plein écran. */
.mm-s1,.mm-mixonly,.mm-ondes{display:none}
.mm-humeurs [data-rythme=""] .mm-ry-ic{display:none}
@keyframes mm-onde{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
@media (max-width:899px){
  /* Ondes : une période = un temps (60 / BPM s, --beat posé par ma-musique.js) ; figées hors lecture, fixes si le mouvement est réduit */
  .mm-ondes{position:absolute;top:50%;display:flex;align-items:center;gap:3px;transform:translateY(-50%);pointer-events:none}
  .mm-ondes i{display:block;flex:none;width:3px;background:var(--ambre);transform-origin:center;animation:mm-onde var(--beat,.545s) ease-in-out infinite;animation-delay:calc(var(--beat,.545s) * var(--k,0) * -.19);animation-play-state:paused}
  .mm-lecteur.playing .mm-ondes i,.mm-np.playing .mm-ondes i{animation-play-state:running}
  .mm-np-art .mm-ondes[data-side=g]{right:calc(100% + 8px)}
  .mm-np-art .mm-ondes[data-side=d]{left:calc(100% + 8px)}
  .mm-lecteur .mm-ondes{top:14px;height:34px;overflow:hidden}
  .mm-lecteur .mm-ondes[data-side=g]{left:12px;right:calc(50% + 58px);justify-content:flex-end}
  .mm-lecteur .mm-ondes[data-side=d]{left:calc(50% + 58px);right:12px;justify-content:flex-start}
  .mm-lecteur .infos .s svg{width:18px;height:12px;stroke:var(--or);fill:none;stroke-width:1.9;stroke-linecap:round;margin-right:7px;vertical-align:-1px}

  /* Plein écran */
  .mm-s1{display:block}
  .mm-np-dlhaut{display:none}
  .mm-np-filebtn{display:grid;width:auto;padding-left:8px;font:500 15px/1 var(--texte);color:var(--encre-3)}
  .mm-np-haut .mm-surtitre{font-weight:500;color:var(--encre-3)}
  .mm-np-haut{min-height:44px}
  .mm-np > .mm-np-art{width:min(230px,62vw);margin:0 auto;translate:none}
  .mm-np .vinyle{display:none}
  .mm-np-poch{position:absolute;inset:0;z-index:1;border-radius:50%;background:conic-gradient(var(--ambre) var(--p,0%),#ddd8d0 0)}
  .mm-np-poch::before{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--creme)}
  .mm-np-poch .mm-poch{position:absolute;inset:12px;width:auto;height:auto;aspect-ratio:auto;border-radius:50%;outline:0;box-shadow:0 0 0 3px var(--encre)}
  .mm-np-poch::after{content:"";position:absolute;left:50%;top:50%;z-index:2;width:24%;height:24%;translate:-50% -50%;border-radius:50%;background:var(--encre);box-shadow:0 0 0 2px #e4e2df}
  #npDisc.tourne + .mm-np-poch .mm-poch{animation:mm-tourne 3.2s linear infinite}
  .mm-np-meta{margin-top:14px;text-align:center}
  .mm-np .mm-np-titre{font-size:clamp(40px,13.5vw,52px);line-height:.9;text-transform:uppercase}
  #npSub{margin:7px 0 0;font-size:15px;color:var(--encre-3)}
  .mm-s1-cmd{display:flex;justify-content:space-between;align-items:flex-start;margin-top:12px}
  .mm-s1-lab{display:flex;flex-direction:column;align-items:center;gap:4px;width:78px;background:none;font:500 11px/1 var(--texte);color:var(--encre-3)}
  .mm-s1-lab[hidden]{display:flex;visibility:hidden}
  .mm-s1-lab .ico{display:grid;place-items:center;width:44px;height:40px}
  .mm-s1-lab .ico svg{width:25px;height:23px;fill:none;stroke:var(--encre);stroke-width:1.8;stroke-linejoin:round}
  .mm-s1-lab.fav-toggle.on .ico svg{fill:var(--or);stroke:var(--or)}
  .mm-s1-cmd .mid{display:flex;align-items:center;gap:14px}
  .mm-s1-ic{display:grid;place-items:center;width:44px;height:44px;background:none}
  .mm-s1-ic svg{width:24px;height:24px;fill:var(--encre)}
  .mm-s1-pp{display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:var(--encre)}
  .mm-s1-pp svg{width:26px;height:26px;fill:var(--creme)}
  .mm-s1-pp.is-loading svg{animation:mm-pouls .9s ease-in-out infinite}
  .mm-np-temps{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0;margin-top:8px;font-size:14px;color:var(--encre-3)}
  .mm-np-temps .mm-seek{order:1;flex:0 0 100%;height:22px}
  .mm-np-temps .mm-seek::before,.mm-np-temps .mm-seek i{top:10px}
  .mm-np-temps .mm-seek i{background:var(--ambre)}
  .mm-np-temps .mm-seek i::after{top:-5px;height:12px;background:var(--encre)}
  .mm-np-temps .mm-mixic{order:2}
  .mm-np-temps .js-cur{order:3}
  .mm-np-temps .js-cur::after{content:" / ";white-space:pre}
  .mm-np-temps .js-dur{order:4}
  .mm-np-temps .mm-mixtx{order:5}
  .mm-np-temps .mm-mixtx::before{content:" \00b7  ";white-space:pre}
  .mm-np.mix .mm-mixonly{display:inline-flex;align-items:center}
  .mm-mixic svg{width:20px;height:14px;margin-right:9px;stroke:var(--or);fill:none;stroke-width:1.9;stroke-linecap:round}
  .mm-np-cmd{position:relative;height:0;margin:0}
  .mm-np-cmd .js-prev,.mm-np-cmd .js-pp,.mm-np-cmd .js-next{display:none}
  .mm-np-cmd #shuffleBtn,.mm-np-cmd #repeatBtn{position:absolute;top:-28px;width:36px;height:36px}
  .mm-np-cmd #shuffleBtn{left:0}
  .mm-np-cmd #repeatBtn{right:0}
  .mm-np-cmd .mm-ic svg{width:21px;height:21px}
  .mm-np-extra{justify-content:center;margin:2px 0 0}
  .mm-np-extra .mm-lien{min-height:32px}
  .mm-np-extra #queueToggle,.mm-np-extra #npFavBtn,.mm-np-extra #npDlBtn{display:none}
  .mm-suivre{margin-top:8px}
  .mm-suivre[hidden]{display:none}
  .mm-suivre-haut{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:8px;border-bottom:1px solid var(--filet)}
  .mm-suivre-haut h3{margin:0;font:900 21px/1 var(--titre);letter-spacing:.01em;text-transform:uppercase}
  .mm-suivre-haut span{font-size:13px;color:var(--encre-3)}
  .mm-suivre-liste{list-style:none;margin:0;padding:0}
  .mm-suivre-l{display:flex;align-items:center;gap:13px;width:100%;height:58px;border-bottom:1px solid var(--filet);text-align:left;background:none}
  .mm-suivre-p{flex:none;width:42px;height:42px}
  .mm-suivre-p .mm-poch{height:100%}
  .mm-suivre-p .mm-gen{font-size:8px;padding:3px}
  .mm-suivre-p .mm-gen b{display:none}
  .mm-suivre-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
  .mm-suivre-t b{font:600 15px/1.15 var(--texte);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mm-suivre-t span{font-size:12.5px;color:var(--encre-3)}
  .mm-suivre-d{font-size:13px;color:var(--encre-3);font-variant-numeric:tabular-nums}
  .mm-np > .mm-np-bas{display:flex;align-items:flex-start;justify-content:space-between;position:sticky;bottom:0;z-index:3;width:auto;max-width:none;margin:auto calc(-1 * var(--g)) calc(-18px - env(safe-area-inset-bottom,0px));padding:12px 12px calc(12px + env(safe-area-inset-bottom,0px));background:var(--creme);border-top:1px solid var(--filet)}
  .mm-np > .mm-suivre{margin-bottom:16px}
  .mm-np-bas button{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;padding:0 2px;background:none;font:500 13px/1 var(--texte);color:var(--encre);white-space:nowrap}
  .mm-np-bas button svg{width:24px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
  .mm-np-bas [data-nprythme=""] svg{visibility:hidden}
  .mm-np-bas button span{padding-bottom:5px;border-bottom:2.5px solid transparent}
  .mm-np-bas button.active span{font-weight:600;border-bottom-color:var(--ambre)}
  .mm-np-sep{flex:none;width:1px;height:42px;margin-top:1px;background:var(--filet)}
  .mm-np-bas .mm-np-cc{flex-direction:row;gap:5px;margin-top:23px;font:600 14px/1 var(--texte);color:var(--or-texte)}
  .mm-np-bas .mm-np-cc svg{width:17px;height:15px;fill:var(--or);stroke:none}
  .mm-np-bas .mm-np-cc:disabled{opacity:.45}

  /* Filtre d'humeurs de l'espace membre : même modèle que la page Musique (libellés Big Shoulders, fins traits, actif en aplat encre) */
  .mm-humeurs{flex-wrap:nowrap;gap:0;margin-top:14px;padding:0}
  .mm-humeurs button{position:relative;flex:1 1 auto;min-width:0;flex-direction:column;justify-content:center;gap:7px;height:58px;padding:0 2px;border-bottom:0;white-space:nowrap;text-align:center;font-family:var(--titre);font-weight:800;font-size:17px;line-height:1;letter-spacing:.005em}
  .mm-humeurs button .mm-ry-ic{width:20px;height:20px;margin:0}
  .mm-humeurs [data-rythme=""] .mm-ry-ic{display:block}
  .mm-humeurs button+button::before{content:"";position:absolute;left:0;top:17px;bottom:17px;width:1px;background:rgba(30,18,32,.22)}
  .mm-humeurs button.active{background:var(--encre);color:var(--creme);font-weight:800;border-bottom:0}
  .mm-humeurs button.active::before,.mm-humeurs button.active+button::before{background:transparent}
  .mm-humeurs button.active:hover{color:var(--creme)}
}
@media (max-width:899px) and (prefers-reduced-motion:reduce){.mm-ondes i{animation:none}#npDisc.tourne + .mm-np-poch .mm-poch{animation:none}}

/* Cibles tactiles de l'en-tête et de la case « Rester connecté » : zone portée à 44 px, rien ne bouge. */
@media (max-width:899px){
  .mm-entete .sac::before{content:"";position:absolute;inset:0 0 0 -4px}
  .mm-menu-btn{position:relative}
  .mm-menu-btn::before{content:"";position:absolute;inset:0 0 0 -8px}
}
.mm-rond{position:relative}
.mm-rond::after{content:"";position:absolute;inset:-2px 0}