/* MINUIT — profil des joueurs, cadeau du jour, saison du mois (js/profil.js).
   Couches (échelle de css/base.css) : .pf-overlay 1097 (entre le tableau d'honneur 1096 et les modales 1100 : « Nom, avatar, couleur »
   s'ouvre au-dessus) · .pf-piece 1305 (pièces du cadeau, non cliquables, 1 s) · le médaillon du cadeau et le panneau de saison vivent
   dans le hall (#view) : Casino.ux les voit comme des commandes et rien ne se pose dessus. */

/* ================= la fenêtre de profil ================= */
.pf-overlay { position: fixed; inset: 0; z-index: 1097; display: grid; place-items: center; padding: 18px; background: rgba(3, 4, 9, .74); animation: pf-fondu .2s both; }
.pf-overlay.is-out { animation: pf-fondu-out .18s both; }
@keyframes pf-fondu { from { opacity: 0; } to { opacity: 1; } }
@keyframes pf-fondu-out { from { opacity: 1; } to { opacity: 0; } }
.pf-cab {
  position: relative; display: flex; flex-direction: column; width: min(1180px, 100%); height: min(900px, 100%); overflow: hidden; border-radius: 18px;
  background: radial-gradient(ellipse 60% 38% at 22% -8%, rgba(222, 184, 92, .12), rgba(0, 0, 0, 0) 60%), linear-gradient(180deg, var(--bg-2), var(--bg-1));
  border: 1px solid var(--line-strong); box-shadow: var(--shadow-2), inset 0 0 0 6px rgba(5, 6, 11, .45);
  animation: pf-cab-in .3s cubic-bezier(.2, .9, .3, 1.1) both; color: var(--text); font-family: var(--font-ui);
}
.pf-cab::before { content: ''; position: absolute; inset: 9px; border: 1px solid rgba(222, 184, 92, .16); border-radius: 12px; pointer-events: none; }
@keyframes pf-cab-in { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }

/* en-tête */
.pf-head { position: relative; z-index: 1; display: flex; align-items: center; gap: 18px; padding: 20px 24px 16px; border-bottom: 1px solid var(--line); }
.pf-av-cadre { position: relative; flex: none; display: grid; place-items: center; width: 78px; height: 78px; border-radius: 50%;
  background: conic-gradient(from 200deg, var(--gold-lo), var(--gold-hi), var(--gold), var(--gold-lo)); box-shadow: 0 6px 20px rgba(0, 0, 0, .5), 0 0 26px -6px color-mix(in srgb, var(--pc) 70%, transparent); }
.pf-av { display: inline-grid; place-items: center; flex: none; border-radius: 50%; line-height: 1; background: color-mix(in srgb, var(--pc, var(--gold)) 26%, #0a0d18); box-shadow: 0 0 0 1.5px var(--pc, var(--gold)); }
.pf-av-xl { width: 70px; height: 70px; font-size: 38px; box-shadow: inset 0 0 0 2px rgba(5, 6, 11, .8), 0 0 0 2px var(--pc, var(--gold)); }
.pf-av-xs { width: 22px; height: 22px; font-size: 12px; }
.pf-ident { flex: 1; min-width: 0; display: grid; gap: 3px; }
.pf-kicker { font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--gold-lo); }
.pf-nom { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 34px; line-height: 1.05; color: var(--gold-hi); letter-spacing: .015em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 2px 14px rgba(222, 184, 92, .18); }
.pf-statut { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--text-dim); }
.pf-statut i { width: 8px; height: 8px; border-radius: 50%; background: var(--text-faint); box-shadow: 0 0 0 2px rgba(111, 106, 92, .25); }
.pf-statut.is-on i { background: var(--win); box-shadow: 0 0 0 2px rgba(62, 224, 143, .2), 0 0 8px rgba(62, 224, 143, .7); }
.pf-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--text-dim); }
.pf-lock.is-on { color: var(--gold); }
.pf-feu { color: #ffb86b; }
.pf-tete-droite { flex: none; display: flex; align-items: center; gap: 14px; }
.pf-pat { text-align: right; padding: 4px 16px 4px 0; border-right: 1px solid var(--line); }
.pf-pat-l { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-lo); }
.pf-pat-v { font-size: 30px; line-height: 1.1; font-weight: 700; color: var(--gold-hi); text-shadow: 0 0 18px rgba(222, 184, 92, .25); }
.pf-pat-s { font-size: 13px; color: var(--text-dim); }
.pf-edit { white-space: nowrap; }
.pf-x { flex: none; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line-strong); background: rgba(5, 6, 11, .4); color: var(--gold-hi); cursor: pointer; font-size: 15px; }
.pf-x:hover { background: rgba(222, 184, 92, .12); }
.pf-x:focus-visible, .pf-seg button:focus-visible, .pf-cadeau:focus-visible, .pf-srow:focus-visible, .pf-s-prec-j:focus-visible { outline: 2px solid var(--gold-hi); outline-offset: 2px; }

