/* ToneRecord — Page artiste /artiste/<slug> (module Claude Design repris le
 * 2026-09-27, préfixe .ap-). Requêtes de conteneur : la page s'adapte à sa
 * largeur réelle. Rendu par assets/ap.js.
 *
 * Disques : ceux du site, jamais d'autres. Le vinyle qui sort de sa pochette
 * (.vinyl, product.css — celui des fiches) seulement sous « Bientôt » /
 * « Dernière sortie » (et le disque unique d'un artiste qui n'en a qu'un) ;
 * partout ailleurs la pochette seule, ou le vinyle CSS du site (.rdisc) figé.
 * Aucune frise de progression (demande de la cliente) : le lecteur du site
 * s'en charge. */
.ap{
  --ap-cream:#F6F6F0;--ap-paper:#F2F0EC;--ap-ink:#0B0B0C;--ap-ink2:rgba(11,11,12,.6);--ap-line:rgba(11,11,12,.14);
  --ap-red:#900011;--ap-led:#FF4A4A;--ap-blue:#0A84FF;--ap-acc:#6b5a44;--ap-acc-ink:#3a2f22;--ap-acc-soft:rgba(107,90,68,.14);
  --ap-top:5.25rem;--ap-bottom:7.5rem;--ap-vh:1vh;--ap-gut:clamp(16px,4cqw,56px);
  --ap-grot:"Archivo Sillon","Helvetica Neue",Arial,sans-serif;--ap-mono:"JetBrains Mono Sillon",ui-monospace,Menlo,monospace;
  --ap-spring:cubic-bezier(.3,1.3,.5,1);--ap-soft:cubic-bezier(.2,.8,.2,1);
  container-type:inline-size;container-name:ap;position:relative;background:var(--ap-cream);color:var(--ap-ink);
  font-family:var(--ap-grot);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased;padding-bottom:var(--ap-bottom);text-align:left
}
@supports (transition-timing-function:linear(0,1)){.ap{--ap-spring:linear(0,.16 4%,.5 10%,.84 17%,1.03 25%,1.06 31%,1.03 38%,1.005 48%,1)}}
.ap *,.ap *::before,.ap *::after{box-sizing:border-box}
/* Le CSS du site passe les titres en serif et numérote les listes « 01. » */
.ap :where(h1,h2,h3,h4){font-family:var(--ap-grot);letter-spacing:normal}
.ap :where(ol,ul){list-style:none;margin:0;padding:0;counter-reset:none}
.ap :where(ol,ul)>li::before{content:none}
.ap :where(p,dl,dd){margin:0}
.ap svg{flex:none}
.ap button{font:inherit;color:inherit}
.ap a{color:inherit}
.ap :focus-visible{outline:2px solid var(--ap-blue);outline-offset:3px}
.ap-mono{font-family:var(--ap-mono);letter-spacing:.06em}
.ap-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0}
.ap-wrap{padding:0 var(--ap-gut)}
/* ── objets ── */
/* Pochette seule, avec le pli et le vernis de la pochette des fiches. */
.ap-poster{position:relative;display:block;aspect-ratio:1;border-radius:2px;overflow:hidden;background:#D8C694;box-shadow:0 14px 28px -18px rgba(11,11,12,.6)}
.ap-poster img{display:block;width:100%;height:100%;object-fit:cover}
.ap-poster::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(255,255,255,.35) 0,transparent 4%),linear-gradient(to right,transparent 92%,rgba(0,0,0,.35) 100%)}
.ap-thumb{width:52px;height:52px;flex:none;border-radius:2px;box-shadow:0 8px 16px -10px rgba(11,11,12,.55)}
.ap-thumb::after{background:linear-gradient(to right,transparent 88%,rgba(0,0,0,.3) 100%)}
/* Vinyle CSS du site (.rdisc, product.css), figé. */
.ap .rdisc{cursor:inherit}
/* Le vinyle des fiches (.vinyl, product.css) : sa pochette, son disque qui sort. */
.ap-rec{--slide:.52;position:relative;width:calc(var(--sleeve)*(1 + var(--slide)));max-width:100%}
.ap-rec .vinyl__label{position:relative}
.ap-latest:hover .vinyl__record,.ap-single-obj:hover .vinyl__record,.ap-rec.is-playing .vinyl__record{transform:translateX(calc(var(--slide) * 100%)) rotate(360deg)}
.ap-latest:hover .vinyl__sleeve,.ap-single-obj:hover .vinyl__sleeve,.ap-rec.is-playing .vinyl__sleeve{transform:translateX(-2.5%) rotate(-1.4deg)}
.ap-rec a{display:block;text-decoration:none}
/* ── boutons ── */
.ap-play{--s:64px;width:var(--s);height:var(--s);border:0;border-radius:50%;background:var(--ap-ink);color:var(--ap-cream)!important;display:grid;place-items:center;cursor:pointer;transition:transform .35s var(--ap-spring),background .2s ease;flex:none;padding:0}
.ap-play:hover{transform:scale(1.06)}.ap-play:active{transform:scale(.94)}
.ap-play svg{width:42%;height:42%}
.ap-ib{width:48px;height:48px;border:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;padding:0;background:rgba(246,246,240,.18);color:inherit;-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);transition:transform .3s var(--ap-spring),background .2s ease}
.ap-ib:hover{transform:scale(1.06);background:rgba(246,246,240,.3)}
.ap-ib svg{width:21px;height:21px}
.ap-ib[aria-pressed="true"]{background:var(--ap-cream);color:var(--ap-red)!important}
.ap-ib[aria-pressed="true"] svg{animation:ap-pop .45s var(--ap-spring)}
@keyframes ap-pop{0%{transform:scale(.5)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
.ap-cap{height:44px;padding:0 18px;border:0;border-radius:999px;display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;cursor:pointer;white-space:nowrap;text-decoration:none;color:inherit;background:rgba(246,246,240,.18);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);transition:background .2s ease}
.ap-cap:hover{background:rgba(246,246,240,.3)}
.ap-cap svg{width:16px;height:16px;transition:transform .35s var(--ap-spring)}
.ap-cap:hover svg{transform:translateX(3px)}
.ap-btn{height:40px;padding:0 16px;border:0;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:13.5px;cursor:pointer;white-space:nowrap;text-decoration:none;background:var(--ap-ink);color:var(--ap-cream)!important;transition:transform .2s var(--ap-soft)}
.ap-btn:active{transform:scale(.96)}
.ap-btn svg{width:16px;height:16px}
.ap-btn.is-ghost{background:transparent;color:var(--ap-ink)!important;box-shadow:inset 0 0 0 1.5px var(--ap-ink)}
.ap-btn.is-ghost:hover{background:var(--ap-acc-soft)}
.ap-btn.is-lg{height:52px;padding:0 24px;font-size:15px}
.ap-amz{font-family:var(--ap-mono);font-size:10px;line-height:1.5;letter-spacing:.02em;color:var(--ap-ink2);max-width:340px;text-wrap:pretty}
/* Flèche cerclée qui pivote de −45° au survol : le geste des liens du site. */
.ap-circ{width:30px;height:30px;flex:none;border-radius:50%;display:inline-grid;place-items:center;box-shadow:inset 0 0 0 1.5px currentColor;transition:transform .4s var(--ap-spring),background .2s ease,color .2s ease}
.ap-circ svg{width:14px;height:14px}
/* ── héros ── */
.ap-hero{position:relative;height:calc(var(--ap-vh)*78);min-height:520px;overflow:hidden;color:#fff;isolation:isolate}
.ap-media{position:absolute;inset:-6% 0 0;z-index:-2;will-change:transform;background:#111}
.ap-media video,.ap-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ap-media img.is-zoom{animation:ap-zoom 38s ease-in-out infinite alternate}
@keyframes ap-zoom{from{transform:scale(1.02)}to{transform:scale(1.12)}}
.ap-media-bg{display:none}
.ap-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,11,12,.34) 0,rgba(11,11,12,0) 26%,rgba(11,11,12,.08) 52%,rgba(11,11,12,.55) 78%,rgba(11,11,12,.7) 100%)}
.ap-dark{position:absolute;inset:0;z-index:-1;background:#0B0B0C;opacity:0;pointer-events:none}
.ap-fade{position:absolute;left:0;right:0;bottom:-1px;height:90px;z-index:0;background:linear-gradient(180deg,transparent,var(--ap-cream))}
.ap-hin{position:absolute;left:0;right:0;bottom:0;z-index:1;display:grid;gap:14px;padding-bottom:clamp(40px,6cqw,72px)}
.ap-name{margin:0;font-weight:900;font-stretch:62%;text-transform:uppercase;font-size:clamp(64px,15cqw,232px);line-height:.8;letter-spacing:-.015em;text-wrap:balance;overflow-wrap:anywhere;text-shadow:0 2px 40px rgba(0,0,0,.25);transform-origin:left bottom;will-change:transform,opacity}
.ap-meta{font-size:12px;opacity:.92;display:flex;gap:10px;flex-wrap:wrap}
.ap-meta span:not(:last-child)::after{content:"·";margin-left:10px;opacity:.7}
.ap-acts{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:6px}
.ap-hero .ap-play{--s:76px;background:var(--ap-cream);color:var(--ap-ink)!important;box-shadow:0 12px 30px -12px rgba(0,0,0,.5)}
/* Sans photo ni vidéo : héros typographique, le vinyle du site au centre. */
.ap-hero.is-type{color:var(--ap-cream);background:radial-gradient(120% 90% at 50% 38%,color-mix(in oklab,var(--ap-acc),#fff 10%) 0,var(--ap-acc) 38%,color-mix(in oklab,var(--ap-acc),#000 45%) 100%)}
.ap-hero.is-type .ap-shade{background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(11,11,12,.35) 100%)}
.ap-ghost{position:absolute;inset:0;z-index:-2;display:grid;align-content:center;overflow:hidden;pointer-events:none}
.ap-ghost span{display:block;white-space:nowrap;font-weight:900;font-stretch:62%;text-transform:uppercase;font-size:clamp(120px,30cqw,460px);line-height:.78;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.22);animation:ap-marq 60s linear infinite}
.ap-ghost span:nth-child(2){animation-direction:reverse;-webkit-text-stroke-color:rgba(0,0,0,.18)}
@keyframes ap-marq{to{transform:translateX(-50%)}}
.ap-stage{position:absolute;left:50%;top:44%;z-index:-1;transform:translate(-50%,-50%);width:clamp(220px,34cqw,420px)}
.ap-stage .rdisc{width:100%;box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
/* barre compacte, collée sous la barre du site */
.ap-bar{position:sticky;top:var(--ap-top);z-index:20;height:0;pointer-events:none}
.ap-bar>div{position:absolute;left:clamp(10px,2cqw,24px);right:clamp(10px,2cqw,24px);top:8px;display:flex;align-items:center;gap:12px;height:58px;padding:0 10px;border-radius:999px;background:rgba(246,246,240,.72);-webkit-backdrop-filter:blur(20px) saturate(1.3);backdrop-filter:blur(20px) saturate(1.3);box-shadow:0 0 0 1px var(--ap-line),0 14px 30px -20px rgba(11,11,12,.4),inset 0 1px 0 rgba(255,255,255,.8);opacity:0;transform:translateY(-10px) scale(.98);transition:opacity .25s ease,transform .45s var(--ap-spring)}
.ap-bar.is-on>div{opacity:1;transform:none;pointer-events:auto}
.ap-bar .ap-play{--s:40px}
.ap-bar b{flex:1;min-width:0;font-weight:900;font-stretch:62%;text-transform:uppercase;font-size:28px;line-height:1;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-bar .ap-ib{width:40px;height:40px;background:transparent;box-shadow:inset 0 0 0 1px var(--ap-line);color:var(--ap-ink)}
.ap-bar .ap-ib[aria-pressed="true"]{background:var(--ap-ink);color:var(--ap-led)!important}
.ap-bar .ap-thumb{width:40px;height:40px}
/* ── sections ── */
.ap-sec{padding-top:clamp(40px,6cqw,72px)}
.ap-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:12px;margin-bottom:18px;border-bottom:6px solid var(--ap-ink)}
.ap-h h2{margin:0;font-weight:900;font-stretch:62%;text-transform:uppercase;font-size:clamp(34px,5.2cqw,64px);line-height:.84;letter-spacing:-.01em}
.ap-h small{font-size:11px;color:var(--ap-ink2)}
.ap-two{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4cqw,56px);align-items:start}
/* « Bientôt » / « Dernière sortie » */
.ap-latest{display:grid;gap:18px}
.ap-latest .ap-rec{--sleeve:min(290px,calc((100cqw - 2 * var(--ap-gut)) / 1.6))}
.ap-latest-t{display:grid;gap:6px}
.ap-latest-t time,.ap-kick{font-size:11.5px;color:var(--ap-acc-ink);font-weight:500}
.ap-latest-t b{font-weight:900;font-stretch:66%;text-transform:uppercase;font-size:clamp(32px,4cqw,48px);line-height:.88;overflow-wrap:anywhere}
.ap-latest-t b a{text-decoration:none}
.ap-latest-t span{font-size:12px;color:var(--ap-ink2)}
.ap-latest-r{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ap-count{height:28px;padding:0 12px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;font-size:11px;box-shadow:inset 0 0 0 1px var(--ap-line)}
.ap-count svg{width:14px;height:14px}
/* rangées (populaires) : pochette, titre, écoutes, durée — pas de frise */
.ap-rows{display:grid;border-top:2px solid var(--ap-ink)}
.ap-row{position:relative;display:grid;grid-template-columns:28px 52px minmax(0,1fr) auto auto 40px;gap:14px;align-items:center;min-height:72px;padding:10px 6px;border-bottom:1px solid var(--ap-line);cursor:pointer;transition:background .2s ease}
.ap-row:hover,.ap-row:focus-within{background:var(--ap-acc-soft)}
.ap-row.is-playing{background:color-mix(in oklab,var(--ap-acc-soft),transparent 30%)}
.ap-rank{font-size:12px;color:var(--ap-ink2);text-align:center;position:relative}
.ap-row.is-playing .ap-rank{color:transparent}
.ap-row.is-playing .ap-rank::after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-4.5px;border-radius:50%;background:var(--ap-led);box-shadow:0 0 10px 2px rgba(255,74,74,.6)}
.ap-row-t{min-width:0;display:grid;gap:2px}
.ap-row-t b{font-weight:700;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-row-t small{font-size:11px;color:var(--ap-ink2)}
.ap-row-d{font-size:12px;color:var(--ap-ink2)}
.ap-row-p{font-size:11px;color:var(--ap-ink2);min-width:64px;text-align:right}
.ap-row-go{height:32px;padding:0 12px;border:0;border-radius:999px;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;cursor:pointer;background:transparent;box-shadow:inset 0 0 0 1px var(--ap-line);text-decoration:none;white-space:nowrap}
.ap-row-go svg{width:13px;height:13px}
.ap-row.is-dim{opacity:.55}
.ap-more{position:relative;width:36px;height:36px;border:0;border-radius:50%;background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--ap-ink2);padding:0}
.ap-more:hover{background:var(--ap-acc-soft);color:var(--ap-ink)}
.ap-more svg{width:18px;height:18px}
.ap-menu{position:absolute;right:6px;top:56px;z-index:10;display:grid;gap:2px;min-width:220px;padding:6px;border-radius:20px;background:rgba(246,246,240,.94);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 0 0 1px var(--ap-line),0 20px 40px -20px rgba(11,11,12,.45);animation:ap-menu .25s var(--ap-spring);cursor:default}
@keyframes ap-menu{from{opacity:0;transform:translateY(-6px) scale(.97)}}
.ap-menu a,.ap-menu button{display:flex;align-items:center;gap:10px;height:38px;padding:0 12px;border:0;border-radius:14px;background:transparent;text-decoration:none;font-size:13.5px;cursor:pointer;text-align:left;white-space:nowrap}
.ap-menu a:hover,.ap-menu button:hover,.ap-menu a:focus-visible,.ap-menu button:focus-visible{background:var(--ap-acc-soft)}
.ap-menu svg{width:16px;height:16px;color:var(--ap-ink2)}
.ap-menu small{display:block;font-family:var(--ap-mono);font-size:9.5px;color:var(--ap-ink2);padding:0 12px 6px;max-width:240px;white-space:normal}
/* un seul disque : il occupe la section */
.ap-single{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5cqw,64px);align-items:center}
.ap-single-obj .ap-rec{--sleeve:min(400px,calc((50cqw - 2 * var(--ap-gut)) / 1.52))}
.ap-single-t{display:grid;gap:14px;align-content:center}
.ap-single-t b{font-weight:900;font-stretch:62%;text-transform:uppercase;font-size:clamp(48px,7cqw,96px);line-height:.84;overflow-wrap:anywhere}
.ap-single-t p{max-width:44ch;text-wrap:pretty}
.ap-album-acts{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ap-rule{display:flex;flex-wrap:wrap;border-top:2px solid var(--ap-ink);border-bottom:1px solid var(--ap-ink)}
.ap-rule span{padding:8px 16px 8px 0;margin-right:16px;border-right:1px solid var(--ap-line);font-size:11px}
.ap-rule span:last-child{border-right:0}
/* discographie : les pochettes, sans animation */
.ap-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.ap-seg{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:3px;border-radius:999px;background:rgba(11,11,12,.06)}
.ap-seg button{position:relative;z-index:1;height:32px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:var(--ap-ink2);font-weight:600;font-size:13px;cursor:pointer;white-space:nowrap}
.ap-seg button[aria-checked="true"]{color:var(--ap-ink)}
.ap-seg i{position:absolute;z-index:0;top:3px;bottom:3px;left:3px;border-radius:999px;background:var(--ap-cream);box-shadow:0 0 0 1px var(--ap-line),0 1px 2px rgba(11,11,12,.08);transition:transform .45s var(--ap-spring)}
.ap-shelfwrap{position:relative;margin:0 calc(-1 * var(--ap-gut))}
.ap-shelf{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(200px,22cqw,280px);gap:clamp(18px,2.4cqw,32px);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding:0 var(--ap-gut);padding:22px var(--ap-gut) 18px;scrollbar-width:none}
.ap-shelf::-webkit-scrollbar{display:none}
.ap-item{position:relative;scroll-snap-align:start;display:grid;gap:12px;align-content:start}
.ap-item-obj{position:relative}
.ap-item-obj>a{display:block}
.ap-item-t{display:grid;gap:3px;text-decoration:none}
.ap-item-t:focus-visible{outline:none}
.ap-item:has(.ap-item-t:focus-visible) .ap-poster{box-shadow:0 0 0 3px var(--ap-blue)}
.ap-item-t b{font-weight:700;font-size:15.5px;line-height:1.2;display:flex;gap:6px;align-items:baseline}
.ap-item-t b em{font-style:normal;color:var(--ap-red);font-size:13px}
.ap-item-t small{font-size:11px;color:var(--ap-ink2)}
.ap-item .ap-play{--s:44px;position:absolute;right:10px;bottom:10px;z-index:3;opacity:0;transform:scale(.8);transition:opacity .2s ease,transform .35s var(--ap-spring)}
.ap-item:hover .ap-play,.ap-item:focus-within .ap-play,.ap-item.is-playing .ap-play{opacity:1;transform:none}
.ap-item-soon{position:absolute;left:10px;top:10px;z-index:3;height:24px;padding:0 10px;border-radius:999px;display:inline-flex;align-items:center;font-size:10px;background:rgba(11,11,12,.82);color:var(--ap-cream)}
.ap-arrows{display:flex;gap:6px}
.ap-arrows button{width:40px;height:40px;border:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;background:transparent;box-shadow:inset 0 0 0 1.5px var(--ap-ink);padding:0}
.ap-arrows button:disabled{opacity:.25;cursor:default}
.ap-arrows svg{width:18px;height:18px}
/* à regarder : lecteur YouTube chargé au clic */
.ap-yt{position:relative;aspect-ratio:16/9;max-width:980px;border-radius:24px;overflow:hidden;background:#111 center/cover no-repeat;cursor:pointer;border:0;padding:0;width:100%;display:block;color:#fff}
.ap-yt::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.55))}
.ap-yt>span{position:absolute;left:20px;right:20px;bottom:18px;z-index:1;display:flex;align-items:center;gap:14px;color:#fff;text-align:left}
.ap-yt>span .ap-play{--s:64px;background:var(--ap-cream);color:var(--ap-ink)!important}
.ap-yt b{display:block;font-weight:800;font-size:18px}
.ap-yt small{display:block;font-size:10.5px;opacity:.85}
.ap-yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* écouter ailleurs : les icônes officielles du site (platform-icons.css) */
.ap-else{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.ap-else a{display:flex;align-items:center;gap:14px;height:76px;padding:0 22px 0 14px;border-radius:999px;text-decoration:none;background:var(--ap-paper);box-shadow:inset 0 0 0 1px var(--ap-line);transition:background .2s ease,transform .3s var(--ap-spring)}
.ap-else a:hover{background:var(--ap-acc-soft);transform:translateY(-2px)}
.ap-else .ap-pf{width:48px;height:48px;flex:none;display:grid;place-items:center}
.ap-else .ap-pf .ic{font-size:44px}
.ap-else b{flex:1;font-weight:700;font-size:16px}
.ap-else b small{display:block;font-weight:400;font-size:10.5px;color:var(--ap-ink2)}
.ap-else a:hover .ap-circ,.ap-else a:focus-visible .ap-circ{transform:rotate(-45deg);background:var(--ap-ink);color:var(--ap-cream)}
/* à propos */
.ap-about{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4cqw,56px);align-items:start}
.ap-about-img{position:relative;aspect-ratio:4/5;border-radius:28px;background:var(--ap-acc);overflow:hidden;display:grid;place-items:center}
.ap-about-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ap-about-img .rdisc{width:62%}
.ap-about-img img.ap-logo-disc{position:static;width:62%;height:auto;filter:drop-shadow(0 24px 30px rgba(0,0,0,.35))}
.ap-bio{font-size:clamp(18px,2cqw,22px);line-height:1.45;text-wrap:pretty;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.ap-bio.is-open{-webkit-line-clamp:unset;display:block}
.ap-bio.is-empty{color:var(--ap-ink2);font-size:16px}
.ap-link{border:0;background:transparent;padding:0;font-weight:700;font-size:13px;cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px;justify-self:start}
.ap-fiche{border-top:6px solid var(--ap-ink)}
.ap-fiche div{display:grid;grid-template-columns:minmax(120px,.8fr) 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--ap-ink)}
.ap-fiche div:last-child{border-bottom:2px solid var(--ap-ink)}
.ap-fiche dt{font-size:11px;color:var(--ap-ink2);text-transform:uppercase}
.ap-fiche dd{font-weight:700;font-size:15px;overflow-wrap:anywhere}
.ap-fiche dd a{text-underline-offset:3px}
/* dans le même style */
.ap-peers{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(150px,16cqw,200px);gap:22px;overflow-x:auto;scrollbar-width:none;padding:6px 2px 10px}
.ap-peers::-webkit-scrollbar{display:none}
.ap-peer{display:grid;gap:12px;justify-items:center;text-align:center;text-decoration:none}
.ap-peer .rdisc{width:100%}
.ap-peer b{font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px}
.ap-peer small{font-size:10.5px;color:var(--ap-ink2)}
.ap-peer:hover .ap-circ,.ap-peer:focus-visible .ap-circ{transform:rotate(-45deg);background:var(--ap-ink);color:var(--ap-cream)}
.ap-foot{margin-top:clamp(48px,7cqw,88px);padding-top:18px;padding-bottom:18px;border-top:6px solid var(--ap-ink);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:11px;color:var(--ap-ink2)}
/* ── panneau « À propos » ── */
.ap-scrim{position:fixed;inset:0;z-index:120;background:rgba(11,11,12,.35);animation:ap-fadein .25s ease}
@keyframes ap-fadein{from{opacity:0}}
.ap-side{position:fixed;top:12px;right:12px;bottom:12px;z-index:121;width:min(460px,calc(100% - 24px));display:grid;align-content:start;gap:18px;padding:26px;overflow:auto;border-radius:28px;background:rgba(246,246,240,.95);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 0 0 1px var(--ap-line),0 30px 80px -30px rgba(11,11,12,.6);animation:ap-sidein .5s var(--ap-soft);padding-bottom:26px}
@keyframes ap-sidein{from{transform:translateX(40px);opacity:0}}
.ap-side h3{margin:0;font-weight:900;font-stretch:62%;text-transform:uppercase;font-size:48px;line-height:.84;padding-right:44px}
.ap-side .ap-bio{display:block;font-size:17px}
.ap-x{position:absolute;right:14px;top:14px;width:40px;height:40px;border:0;border-radius:50%;display:grid;place-items:center;background:transparent;box-shadow:inset 0 0 0 1px var(--ap-line);cursor:pointer;padding:0}
.ap-x svg{width:18px;height:18px}
.ap-toast{position:fixed;left:50%;bottom:calc(var(--ap-bottom,7.5rem) + 8px);transform:translateX(-50%);z-index:130;padding:10px 16px;border-radius:999px;background:#0B0B0C;color:#F6F6F0;font:13px/1.3 "Archivo Sillon",Arial,sans-serif;box-shadow:0 14px 30px -14px rgba(11,11,12,.6);animation:ap-fadein .2s ease}
.ap-empty-note{font-size:12px;color:var(--ap-ink2)}
/* Rendu serveur (sans JavaScript, et pour les moteurs), remplacé par ap.js. */
.ap-ssr{padding:calc(var(--ap-top) + 24px) var(--ap-gut) var(--ap-bottom)}
.ap-ssr h1{font-weight:900;font-stretch:62%;text-transform:uppercase;font-size:clamp(56px,12cqw,160px);line-height:.84}
.ap-ssr ul{display:grid;gap:6px;margin-top:24px}
.w-mod-js .ap-ssr{visibility:hidden}
/* ── tablette / mobile ── */
@container ap (max-width:900px){
  .ap-two,.ap-about{grid-template-columns:1fr}
  .ap-row{grid-template-columns:24px 48px minmax(0,1fr) auto 36px}.ap-row-p{display:none}
  .ap-row .ap-thumb{width:48px;height:48px}
  .ap-single{grid-template-columns:1fr}
  .ap-single-obj .ap-rec{--sleeve:min(360px,calc((100cqw - 2 * var(--ap-gut)) / 1.56))}
  .ap-about-img{max-width:460px}
}
/* Mobile : la photo ou la vidéo en ENTIER (jamais rognée), dans un cadre à
 * ses proportions sous la barre du site, puis le nom en dessous. */
@container ap (max-width:700px){
  .ap-hero:not(.is-type){height:auto;min-height:0;overflow:visible;color:var(--ap-ink);padding-top:var(--ap-top);isolation:isolate}
  .ap-hero:not(.is-type) .ap-media{position:relative;inset:auto;margin:0 12px;aspect-ratio:var(--ap-ratio,16/9);max-height:calc(var(--ap-vh)*62);border-radius:22px;overflow:hidden;transform:none!important;box-shadow:0 20px 40px -24px rgba(11,11,12,.55)}
  .ap-hero:not(.is-type) .ap-media video,.ap-hero:not(.is-type) .ap-media img{object-fit:contain;animation:none}
  .ap-hero:not(.is-type) .ap-media .ap-media-bg{display:block;object-fit:cover;filter:blur(24px) saturate(1.2);transform:scale(1.2);opacity:.8}
  .ap-hero:not(.is-type) .ap-shade,.ap-hero:not(.is-type) .ap-dark,.ap-hero:not(.is-type) .ap-fade{display:none}
  .ap-hero:not(.is-type) .ap-hin{position:relative;padding-top:22px;padding-bottom:8px}
  .ap-hero:not(.is-type) .ap-name{text-shadow:none;transform:none!important;opacity:1!important}
  .ap-hero:not(.is-type) .ap-meta{opacity:1;color:var(--ap-ink2)}
  .ap-hero:not(.is-type) .ap-play{background:var(--ap-ink);color:var(--ap-cream)!important}
  .ap-hero:not(.is-type) .ap-ib,.ap-hero:not(.is-type) .ap-cap{background:transparent;box-shadow:inset 0 0 0 1.5px var(--ap-line);color:var(--ap-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
  .ap-hero:not(.is-type) .ap-ib[aria-pressed="true"]{background:var(--ap-ink);color:var(--ap-led)!important}
}
@container ap (max-width:600px){
  .ap{font-size:14.5px}
  .ap-hero.is-type{height:calc(var(--ap-vh)*62);min-height:460px}
  .ap-name{font-size:clamp(56px,21cqw,110px)}
  .ap-hero .ap-play{--s:64px}
  .ap-acts{gap:10px}
  .ap-ib{width:46px;height:46px}
  .ap-cap{height:46px}
  .ap-stage{top:40%;width:60cqw}
  .ap-ghost span{font-size:52cqw}
  .ap-bar b{font-size:22px}
  .ap-h{border-bottom-width:4px}
  .ap-row{grid-template-columns:44px minmax(0,1fr) auto 32px;gap:10px;min-height:66px}.ap-rank,.ap-row-d{display:none}
  .ap-row .ap-thumb{width:44px;height:44px}
  .ap-shelf{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;scroll-snap-type:none}
  .ap-arrows{display:none}
  .ap-item .ap-play{opacity:1;transform:none;--s:38px}
  .ap-rule span{border-right:0}
  .ap-side{top:auto;left:0;right:0;bottom:0;width:100%;max-height:85%;border-radius:28px 28px 0 0}
  .ap-else{grid-template-columns:1fr}
  .ap-else a{height:66px}
  .ap-about-img{aspect-ratio:1}
}
@media (prefers-reduced-motion:reduce){
  .ap *,.ap *::before,.ap *::after{animation:none!important;transition-duration:.01ms!important}
  .ap-media{transform:none!important}
}
.sx-calm .ap *,.sx-calm .ap *::before,.sx-calm .ap *::after{animation:none!important;transition-duration:.01ms!important}
/* Téléphone : la barre du site s'efface quand la barre compacte de l'artiste
   apparaît (html[data-gx-pagebar]) ; celle-ci monte donc tout en haut, et la
   page laisse la place de l'île du bas (platine). */
@media (max-width:700px){
  .ap .ap-bar{top:max(6px,env(safe-area-inset-top))}
  .ap{--ap-bottom:9.5rem}
}
.ap-buy{display:inline-flex;align-items:center;gap:6px;justify-self:start;height:30px;padding:0 12px;border-radius:999px;font-size:12px;font-weight:600;text-decoration:none;box-shadow:inset 0 0 0 1.5px var(--ap-ink);color:var(--ap-ink)!important}
.ap-buy svg{width:14px;height:14px}
.ap-buy:hover{background:var(--ap-ink);color:var(--ap-cream)!important}
.ap-item .ap-amz{font-size:9px}
.ap-cap.is-shop svg{transition:none}
.ap-cap.is-shop:hover svg{transform:none}
