/* Vitrine « Sélection de la semaine » (js/selection-vitrine.js) — 05/10/2026, remplace le carrousel de l'accueil.
   Tout le reste vient des styles .pks-* de la vitrine des packs (index.html). L'affiche est en 4:5 : la boîte
   est donc plus haute que large (--sel-H). */
.pks.sel{--pks-W:clamp(220px,22vw,340px);--sel-H:calc(var(--pks-W) * 1.25)}
.sel .pks-stage{height:calc(var(--pks-W) * 1.75)}
.sel .pks-scene{height:var(--sel-H)}
.sel .pks-f-front,.sel .pks-f-back,.sel .pks-f-left,.sel .pks-f-right{height:var(--sel-H);margin-top:calc(var(--sel-H) / -2)}
.sel .pks-f-top{transform:rotateX(90deg) translateZ(calc(var(--sel-H) / 2))}
.sel .pks-f-bottom{transform:rotateX(-90deg) translateZ(calc(var(--sel-H) / 2))}
.sel .pks-shadow{top:calc(50% + var(--sel-H) * .6)}
.sel .pks-f-front{background-color:#140f1c}
.sel .pks-title{font-size:clamp(42px,17cqi,104px)}
.sel .pks-price small{font-size:.72em;font-weight:700;opacity:.7}
/* Tranche : dégradé aux couleurs de la semaine, « Sélection S40 » à la verticale */
.sel .pks-f-left,.sel .pks-f-right{display:grid;place-items:center;overflow:hidden}
.sel .pks-f-left span,.sel .pks-f-right span{writing-mode:vertical-rl;transform:rotate(180deg);font-weight:900;font-size:calc(var(--pks-D) * .4);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.92);white-space:nowrap;text-shadow:0 1px 6px rgba(0,0,0,.35)}
.sel .pks-f-right span{transform:none}
/* Les semaines : grille de 2 colonnes, la pochette de la semaine en vignette (4:5) */
.sel .sel-cards{grid-template-columns:1fr 1fr;gap:8px}
.sel .sel-card{grid-template-columns:40px minmax(0,1fr);gap:10px;padding:7px 10px 7px 7px;border-radius:14px}
.sel .sel-thumb{width:40px;height:50px;border-radius:7px;object-fit:cover;object-position:top}
.sel .sel-card .pks-cname{font-size:13.5px}
.sel .sel-card .pks-cmeta{font-size:11px}
.sel .sel-card{position:relative}
.sel .sel-new{position:absolute;top:-8px;right:10px;font-size:8.5px;padding:2px 7px;box-shadow:0 4px 12px -4px rgba(0,0,0,.6)}
.sel .pks-tt{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
/* Titres floutés (le serveur les envoie déjà brouillés) */
.sel .sel-flou{filter:blur(3.6px);-webkit-user-select:none;user-select:none;pointer-events:none}
.sel .pks-bk-list.sel-flou{filter:blur(2.5px)}
.sel .sel-lock{display:flex;align-items:center;gap:7px}
.sel .sel-lock svg{color:var(--pks-tint)}
.sel .sel-why{display:grid;gap:10px}
.sel .sel-why strong{color:#fff}
.sel .sel-drumjo{margin-top:-8px;color:#bdb6cc}
.sel .sel-drumjo a{color:#fff;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--pks-tint) 60%,transparent)}
@media (max-width:960px){
  .sel .pks-stage{height:calc(var(--pks-W) * 1.75)}
  .sel .sel-card{grid-template-columns:36px minmax(0,1fr)}
  .sel .sel-thumb{width:36px;height:45px}
  .sel .pks-year{top:calc(8px + var(--pks-W) * .875)}
}

/* Espace membre (/membre) : même vitrine sans flou ; 3 semaines en liste ; lecteur intégré + tracklist complète.
   Les anciens blocs .weekly-pack restent dans la page (verrou, données) mais sont masqués. */
#new.sel-on > .container > .section-head,#new.sel-on #week-coverflow,#new.sel-on .weekly-pack{display:none !important}
#new.sel-on{padding-top:0}
.sel.sel-membre .sel-cards{grid-template-columns:1fr}
.sel.sel-membre .sel-card{grid-template-columns:44px minmax(0,1fr) auto;padding:7px 14px 7px 7px}
.sel.sel-membre .sel-thumb{width:44px;height:55px}
.sel.sel-membre .sel-card .pks-cname{font-size:14.5px}
.sel.sel-membre .sel-new{position:static;box-shadow:none}
.sel .sel-msg{flex-basis:100%;margin:0;font-size:12.5px;line-height:1.45;color:#d6d0e3}
.sel .sel-msg:empty{display:none}
/* Lecteur intégré */
.sel .sel-player{display:grid;grid-template-columns:44px minmax(0,1fr) auto;grid-template-areas:"pp info time" "wave wave wave";align-items:center;gap:10px 14px;padding:14px 16px;border-radius:18px;background:rgba(10,8,16,.55);border:1px solid color-mix(in srgb,var(--pks-tint) 30%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.sel .sel-pp{grid-area:pp;width:44px;height:44px;border-radius:50%;border:0;background:var(--pks-tint);color:#0b0816;display:grid;place-items:center;cursor:pointer;transition:transform .2s}
.sel .sel-pp:hover{transform:scale(1.06)}
.sel .sel-pp:disabled{opacity:.35;cursor:default;transform:none}
.sel .sel-pinfo{grid-area:info;min-width:0}
.sel .sel-ptitle{margin:0;font-weight:800;font-size:15px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sel .sel-psub{margin:2px 0 0;font-size:12.5px;color:#a9a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sel .sel-ptime{grid-area:time;font-family:var(--pks-mono);font-size:11.5px;color:#a9a3b8;font-variant-numeric:tabular-nums;white-space:nowrap}
.sel .sel-wave{grid-area:wave;min-height:46px;cursor:pointer}
.sel .sel-player[data-etat="vide"] .sel-wave,.sel .sel-player[data-etat="erreur"] .sel-wave{background:repeating-linear-gradient(90deg,rgba(255,255,255,.16) 0 2px,transparent 2px 4px);-webkit-mask-image:linear-gradient(transparent 44%,#000 44% 56%,transparent 56%);mask-image:linear-gradient(transparent 44%,#000 44% 56%,transparent 56%)}
.sel .sel-player[data-etat="erreur"] .sel-ptitle{color:#fca5a5}
/* Tracklist complète : écoute + téléchargement par titre */
.sel .sel-list{max-height:min(40vh,340px);overflow:auto;overscroll-behavior:contain;padding-right:6px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}
.sel .sel-row{display:grid;grid-template-columns:22px minmax(0,1fr) auto 30px 30px;align-items:center;gap:4px 10px;padding:8px 4px;cursor:pointer;border-radius:10px}
.sel .sel-row .sel-tx{display:grid;min-width:0}
.sel .sel-row .pks-ta{grid-column:auto}
.sel .sel-row .pks-tv{grid-column:auto;grid-row:auto}
.sel .sel-n{font-family:var(--pks-mono);font-size:11px;color:#77708a;font-variant-numeric:tabular-nums}
.sel .sel-play,.sel .sel-dl{width:30px;height:30px;padding:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;font-weight:800;font-size:14px;line-height:1;transition:transform .15s,background .2s}
.sel .sel-play{border:1px solid color-mix(in srgb,var(--pks-tint) 50%,transparent);background:color-mix(in srgb,var(--pks-c1) 14%,transparent);color:#fff}
.sel .sel-dl{border:0;background:var(--pks-tint);color:#0b0816}
.sel .sel-play:hover,.sel .sel-dl:hover{transform:scale(1.08)}
.sel .sel-row:hover{background:rgba(255,255,255,.04)}
.sel .sel-row.on{background:color-mix(in srgb,var(--pks-c1) 16%,transparent)}
.sel .sel-row.on .pks-tt{color:var(--pks-tint)}
.sel .sel-row.joue .sel-play{background:var(--pks-tint);color:#0b0816;border-color:transparent}
/* Semaine verrouillée (pas abonné) : titres floutés, ni écoute ni téléchargement */
.sel.sel-locked .sel-row .pks-tt,.sel.sel-locked .sel-row .pks-ta{filter:blur(4px);-webkit-user-select:none;user-select:none}
.sel.sel-locked .sel-play,.sel.sel-locked .sel-dl{visibility:hidden}
.sel.sel-locked .sel-row{cursor:default}
.sel.sel-locked .sel-player{opacity:.45}
@media (max-width:960px){
  .sel.sel-membre .sel-card{grid-template-columns:40px minmax(0,1fr) auto}
  .sel.sel-membre .sel-thumb{width:40px;height:50px}
  .sel .sel-list{max-height:62vh}
}
@media (max-width:420px){
  .sel .sel-row{grid-template-columns:20px minmax(0,1fr) 30px 30px}
  .sel .sel-row .pks-tv{display:none}
}

/* « Mes packs » de /membre (js/packs-membre.js) : même vitrine, boîte carrée (pochette + tranche du pack), têtes des artistes */
#packs.pkm-on > .container{display:none}
#packs.pkm-on{padding-top:0}
.pks.sel.pkm{--pks-W:clamp(220px,23vw,360px);--sel-H:var(--pks-W)}
.pkm .pks-stage{height:calc(var(--pks-W) * 1.5)}
.pkm .pks-shadow{top:calc(50% + var(--pks-W) * .64)}
.pkm .pks-f-front{background-color:#000}
.sel.sel-membre.pkm .sel-thumb{width:44px;height:44px;border-radius:9px}
.pkm .pkm-achete{background:linear-gradient(120deg,#16a34a,#22c55e)}
.pkm .pkm-attente{padding:14px 4px;color:#a9a3b8;font-size:13px;border:0}
.pkm .sel-player[hidden],.pkm .pks-inside[hidden]{display:none}
@media (max-width:960px){ .pks.sel.pkm{--pks-W:min(58vw,300px)} }

/* « Mes édits » de /membre (js/edits-membre.js) : une boîte carrée par éditeur, objets de son univers (styles .crw) */
#edits.edm-on > .container{display:none}
#edits.edm-on{padding-top:0}
.pks.sel.edm{--pks-W:clamp(220px,23vw,360px);--sel-H:var(--pks-W);margin-top:0}
.edm .pks-stage{height:calc(var(--pks-W) * 1.5)}
.edm .pks-shadow{top:calc(50% + var(--pks-W) * .64)}
.edm .pks-f-front{display:grid;place-items:center}
.edm .edm-nom{font-weight:900;font-size:calc(var(--pks-W) * .16);letter-spacing:-.03em;color:#fff;text-shadow:0 4px 20px rgba(0,0,0,.4);text-align:center;padding:0 8%}
.sel.sel-membre.edm .sel-thumb{width:44px;height:44px;border-radius:50%}
.edm .edm-initiale{display:grid;place-items:center;font-weight:900;font-size:18px;color:#fff}
.edm .edm-sans{display:grid;place-items:center;width:30px;height:30px;font-family:var(--pks-mono);font-size:9.5px;color:#8e88a0}
.edm .pks-picker-head[hidden]{display:none}
@media (max-width:960px){ .pks.sel.edm{--pks-W:min(58vw,300px)} }

/* Fiche publique d'un éditeur (friends-editor.html, js/editeur-vitrine.js) : liste de ses édits, choisir = écouter */
.editor-vitrine{margin:8px 0 40px}
.pks.sel.edp{border-radius:28px}
.edp .sel-row{grid-template-columns:22px minmax(0,1fr) auto 30px}
.edp .sel-row.choisi{background:color-mix(in srgb,var(--pks-c1) 12%,transparent);box-shadow:inset 2px 0 0 var(--pks-tint)}
.edp .edp-list{max-height:min(52vh,470px)}
.edp .pks-tv.edp-free{border-color:color-mix(in srgb,#22c55e 60%,transparent);color:#86efac}
.edp .pks-buy.edp-off{opacity:.55;pointer-events:none}
.edp .sel-player{margin-top:2px}
.pks.sel.edp{--pks-W:clamp(200px,19vw,290px)}
@media (min-width:961px){ .edp .pks-grid{grid-template-columns:minmax(0,.95fr) minmax(0,.9fr) minmax(0,1.25fr)} }
.pks.edp .pks-tt{-webkit-line-clamp:1}
.pks.edp .pks-specs{gap:clamp(14px,4cqi,28px)}
.pks.edp .pks-specs dd{font-size:19px;white-space:nowrap}
.edp .pks-pos{white-space:nowrap}
.edp .pks-nav[hidden]{display:none}
.edp .pks-tagline{font-size:clamp(22px,9cqi,32px)}
@media (max-width:420px){ .edp .sel-row{grid-template-columns:20px minmax(0,1fr) auto 30px} .edp .sel-row .pks-tv{display:block} }
/* Albums + édits regroupés (06/10/2026) : une carte par album + « Édits à l'unité », la tracklist de la carte choisie dessous */
.edp .edp-cards{grid-template-columns:1fr;gap:8px}
.sel.sel-membre.edp .sel-card{grid-template-columns:44px minmax(0,1fr);padding:7px 14px 7px 7px}
.sel.sel-membre.edp .sel-thumb{width:44px;height:44px;border-radius:9px}
.edp .edp-album{background:linear-gradient(120deg,#d4b556,#f59e0b);color:#1a1205}
.edp.edp-multi .edp-list{max-height:min(36vh,320px)}
.pks.edp .pks-buy{white-space:nowrap;font-size:15px;gap:12px;padding-right:18px}
.pks.edp .pks-price{white-space:nowrap}
/* Sélections des curateurs dans l'espace membre (06/10/2026) : sélecteur « Delviin Leak | DRUMJO » en haut de la vitrine */
.sel .sel-src{position:relative;z-index:5;display:flex;gap:4px;width:max-content;max-width:calc(100% - 32px);margin:0 auto clamp(6px,1.4vh,14px);padding:4px;border-radius:999px;background:rgba(10,8,16,.62);border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.sel .sel-src[hidden]{display:none}
.sel .sel-src button{appearance:none;display:inline-flex;align-items:center;gap:8px;min-width:0;padding:5px 14px 5px 5px;border:0;border-radius:999px;background:transparent;color:#bdb6cc;font:700 13px/1 Inter,sans-serif;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s}
.sel .sel-src button img{width:26px;height:26px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.sel .sel-src button[aria-selected="true"]{background:color-mix(in srgb,var(--pks-tint) 22%,transparent);color:#fff;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--pks-tint) 55%,transparent)}
.sel .sel-src button:hover{color:#fff}
.sel .sel-src button em{font:800 9.5px/1 var(--pks-mono);letter-spacing:.12em;text-transform:uppercase;font-style:normal;padding:4px 6px;border-radius:999px;background:var(--pks-tint);color:#0b0816}
.sel .sel-src button:focus-visible{outline:2px solid var(--pks-tint);outline-offset:2px}
/* sélection sans pochette : la photo du curateur, avec son nom */
.sel .pks-f-front.sel-f-cur{background-size:cover;background-position:center 22%}
.sel .sel-fc{position:absolute;left:0;right:0;bottom:0;display:grid;gap:4px;padding:22% 8% 8%;background:linear-gradient(180deg,transparent,rgba(8,6,14,.9) 58%);text-align:left;pointer-events:none}
.sel .sel-fc i{font:700 calc(var(--pks-W) * .036)/1 var(--pks-mono);letter-spacing:.22em;text-transform:uppercase;font-style:normal;color:var(--pks-tint)}
.sel .sel-fc b{font:900 calc(var(--pks-W) * .15)/.92 Inter,sans-serif;letter-spacing:-.02em;color:#fff}
.sel .sel-fc em{font:800 calc(var(--pks-W) * .05)/1 Inter,sans-serif;font-style:normal;color:rgba(255,255,255,.75)}
@media (max-width:520px){ .sel .sel-src button{padding-right:10px;font-size:12px;gap:6px} .sel .sel-src button img{width:22px;height:22px} }
.sel.sel-locked-cur .sel-dl{visibility:hidden}
/* « Bientôt disponible » (06/10/2026) : sélection de curateur déposée, pas encore sortie — cadenas partout */
.sel .sel-lock-i{flex:0 0 auto;width:1.15em;height:1.15em}
.sel .sel-cad{position:absolute;z-index:2;left:50%;bottom:4.5%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:.55em;padding:.7em 1.15em;border-radius:999px;white-space:nowrap;
  background:rgba(8,6,12,.86);border:1px solid rgba(255,255,255,.26);box-shadow:0 10px 30px -8px rgba(0,0,0,.8);font:800 calc(var(--pks-W) * .042)/1 Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#fff;pointer-events:none}
.sel .sel-cad .sel-lock-i{color:var(--pks-tint)}
.sel .sel-bk-cad{display:grid;justify-items:center;gap:6px;margin:8% 0 6%;text-align:center;color:var(--pks-tint)}
.sel .sel-bk-cad .sel-lock-i{width:calc(var(--pks-W) * .14);height:calc(var(--pks-W) * .14)}
.sel .sel-bk-cad b{font:900 calc(var(--pks-W) * .07)/1 Inter,sans-serif;color:#fff;text-transform:uppercase;letter-spacing:.02em}
.sel .sel-bk-cad span{font:700 calc(var(--pks-W) * .036)/1.3 var(--pks-mono);letter-spacing:.08em;color:rgba(255,255,255,.7)}
.pks.sel .pks-tlist li.sel-bientot{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:none;justify-items:center;gap:8px;padding:24px 16px;margin:4px 0;border-radius:16px;list-style:none;text-align:center;
  border:1px dashed color-mix(in srgb,var(--pks-tint) 60%,transparent);background:rgba(10,8,16,.5)}
.pks.sel .pks-tlist li.sel-bientot > *{grid-column:1;grid-row:auto;grid-area:auto;margin:0}
.sel .pks-tlist .sel-bientot .sel-lock-i{width:30px;height:30px;color:var(--pks-tint)}
.sel .pks-tlist .sel-bientot b{font:800 18px/1.2 Inter,sans-serif;color:#fff}
.sel .pks-tlist .sel-bientot span{font:600 12.5px/1.45 var(--pks-mono);letter-spacing:.04em;color:#c9c2d8}
.sel .pks-buy.sel-btn-lock{cursor:default}
.sel .pks-buy.sel-btn-lock .pks-plus{color:#fff}
.sel .pks-buy.sel-btn-lock .pks-plus .sel-lock-i{width:18px;height:18px}
.sel .sel-msg a{color:#fff}
.sel .sel-why[hidden]{display:none}

/* « Tu hésites ? » (08/10/2026) : bouton « Pack d'essai » sous la tracklist (visiteurs de l'accueil), même style
   que « S'abonner » (.pks-buy de vitrine-pks.css) */
.pks-hesite{display:grid;justify-items:start;gap:10px;margin-top:-8px}
.pks-hesite[hidden]{display:none}
.pks-hesite .pks-fine{max-width:300px}
.sel .pks-buy.sel-essai{font-size:15px;gap:12px;padding-right:20px;white-space:nowrap}
.sel .pks-buy.sel-essai:hover .pks-plus{transform:translateY(2px)}