/* Now Playing : rangée de l'accueil (nowplaying/_card.html), bandeau des
   écrans larges (nowplaying/_bar.html) et page historique
   (nowplaying/history.html). */

/* --- « Sur la platine » ------------------------------------------------ */
.np-eyebrow {
  font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--soft);
}
.np-art-link { flex:0 0 auto; display:block; line-height:0; }
.np-art-link[href]:hover .np-art { opacity:.82; }
.np-art { object-fit:cover; display:block; background:var(--card); transition:opacity .12s; }
.np-art[hidden] { display:none; }
/* Sans pochette : un disque vert à pastille or. */
.np-art-ph {
  display:none; align-items:center; justify-content:center;
  background:var(--card); border:1px solid rgba(254,246,229,.18);
}
.np-art-ph::after { content:""; border-radius:50%; background:var(--gold); }
.np-art-link:has(.np-art[hidden]) .np-art-ph { display:flex; }
.np-name, .np-artists { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.np-artists { color:var(--soft); }
.np-artists:empty { display:none; }

.np-row {
  display:flex; align-items:center; gap:16px; margin-top:24px; padding:18px 0;
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
}
.np-row .np-art, .np-row .np-art-ph { width:56px; height:56px; border-radius:50%; }
.np-row .np-art-ph::after { width:14px; height:14px; }
.np-row .np-body { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.np-row .np-name { font-size:17px; font-weight:600; }
.np-row .np-artists { font-size:14px; }
.np-row .np-more { font-size:14px; padding:2px 0; align-self:flex-start; }

.np-bar { display:none; background:var(--card); border-bottom:1px solid var(--border); }
.np-bar__in {
  max-width:var(--page); margin:0 auto; padding:6px var(--gutter); min-height:44px;
  display:flex; flex-wrap:wrap; align-items:center; gap:14px; font-size:15px;
}
.np-bar .np-eyebrow {
  display:flex; align-items:center; gap:8px; font-weight:600; color:var(--gold);
}
.np-live {
  width:7px; height:7px; border-radius:50%; background:var(--green);
  box-shadow:0 0 0 3px rgba(79,168,119,.25);
}
.np-bar .np-art, .np-bar .np-art-ph { width:28px; height:28px; border-radius:3px; }
.np-bar .np-art-ph { background:var(--bg); border-color:var(--border); }
.np-bar .np-art-ph::after { width:8px; height:8px; }
.np-bar .np-name { font-weight:600; max-width:40ch; }
.np-bar .np-artists { max-width:40ch; }
.np-bar .np-more { margin-left:auto; font-size:14px; font-weight:600; padding:10px 0; }
@media (min-width:900px) {
  .np-row { display:none; }
  .np-bar { display:block; }
}

/* --- Historique des morceaux ---------------------------------------- */
.nph { max-width:760px; }
.nph-sub { color:var(--soft); font-size:15px; margin:-8px 0 20px; }
.nph-list { list-style:none; margin:0; padding:0; }
.nph-row {
  display:flex; gap:14px; align-items:center;
  padding:12px 0; border-top:1px solid var(--border);
}
.nph-art, .nph-art-ph {
  flex:0 0 44px; width:44px; height:44px; border-radius:4px; object-fit:cover;
  background:var(--card); display:block;
}
.nph-art-ph { border:1px solid var(--border); }
.nph-body { min-width:0; flex:1; }
.nph-name, .nph-artists { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nph-name { font-weight:600; color:var(--ink); text-decoration:none; }
a.nph-name:hover { color:var(--gold-hover); }
.nph-artists { color:var(--soft); font-size:14px; }
.nph-when { flex:0 0 auto; text-align:right; color:var(--soft); font-variant-numeric:tabular-nums; }
.nph-date { display:block; font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.nph-time { font-size:14px; }
.nph-empty { color:var(--soft); margin-top:24px; }
.nph-back { display:inline-block; margin-top:22px; font-size:14px; padding:12px 0; }