/* ==========================================================================
   Fiche artiste « Ring Pop » (decision Terry 09/10/2026, model ringpopcandy.com,
   colours from the latest cover). Loaded after bouyon-fiche-affiche.css, on the
   page reshaped by scripts/fiche-ringpop.mjs.
   Each block is a full-bleed band (--bg, --rp-fg = giant word, --rp-tx = text,
   set inline per band). A band that fits in the screen sticks at the top and the
   next one slides over it; a taller one (.rp-flow) scrolls like a normal block. Giant words: Big Shoulders Display (« Gratte-ciel »,
   chosen by Terry), fitted to the width by bouyon-fiche-ringpop.js (--fit).
   Values read on ringpopcandy.com: cream #fff7e9, label 16 px / 900 / .5 px,
   tilted bars at 2.5°, giant words around 20 % of the screen width.
   ========================================================================== */
@font-face{font-family:"Big Shoulders Display";src:url(/assets/fonts/big-shoulders-display.woff2) format("woff2");font-weight:100 900;font-display:swap}

html:has(body.fiche-ringpop){background:#fff7e9}
body.fiche-ringpop{background:#fff7e9!important}
main.ringpop::after{content:none!important}
main.ringpop{--rp-font:"Big Shoulders Display",Impact,sans-serif;--rp-pad:max(16px,4vw);color:var(--color-text)}
main.ringpop .fiche-plis,main.ringpop .fiche-fin{display:contents!important}

/* ---- the band ------------------------------------------------------------- */
main.ringpop .rp-band{position:sticky!important;top:0;z-index:1;display:block!important;max-width:none!important;
  margin:0!important;padding:clamp(88px,9vw,140px) var(--rp-pad) clamp(72px,8vw,120px)!important;
  background:var(--bg)!important;color:var(--rp-tx)!important;overflow:clip;border:0!important}
/* the base styles give sections a fixed width (.fiche-listen 720 px, .artist-section 1180 px)
   and the poster turns the top into a two-column grid: a band is always full width, one block */
body.fiche-ringpop main.ringpop .rp-band{display:block!important;width:auto!important;max-width:none!important;grid-template-columns:none!important}
main.ringpop .rp-band > *{max-width:1180px;margin-left:auto;margin-right:auto}
body.fiche-ringpop main.ringpop .rp-band.rp-flow{position:relative!important;top:auto!important}
main.ringpop .rp-band > .rp-giant,main.ringpop .rp-band > .rp-k{max-width:none}
main.ringpop header.rp-band[data-band="hero"]{min-height:100svh;padding-top:clamp(96px,8vw,128px)!important}

.ringpop .rp-k{display:block;margin:0 0 18px!important;text-align:center;font:900 16px/1 "Cabinet Grotesk",var(--font-body),sans-serif!important;
  letter-spacing:.5px!important;text-transform:uppercase!important;color:var(--rp-fg)!important}
main.ringpop .rp-giant{display:block;margin:0 auto!important;padding:0!important;text-align:center;text-transform:uppercase!important;color:var(--rp-fg)!important;
  font-family:var(--rp-font)!important;font-weight:900!important;font-size:var(--fit,15vw)!important;line-height:.82!important;
  letter-spacing:0!important;white-space:nowrap;max-width:none}
/* the bet title has an id-level size in the poster style; the giant words must not be capped */
body.fiche-ringpop main.ringpop .rp-band .rp-giant,body.fiche-ringpop main.ringpop #sec-pari .rp-giant{font-size:var(--fit,15vw)!important;width:auto!important;max-width:none!important}
main.ringpop .rp-giant::after{content:none!important}
.ringpop .rp-line{display:block;overflow:clip;padding:.2em 0 .04em;margin-top:-.16em}
.ringpop .rp-line:first-child{margin-top:0}
.ringpop .rp-in{display:inline-block}
.ringpop.rp-anim .rp-giant:not(.is-in) .rp-in{transform:translateY(105%)}
.ringpop.rp-anim .rp-in{transition:transform 700ms cubic-bezier(.23,1,.32,1)}
.ringpop .rp-line:nth-child(2) .rp-in{transition-delay:70ms}
.ringpop .rp-line:nth-child(3) .rp-in{transition-delay:140ms}

.ringpop .rp-meta,.ringpop .billing{font:800 13px/1.6 "Cabinet Grotesk",var(--font-body),sans-serif!important;letter-spacing:.12em!important;
  text-transform:uppercase!important;color:var(--rp-tx)!important;margin:0}
.ringpop .billing b{color:var(--rp-fg)!important}
.ringpop .rp-sticker{display:block;width:100%;height:auto;transform:rotate(-4deg);box-shadow:0 18px 40px rgba(0,0,0,.28)}
.ringpop .rp-sticker--r{transform:rotate(3.5deg)}

/* pills: listening choice (white, the platform's own logo) and actions */
.ringpop .rp-listen{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.ringpop .rp-plat{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px 0 14px;border-radius:999px;background:#fff;color:#151515!important;
  box-shadow:0 0 0 1.5px rgba(0,0,0,.1);font:800 16px/1 "Cabinet Grotesk",var(--font-body),sans-serif;text-decoration:none!important}
.ringpop .rp-plat img{width:24px!important;height:24px!important;flex:none}
.ringpop .rp-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.ringpop .rp-pill{display:inline-flex;align-items:center;min-height:48px;padding:0 24px;border-radius:999px;background:transparent;color:var(--rp-fg)!important;
  box-shadow:inset 0 0 0 2px var(--rp-fg);font:800 17px/1 "Cabinet Grotesk",var(--font-body),sans-serif;text-decoration:none!important}
.ringpop .rp-plat:active,.ringpop .rp-pill:active{transform:scale(.97)}
.ringpop .rp-plat:focus-visible,.ringpop .rp-pill:focus-visible,.ringpop .rp-big a:focus-visible,.ringpop .rp-next:focus-visible{outline:3px solid var(--rp-fg);outline-offset:4px}
@media (hover:hover){.ringpop .rp-plat{transition:box-shadow 160ms ease-out}.ringpop .rp-plat:hover{box-shadow:0 0 0 2.5px var(--rp-fg)}}

/* ---- colours inside a band ------------------------------------------------------
   Some page components carry their own light colours, made for the old dark page
   (identity card, game counter, « publié par », form labels): inside a band every
   text takes the band's text colour, then the accents come back in --rp-acc (the
   accent at 4.5:1). Measured with an audit of every text against its real background. */
body.fiche-ringpop main.ringpop .rp-band :where(p,li,dt,dd,span,small,em,strong,b,label,figcaption,blockquote,time,h2,h3,h4,summary,a,button,legend,cite,q){color:inherit!important}
body.fiche-ringpop main.ringpop .rp-band :where(a:not(.rp-plat):not(.rp-pill):not(.rp-next),.k-annee,.k-oeuvre,.fiche-lien,.fiche-sec__k,.billing b,.artist-endcard__title em,.jeu-hud__pct,.artist-pari__tag){color:var(--rp-acc)!important}
body.fiche-ringpop main.ringpop .rp-band :where(.fiche-pli__d,.artist-tl-src,.disco-by,small,.parole__aide,.parole__rgpd,.jeu-hud__prog){color:var(--color-text-soft)!important}
body.fiche-ringpop main.ringpop .rp-band :where(input,textarea,select){color:var(--rp-tx)!important;background:transparent!important;border:0!important;box-shadow:inset 0 -2px 0 var(--rule)!important;border-radius:0!important}
body.fiche-ringpop main.ringpop .rp-band :where(input,textarea)::placeholder{color:var(--color-text-soft)!important;opacity:1}
body.fiche-ringpop main.ringpop .rp-band .rp-k,body.fiche-ringpop main.ringpop .rp-band .rp-pill,body.fiche-ringpop main.ringpop .rp-band .fiche-listen__btn,body.fiche-ringpop main.ringpop .rp-band .parole__go{color:var(--rp-acc)!important;box-shadow:inset 0 0 0 2px var(--rp-acc)!important}
/* filled buttons of the page (vote, gift, share, bridge) become outlined pills: a fill in
   the accent colour would carry text of the same colour */
body.fiche-ringpop main.ringpop .rp-band :is(.parole__go,.fiche-gift__btn,.bouyon-chapter__partage-fin button,.bouyon-chapter__partage-fin a,.artist-endcard__cta,.fiche-listen__btn,.artist-music-bridge__listen){
  background:transparent!important;color:var(--rp-acc)!important;box-shadow:inset 0 0 0 2px var(--rp-acc)!important;border:0!important;border-radius:999px!important}
body.fiche-ringpop main.ringpop .rp-band :is(.parole__go,.fiche-gift__btn,.bouyon-chapter__partage-fin button,.bouyon-chapter__partage-fin a,.artist-endcard__cta,.artist-music-bridge__listen) *{color:inherit!important}
/* the « your profile as an image » block is appended by a script at the end of <main>, outside the bands */
body.fiche-ringpop main.ringpop > .kit-artiste{padding:48px var(--rp-pad) 120px;text-align:center;background:#fff7e9;color:#151515}
body.fiche-ringpop main.ringpop > .kit-artiste *{color:#151515!important}
body.fiche-ringpop main.ringpop > .kit-artiste .kit-artiste__btn{background:transparent!important;box-shadow:inset 0 0 0 2px #151515!important;border:0!important;border-radius:999px!important;min-height:48px;padding:0 24px}
body.fiche-ringpop main.ringpop .rp-band .rp-k{box-shadow:none!important}
body.fiche-ringpop main.ringpop .rp-plat{background:#fff!important;color:#151515!important}
body.fiche-ringpop main.ringpop .rp-band .rp-giant,body.fiche-ringpop main.ringpop .rp-band .rp-giant *{color:var(--rp-fg)!important}
body.fiche-ringpop main.ringpop .rp-band .rp-hook{color:var(--rp-fg)!important}

/* ---- 1. the opening ---------------------------------------------------------- */
.ringpop .rp-hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:max(24px,4vw);align-items:center;margin-top:clamp(24px,4vw,56px)!important}
.ringpop .rp-hero .lede{margin:18px 0 0!important;font-size:clamp(17px,1.45vw,21px)!important;line-height:1.5;max-width:62ch;color:var(--rp-tx)!important}

/* ---- 2. tilted bars ------------------------------------------------------------ */
main.ringpop .rp-bars{position:relative;z-index:2;padding:28px 0!important;margin:-40px 0!important;max-width:none!important;pointer-events:none;overflow-x:clip}
main.ringpop .rp-tilt{transform:rotate(-2.5deg);margin:0 -6vw;background:var(--bg)!important}
main.ringpop .rp-tilt--b{transform:rotate(2deg);margin-top:-14px}
.ringpop .rp-bar{display:flex;width:max-content;padding:.12em 0;color:var(--rp-fg);font:900 clamp(44px,8.2vw,112px)/1 var(--rp-font);text-transform:uppercase;white-space:nowrap}
.ringpop .rp-run{display:flex;animation:rp-run 60s linear infinite}
.ringpop .rp-tilt--b .rp-run{animation-direction:reverse}
.ringpop .rp-bar span{padding:0 .28em}
.ringpop .rp-bar i{font-style:normal;opacity:.55}
@keyframes rp-run{to{transform:translateX(-50%)}}

/* the playlist band: one screen, its content centred above the fixed action bar (~104 px);
   it never sticks, so no band ever slides over its bottom */
body.fiche-ringpop main.ringpop section.fiche-listen.rp-band{display:flex!important;flex-direction:column;justify-content:center;grid-template-columns:none!important;
  min-height:100svh;padding:16px 0 112px!important;overflow:hidden}
/* ---- 3. latest release, 5. playlist --------------------------------------------- */
.ringpop .rp-rel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:max(28px,5vw);align-items:center;margin-top:clamp(28px,4vw,64px)!important}
.ringpop .rp-actu{margin-top:16px!important}
.ringpop .rp-actu a{color:var(--rp-tx)!important;text-underline-offset:3px}
.ringpop .rp-hook{margin:0!important;font:800 clamp(24px,2.6vw,38px)/1.15 "Cabinet Grotesk",var(--font-body),sans-serif!important;color:var(--rp-fg)!important}
main.ringpop .rp-mur .fiche-listen__btn{display:inline-flex!important;align-items:center;gap:8px;min-height:48px;margin:0!important;padding:0 24px!important;border-radius:999px!important;
  background:transparent!important;color:var(--rp-fg)!important;box-shadow:inset 0 0 0 2px var(--rp-fg)!important;border:0!important;font:800 17px/1 "Cabinet Grotesk",var(--font-body),sans-serif!important;cursor:pointer}

/* ---- 4. the bet, 8. folded bands: their own titles become the giant word ------ */
main.ringpop .rp-band .fiche-sec__head{margin:0!important;padding:0!important;border:0!important;text-align:center}
main.ringpop .rp-band .fiche-sec__k{display:block;text-align:center;margin:0 0 18px!important;font:900 16px/1 "Cabinet Grotesk",var(--font-body),sans-serif!important;
  letter-spacing:.5px!important;text-transform:uppercase!important;color:var(--rp-fg)!important;opacity:1!important}
main.ringpop details.rp-band > summary{display:block!important;position:relative;grid-template-columns:none!important;text-align:center;cursor:pointer;list-style:none;padding:0!important;margin:0!important;border:0!important}
main.ringpop details.rp-band > summary::-webkit-details-marker{display:none}
main.ringpop details.rp-band > summary .fiche-pli__d{display:block!important;position:static!important;transform:none!important;max-width:60ch;margin-left:auto!important;margin-right:auto!important;margin-top:18px;text-align:center;font:800 13px/1.6 "Cabinet Grotesk",var(--font-body),sans-serif!important;
  letter-spacing:.12em;text-transform:uppercase;color:var(--rp-tx)!important}
main.ringpop details.rp-band > summary .fiche-pli__signe{display:block;margin:22px auto 0;width:48px;height:48px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--rp-fg);position:relative}
main.ringpop details.rp-band > summary .fiche-pli__signe::before,main.ringpop details.rp-band > summary .fiche-pli__signe::after{content:"";position:absolute;left:50%;top:50%;width:18px;height:2px;margin:-1px 0 0 -9px;background:var(--rp-fg)}
main.ringpop details.rp-band > summary .fiche-pli__signe::after{transform:rotate(90deg);transition:transform 200ms cubic-bezier(.23,1,.32,1)}
main.ringpop details.rp-band[open] > summary .fiche-pli__signe::after{transform:rotate(0)}
main.ringpop details.rp-band > .fiche-pli__corps{margin-top:clamp(32px,4vw,56px)!important}

/* ---- 6. the years ---------------------------------------------------------------- */
main.ringpop .rp-band[data-band="fil"] .chap{background:var(--bg)!important;margin-top:24px!important}
main.ringpop .rp-band .fiche-an__y{font-family:var(--rp-font)!important;font-weight:900!important;font-size:clamp(48px,8vw,120px)!important;
  line-height:.85!important;letter-spacing:0!important;color:var(--rp-fg)!important}
main.ringpop .rp-band .fiche-an__y--long{font-size:clamp(40px,6vw,96px)!important}

/* ---- 7. where to listen ------------------------------------------------------------- */
.ringpop .rp-big{list-style:none;margin:clamp(24px,3vw,48px) auto 0!important;padding:0!important;max-width:1180px}
.ringpop .rp-big li{border-top:1px solid var(--rule)!important;margin:0!important;padding:0!important}
.ringpop .rp-big li:last-child{border-bottom:1px solid var(--rule)!important}
.ringpop .rp-big a{display:flex;align-items:center;gap:.3em;padding:.12em 0;text-decoration:none!important;color:var(--rp-fg)!important;
  font:900 clamp(48px,8.5vw,136px)/1 var(--rp-font)!important;text-transform:uppercase}
.ringpop .rp-big__logo{display:grid;place-items:center;width:.82em;height:.82em;flex:none;border-radius:50%;background:#fff!important}
.ringpop .rp-big__logo img{width:58%!important;height:58%!important}
.ringpop .rp-big__txt{display:flex;flex-direction:column;gap:.12em}
.ringpop .rp-big__sub{font:800 13px/1.2 "Cabinet Grotesk",var(--font-body),sans-serif;letter-spacing:.12em;color:var(--rp-tx)}
.ringpop .rp-big__go{margin-left:auto;font-size:.42em}
@media (hover:hover){.ringpop .rp-big a{transition:color 160ms ease-out}.ringpop .rp-big a:hover{color:var(--rp-tx)!important}}
.ringpop .rp-follow{margin-top:28px!important;text-align:center}
.ringpop .rp-follow a{display:inline-flex;align-items:center;gap:10px;color:var(--rp-tx)!important;font:800 17px/1 "Cabinet Grotesk",var(--font-body),sans-serif;text-decoration:none!important}
.ringpop .rp-follow img{width:24px;height:24px}

/* ---- 10. the next artist --------------------------------------------------------------- */
.ringpop .rp-next{display:block;text-align:center;text-decoration:none!important}
.ringpop .rp-next__pf{width:min(440px,72vw)!important;margin:clamp(24px,3vw,44px) auto 0;transform:rotate(3deg)}
@media (hover:hover){.ringpop .rp-next__pf{transition:transform 200ms cubic-bezier(.23,1,.32,1)}.ringpop .rp-next:hover .rp-next__pf{transform:rotate(0)}}

/* the bottom bar stays readable over every band */
main.ringpop .artist-actionbar{z-index:60;background:#151515!important;color:#fff7e9;--color-text:#fff7e9;--color-text-soft:rgba(255,247,233,.7)}

@media (max-width:720px){
  .ringpop .rp-hero,.ringpop .rp-rel{grid-template-columns:1fr}
  .ringpop .rp-hero .rp-sticker{width:78%;margin:0 auto}
  .ringpop .rp-rel .rp-sticker{width:80%;margin:0 auto}
  }
@media (prefers-reduced-motion:reduce){
  .ringpop .rp-run{animation:none}
  .ringpop.rp-anim .rp-giant:not(.is-in) .rp-in{transform:none}
}

/* ==========================================================================
   « La mise » — the bet (Terry 09/10/2026, chosen among three stagings).
   Built by src/scripts/site/bouyon-fiche-mise.js. A chip is Terry's logo on a round token
   (the white logo file as a stencil, so it takes each page's colours). Answers are spaced
   for big fingers (« ne colle pas trop les réponses »): 64 px minimum height, 20-22 px apart,
   far above WCAG 2.2 target spacing (2.5.8, 24 px) and Apple's 44 pt.
   ========================================================================== */
.g-token{position:relative;display:inline-block;flex:none;width:1em;height:1em;border-radius:50%!important;background:var(--rp-fg);
  box-shadow:0 .06em 0 color-mix(in srgb,#000 35%,var(--rp-fg))}
/* the poster style strips the background, border and shadow of everything inside a section */
body.fiche-ringpop main.ringpop .g-token{background:var(--rp-fg)!important;border-radius:50%!important;box-shadow:0 .06em 0 color-mix(in srgb,#000 35%,var(--rp-fg))!important}
.g-token::before{content:"";position:absolute;inset:7%;border-radius:50%;border:.045em dashed var(--bg)}
.g-token::after{content:"";position:absolute;inset:19%;background:var(--bg);
  -webkit-mask:url(/assets/images/logo-blanc-400-a1369833.webp) center/contain no-repeat;mask:url(/assets/images/logo-blanc-400-a1369833.webp) center/contain no-repeat}
.g-token.g-token--fly{position:fixed;z-index:200;font-size:44px;pointer-events:none}

main.ringpop #pane-pari.is-mise{max-width:1180px;margin:0 auto}
body.fiche-ringpop main.ringpop .g-son{position:absolute;top:clamp(88px,9vw,140px);right:var(--rp-pad);z-index:3;min-height:44px;padding:0 16px;border-radius:999px!important;border:0;cursor:pointer;
  background:transparent!important;color:var(--rp-acc)!important;box-shadow:inset 0 0 0 2px var(--rp-acc)!important;font:800 14px/1 "Cabinet Grotesk",sans-serif}
body.fiche-ringpop main.ringpop .g-stage{margin:clamp(24px,4vw,56px) auto 0;text-align:left}
body.fiche-ringpop main.ringpop .g-scene{position:relative}
body.fiche-ringpop main.ringpop .g-top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:clamp(20px,3vw,40px)}
body.fiche-ringpop main.ringpop .g-num{font:900 clamp(48px,7vw,104px)/.8 var(--rp-font);color:var(--rp-fg)!important}
body.fiche-ringpop main.ringpop .g-score{display:inline-flex;align-items:center;gap:.14em;font:900 clamp(48px,7vw,104px)/.8 var(--rp-font);color:var(--rp-tx)!important}
body.fiche-ringpop main.ringpop .g-score .g-token{font-size:.72em}
body.fiche-ringpop main.ringpop .g-score small{font:800 15px/1 "Cabinet Grotesk",sans-serif;letter-spacing:.12em;text-transform:uppercase;align-self:flex-end;margin-bottom:.3em}
body.fiche-ringpop main.ringpop .g-delta{position:absolute;right:0;top:-34px;font:900 32px/1 var(--rp-font);color:var(--rp-fg)!important;animation:g-up 1.4s cubic-bezier(.23,1,.32,1) forwards}
body.fiche-ringpop main.ringpop .g-delta.is-down{color:var(--color-text-soft)!important}
@keyframes g-up{0%{transform:translateY(16px);opacity:0}20%{transform:none;opacity:1}75%{opacity:1}100%{transform:translateY(-14px);opacity:0}}
body.fiche-ringpop main.ringpop .g-tag{margin:0 0 10px!important;font:800 13px/1 "Cabinet Grotesk",sans-serif!important;letter-spacing:.14em;text-transform:uppercase;color:var(--rp-acc)!important}
body.fiche-ringpop main.ringpop .g-q{margin:0 0 clamp(20px,3vw,32px)!important;max-width:22ch;font:800 clamp(30px,4.4vw,64px)/1.04 "Cabinet Grotesk",sans-serif!important;letter-spacing:-.025em!important;color:var(--rp-tx)!important}

/* the stake: 1, 2 or 3 chips */
body.fiche-ringpop main.ringpop .g-mise{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin:0 0 clamp(22px,3vw,34px)}
body.fiche-ringpop main.ringpop .g-mise__k{font:800 14px/1 "Cabinet Grotesk",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--rp-tx)!important;margin-right:4px}
body.fiche-ringpop main.ringpop .g-chip{display:inline-flex;align-items:center;gap:10px;min-height:64px;min-width:64px;padding:0 18px 0 12px;border:0!important;border-radius:999px!important;cursor:pointer;
  background:transparent!important;color:var(--rp-tx)!important;box-shadow:inset 0 0 0 2px var(--rule)!important;transition:transform 200ms cubic-bezier(.23,1,.32,1),box-shadow 200ms}
body.fiche-ringpop main.ringpop .g-chip b{font:900 30px/1 var(--rp-font)}
body.fiche-ringpop main.ringpop .g-stack{display:inline-flex;font-size:40px}
body.fiche-ringpop main.ringpop .g-stack .g-token + .g-token{margin-left:-.62em}
body.fiche-ringpop main.ringpop .g-chip[aria-pressed="true"]{transform:translateY(-4px);box-shadow:inset 0 0 0 3px var(--rp-fg)!important;color:var(--rp-fg)!important}
body.fiche-ringpop main.ringpop .g-chip:active{transform:scale(.96)}
body.fiche-ringpop main.ringpop .g-chip:disabled{cursor:default}
body.fiche-ringpop main.ringpop .g-chip:disabled:not([aria-pressed="true"]){opacity:.45}

/* the answers: giant words, well apart */
body.fiche-ringpop main.ringpop .g-rows{display:grid;gap:20px}
body.fiche-ringpop main.ringpop .g-row{position:relative;display:flex;align-items:center;gap:clamp(12px,2vw,28px);width:100%;min-height:64px;padding:.12em clamp(10px,1.4vw,18px);border:0!important;
  border-bottom:2px solid var(--rule)!important;background:none!important;cursor:pointer;text-align:left;overflow:hidden;isolation:isolate;border-radius:0!important}
body.fiche-ringpop main.ringpop .g-l{flex:none;width:1.4em;font:900 clamp(22px,2.6vw,36px)/1 var(--rp-font);color:var(--rp-acc)!important}
body.fiche-ringpop main.ringpop .g-t{font:900 clamp(34px,5.6vw,88px)/.95 var(--rp-font);text-transform:uppercase;color:var(--rp-fg)!important;transition:color 200ms,transform 200ms cubic-bezier(.23,1,.32,1)}
@media (hover:hover){body.fiche-ringpop main.ringpop .g-row:not(:disabled):hover .g-t{color:var(--rp-tx)!important;transform:translateX(.1em)}}
body.fiche-ringpop main.ringpop .g-row:active .g-t{transform:scale(.98)}
body.fiche-ringpop main.ringpop .g-row::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--rp-fg);transform:scaleY(0);transform-origin:bottom;transition:transform 380ms cubic-bezier(.23,1,.32,1)}
body.fiche-ringpop main.ringpop .g-row.good::before{transform:scaleY(1)}
body.fiche-ringpop main.ringpop .g-row.good .g-t,body.fiche-ringpop main.ringpop .g-row.good .g-l{color:var(--bg)!important}
body.fiche-ringpop main.ringpop .g-row.good .g-l::after{content:" ✓"}
body.fiche-ringpop main.ringpop .g-row::after{content:"";position:absolute;left:0;right:0;top:52%;height:8px;background:var(--rp-tx);transform:scaleX(0);transform-origin:left;transition:transform 320ms cubic-bezier(.23,1,.32,1)}
body.fiche-ringpop main.ringpop .g-row.bad::after{transform:scaleX(1)}
body.fiche-ringpop main.ringpop .g-row.bad .g-t{opacity:.5}
body.fiche-ringpop main.ringpop .g-row.other{opacity:.28}
body.fiche-ringpop main.ringpop .g-fact{margin:24px 0 0!important;max-width:46ch;font:700 clamp(18px,1.9vw,26px)/1.35 "Cabinet Grotesk",sans-serif!important;color:var(--rp-tx)!important;animation:g-in 360ms cubic-bezier(.23,1,.32,1)}
@keyframes g-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
body.fiche-ringpop main.ringpop .g-next{display:inline-flex;align-items:baseline;gap:.2em;min-height:64px;margin-top:18px;padding:0;border:0!important;background:none!important;cursor:pointer;
  font:900 clamp(44px,6.5vw,96px)/.9 var(--rp-font);text-transform:uppercase;color:var(--rp-fg)!important;animation:g-in 360ms cubic-bezier(.23,1,.32,1) 120ms both}
body.fiche-ringpop main.ringpop .g-next span{transition:transform 200ms cubic-bezier(.23,1,.32,1)}
@media (hover:hover){body.fiche-ringpop main.ringpop .g-next:hover span{transform:translateX(10px)}}
body.fiche-ringpop main.ringpop :is(.g-row,.g-next,.g-chip,.g-son):focus-visible{outline:3px solid var(--rp-fg);outline-offset:4px}

/* the end: the pile, giant; the page's own verdict follows (its score line is shown here) */
body.fiche-ringpop main.ringpop .g-end{text-align:center;padding:clamp(12px,3vw,40px) 0}
body.fiche-ringpop main.ringpop .g-end .g-tag{text-align:center}
body.fiche-ringpop main.ringpop .g-final{display:inline-flex;align-items:center;gap:.08em;margin:0!important;font:900 clamp(150px,26vw,360px)/.8 var(--rp-font)!important;color:var(--rp-fg)!important}
body.fiche-ringpop main.ringpop .g-final .g-token{font-size:.6em}
body.fiche-ringpop main.ringpop .g-verdict{margin:12px auto 0!important;font:900 clamp(32px,4vw,56px)/1 var(--rp-font)!important;color:var(--rp-tx)!important}
body.fiche-ringpop main.ringpop .artist-endcard--verdict.is-mise .artist-pari__score-final{display:none!important}
body.fiche-ringpop main.ringpop .g-confetti{position:absolute;inset:0;pointer-events:none;z-index:5}
body.fiche-ringpop main.ringpop .g-confetti i{position:absolute;left:50%;top:55%;width:12px;height:18px;border-radius:2px;animation:g-conf var(--d) cubic-bezier(.23,1,.32,1) forwards}
@keyframes g-conf{to{transform:translate(var(--x),var(--y)) rotate(var(--r));opacity:0}}
@media (max-width:720px){
  body.fiche-ringpop main.ringpop .g-rows{gap:22px}
  body.fiche-ringpop main.ringpop .g-son{top:72px}
  body.fiche-ringpop main.ringpop .g-mise{gap:10px}
  body.fiche-ringpop main.ringpop .g-mise__k{flex-basis:100%}
  body.fiche-ringpop main.ringpop .g-chip{padding:0 14px 0 10px;gap:8px}
  body.fiche-ringpop main.ringpop .g-stack{font-size:32px}
}
@media (prefers-reduced-motion:reduce){
  body.fiche-ringpop main.ringpop :is(.g-fact,.g-next,.g-delta){animation:none!important}
}

/* ==========================================================================
   « Partager » — rebuilt by scripts/fiche-ringpop.mjs (Terry 09/10/2026: « la section partager
   est moche »): the giant word, then big buttons. The page's own share button stays (its
   script shares on phones and copies elsewhere); shown only where the device can share.
   ========================================================================== */
body.fiche-ringpop main.ringpop .rp-share{text-align:center}
body.fiche-ringpop main.ringpop .rp-share__txt{margin:22px auto 0!important;max-width:44ch;font:700 clamp(18px,1.8vw,24px)/1.35 "Cabinet Grotesk",sans-serif!important;color:var(--rp-tx)!important}
body.fiche-ringpop main.ringpop .rp-share__row{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:32px}
body.fiche-ringpop main.ringpop .rp-share__row [hidden]{display:none!important}
body.fiche-ringpop main.ringpop .rp-band .rp-share .rp-sbtn{display:inline-flex!important;align-items:center;gap:12px;min-height:60px;padding:0 26px 0 12px!important;cursor:pointer;border:0!important;border-radius:999px!important;
  background:#fff!important;color:#151515!important;box-shadow:0 6px 0 rgba(0,0,0,.18)!important;font:800 19px/1 "Cabinet Grotesk",sans-serif!important;text-decoration:none!important;text-transform:none!important;letter-spacing:0!important}
body.fiche-ringpop main.ringpop .rp-band .rp-share .rp-sbtn *{color:#151515!important}
body.fiche-ringpop main.ringpop .rp-band .rp-share .rp-sbtn:active{transform:scale(.96)}
body.fiche-ringpop main.ringpop .rp-band .rp-share .rp-sbtn .rp-sic{display:grid;place-items:center;width:40px;height:40px;border-radius:50%!important;flex:none;background:var(--bg)!important}
body.fiche-ringpop main.ringpop .rp-band .rp-share .rp-sbtn .rp-sic svg{width:22px;height:22px;color:var(--rp-fg)!important;stroke:var(--rp-fg)}
body.fiche-ringpop main.ringpop .rp-share .kit-artiste__dit{margin-top:14px;color:var(--rp-tx)!important}

/* ---- the right answer: chips burst, shock ring, ✓ stamp, flash (bouyon-fiche-mise.js) ---- */
.fx-layer{position:fixed;inset:0;pointer-events:none;z-index:300}
.fx-layer .fx-token{position:fixed;left:0;top:0}
.fx-ring{position:fixed;z-index:299;width:60px;height:60px;border-radius:50%;border:5px solid;pointer-events:none}
body.fiche-ringpop main.ringpop .fx-stamp{position:absolute;right:clamp(12px,3vw,40px);top:50%;display:grid;place-items:center;width:1.25em;height:1.25em;border-radius:50%!important;
  background:var(--bg)!important;color:var(--rp-fg)!important;font:900 clamp(34px,4vw,56px)/1 var(--rp-font);box-shadow:0 0 0 4px var(--rp-fg)!important;z-index:2}
body.fiche-ringpop main.ringpop .fx-flash{position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(circle at 50% 60%,var(--rp-fg),transparent 70%)!important;mix-blend-mode:screen}

/* ==========================================================================
   The end of the bet: the pile, the streak, the email, the gift to open
   (src/scripts/site/bouyon-fiche-fin.js, Terry 09/10/2026 « la pile et la série »).
   The page's own mail form under the verdict is replaced by this one.
   ========================================================================== */
body.fiche-ringpop main.ringpop .artist-endcard--verdict.is-mise [data-pari-mail]{display:none!important}
body.fiche-ringpop main.ringpop .fin{position:relative;max-width:1180px;margin:clamp(40px,6vw,80px) auto 0;padding-top:clamp(28px,4vw,56px);border-top:2px solid var(--rule);text-align:center}
body.fiche-ringpop main.ringpop .fin-k{text-align:left}
body.fiche-ringpop main.ringpop .fin-pile{display:flex;align-items:flex-end;justify-content:center;gap:clamp(24px,5vw,72px)}
body.fiche-ringpop main.ringpop .fin-tower{position:relative;width:120px;height:min(46vh,400px);font-size:110px}
body.fiche-ringpop main.ringpop .fin-chip{position:absolute;left:50%;bottom:calc(var(--k) * 15px);transform:translateX(-50%);height:.32em}
body.fiche-ringpop main.ringpop .fin-chip::before{inset:10% 7%}
body.fiche-ringpop main.ringpop .fin-chip::after{display:none}
body.fiche-ringpop main.ringpop .fin-seal{position:absolute;left:50%;top:50%;font-size:150px;transform:translate(-50%,-50%);z-index:3;box-shadow:0 0 0 10px var(--bg),0 18px 40px rgba(0,0,0,.4)!important}
body.fiche-ringpop main.ringpop .fin.is-safe .fin-tower{filter:drop-shadow(0 0 24px var(--rp-fg))}
body.fiche-ringpop main.ringpop .fin-side{text-align:left}
body.fiche-ringpop main.ringpop .fin-count{display:block;font:900 clamp(120px,18vw,240px)/.8 var(--rp-font);color:var(--rp-fg)!important;font-variant-numeric:tabular-nums}
body.fiche-ringpop main.ringpop .fin-verse{margin:10px 0 0!important;font:800 15px/1.2 "Cabinet Grotesk",sans-serif!important;letter-spacing:.1em;text-transform:uppercase;color:var(--rp-acc)!important}
body.fiche-ringpop main.ringpop .fin-grade{margin:10px 0 0!important;font:800 clamp(20px,2.4vw,30px)/1.1 "Cabinet Grotesk",sans-serif!important;color:var(--rp-tx)!important}
body.fiche-ringpop main.ringpop .fin-serie{position:relative;margin-top:clamp(36px,5vw,64px);text-align:left}
body.fiche-ringpop main.ringpop .fin-bonus{position:absolute;right:0;top:-6px;margin:0!important;font:900 clamp(28px,3.4vw,44px)/1 var(--rp-font)!important;color:var(--rp-fg)!important;animation:g-up 2.2s cubic-bezier(.23,1,.32,1) forwards}
body.fiche-ringpop main.ringpop .fin-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(8px,1.4vw,18px);list-style:none;margin:20px 0 0!important;padding:0!important}
body.fiche-ringpop main.ringpop .fin-day{display:flex;flex-direction:column;align-items:center;gap:6px;opacity:.45;margin:0!important}
body.fiche-ringpop main.ringpop .fin-day .g-token{font-size:clamp(40px,6vw,84px);filter:grayscale(1)}
body.fiche-ringpop main.ringpop .fin-day b{font:900 clamp(15px,1.8vw,24px)/1 var(--rp-font);text-transform:uppercase;color:var(--rp-tx)!important}
body.fiche-ringpop main.ringpop .fin-day small{font:700 13px/1.2 "Cabinet Grotesk",sans-serif;color:var(--color-text-soft)!important}
body.fiche-ringpop main.ringpop .fin-day.is-on{opacity:1}
body.fiche-ringpop main.ringpop .fin-day.is-on .g-token{filter:none}
body.fiche-ringpop main.ringpop .fin-day.is-today .g-token{font-size:clamp(52px,8vw,112px)}
body.fiche-ringpop main.ringpop .fin-rdv{margin:18px 0 0!important;text-align:center;font:800 clamp(17px,1.8vw,22px)/1.3 "Cabinet Grotesk",sans-serif!important;color:var(--rp-tx)!important}
body.fiche-ringpop main.ringpop .fin-rdv__a{color:var(--rp-acc)!important;text-underline-offset:4px}
body.fiche-ringpop main.ringpop .fin-txt{max-width:640px;margin:clamp(32px,4vw,56px) auto 0}
body.fiche-ringpop main.ringpop .fin-h{margin:0!important;font:900 clamp(40px,6vw,92px)/.9 var(--rp-font)!important;text-transform:uppercase;color:var(--rp-fg)!important}
body.fiche-ringpop main.ringpop .fin-p{margin:14px auto 0!important;max-width:46ch;font:700 clamp(17px,1.6vw,21px)/1.4 "Cabinet Grotesk",sans-serif!important;color:var(--rp-tx)!important}
body.fiche-ringpop main.ringpop .fin-form{margin-top:24px}
body.fiche-ringpop main.ringpop .fin-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
body.fiche-ringpop main.ringpop .rp-band .fin-input{flex:1 1 260px;max-width:380px;min-height:60px;padding:0 22px!important;border-radius:999px!important;border:0!important;
  background:#fff!important;color:#151515!important;font:700 18px/1 "Cabinet Grotesk",sans-serif!important;box-shadow:0 6px 0 rgba(0,0,0,.18)!important}
body.fiche-ringpop main.ringpop .rp-band .fin-input::placeholder{color:#6b6b6b!important}
body.fiche-ringpop main.ringpop .fin-go{min-height:60px;padding:0 28px;border-radius:999px!important;border:0!important;cursor:pointer;background:var(--rp-fg)!important;color:var(--bg)!important;
  font:900 24px/1 var(--rp-font)!important;text-transform:uppercase;box-shadow:0 6px 0 color-mix(in srgb,#000 35%,var(--rp-fg))!important}
body.fiche-ringpop main.ringpop .fin-go:active{transform:translateY(4px)}
body.fiche-ringpop main.ringpop .fin-opt{display:flex;gap:10px;align-items:flex-start;max-width:520px;margin:16px auto 0;text-align:left;font:600 14px/1.4 "Cabinet Grotesk",sans-serif;color:var(--color-text-soft)!important;cursor:pointer}
body.fiche-ringpop main.ringpop .fin-opt input{width:22px;height:22px;flex:none;accent-color:var(--rp-fg);margin-top:1px}
body.fiche-ringpop main.ringpop .fin-msg{min-height:1.2em;margin-top:10px!important;color:var(--rp-tx)!important}
body.fiche-ringpop main.ringpop .fin-ok{margin:18px auto 0!important;max-width:30ch;font:900 clamp(28px,3.6vw,52px)/1.05 var(--rp-font)!important;text-transform:uppercase;color:var(--rp-fg)!important}
/* the gift waits for the visitor: it pops in once the pile has landed, then breathes */
body.fiche-ringpop main.ringpop .fin-cadeau{display:inline-flex;align-items:center;gap:14px;min-height:72px;margin-top:clamp(28px,4vw,48px);padding:0 30px 0 18px;border:0!important;border-radius:999px!important;cursor:pointer;
  background:#fff!important;color:#151515!important;box-shadow:0 7px 0 rgba(0,0,0,.22),0 0 0 4px var(--rp-fg)!important;font:900 clamp(24px,2.6vw,32px)/1 var(--rp-font)!important;text-transform:uppercase}
body.fiche-ringpop main.ringpop .fin-cadeau *{color:#151515!important}
body.fiche-ringpop main.ringpop .fin-cadeau[hidden]{display:none!important}
body.fiche-ringpop main.ringpop .fin-cadeau__ic{font-size:40px;line-height:1;animation:fin-wiggle 2.4s cubic-bezier(.23,1,.32,1) 1s infinite}
body.fiche-ringpop main.ringpop .fin-cadeau:active{transform:translateY(4px) scale(.98)}
body.fiche-ringpop main.ringpop .fin-cadeau:focus-visible{outline:3px solid var(--rp-fg);outline-offset:6px}
@keyframes fin-wiggle{0%,70%,100%{transform:none}76%{transform:rotate(-14deg) scale(1.15)}82%{transform:rotate(12deg) scale(1.15)}88%{transform:rotate(-8deg)}94%{transform:rotate(4deg)}}
@media (max-width:720px){
  body.fiche-ringpop main.ringpop .fin-days{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:22px}
  body.fiche-ringpop main.ringpop .fin-tower{width:90px;font-size:84px;height:300px}
  body.fiche-ringpop main.ringpop .fin-chip{bottom:calc(var(--k) * 11px)}
}
@media (prefers-reduced-motion:reduce){body.fiche-ringpop main.ringpop .fin-cadeau__ic,body.fiche-ringpop main.ringpop .fin-bonus{animation:none!important}}

/* ==========================================================================
   The gift (src/scripts/site/bouyon-fiche-cadeau3d.js, Terry 09/10/2026): the 3D box with
   Terry's seal, the card that rises out of it, the button to the playlist band.
   The older « Un cadeau pour toi » band would be a second gift for the same playlist: hidden.
   ========================================================================== */
body.fiche-ringpop main.ringpop section.fiche-gift{display:none!important}
body.fiche-ringpop main.ringpop .cad{position:relative;margin:clamp(40px,6vw,72px) auto 0;text-align:center;perspective:1200px}
body.fiche-ringpop main.ringpop .cad-stage{position:relative;width:min(440px,86vw);margin:0 auto;transition:width 700ms cubic-bezier(.23,1,.32,1)}
/* once open, the box steps back so box + card fit in one screen */
body.fiche-ringpop main.ringpop .cad.is-revealed .cad-stage{width:min(200px,48vw)}
body.fiche-ringpop main.ringpop .cad-box{position:relative;z-index:2;display:block;width:100%;height:auto;cursor:pointer;filter:drop-shadow(0 24px 30px rgba(0,0,0,.35))}
body.fiche-ringpop main.ringpop .cad-rays{position:absolute;left:50%;top:42%;z-index:1;width:160%;aspect-ratio:1;transform:translate(-50%,-50%) scale(.2);opacity:0;pointer-events:none;border-radius:50%!important;
  background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--rp-fg) 75%,#fff) 0deg 7deg,transparent 7deg 18deg)!important;
  -webkit-mask:radial-gradient(circle,#000 0 18%,transparent 62%);mask:radial-gradient(circle,#000 0 18%,transparent 62%);transition:transform 700ms cubic-bezier(.23,1,.32,1),opacity 500ms ease-out}
body.fiche-ringpop main.ringpop .cad.is-open .cad-rays{transform:translate(-50%,-50%) scale(1);opacity:.9;animation:cad-spin 14s linear infinite}
@keyframes cad-spin{to{transform:translate(-50%,-50%) scale(1) rotate(360deg)}}
body.fiche-ringpop main.ringpop .cad-open{position:relative;z-index:3;margin-top:-6px;min-height:60px;padding:0 30px;border:0!important;border-radius:999px!important;cursor:pointer;
  background:#fff!important;color:#151515!important;box-shadow:0 7px 0 rgba(0,0,0,.22),0 0 0 4px var(--rp-fg)!important;font:900 clamp(24px,2.6vw,30px)/1 var(--rp-font)!important;text-transform:uppercase;animation:cad-call 2.2s cubic-bezier(.23,1,.32,1) infinite}
body.fiche-ringpop main.ringpop .cad-open[hidden]{display:none!important}
@keyframes cad-call{0%,60%,100%{transform:none}70%{transform:scale(1.06) rotate(-2deg)}80%{transform:scale(1.04) rotate(2deg)}90%{transform:scale(1.02)}}
body.fiche-ringpop main.ringpop .cad-open:focus-visible,body.fiche-ringpop main.ringpop .cad-go:focus-visible{outline:3px solid var(--rp-fg);outline-offset:6px}

/* the card */
body.fiche-ringpop main.ringpop .cad-card{position:relative;z-index:4;width:min(380px,88vw);margin:-40px auto 0;perspective:900px}
body.fiche-ringpop main.ringpop .cad-card[hidden]{display:none!important}
body.fiche-ringpop main.ringpop .cad-card__in{position:relative;overflow:hidden;padding:22px 20px 22px;border-radius:22px!important;color:#151515!important;
  background:linear-gradient(160deg,#fff7e9,#f2e8ff 55%,#e6fbff)!important;box-shadow:0 30px 60px rgba(0,0,0,.4),0 0 0 4px #fff,0 0 0 8px var(--rp-fg)!important;
  transform:rotateX(var(--rx,0)) rotateY(var(--ry,0));transform-style:preserve-3d;transition:transform 160ms ease-out;animation:cad-breathe 5s ease-in-out infinite}
@keyframes cad-breathe{0%,100%{translate:0 0}50%{translate:0 -6px}}
body.fiche-ringpop main.ringpop .cad-card__in *{color:#151515!important}
body.fiche-ringpop main.ringpop .cad-card__sheen{position:absolute;inset:-20%;pointer-events:none;mix-blend-mode:color-dodge;opacity:.55;
  background:radial-gradient(circle at var(--sx,50%) var(--sy,30%),rgba(255,255,255,.9),transparent 30%),conic-gradient(from 90deg at var(--sx,50%) var(--sy,50%),#ff4fd8,#4ff3ff,#d6ff4f,#ffb84f,#ff4fd8)!important;animation:cad-holo 6s linear infinite}
@keyframes cad-holo{to{filter:hue-rotate(360deg)}}
body.fiche-ringpop main.ringpop .cad-card__top{position:relative;display:flex;align-items:center;gap:12px}
body.fiche-ringpop main.ringpop .cad-card__pf{width:52px;height:52px;border-radius:50%!important;object-fit:cover;box-shadow:0 0 0 3px #fff,0 0 0 5px #151515!important}
body.fiche-ringpop main.ringpop .cad-card__artist{margin:0!important;font:900 28px/1 var(--rp-font)!important;text-transform:uppercase;text-align:left}
body.fiche-ringpop main.ringpop .cad-card__rank{position:relative;display:block;width:62%;height:auto;margin:14px auto 0;filter:drop-shadow(0 14px 18px rgba(0,0,0,.3))}
body.fiche-ringpop main.ringpop .cad-card__who{position:relative;margin:8px 0 0!important;font:900 clamp(26px,3vw,34px)/1 var(--rp-font)!important;text-transform:uppercase}
body.fiche-ringpop main.ringpop .cad-card__stats{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:16px 0 0!important}
body.fiche-ringpop main.ringpop .cad-card__stats div{padding:8px 2px;border-radius:12px!important;background:rgba(255,255,255,.65)!important}
body.fiche-ringpop main.ringpop .cad-card__stats dt{font:800 10px/1 "Cabinet Grotesk",sans-serif;letter-spacing:.1em;text-transform:uppercase}
body.fiche-ringpop main.ringpop .cad-card__stats dd{margin:6px 0 0!important;font:900 22px/1 var(--rp-font)}
body.fiche-ringpop main.ringpop .cad-card__k{position:relative;margin:16px 0 8px!important;font:800 11px/1 "Cabinet Grotesk",sans-serif!important;letter-spacing:.14em;text-transform:uppercase}
body.fiche-ringpop main.ringpop .cad-card__badges{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;list-style:none;margin:0!important;padding:0!important}
body.fiche-ringpop main.ringpop .cad-badge{position:relative;display:flex;flex-direction:column;align-items:center;width:84px;margin:0!important}
body.fiche-ringpop main.ringpop .cad-badge img{width:70px;height:70px;filter:drop-shadow(0 6px 8px rgba(0,0,0,.25))}
body.fiche-ringpop main.ringpop .cad-badge__nom{margin-top:4px;font:800 11px/1.15 "Cabinet Grotesk",sans-serif}
body.fiche-ringpop main.ringpop .cad-badge__new{position:absolute;top:-6px;right:-2px;padding:3px 7px;border-radius:999px!important;background:#151515!important;color:#fff!important;font:900 11px/1 var(--rp-font);text-transform:uppercase;transform:rotate(8deg)}
body.fiche-ringpop main.ringpop .cad-card__next{position:relative;margin:14px 0 0!important;font:800 13px/1.3 "Cabinet Grotesk",sans-serif!important}
body.fiche-ringpop main.ringpop .cad-go{display:inline-flex;align-items:center;gap:10px;min-height:64px;margin-top:28px;padding:0 30px;border-radius:999px!important;text-decoration:none!important;
  background:var(--rp-fg)!important;color:var(--bg)!important;box-shadow:0 7px 0 color-mix(in srgb,#000 35%,var(--rp-fg))!important;font:900 clamp(24px,2.8vw,32px)/1 var(--rp-font)!important;text-transform:uppercase}
body.fiche-ringpop main.ringpop .cad-go[hidden]{display:none!important}
body.fiche-ringpop main.ringpop .cad-go:active{transform:translateY(4px)}
/* the playlist band answers the button */
body.fiche-ringpop main.ringpop section.fiche-listen.is-cadeau{animation:cad-arrive 1.2s cubic-bezier(.23,1,.32,1)}
@keyframes cad-arrive{0%{filter:brightness(1.6) saturate(1.4)}100%{filter:none}}
@media (prefers-reduced-motion:reduce){body.fiche-ringpop main.ringpop :is(.cad-open,.cad-card__in,.cad-card__sheen,.cad.is-open .cad-rays,section.fiche-listen.is-cadeau){animation:none!important}}

/* ---- 5. the playlist, « Le mur » (Terry 09/10/2026) ------------------------------
   covers sized on the screen height so wall + text + buttons fit in one screen */
/* --c: what is left of the screen once the site header, the action bar and the text are
   placed, shared by the three rows of covers (the text needs ~520 px on a phone, ~440 wider) */
main.ringpop .rp-mur{--c:clamp(64px,min(26vw,calc((100svh - var(--eb-h,72px) - 520px) / 3)),190px);width:100%}
@media (min-width:721px){main.ringpop .rp-mur{--c:clamp(72px,min(15vw,calc((100svh - var(--eb-h,72px) - 440px) / 3)),190px)}}
/* short screens: two rows, so the covers stay readable */
@media (max-height:740px){
  main.ringpop .rp-mur{--c:clamp(60px,min(26vw,calc((100svh - var(--eb-h,72px) - 510px) / 2)),170px)}
  main.ringpop .rp-mur__row--2{display:none}
  main.ringpop .rp-mur__rows{padding:12px 0}
}
main.ringpop .rp-mur__wall{position:relative}
main.ringpop .rp-mur__rows{display:grid;gap:12px;overflow:hidden;padding:18px 0}
main.ringpop .rp-mur__row{transform:rotate(-4deg);margin:0 -8vw}
main.ringpop .rp-mur__row--1{transform:rotate(-4deg) translateX(-6vw)}
main.ringpop .rp-mur__run{display:flex;gap:12px;width:max-content;animation:rp-run 44s linear infinite}
main.ringpop .rp-mur__row--1 .rp-mur__run{animation-direction:reverse;animation-duration:50s}
main.ringpop .rp-mur__run img{width:var(--c);height:var(--c);object-fit:cover;box-shadow:0 10px 22px rgba(0,0,0,.35)}
main.ringpop .rp-mur__over{position:absolute;left:var(--rp-pad);right:var(--rp-pad);top:50%;transform:translateY(-50%);text-align:center;pointer-events:none}
/* « La playlist de TIITII NBA »: a black label that bites onto the name (Terry 09/10/2026:
   « se voit très mal »), readable on any cover palette */
body.fiche-ringpop main.ringpop .rp-mur__over .rp-k{position:relative;z-index:2;display:inline-block;margin:0 0 -.35em!important;padding:.55em 1.1em;border-radius:999px!important;
  background:#151515!important;color:#fff!important;box-shadow:0 8px 18px rgba(0,0,0,.35)!important;transform:rotate(3deg);
  font:900 clamp(15px,1.7vw,22px)/1 "Cabinet Grotesk",var(--font-body),sans-serif!important;letter-spacing:.06em!important;text-transform:uppercase}
main.ringpop .rp-mur__nom{display:block;width:fit-content;max-width:100%;margin:0 auto!important;padding:.06em .3em;background:var(--bg)!important;color:var(--rp-fg)!important;
  font:900 clamp(48px,min(11vw,13svh),180px)/.86 var(--rp-font)!important;text-transform:uppercase;transform:rotate(-2deg);box-shadow:0 12px 0 rgba(0,0,0,.25)!important}
main.ringpop .rp-mur__txt{max-width:860px;margin:clamp(14px,2.6vh,28px) auto 0;padding:0 var(--rp-pad);text-align:center}
main.ringpop .rp-mur__txt .rp-hook{font-size:clamp(20px,min(2.4vw,3.2svh),32px)!important}
main.ringpop .rp-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;list-style:none;margin:14px 0 0!important;padding:0!important}
main.ringpop .rp-chips li{margin:0!important;padding:8px 14px;border-radius:999px!important;background:#fff!important;color:#151515!important;font:800 15px/1.1 "Cabinet Grotesk",var(--font-body),sans-serif;transform:rotate(-1.5deg)}
main.ringpop .rp-chips li:nth-child(even){transform:rotate(1.5deg)}
body.fiche-ringpop main.ringpop section.fiche-listen .rp-chips li.rp-chips__plus{background:#151515!important;color:#fff!important}
main.ringpop .rp-mur__cta{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:clamp(14px,2.4vh,22px)}
main.ringpop .rp-mur__cta .rp-listen{margin:0!important}
main.ringpop .rp-mur .fiche-listen__player{margin-top:18px}
main.ringpop .rp-mur .fiche-listen__player iframe{width:100%;border-radius:12px}
@media (prefers-reduced-motion:reduce){main.ringpop .rp-mur__run{animation:none}}
/* the affiche style turns this button into a 60 px round play icon with its text hidden:
   on the wall it says what it does (« ▶ Lancer Bouyon New Waves ») */
body.fiche-ringpop main.ringpop section.fiche-listen:not(.fiche-listen--artiste) .rp-mur .fiche-listen__btn{width:auto!important;height:auto!important;min-height:52px!important;padding:0 22px!important;
  font:800 17px/1 "Cabinet Grotesk",var(--font-body),sans-serif!important;color:#151515!important;background:#fff!important;box-shadow:0 6px 0 rgba(0,0,0,.2)!important;display:inline-flex!important;gap:8px}
body.fiche-ringpop main.ringpop section.fiche-listen:not(.fiche-listen--artiste) .rp-mur .fiche-listen__btn span[aria-hidden]{font-size:15px;margin:0}
body.fiche-ringpop main.ringpop section.fiche-listen:not(.fiche-listen--artiste) .rp-mur .fiche-listen__btn[aria-expanded="true"]::before{content:none}
/* end of the game (Terry 09/10/2026: « ça aussi c'est un doublon »): the old collection card
   and its email form repeat the gift card and « Mettre ma pile à l'abri ». The account invite
   only lands in a visible card (bouyon-compte.js), so it goes with it. */
body.fiche-ringpop main.ringpop .jeu-carte{display:none!important}

/* ---- 4b. the end of the bet, « L'affiche » (Terry 09/10/2026) ----------------------------
   key art: the photo edge to edge, the verdict lettered in the cover's colour biting its
   bottom edge, display + handwriting, a billing line, the actions as tilted stickers */
body.fiche-ringpop main.ringpop [data-pari-verdict].pv-on > :not(.pv){display:none!important}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv{margin:clamp(40px,6vw,80px) calc(-1 * var(--rp-pad)) 0;text-align:left}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-photo{display:block;width:100%;aspect-ratio:4/5;max-height:78svh;height:auto;object-fit:cover;object-position:50% 22%;filter:saturate(1.1) contrast(1.05)}
/* faces sit in the upper part of artist photos: frame from the top */
@media (min-width:900px){body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-photo{aspect-ratio:3/2;object-position:50% 12%}}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-lock{position:relative;margin:-.62em var(--rp-pad) 0;font-size:clamp(54px,9vw,124px);line-height:1!important}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-call{display:inline;margin:0!important;padding:0 .12em;background:var(--rp-fg)!important;box-decoration-break:clone;-webkit-box-decoration-break:clone;
  font:900 1em/1.02 var(--rp-font)!important;text-transform:uppercase;color:var(--bg)!important}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-script{max-width:22ch;margin:.1em 0 0 .4em!important;font:700 clamp(30px,4.4vw,60px)/1 "Caveat",cursive!important;color:var(--rp-tx)!important;transform:rotate(-3deg)}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-script:empty{display:none}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-billing{margin:16px 0 0!important;font:700 10px/1.4 "Cabinet Grotesk",var(--font-body),sans-serif!important;letter-spacing:.32em!important;text-transform:uppercase;color:var(--rp-tx)!important;opacity:.75}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-stickers{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center;margin:26px var(--rp-pad) 0}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-st{display:inline-block!important;margin:0!important;padding:15px 18px!important;border:0!important;border-radius:999px!important;cursor:pointer;text-decoration:none!important;white-space:normal;
  background:#fff!important;color:#151515!important;font:800 16px/1.2 "Cabinet Grotesk",var(--font-body),sans-serif!important;box-shadow:0 6px 0 rgba(0,0,0,.3)!important;min-height:0!important}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-st::before,body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-st::after{content:none!important}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-st--0{background:var(--rp-fg)!important;color:var(--bg)!important;transform:rotate(-3deg)}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-st--1{transform:rotate(2deg)}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-st--2{transform:rotate(-1deg)}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-st--3{transform:rotate(3deg)}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-st:active{transform:scale(.97)}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-st:focus-visible{outline:3px solid var(--rp-fg)!important;outline-offset:4px}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-cap{display:block!important;max-width:56ch;margin:22px var(--rp-pad) 0!important;font:700 clamp(17px,1.7vw,22px)/1.45 "Cabinet Grotesk",var(--font-body),sans-serif!important;color:var(--rp-tx)!important;text-align:left!important}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-cap b{color:var(--rp-fg)!important;margin-right:.3em}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-cap a{font-size:14px;color:var(--rp-tx)!important;text-decoration:underline!important;text-underline-offset:3px}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-hist{display:block!important;margin:28px var(--rp-pad) 0!important;text-align:left!important}
body.fiche-ringpop main.ringpop .rp-band [data-pari-verdict].pv-on .pv-hist a{font:900 clamp(24px,2.6vw,34px)/1 var(--rp-font)!important;text-transform:uppercase;color:var(--rp-fg)!important;border-bottom:3px solid currentColor!important;text-decoration:none!important}

/* ---- « Le défi », the share sheet (bouyon-fiche-partage.js, Terry 09/10/2026) ------------
   the image first, then the ways to send it; the old « profile as an image » kit is gone */
body.fiche-ringpop main.ringpop > .kit-artiste{display:none!important}
.ps{position:fixed;inset:0;z-index:2147483600;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.6);animation:ps-in 200ms ease-out}
@keyframes ps-in{from{opacity:0}to{opacity:1}}
.ps-panel{position:relative;width:min(560px,100%);max-height:100svh;overflow:auto;padding:22px 20px calc(22px + env(safe-area-inset-bottom));background:#151515;color:#fff;border-radius:22px 22px 0 0;animation:ps-up 280ms cubic-bezier(.23,1,.32,1)}
@media (min-width:700px){.ps{align-items:center}.ps-panel{border-radius:22px}}
@keyframes ps-up{from{transform:translateY(40px)}to{transform:none}}
.ps-x{position:absolute;top:10px;right:12px;width:44px;height:44px;border:0;background:none;color:#fff;font:400 32px/1 system-ui,sans-serif;cursor:pointer}
.ps-img{display:block;width:auto;max-width:100%;height:auto;max-height:52svh;margin:18px auto 0;box-shadow:0 18px 40px rgba(0,0,0,.5)}
.ps-hint{margin:16px 4px 0;font:600 15px/1.4 "Cabinet Grotesk",system-ui,sans-serif;color:rgba(255,255,255,.78);text-align:center}
.ps-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.ps-b{display:flex;align-items:center;justify-content:center;min-height:52px;padding:0 14px;border:0;border-radius:999px;background:#2a2a2a;color:#fff;font:800 16px/1.1 "Cabinet Grotesk",system-ui,sans-serif;text-align:center;text-decoration:none;cursor:pointer}
.ps-b.is-main{grid-column:1/-1;min-height:58px;font-size:18px}
.ps-b--wa.is-main{background:#25d366;color:#0b2b17}
.ps-b:active{transform:scale(.97)}
.ps-b:focus-visible,.ps-x:focus-visible{outline:3px solid #fff;outline-offset:3px}
.ps-st{min-height:1.4em;margin:12px 0 0;text-align:center;font:700 15px/1.4 system-ui,sans-serif;color:#9ef0c0}
@media (prefers-reduced-motion:reduce){.ps,.ps-panel{animation:none}}

/* ---- the bottom bar, « L'étiquette » (Terry 09/10/2026): two floating stickers ------------ */
body.fiche-ringpop .artist-actionbar.rp-dock{display:flex!important;justify-content:space-between!important;align-items:flex-end;gap:10px;left:14px!important;right:14px!important;bottom:calc(14px + env(safe-area-inset-bottom))!important;
  width:auto!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important;pointer-events:none}
body.fiche-ringpop .artist-actionbar.rp-dock > *{pointer-events:auto}
body.fiche-ringpop .artist-actionbar.rp-dock .artist-actionbar__btn{display:inline-flex!important;align-items:center;gap:8px;min-height:50px;padding:10px 18px!important;border:0!important;border-radius:999px!important;
  font:800 16px/1.15 "Cabinet Grotesk",var(--font-body),sans-serif!important;text-decoration:none!important;box-shadow:0 6px 0 rgba(0,0,0,.3)!important}
body.fiche-ringpop .artist-actionbar.rp-dock .artist-actionbar__btn--p{background:#fff!important;color:#151515!important;transform:rotate(-2.5deg)}
body.fiche-ringpop .artist-actionbar.rp-dock .artist-actionbar__btn--p *{color:#151515!important}
body.fiche-ringpop .artist-actionbar.rp-dock .artist-actionbar__disque{width:30px!important;height:30px!important;border-radius:50%!important}
body.fiche-ringpop .artist-actionbar.rp-dock .fiche-nav__btn{flex-direction:row-reverse;background:var(--h-fg,#fff)!important;color:var(--h-bg,#151515)!important;transform:rotate(2.5deg);
  font:900 22px/1 "Big Shoulders Display",Impact,sans-serif!important;text-transform:uppercase}
body.fiche-ringpop .artist-actionbar.rp-dock .fiche-nav__btn *{color:inherit!important}
body.fiche-ringpop .artist-actionbar.rp-dock .fiche-nav__mot{display:inline!important}
body.fiche-ringpop .artist-actionbar.rp-dock :is(.artist-actionbar__btn):focus-visible{outline:3px solid #fff;outline-offset:3px}
@media (max-width:420px){body.fiche-ringpop .artist-actionbar.rp-dock .artist-actionbar__btn{font-size:14px!important}body.fiche-ringpop .artist-actionbar.rp-dock .fiche-nav__btn{font-size:19px!important}}
@media (prefers-reduced-motion:reduce){body.fiche-ringpop .artist-actionbar.rp-dock .artist-actionbar__btn{transform:none!important}}
/* the next artist's sticker: one line, one arrow (the page's own arrow span stays, the label
   is the name) */
body.fiche-ringpop .artist-actionbar.rp-dock .fiche-nav__btn{white-space:nowrap;max-width:min(56vw,360px)}
body.fiche-ringpop .artist-actionbar.rp-dock .fiche-nav__mot{overflow:hidden;text-overflow:ellipsis}
body.fiche-ringpop .artist-actionbar.rp-dock .fiche-nav__btn::after{content:none!important}
body.fiche-ringpop .artist-actionbar.rp-dock .artist-actionbar__btn--p{max-width:min(48vw,320px)}