/* corps */
.pf-body { position: relative; z-index: 1; flex: 1; min-height: 0; overflow: auto; padding: 16px 20px 20px; scrollbar-width: thin; scrollbar-color: var(--gold-lo) transparent; }
.pf-attente { display: flex; align-items: center; justify-content: center; gap: 14px; height: 100%; min-height: 200px; color: var(--text-dim); font-size: 15px; }
.pf-erreur { color: var(--lose); }
.pf-anneau { width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--line-strong); border-top-color: var(--gold-hi); animation: pf-tourne .8s linear infinite; }
@keyframes pf-tourne { to { transform: rotate(360deg); } }
.pf-grille { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 16px; align-items: stretch; }
.pf-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.pf-col > .pf-carte { min-width: 0; }
.pf-col > .pf-carte:last-child { flex: 1 1 auto; }
.pf-carte { position: relative; padding: 14px 16px 15px; border-radius: 14px; border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(26, 32, 64, .62), rgba(10, 13, 24, .78)); box-shadow: inset 0 1px 0 rgba(247, 221, 143, .06); animation: pf-carte-in .35s both; }
.pf-col:nth-child(2) .pf-carte { animation-delay: .06s; }
@keyframes pf-carte-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.pf-carte-t { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.pf-carte-t h3 { margin: 0; flex: 1; display: flex; align-items: center; gap: 10px; font: 400 17px/1.2 var(--font-display); letter-spacing: .05em; color: var(--gold-hi); }
.pf-carte-t h3::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--line-strong), transparent); }
.pf-carte-note { font-size: 12px; color: var(--text-dim); }
.pf-vide { color: var(--text-dim); font-size: 14px; padding: 4px 0; }
.pf-petit { font-size: 12px; }
.pf-seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: 999px; border: 1px solid var(--line); background: rgba(5, 6, 11, .5); }
.pf-seg button { min-height: 26px; padding: 0 11px; border: 0; border-radius: 999px; background: transparent; color: var(--text-dim); cursor: pointer; font: 600 12px var(--font-ui); transition: color .15s, background .15s; }
.pf-seg button:hover { color: var(--text); }
.pf-seg button.is-on { background: linear-gradient(180deg, var(--gold-hi), var(--gold)); color: #1a1406; }

/* la courbe */
.pf-graph { position: relative; }
.pf-svg { display: block; width: 100%; height: auto; aspect-ratio: 640 / 232; overflow: visible; cursor: crosshair; touch-action: none; }
.pf-g0 { stop-color: var(--gold); stop-opacity: .38; }
.pf-g1 { stop-color: var(--gold); stop-opacity: 0; }
.pf-svg.is-bas .pf-g0 { stop-color: #d88a6a; stop-opacity: .3; }
.pf-svg.is-bas .pf-g1 { stop-color: #d88a6a; }
.pf-axe { stroke: rgba(222, 184, 92, .16); stroke-width: 1; stroke-dasharray: 2 5; }
.pf-axe.is-mi { stroke: rgba(222, 184, 92, .09); }
.pf-axe-t { fill: var(--text-faint); font: 500 12px var(--font-num); }
.pf-ref { stroke: rgba(247, 240, 220, .22); stroke-width: 1; stroke-dasharray: 5 4; }
.pf-aire { stroke: none; }
.pf-ligne { fill: none; stroke: var(--gold-hi); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; filter: drop-shadow(0 0 5px rgba(247, 221, 143, .45)); }
.pf-svg.is-bas .pf-ligne { stroke: #f0b48c; filter: drop-shadow(0 0 5px rgba(240, 180, 140, .4)); }
.pf-graph.is-trace .pf-ligne { stroke-dasharray: var(--long); stroke-dashoffset: var(--long); animation: pf-trace 1.1s cubic-bezier(.35, .1, .25, 1) .12s forwards; }
.pf-graph.is-trace .pf-aire { animation: pf-fondu .9s .4s both; }
.pf-graph.is-trace .pf-bout { animation: pf-fondu .3s 1.1s both; }
@keyframes pf-trace { to { stroke-dashoffset: 0; } }
.pf-bout { fill: var(--gold-hi); stroke: var(--bg-1); stroke-width: 2; }
.pf-date { fill: var(--text-faint); font: 500 12px var(--font-num); }
.pf-guide { stroke: rgba(247, 221, 143, .5); stroke-width: 1; opacity: 0; }
.pf-point { fill: var(--gold-hi); stroke: var(--bg-0); stroke-width: 2.5; opacity: 0; }
.pf-svg.is-survol .pf-guide, .pf-svg.is-survol .pf-point { opacity: 1; }
.pf-bulle { position: absolute; z-index: 2; transform: translate(12px, -118%); display: grid; gap: 1px; padding: 6px 10px; border-radius: 10px; pointer-events: none; white-space: nowrap;
  background: rgba(8, 10, 20, .94); border: 1px solid var(--line-strong); box-shadow: 0 8px 22px rgba(0, 0, 0, .55); font-size: 12px; color: var(--text-dim); }
.pf-bulle b { color: var(--gold-hi); font-size: 14px; }
.pf-bulle.is-gauche { transform: translate(calc(-100% - 12px), -118%); }
.pf-bulle[hidden] { display: none; }
.pf-graph.is-vide { display: grid; place-items: center; min-height: 150px; border-radius: 10px; border: 1px dashed var(--line); }
.pf-graph-vide { text-align: center; color: var(--text-dim); font-size: 13.5px; line-height: 1.6; }
.pf-graph-vide b { color: var(--gold-hi); }
.pf-graph-pied { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; margin-top: 6px; font-size: 13px; color: var(--text-dim); }
.pf-graph-pied b { color: var(--text); font-weight: 600; }
.pf-graph-var { margin-left: auto; font: 700 14px var(--font-num); }

/* barres par jeu */
.pf-barres { display: grid; gap: 7px; }
.pf-barre { display: grid; grid-template-columns: 128px minmax(0, 1fr) 92px 84px; align-items: center; gap: 10px; font-size: 13px; }
.pf-barre-nom { display: flex; align-items: center; gap: 8px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-barre-nom i { flex: none; width: 9px; height: 9px; border-radius: 3px; transform: rotate(45deg); background: var(--acc); box-shadow: 0 0 8px color-mix(in srgb, var(--acc) 60%, transparent); }
.pf-barre-piste { height: 10px; border-radius: 999px; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px rgba(222, 184, 92, .08); overflow: hidden; }
.pf-barre-v { height: 100%; border-radius: 999px; background: linear-gradient(90deg, color-mix(in srgb, var(--acc) 45%, #1a2040), var(--acc)); transform-origin: left;
  animation: pf-barre 0.7s cubic-bezier(.2, .8, .3, 1) both; animation-delay: calc(var(--k) * 45ms + .1s); }
@keyframes pf-barre { from { transform: scaleX(0); } to { transform: none; } }
.pf-barre-n { color: var(--text-dim); text-align: right; font-size: 12px; }
.pf-barre-net { text-align: right; font-weight: 600; }

/* chiffres */
.pf-chiffres { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 18px; }
.pf-chiffre { display: flex; justify-content: space-between; gap: 8px; padding: 3px 0; border-bottom: 1px solid rgba(222, 184, 92, .07); font-size: 13px; color: var(--text-dim); }
.pf-chiffre b { color: var(--text); font-weight: 600; }
.pf-chiffre:last-child { grid-column: 1 / -1; }
.pf-coup { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin-top: 10px; padding: 9px 12px; border-radius: 12px;
  background: radial-gradient(ellipse at 0% 50%, rgba(222, 184, 92, .16), transparent 70%), rgba(5, 6, 11, .35); border: 1px solid rgba(222, 184, 92, .22); }
.pf-coup-l { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-lo); }
.pf-coup b { font-size: 21px; color: var(--win); text-shadow: 0 0 14px rgba(62, 224, 143, .3); }
.pf-coup-j { color: var(--text-dim); font-size: 13px; }
.pf-coup.is-vide b { color: var(--text-faint); text-shadow: none; }

/* arsenal */
.pf-ars-v { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: var(--text-dim); }
.pf-ars-v b { font-size: 22px; color: var(--text); }
.pf-ars-ico { color: #aab4c8; font-size: 16px; }
.pf-compo { display: flex; height: 8px; margin: 10px 0 6px; border-radius: 999px; overflow: hidden; background: rgba(255, 255, 255, .05); }
.pf-compo-j { background: linear-gradient(90deg, var(--gold-lo), var(--gold)); }
.pf-compo-a { background: linear-gradient(90deg, #5b6680, #aab4c8); }
.pf-compo-l { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--text-dim); }
.pf-pastille { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 2px; vertical-align: middle; }
.pf-pastille.is-j { background: var(--gold); }
.pf-pastille.is-a { background: #aab4c8; }

/* saison et trophées */
.pf-rang { display: flex; align-items: center; gap: 12px; font-size: 13px; color: var(--text-dim); line-height: 1.35; }
.pf-rang-n { font: 700 26px var(--font-num); color: var(--gold-hi); min-width: 38px; text-align: center; }
.pf-rang b { font-size: 16px; }
.pf-tros { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.pf-tro { display: inline-flex; align-items: center; gap: 7px; padding: 4px 10px 4px 6px; border-radius: 999px; font-size: 12.5px; color: var(--text);
  border: 1px solid rgba(222, 184, 92, .35); background: linear-gradient(180deg, rgba(222, 184, 92, .16), rgba(222, 184, 92, .04)); }
.pf-tro.is-2 { border-color: rgba(200, 210, 230, .4); background: linear-gradient(180deg, rgba(200, 210, 230, .14), rgba(200, 210, 230, .03)); }
.pf-tro.is-3 { border-color: rgba(214, 140, 90, .45); background: linear-gradient(180deg, rgba(214, 140, 90, .16), rgba(214, 140, 90, .04)); }
.pf-tro-m { font-size: 17px; }
.pf-tro b { font-size: 12px; color: var(--text-dim); font-weight: 600; }

/* succès */
.pf-succes { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 6px; max-height: 232px; overflow: auto; scrollbar-width: thin; scrollbar-color: var(--gold-lo) transparent; }
.pf-succ { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 4px; border-radius: 999px; font-size: 12.5px; color: var(--text); cursor: default;
  border: 1px solid rgba(205, 127, 50, .45); background: rgba(205, 127, 50, .08); }
.pf-succ-i { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 12.5px; background: rgba(5, 6, 11, .6); }
.pf-succ.is-argent { border-color: rgba(200, 210, 230, .45); background: rgba(200, 210, 230, .07); }
.pf-succ.is-or { border-color: rgba(222, 184, 92, .6); background: rgba(222, 184, 92, .1); }
.pf-succ.is-legendaire { border-color: rgba(155, 107, 255, .7); background: linear-gradient(90deg, rgba(155, 107, 255, .16), rgba(255, 79, 216, .1)); box-shadow: 0 0 12px -4px rgba(155, 107, 255, .7); }

/* ================= le cadeau du jour (dans le haut du hall) ================= */
.pf-cadeau { position: absolute; z-index: 2; top: 16px; right: 18px; display: grid; place-items: center; width: 54px; height: 54px; padding: 0; border-radius: 50%; cursor: pointer;
  border: 1px solid rgba(247, 221, 143, .55); color: var(--gold-hi);
  background: radial-gradient(circle at 50% 32%, #2b3160, #0d1122 72%); box-shadow: 0 6px 18px rgba(0, 0, 0, .55), inset 0 0 0 3px rgba(5, 6, 11, .55), inset 0 0 0 4px rgba(222, 184, 92, .28);
  transition: transform .2s, box-shadow .25s, border-color .25s, opacity .25s; }
.pf-cadeau:hover { transform: translateY(-1px) scale(1.05); border-color: var(--gold-hi); }
.pf-cadeau:active { transform: scale(.96); }
.pf-cadeau-ico { position: relative; z-index: 1; font-size: 25px; line-height: 1; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .5)); }
.pf-cadeau-halo { position: absolute; inset: -5px; border-radius: 50%; pointer-events: none; opacity: 0; }
.pf-cadeau-n { position: absolute; left: 50%; bottom: -9px; transform: translateX(-50%); min-width: 38px; padding: 1px 7px; border-radius: 999px; white-space: nowrap;
  font: 700 12px/16px var(--font-num); color: #1a1406; background: linear-gradient(180deg, var(--gold-hi), var(--gold)); box-shadow: 0 0 0 2px var(--bg-1); }
.pf-cadeau-n:empty { display: none; }
.pf-cadeau.is-pris { opacity: .62; border-color: rgba(222, 184, 92, .3); }
.pf-cadeau.is-pris .pf-cadeau-ico { filter: grayscale(.55) drop-shadow(0 2px 3px rgba(0, 0, 0, .5)); }
.pf-cadeau.is-pris .pf-cadeau-n { background: rgba(10, 13, 24, .92); color: #ffb86b; box-shadow: 0 0 0 1px rgba(222, 184, 92, .3); }
.pf-cadeau.is-pris:hover { opacity: .9; }
.pf-cadeau.is-dispo { border-color: var(--gold-hi); box-shadow: 0 6px 18px rgba(0, 0, 0, .55), inset 0 0 0 3px rgba(5, 6, 11, .55), inset 0 0 0 4px rgba(247, 221, 143, .5), 0 0 22px -2px rgba(247, 221, 143, .55); }
.pf-cadeau.is-dispo .pf-cadeau-halo { opacity: 1; background: radial-gradient(circle, rgba(247, 221, 143, .38), rgba(247, 221, 143, 0) 68%); animation: pf-luit 2.6s ease-in-out infinite; }
.pf-cadeau.is-dispo .pf-cadeau-ico { animation: pf-balance 2.6s ease-in-out infinite; }
.pf-cadeau.is-ouvre .pf-cadeau-ico { animation: pf-ouvre .45s cubic-bezier(.2, .9, .3, 1.4); }
@keyframes pf-luit { 0%, 100% { transform: scale(.92); opacity: .55; } 50% { transform: scale(1.14); opacity: 1; } }
@keyframes pf-balance { 0%, 86%, 100% { transform: none; } 90% { transform: rotate(-9deg); } 94% { transform: rotate(8deg); } 97% { transform: rotate(-4deg); } }
@keyframes pf-ouvre { 0% { transform: scale(1); } 45% { transform: scale(1.35) rotate(-8deg); } 100% { transform: scale(1); } }
html.perf-low .pf-cadeau.is-dispo .pf-cadeau-halo { animation: none; opacity: .75; }
.pf-indice { position: absolute; z-index: 2; top: 24px; right: 84px; max-width: 250px; padding: 7px 12px; border-radius: 12px; font-size: 12.5px; color: var(--text);
  background: rgba(8, 10, 20, .92); border: 1px solid var(--line-strong); box-shadow: 0 8px 20px rgba(0, 0, 0, .5); pointer-events: none; animation: pf-indice-in .35s both; transition: opacity .4s; }
.pf-indice::after { content: ''; position: absolute; right: -6px; top: 13px; width: 10px; height: 10px; transform: rotate(45deg); background: inherit; border-right: 1px solid var(--line-strong); border-top: 1px solid var(--line-strong); }
.pf-indice b { color: var(--gold-hi); }
.pf-indice.is-out { opacity: 0; }
@keyframes pf-indice-in { from { opacity: 0; transform: translateX(8px); } to { opacity: 1; transform: none; } }
.pf-piece { position: fixed; z-index: 1305; width: 16px; height: 16px; margin: 0; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle at 35% 30%, #fff5cf, var(--gold-hi) 35%, var(--gold) 62%, var(--gold-lo)); box-shadow: 0 0 0 1px rgba(90, 64, 12, .6), 0 0 10px rgba(247, 221, 143, .7);
  transform: translate(-50%, -50%); opacity: 0; }
.tb-balance.pf-tinte { animation: pf-tinte .6s ease-out; }
@keyframes pf-tinte { 0% { filter: none; } 30% { filter: brightness(1.6) drop-shadow(0 0 8px rgba(247, 221, 143, .9)); } 100% { filter: none; } }

/* ================= la saison du mois (colonne du hall) ================= */
.pf-saison .pf-s-titre { margin-bottom: 2px; }
.pf-s-sous { margin: 0 0 8px; font-size: 12px; color: var(--text-dim); }   /* ACCUEIL 01/10 : 4,5:1 au moins (était text-faint) */
.pf-s-liste { display: grid; gap: 1px; }
.pf-srow { display: grid; grid-template-columns: 24px 22px minmax(0, 1fr) auto; align-items: center; gap: 8px; width: 100%; padding: 5px 6px; border: 1px solid transparent; border-radius: 10px;
  background: transparent; color: var(--text); font: inherit; font-size: 13.5px; text-align: left; cursor: pointer; transition: background .15s, border-color .15s; }
.pf-srow:hover { background: rgba(255, 255, 255, .04); }
.pf-srow.is-me { border-color: color-mix(in srgb, var(--pc, var(--gold)) 50%, transparent); background: color-mix(in srgb, var(--pc, var(--gold)) 9%, transparent); }
.pf-srow-r { text-align: center; font: 700 12.5px var(--font-num); color: var(--text-dim); }
.pf-srow.is-top1 .pf-srow-r, .pf-srow.is-top2 .pf-srow-r, .pf-srow.is-top3 .pf-srow-r { font-size: 15px; }
.pf-srow-n { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.pf-srow-s { font-size: 13px; font-weight: 600; }
.pf-s-sep { text-align: center; color: var(--text-faint); font-size: 12px; line-height: 1; padding: 2px 0; }
.pf-s-prec { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(222, 184, 92, .1); font-size: 12px; color: var(--text-dim); }
.pf-s-prec-l { color: var(--gold); }
.pf-s-prec-j { padding: 1px 7px; border: 1px solid rgba(222, 184, 92, .18); border-radius: 999px; background: rgba(5, 6, 11, .35); color: var(--text); font: inherit; font-size: 12px; cursor: pointer; }
.pf-s-prec-j:hover { border-color: var(--line-strong); }

/* un joueur du hall s'ouvre d'un clic */
.plist-live .prow[data-pid], .rank .rank-row[data-pid] { cursor: pointer; }
/* (ACCUEIL 01/10 : anneau à l'intérieur de la ligne, les listes défilent et rogneraient un anneau extérieur) */
.plist-live .prow[data-pid]:focus-visible, .rank .rank-row[data-pid]:focus-visible { outline: 2px solid var(--gold-hi); outline-offset: -2px; border-radius: 10px; }

/* « Animations réduites » : rien ne bouge, tout est là tout de suite */
html.reduce-motion .pf-overlay, html.reduce-motion .pf-cab, html.reduce-motion .pf-carte, html.reduce-motion .pf-barre-v, html.reduce-motion .pf-cadeau-halo,
html.reduce-motion .pf-cadeau-ico, html.reduce-motion .pf-indice, html.reduce-motion .pf-anneau, html.reduce-motion .tb-balance.pf-tinte,
html.reduce-motion .pf-graph.is-trace .pf-ligne, html.reduce-motion .pf-graph.is-trace .pf-aire, html.reduce-motion .pf-graph.is-trace .pf-bout { animation: none !important; }
html.reduce-motion .pf-cadeau, html.reduce-motion .pf-srow, html.reduce-motion .pf-seg button { transition: none; }
html.reduce-motion .pf-cadeau.is-dispo .pf-cadeau-halo { opacity: .8; }

/* téléphone : le nom du jeu, ses manches et son net sur une ligne, la barre dessous (la rangée dépassait de la carte) */
@media (max-width: 640px) {
  .pf-barre { grid-template-columns: minmax(0, 1fr) auto auto; }
  .pf-barre-piste { grid-column: 1 / -1; grid-row: 2; }
  .pf-chiffres { grid-template-columns: minmax(0, 1fr); }
}
/* écrans plus étroits que prévu : une seule colonne */
@media (max-width: 1020px) {
  .pf-grille { grid-template-columns: minmax(0, 1fr); }
  .pf-head { flex-wrap: wrap; }
  .pf-tete-droite { width: 100%; justify-content: flex-end; }
}

/* ---------- la progression de l'Armurerie (L2-PROG-ÉCRAN, dev/armurerie/API-PROGRESSION.md) : cadre, titre, niveau, vitrine ----------
   Les cadres se gagnent au niveau (Laiton 2, Argent 8, Or 12, Néon 18, Minuit 25) ou à la série (Fidèle, 30 jours). Leurs jetons servent
   aussi aux aperçus du Carnet de l'Armurerie (.arp-anneau[data-cadre]). Sans cadre choisi, l'anneau d'or habituel du profil. */
[data-cadre="laiton"] { --cadre-a: #7a5a1c; --cadre-b: #f2d58a; --cadre-c: #b88a34; --cadre-lueur: rgba(222, 184, 92, .32); }
[data-cadre="argent"] { --cadre-a: #5d6676; --cadre-b: #f3f6fb; --cadre-c: #a9b2c2; --cadre-lueur: rgba(214, 224, 240, .32); }
[data-cadre="or"] { --cadre-a: #8f5f0e; --cadre-b: #ffe6a0; --cadre-c: #e4ae33; --cadre-lueur: rgba(228, 174, 51, .5); }
[data-cadre="neon"] { --cadre-a: #2ad8f0; --cadre-b: #d32ce6; --cadre-c: #8847ff; --cadre-lueur: rgba(59, 232, 255, .55); }
[data-cadre="minuit"] { --cadre-a: #0d1330; --cadre-b: #6f86ff; --cadre-c: #deb85c; --cadre-lueur: rgba(75, 105, 255, .45); }
[data-cadre="fidele"] { --cadre-a: #7a4a12; --cadre-b: #ffcf8a; --cadre-c: #e08a3c; --cadre-lueur: rgba(255, 184, 107, .45); }
.pf-av-cadre[data-cadre] { background: conic-gradient(from 210deg, var(--cadre-a), var(--cadre-b), var(--cadre-c), var(--cadre-b), var(--cadre-a));
  box-shadow: 0 6px 20px rgba(0, 0, 0, .5), 0 0 28px -4px var(--cadre-lueur); }
/* les douze traits du cadran de minuit, sur les cadres Laiton, Minuit et Fidèle */
.pf-av-cadre[data-cadre="laiton"]::after, .pf-av-cadre[data-cadre="minuit"]::after, .pf-av-cadre[data-cadre="fidele"]::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; pointer-events: none;
  background: repeating-conic-gradient(from -1.5deg, var(--cadre-b) 0 3deg, transparent 3deg 30deg);
  -webkit-mask: radial-gradient(circle, transparent 88%, #000 89%); mask: radial-gradient(circle, transparent 88%, #000 89%); opacity: .8; }
.pf-av-cadre[data-cadre="neon"] { box-shadow: 0 6px 20px rgba(0, 0, 0, .5), 0 0 0 1px rgba(59, 232, 255, .55), 0 0 22px rgba(59, 232, 255, .5), 0 0 36px rgba(211, 44, 230, .32); }
.pf-titre { margin: 0; font: 500 14px/1.2 var(--font-ui); letter-spacing: .06em; color: var(--gold); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-niv { color: var(--gold); }
.pf-serie { display: inline-flex; align-items: center; gap: 5px; }
.pf-flamme { width: 13px; height: 13px; flex: none; color: var(--text-faint); }
.pf-serie.is-f3 .pf-flamme { color: var(--gold); }
.pf-serie.is-f7 .pf-flamme, .pf-serie.is-f30 .pf-flamme { color: var(--gold-hi); }

/* la vitrine : des armes, jamais un solde ni un net */
.pf-vitrine { display: grid; grid-template-columns: repeat(auto-fit, minmax(92px, 132px)); justify-content: center; gap: 8px; }
.pf-vit-a { position: relative; display: grid; grid-template-rows: minmax(0, 1fr) auto; min-width: 0; aspect-ratio: 100 / 112; padding: 6px 7px 9px; border-radius: 6px; overflow: hidden;
  border: 1px solid rgba(222, 184, 92, .14); background: radial-gradient(120% 70% at 50% 108%, color-mix(in srgb, var(--arm-rc, var(--gold)) 22%, transparent), transparent 68%), linear-gradient(180deg, #161c38, #0b0e1c); }
.pf-vit-a.is-libre { place-items: center; grid-template-rows: 1fr; border-style: dashed; border-color: rgba(222, 184, 92, .26); background: rgba(5, 6, 11, .35); color: var(--text-dim); font-size: 12px; }
.pf-vit-img { display: grid; place-items: center; min-height: 0; }
.pf-vit-img img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 5px 6px rgba(0, 0, 0, .55)); }
.pf-vit-t { display: grid; gap: 1px; min-width: 0; padding-top: 3px; }
.pf-vit-arme, .pf-vit-fin { overflow-wrap: anywhere; }
.pf-vit-arme { font-size: 12px; line-height: 1.25; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--text-dim); }
.pf-vit-fin { font-size: 13px; line-height: 1.25; font-weight: 600; color: var(--text); }
.pf-vit-barre { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--arm-rc, var(--gold)); }
.pf-vit-albums { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
.pf-vit-l { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-lo); margin-right: 4px; }
.pf-vit-al { padding: 3px 9px; border-radius: 999px; border: 1px solid var(--line-strong); font-size: 12px; color: var(--gold-hi); }