/* MINUIT — socle visuel de la nouvelle Armurerie : jetons de rareté, cartes, bande d'ouverture, cartouche du résultat, net signé.
   Contrat : dev/armurerie/DIRECTION.md. Les couleurs de rareté sont celles de CS (relevées chez Hellcase) ; le laiton du casino
   reste un filet, l'or ★ est le seul or qui brille. Une carte ou une bande porte sa rareté par data-r="bleu|violet|rose|rouge|or". */
:root {
  --arm-r-bleu: #4b69ff; --arm-r-violet: #8847ff; --arm-r-rose: #d32ce6; --arm-r-rouge: #eb4b4b; --arm-r-or: #e4ae33;
  /* teintes de texte : ≥ 4,6:1 sur --bg-3 (calculé) */
  --arm-t-bleu: #6680ff; --arm-t-violet: #a16eff; --arm-t-rose: #d94aea; --arm-t-rouge: #ec5858; --arm-t-or: #e4ae33;
  --arm-st: #cf6a32; --arm-t-st: #d1713c;
  --arm-net-pos: var(--win, #3ee08f); --arm-net-neg: var(--lose, #ff5a67); --arm-net-nul: var(--text-dim, #a9a28e);
  --arm-laque-hi: #161c38; --arm-laque-lo: #0b0e1c; --arm-nuit-fenetre: #06080f;
  --arm-ease-sortie: cubic-bezier(.16, 1, .3, 1);
  --arm-ease-douce: cubic-bezier(.22, 1, .36, 1);
  --arm-ease-retour: cubic-bezier(.3, .75, .25, 1);
  --arm-t-lumiere: 220ms; --arm-t-leve: 300ms; --arm-t-cartouche: 300ms; --arm-t-retour: 520ms;
}
[data-r] { --arm-rc: var(--gold, #deb85c); --arm-rt: var(--text, #f4ecd8); }
[data-r="bleu"] { --arm-rc: var(--arm-r-bleu); --arm-rt: var(--arm-t-bleu); }
[data-r="violet"] { --arm-rc: var(--arm-r-violet); --arm-rt: var(--arm-t-violet); }
[data-r="rose"] { --arm-rc: var(--arm-r-rose); --arm-rt: var(--arm-t-rose); }
[data-r="rouge"] { --arm-rc: var(--arm-r-rouge); --arm-rt: var(--arm-t-rouge); }
[data-r="or"] { --arm-rc: var(--arm-r-or); --arm-rt: var(--arm-t-or); }

/* ---------- l'échelle de l'écran : règle et paliers dans css/base.css (classe a-l-echelle, que la racine de l'Armurerie porte) ----------
   Le calque plein écran est fixé sous la barre du casino, qui reste à sa taille : sa hauteur se compte en px de l'écran. */
.g-armurerie .ar .ar-calque { top: calc(var(--topbar-h, 64px) / var(--echelle, 1)); }

/* ---------- utilitaires ---------- */
.arm-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
/* opacité seule : un `filter` ferait de l'élément le repère des enfants en position fixe (la barre au pouce quitterait le bas de l'écran) */
.arm-eteint { opacity: .28; pointer-events: none; transition: opacity .45s var(--arm-ease-douce); }
.arm-cadre { position: relative; border: 1px solid var(--line, rgba(222,184,92,.2)); }
.arm-cadre::before, .arm-cadre::after { content: ""; position: absolute; width: 14px; height: 14px; border: 2px solid var(--gold, #deb85c); pointer-events: none; }
.arm-cadre::before { top: -3px; left: -3px; border-right: 0; border-bottom: 0; }
.arm-cadre::after { right: -3px; bottom: -3px; border-left: 0; border-top: 0; }

/* ---------- palier, cotes, net ---------- */
.arm-palier { display: inline-flex; align-items: center; gap: 7px; font: 600 12.5px/1.2 var(--font-ui); letter-spacing: .02em; color: var(--arm-rt); white-space: nowrap; }
.arm-palier::before { content: ""; flex: none; width: 7px; height: 7px; background: var(--arm-rc); transform: rotate(45deg); box-shadow: 0 0 0 2px color-mix(in srgb, var(--arm-rc) 22%, transparent); }
.arm-cotes { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; margin: 0; padding: 0; list-style: none; }
.arm-cotes .num { color: var(--text); font-size: 13px; margin-left: 7px; }   /* le nom du palier et sa cote ne se touchent plus (« Covert0,64 % ») */
.arm-net { font: 700 17px/1.2 var(--font-num); font-variant-numeric: tabular-nums; white-space: nowrap; }
.arm-net.is-pos { color: var(--arm-net-pos); }
.arm-net.is-neg { color: var(--arm-net-neg); }
.arm-net.is-nul { color: var(--arm-net-nul); }

/* ---------- carte d'objet (bande, inventaire, fil) : la tuile d'arme du système (revue n° 2) ----------
   Rapport 1 / 1,12 (--arm-carte-r), laque de nuit et lueur du palier en bas, bord de laiton à .14, barre de rareté de 4 px, arme en
   capitales de 12 px, finition en 15 px ; l'image garde le reste (≈ 62 % de la hauteur). */
.arm-carte { position: relative; flex: none; width: var(--arm-carte-l, 216px); height: var(--arm-carte-h, calc(var(--arm-carte-l, 216px) * var(--arm-carte-r, 1.12))); }
.arm-carte-c { position: absolute; inset: 0; border-radius: 6px; overflow: hidden; transform-origin: 50% 55%; perspective: 900px;
  background: radial-gradient(120% 70% at 50% 108%, color-mix(in srgb, var(--arm-rc) 22%, transparent), transparent 68%), linear-gradient(180deg, var(--arm-laque-hi), var(--arm-laque-lo));
  border: 1px solid rgba(222,184,92,.14); box-shadow: inset 0 1px 0 rgba(247,221,143,.08), 0 6px 14px rgba(0,0,0,.4);
  transition: transform var(--arm-t-leve) var(--arm-ease-sortie), box-shadow var(--arm-t-leve) var(--arm-ease-sortie), opacity .3s var(--arm-ease-douce); }
.arm-corps { position: absolute; inset: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; padding: 12px 12px 14px; }
.arm-carte-img { display: grid; place-items: center; min-height: 0; }
.arm-carte-img img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 8px 10px rgba(0,0,0,.55)); user-select: none; -webkit-user-drag: none; }
/* dans une bande, 56 ombres portées à rastériser à chaque tuile qui entre pendant le défilement (ARM-CS2-A, mesuré) : seule la
   carte gagnante garde la sienne, une fois arrêtée */
.arm-bande .arm-carte-img img { filter: none; }
.arm-bande .arm-carte.is-gagnante .arm-carte-img img { filter: drop-shadow(0 8px 10px rgba(0,0,0,.6)); }
.arm-carte-t { display: grid; gap: 2px; min-width: 0; padding-top: 6px; }
.arm-carte-a, .arm-carte-f { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.arm-carte-a { font: 600 12px/1.3 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; color: var(--text-dim); }
.arm-carte-f { font: 600 15px/1.25 var(--font-ui); color: var(--text); }
.arm-carte.is-st .arm-carte-a::before { content: "StatTrak™ "; color: var(--arm-t-st); }
.arm-carte-barre { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--arm-rc); box-shadow: 0 -6px 16px -5px var(--arm-rc); }
/* le dos ★ (revue n° 2) : la même carte que ses voisines, une plaque d'or à la place de l'image — l'or reste vif pour se voir en
   mouvement : un dégradé, un seul reflet en diagonale, le médaillon de minuit (douze traits, l'étoile) gravé en sombre —, ses
   libellés sous la plaque, à leur place habituelle. Aucun nom ni image du vrai objet tant qu'il n'est pas retourné. */
.arm-carte--dos .arm-carte-c { border-color: rgba(247,221,143,.38); box-shadow: inset 0 1px 0 rgba(255,246,214,.22), 0 6px 14px rgba(0,0,0,.4), 0 10px 26px -8px rgba(228,174,51,.4); }
.arm-dos { position: relative; display: grid; place-items: center; width: 100%; height: 100%; border-radius: 4px; overflow: hidden;
  background: linear-gradient(165deg, #f7dd8f 0%, #e4ae33 54%, #8c6a22 100%);
  box-shadow: inset 0 0 0 1px rgba(255,244,205,.75), inset 0 0 0 4px rgba(140,106,34,.42), inset 0 0 0 5px rgba(255,244,205,.45), inset 0 -18px 26px -12px rgba(74,53,8,.5); }
.arm-dos::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(118deg, transparent 28%, rgba(255,252,236,.5) 44%, rgba(255,252,236,.1) 53%, transparent 64%); }
.arm-dos::before { content: ""; width: 46%; aspect-ratio: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%232a1d06' stroke-linejoin='round' stroke-linecap='round'%3E%3Ccircle cx='50' cy='50' r='46' stroke-width='2.4'/%3E%3Ccircle cx='50' cy='50' r='39' stroke-width='1' opacity='.5'/%3E%3Cpath stroke-width='1.8' d='M50 4v7M73 10.2l-3.5 6.1M89.8 27l-6.1 3.5M96 50h-7M89.8 73l-6.1-3.5M73 89.8l-3.5-6.1M50 96v-7M27 89.8l3.5-6.1M10.2 73l6.1-3.5M4 50h7M10.2 27l6.1 3.5M27 10.2l3.5 6.1'/%3E%3Cpath fill='%23241903' stroke-width='1.5' d='M50 20 56.7 40.7 78.5 40.7 60.9 53.5 67.6 74.3 50 61.5 32.4 74.3 39.1 53.5 21.5 40.7 43.3 40.7Z'/%3E%3C/svg%3E") center / contain no-repeat; }
.arm-dos-t .arm-carte-f { color: var(--arm-t-or); }
.arm-flip { position: absolute; inset: 0; transform-style: preserve-3d; transition: transform var(--arm-t-retour) var(--arm-ease-retour); }
.arm-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.arm-face--recto { transform: rotateY(180deg); background: radial-gradient(120% 70% at 50% 108%, color-mix(in srgb, var(--arm-r-or) 30%, transparent), transparent 70%), linear-gradient(180deg, var(--arm-laque-hi), var(--arm-laque-lo)); }
.arm-carte.is-retournee .arm-flip { transform: rotateY(180deg); }
/* le voile (animations réduites) : une carte retournée, laque de nuit, filet de laiton, le losange de la maison au centre */
.arm-voile { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; border-radius: inherit; transition: opacity .3s linear;
  background: radial-gradient(circle at 50% 46%, rgba(222,184,92,.09), transparent 42%), linear-gradient(180deg, #121733, #080a14);
  box-shadow: inset 0 0 0 1px var(--line-strong, rgba(222,184,92,.45)), inset 0 0 0 6px #0a0d18, inset 0 0 0 7px rgba(222,184,92,.22); }
.arm-voile::before { content: ""; width: 18%; aspect-ratio: 1; transform: rotate(45deg); border: 2px solid rgba(222,184,92,.55); box-shadow: inset 0 0 0 4px #0b0e1c, inset 0 0 0 9px rgba(222,184,92,.35); }
.arm-voile.is-leve { opacity: 0; }

/* ---------- la bande ---------- */
.arm-bande { --arm-fenetre-h: calc(var(--arm-carte-h, calc(var(--arm-carte-l, 216px) * var(--arm-carte-r, 1.12))) + var(--arm-pad-f, 30px) * 2); position: relative; min-width: 0; overflow: hidden; }   /* les étincelles restent au-dessus de leur bande */
.arm-fenetre { position: relative; height: var(--arm-fenetre-h); overflow: hidden; border-radius: 4px; isolation: isolate;
  background: radial-gradient(70% 90% at 50% 115%, rgba(222,184,92,.07), transparent 70%), var(--arm-nuit-fenetre);
  border-block: 1px solid var(--line-strong, rgba(222,184,92,.45)); box-shadow: inset 0 14px 30px rgba(0,0,0,.55), inset 0 -14px 30px rgba(0,0,0,.55); }
.arm-fenetre::before, .arm-fenetre::after { content: ""; position: absolute; left: 0; right: 0; height: var(--filet, 1px); background: linear-gradient(90deg, transparent, rgba(222,184,92,.34) 12%, rgba(222,184,92,.34) 88%, transparent); z-index: 4; pointer-events: none; }
.arm-fenetre::before { top: 4px; } .arm-fenetre::after { bottom: 4px; }
.arm-zone { position: absolute; inset: 0; z-index: 1; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 13%, #000 87%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 13%, #000 87%, transparent 100%); }
.arm-ruban { position: absolute; top: 0; bottom: 0; left: 0; display: flex; align-items: center; gap: var(--arm-ecart, 10px); }
.arm-bande.is-roule .arm-ruban { will-change: transform; }
.arm-bande.is-roule .arm-carte-c { transition: none; }
/* l'aiguille de laiton du croupier ; à chaque bout, le losange de la maison (un carré tourné : aucune forme découpée) */
.arm-aiguille { position: absolute; z-index: 5; left: 50%; top: -1px; bottom: -1px; width: 2px; transform: translateX(-50%); pointer-events: none;
  background: linear-gradient(180deg, var(--gold-hi, #f7dd8f), var(--gold, #deb85c) 50%, var(--gold-hi, #f7dd8f)); box-shadow: 0 0 0 1px rgba(5,6,11,.55), 0 0 18px rgba(247,221,143,.35); }
.arm-aiguille::before, .arm-aiguille::after { content: ""; position: absolute; left: 50%; width: 11px; height: 11px; margin-left: -5.5px; background: var(--gold-hi, #f7dd8f); transform: rotate(45deg);
  box-shadow: 0 0 0 1px rgba(5,6,11,.6), 0 2px 5px rgba(0,0,0,.55); }
.arm-aiguille::before { top: -5px; }
.arm-aiguille::after { bottom: -5px; }
/* la lueur du palier : sa boîte est la fenêtre (plus rien ne dépasse de la bande ni de l'écran, ARM-FIX1) ; le dégradé et les rayons
   gardent leur taille d'avant (--arm-lum-l × --arm-lum-h, centrés) et la fenêtre les rogne comme avant : même effet */
.arm-lumiere { --arm-lum-l: calc(var(--arm-carte-l, 216px) * 2.3); --arm-lum-h: calc(var(--arm-fenetre-h) * 1.1);
  position: absolute; z-index: 0; inset: 0; pointer-events: none; opacity: 0;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--arm-rc) 75%, transparent), color-mix(in srgb, var(--arm-rc) 24%, transparent) 55%, transparent)
    center / var(--arm-lum-l) var(--arm-lum-h) no-repeat;
  transition: opacity var(--arm-t-lumiere) var(--arm-ease-sortie); }
.arm-lumiere::after { content: ""; position: absolute; left: calc((100% - var(--arm-lum-l) * 1.6) / 2); top: calc((100% - var(--arm-lum-h) * 1.6) / 2);
  width: calc(var(--arm-lum-l) * 1.6); height: calc(var(--arm-lum-h) * 1.6); opacity: 0; transition: opacity .6s var(--arm-ease-douce);
  background: repeating-conic-gradient(from 0deg, color-mix(in srgb, var(--arm-rc) 30%, transparent) 0 3.5deg, transparent 3.5deg 11.25deg);
  -webkit-mask-image: radial-gradient(closest-side, #000 20%, transparent 75%); mask-image: radial-gradient(closest-side, #000 20%, transparent 75%); }
.arm-rampe { position: relative; height: 2px; margin: 8px 6% 0; opacity: 0; border-radius: 2px; transition: opacity var(--arm-t-lumiere) var(--arm-ease-sortie);
  background: linear-gradient(90deg, transparent, var(--arm-rc) 35%, var(--arm-rc) 65%, transparent); box-shadow: 0 -6px 18px -4px var(--arm-rc); }
/* le losange de la maison au milieu de la rampe */
.arm-rampe::before { content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; margin: -4px 0 0 -4px; transform: rotate(45deg);
  background: var(--arm-rc); box-shadow: 0 0 0 3px var(--bg-0, #05060b), 0 0 0 4px color-mix(in srgb, var(--arm-rc) 55%, transparent); }

/* révélation : la lumière du palier, la carte qui se lève, les autres qui s'éteignent */
/* les autres cartes s'éteignent sous un seul voile (un projecteur centré sur l'aiguille) : une opacité composée au lieu de quatorze
   cartes repeintes à chaque image de leur fondu (ARM-CS2-A, mesuré). Voile à .3 (revue de Selman, point 3 : à .66 il éteignait les
   quasi-gains ★ voisins ; le ruban est composé à part, une carte ne peut pas passer au-dessus du voile) */
.arm-zone::after { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: 0; transition: opacity .3s var(--arm-ease-douce);
  --c: calc(50% + var(--arm-trou, 0px)); --l: var(--arm-trou-l, 216px);
  background: linear-gradient(90deg, rgba(6,8,15,.3) calc(var(--c) - var(--l) * .74), transparent calc(var(--c) - var(--l) * .64),
    transparent calc(var(--c) + var(--l) * .64), rgba(6,8,15,.3) calc(var(--c) + var(--l) * .74)); }
.arm-bande--y .arm-zone::after { background: linear-gradient(180deg, rgba(6,8,15,.3) calc(var(--c) - var(--l) * .74), transparent calc(var(--c) - var(--l) * .64),
    transparent calc(var(--c) + var(--l) * .64), rgba(6,8,15,.3) calc(var(--c) + var(--l) * .74)); }
.arm-bande.is-arretee .arm-zone::after { opacity: 1; }
.arm-carte.is-gagnante .arm-carte-c { will-change: transform; }
.arm-carte.is-eteinte .arm-carte-c { opacity: .35; }   /* une carte seule qu'on éteint (contrat raté) */
.arm-bande.is-arretee .arm-aiguille { opacity: .55; transition: opacity .4s var(--arm-ease-douce); }
.arm-bande.is-arretee .arm-lumiere { opacity: .32; }
.arm-bande.is-arretee .arm-rampe { opacity: .45; }
.arm-bande[data-niveau="1"] .arm-lumiere { opacity: .6; } .arm-bande[data-niveau="1"] .arm-rampe { opacity: .8; }
.arm-bande[data-niveau="2"] .arm-lumiere, .arm-bande[data-niveau="3"] .arm-lumiere { opacity: .88; }
.arm-bande[data-niveau="2"] .arm-rampe, .arm-bande[data-niveau="3"] .arm-rampe { opacity: 1; }
.arm-bande[data-niveau="3"] .arm-lumiere::after { opacity: 1; animation: arm-rayons 40s linear infinite; }
.arm-carte.is-gagnante { z-index: 2; }
.arm-carte.is-gagnante .arm-carte-c { transform: translateY(-6px) scale(1.05); box-shadow: 0 16px 28px rgba(0,0,0,.6), 0 0 0 1px var(--arm-rc), inset 0 1px 0 rgba(247,221,143,.12); }
.arm-bande[data-niveau="2"] .arm-carte.is-gagnante .arm-carte-c, .arm-bande[data-niveau="3"] .arm-carte.is-gagnante .arm-carte-c { box-shadow: 0 16px 28px rgba(0,0,0,.6), 0 0 0 1px var(--arm-rc), 0 0 30px 2px color-mix(in srgb, var(--arm-rc) 42%, transparent); }
.arm-bande.is-secousse .arm-fenetre { animation: arm-secousse .3s linear; }
/* la fête (gain au-dessus du prix, data-fete 1 à 4 : bleu, violet, rose, rouge et or) : la carte gagnante grandit, son liseré
   s'allume et bat ; une perte n'a pas de data-fete (sobre) */
.arm-bande[data-fete] { --arm-fete-k: 1.1; }
.arm-bande[data-fete="2"] { --arm-fete-k: 1.14; } .arm-bande[data-fete="3"] { --arm-fete-k: 1.18; } .arm-bande[data-fete="4"] { --arm-fete-k: 1.22; }
.arm-bande[data-fete] .arm-carte.is-gagnante { z-index: 3; }
.arm-bande[data-fete] .arm-carte.is-gagnante .arm-carte-c { transform: translateY(-6px) scale(var(--arm-fete-k));
  box-shadow: 0 18px 32px rgba(0,0,0,.65), 0 0 0 2px var(--arm-rc), 0 0 34px 4px color-mix(in srgb, var(--arm-rc) 55%, transparent); }
.arm-bande[data-fete="3"] .arm-carte.is-gagnante .arm-carte-c, .arm-bande[data-fete="4"] .arm-carte.is-gagnante .arm-carte-c { animation: arm-battement 1.1s var(--arm-ease-douce) .25s 2 both; }
.arm-bande[data-fete="4"] .arm-lumiere::after { opacity: 1; animation: arm-rayons 18s linear infinite; }
.arm-bande--y[data-fete] .arm-carte.is-gagnante .arm-carte-c { transform: scale(calc(1 + (var(--arm-fete-k) - 1) * .6)); }
.arm-bande--y[data-fete="3"] .arm-carte.is-gagnante .arm-carte-c, .arm-bande--y[data-fete="4"] .arm-carte.is-gagnante .arm-carte-c { animation-name: arm-battement-y; }
/* la fête agrandit la carte gagnante : le libellé de ses deux voisines, sur lequel elle passe, s'efface (js : is-voisine) */
.arm-bande[data-fete] .arm-carte.is-voisine .arm-carte-t { opacity: 0; transition: opacity .2s var(--arm-ease-douce); }
.arm-etincelle { position: absolute; z-index: 6; left: var(--x, 50%); bottom: 8px; width: 5px; height: 5px; background: var(--arm-rc); transform: rotate(45deg); opacity: 0; pointer-events: none;
  box-shadow: 0 0 8px color-mix(in srgb, var(--arm-rc) 70%, transparent); animation: arm-etincelle var(--d, 1.1s) var(--arm-ease-sortie) var(--delai, 0s) both; }

/* couloirs verticaux (×3 à ×10, batailles) */
.arm-bande--y { container-type: inline-size; --arm-fenetre-h: var(--arm-couloir-h, clamp(260px, calc(52 * var(--vh, 1vh)), 520px)); }
.arm-bande--y .arm-zone { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 15%, #000 85%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 15%, #000 85%, transparent 100%); }
.arm-bande--y .arm-fenetre { border-block: 0; border-inline: 1px solid var(--line-strong, rgba(222,184,92,.45)); }
.arm-bande--y .arm-fenetre::before, .arm-bande--y .arm-fenetre::after { display: none; }
.arm-bande--y .arm-ruban { left: 6px; right: 6px; bottom: auto; flex-direction: column; align-items: stretch; }
.arm-bande--y .arm-carte { width: auto; height: auto; aspect-ratio: 1 / var(--arm-couloir-r, .98); }
.arm-bande--y .arm-aiguille { left: -1px; right: -1px; top: 50%; bottom: auto; width: auto; height: 2px; transform: translateY(-50%); background: linear-gradient(90deg, var(--gold-hi, #f7dd8f), var(--gold, #deb85c) 50%, var(--gold-hi, #f7dd8f)); }
.arm-bande--y .arm-aiguille::before, .arm-bande--y .arm-aiguille::after { top: 50%; bottom: auto; left: -5px; margin: -5.5px 0 0; }
.arm-bande--y .arm-aiguille::after { left: auto; right: -5px; }
.arm-bande--y .arm-lumiere { --arm-lum-l: 150%; --arm-lum-h: calc(var(--arm-fenetre-h) * .62); }
@container (max-width: 132px) {
  .arm-bande--y .arm-carte-t { display: none; }
  .arm-bande--y .arm-corps { padding: 6px 6px 9px; }
}

/* ---------- la scène ---------- */
.arm-scene { position: relative; display: grid; gap: 16px; min-width: 0; overflow-x: clip;   /* la pluie de la fête ne fait jamais défiler la page */
  --arm-carte-l: clamp(118px, calc(9 * var(--vw, 1vw)) + 44px, 228px); --arm-carte-h: calc(var(--arm-carte-l) * var(--arm-carte-r, 1.12)); --arm-ecart: clamp(6px, calc(.55 * var(--vw, 1vw)), 12px); }
.arm-scene[data-n="2"] { --arm-carte-l: clamp(104px, calc(6.5 * var(--vw, 1vw)) + 40px, 190px); }
.arm-scene-bandes { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
/* une ouverture en couloirs : la largeur d'un couloir, l'écart entre deux, le rapport de ses cartes (--arm-couloir-l, -g, -r : l'écran
   peut les régler), et la LIGNE D'ARRÊT COMMUNE (revue n° 3, défaut 9). Les rouleaux d'une ouverture s'arrêtent tous à la même
   hauteur (js : COULOIR) ; un seul trait de laiton les traverse, fini par le losange de la maison à chaque bout : c'est lui,
   l'aiguille. Celle de chaque couloir reste en place pour la mesure (carteSousAiguille), sans se dessiner. */
.arm-scene[data-axe="y"] { --arm-couloir-l: 220px; --arm-couloir-g: clamp(5px, calc(.9 * var(--vw, 1vw)), 16px);
  --arm-ligne-y: calc(var(--arm-couloir-h, clamp(260px, calc(52 * var(--vh, 1vh)), 520px)) / 2); }
.arm-scene[data-axe="y"] .arm-scene-bandes { position: relative; flex-direction: row; justify-content: center; gap: var(--arm-couloir-g); }
.arm-scene[data-axe="y"] .arm-bande { flex: 1 1 0; max-width: var(--arm-couloir-l); }
.arm-scene[data-axe="y"] .arm-bande--y .arm-aiguille { opacity: 0; }
.arm-scene[data-axe="y"] .arm-scene-bandes::after { content: ""; position: absolute; z-index: 6; left: 50%; top: var(--arm-ligne-y); height: 11px; pointer-events: none;
  width: calc(min(100% - 2 * var(--arm-couloir-pad, 0px), var(--arm-n, 3) * var(--arm-couloir-l) + (var(--arm-n, 3) - 1) * var(--arm-couloir-g)) + 44px);
  transform: translate(-50%, -50%); opacity: .92; filter: drop-shadow(0 0 7px rgba(247,221,143,.32)); animation: arm-fondu .32s var(--arm-ease-douce) both;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 11'%3E%3Cpath d='M5.5 .8 10.2 5.5 5.5 10.2 .8 5.5Z' fill='%23f7dd8f' stroke='%2305060b' stroke-opacity='.6'/%3E%3C/svg%3E") left center / 11px 11px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 11'%3E%3Cpath d='M5.5 .8 10.2 5.5 5.5 10.2 .8 5.5Z' fill='%23f7dd8f' stroke='%2305060b' stroke-opacity='.6'/%3E%3C/svg%3E") right center / 11px 11px no-repeat,
    linear-gradient(90deg, var(--gold-hi, #f7dd8f), var(--gold, #deb85c) 50%, var(--gold-hi, #f7dd8f)) center / calc(100% - 16px) 2px no-repeat,
    linear-gradient(rgba(5,6,11,.5), rgba(5,6,11,.5)) center / calc(100% - 16px) 4px no-repeat; }
.arm-eclat { position: absolute; inset: 0; z-index: 7; pointer-events: none; animation: arm-eclat .9s ease-out both;
  background: radial-gradient(55% 48% at 50% 38%, color-mix(in srgb, var(--arm-rc) 34%, transparent), transparent 70%); }
/* le flash de la fête : plus large et plus franc du violet (2) au rouge et à l'or (4), cœur blanc chaud pour le 4 */
.arm-eclat[data-fete="2"] { background: radial-gradient(60% 52% at 50% 38%, color-mix(in srgb, var(--arm-rc) 38%, transparent), transparent 72%); }
.arm-eclat[data-fete="3"] { background: radial-gradient(70% 60% at 50% 38%, color-mix(in srgb, var(--arm-rc) 48%, transparent), transparent 74%); }
.arm-eclat[data-fete="4"] { animation-duration: 1.2s; background: radial-gradient(18% 22% at 50% 36%, rgba(255,246,220,.55), transparent 70%),
  radial-gradient(85% 75% at 50% 38%, color-mix(in srgb, var(--arm-rc) 60%, transparent), transparent 76%); }
.arm-pluie { position: absolute; z-index: 8; left: var(--x, 50%); top: 46%; width: 8px; height: 8px; pointer-events: none; opacity: 0;
  background: var(--arm-rc); transform: rotate(45deg); box-shadow: 0 0 10px color-mix(in srgb, var(--arm-rc) 80%, transparent);
  animation: arm-pluie var(--d, 1.4s) cubic-bezier(.15, .7, .3, 1) var(--delai, 0s) both; }
/* le plateau, sous la bande : au repos les commandes de l'écran (.arm-pied), après la révélation le cartouche et ses actions ;
   même place, hauteur constante : rien ne saute au clic ni à l'arrêt */
.arm-plateau { display: grid; align-content: start; justify-items: center; min-height: var(--arm-plateau-h, 220px); min-width: 0; }   /* mesuré : résultat 216 px, commandes 134-186 px */
.arm-scene[data-n]:not([data-n="1"]) .arm-plateau { --arm-plateau-h: 318px; }
.arm-scene.is-verdict .arm-pied { display: none; }
.arm-pied { width: 100%; }
.arm-verdict { display: grid; gap: 12px; justify-items: center; width: 100%; min-width: 0; }
.arm-verdict:empty { display: none; }
.arm-verdict > * { animation: arm-apparition var(--arm-t-cartouche) var(--arm-ease-sortie) both; }
.arm-verdict-liste { display: flex; justify-content: center; gap: clamp(5px, calc(.9 * var(--vw, 1vw)), 16px); width: 100%; }
.arm-verdict-total { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 6px 18px; color: var(--text-dim); font: 500 14px/1.3 var(--font-ui); }
.arm-verdict-total .num:not(.arm-net) { color: var(--text); font-size: 16px; }
.arm-verdict-total .arm-net { font-size: 16px; }
.arm-verdict-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
/* la barre au pouce (téléphone) : l'action principale collée en bas, sur un fond de nuit, au-dessus de la zone sûre ; au bureau,
   elle se fond dans sa ligne. L'écran garde ≥ 104 px de marge basse quand elle est là. */
.arm-pouce { display: contents; }

/* ---------- cartouche du résultat ---------- */
.arm-cartouche { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px 22px; width: min(100%, 760px); padding: 16px 22px 20px; border-radius: 3px; overflow: hidden;
  background: radial-gradient(90% 120% at 0% 100%, color-mix(in srgb, var(--arm-rc) 16%, transparent), transparent 60%), linear-gradient(180deg, rgba(26,32,64,.78), rgba(8,10,20,.94));
  border: 1px solid var(--line, rgba(222,184,92,.2)); box-shadow: 0 12px 28px rgba(0,0,0,.5), inset 0 1px 0 rgba(247,221,143,.07); }
.arm-cartouche::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--arm-rc); }
/* équerres art déco aux quatre coins (laiton), dessinées par huit filets */
.arm-cartouche::before, .arm-carte.is-gagnante::after { content: ""; position: absolute; pointer-events: none; --q: 14px; --t: 1.5px; --qc: rgba(222,184,92,.62);
  background: linear-gradient(var(--qc), var(--qc)) 0 0 / var(--q) var(--t), linear-gradient(var(--qc), var(--qc)) 0 0 / var(--t) var(--q),
    linear-gradient(var(--qc), var(--qc)) 100% 0 / var(--q) var(--t), linear-gradient(var(--qc), var(--qc)) 100% 0 / var(--t) var(--q),
    linear-gradient(var(--qc), var(--qc)) 0 100% / var(--q) var(--t), linear-gradient(var(--qc), var(--qc)) 0 100% / var(--t) var(--q),
    linear-gradient(var(--qc), var(--qc)) 100% 100% / var(--q) var(--t), linear-gradient(var(--qc), var(--qc)) 100% 100% / var(--t) var(--q);
  background-repeat: no-repeat; }
.arm-cartouche::before { inset: 7px 7px 11px; }
/* la carte gagnante : les équerres du viseur, à la couleur du palier, levées avec elle */
.arm-carte.is-gagnante::after { inset: -9px; z-index: 3; --q: 16px; --t: 2px; --qc: var(--arm-rc); transform: translateY(-6px) scale(1.05);
  animation: arm-fondu .3s var(--arm-ease-sortie) both; }
.arm-bande--y .arm-carte.is-gagnante::after { inset: -6px; --q: 12px; }
/* en couloirs, la carte gagnante grandit depuis son pied, sans se soulever : les cartes gagnantes d'une ouverture gardent le même
   pied et leurs libellés la même ligne, qu'il y ait fête ou non (la ligne d'arrêt commune : revue n° 3, défaut 9) */
.arm-bande--y .arm-carte.is-gagnante .arm-carte-c, .arm-bande--y .arm-carte.is-gagnante::after { transform-origin: 50% 100%; transform: scale(1.05); }
/* une ouverture en couloirs arrêtée : seule la carte gagnante garde son libellé (celui de la carte du dessus, au bord du couloir,
   était rogné une fois sur deux) ; l'image et le palier des voisines restent */
.arm-scene[data-axe="y"] .arm-bande.is-arretee .arm-carte:not(.is-gagnante) .arm-carte-t { opacity: 0; transition: opacity .3s var(--arm-ease-douce); }
.arm-cartouche p, .arm-cartouche h3, .arm-verdict-total { margin: 0; }
.arm-cartouche .arm-cartouche-meta { margin-top: 8px; }
.arm-cartouche-img { width: 168px; aspect-ratio: 4 / 3; display: grid; place-items: center; }
.arm-cartouche-img img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 9px 10px rgba(0,0,0,.6)); }
.arm-cartouche-nom { margin: 0; font: 400 clamp(22px, calc(1.4 * var(--vw, 1vw)) + 12px, 36px)/1.12 var(--font-display); letter-spacing: .02em; color: var(--text); text-wrap: balance; }
.arm-cartouche-nom .arm-arme { margin-right: .45em; font: 600 13px/1 var(--font-ui); letter-spacing: .1em; text-transform: uppercase; color: var(--text-dim); vertical-align: .3em; }
.arm-cartouche-nom .arm-arme.is-st::before { content: "StatTrak™ "; color: var(--arm-t-st); }
.arm-cartouche-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 8px 0 0; color: var(--text-dim); font: 500 14px/1.3 var(--font-ui); }
.arm-float { position: relative; width: min(300px, 100%); height: 5px; margin-top: 10px; border-radius: 3px;
  background: linear-gradient(90deg, #3ee08f 0 7%, #9fd36a 7% 15%, #e4c25a 15% 38%, #ee8c4a 38% 45%, #eb4b4b 45% 100%); opacity: .85; }
.arm-float i { position: absolute; top: -4px; width: 2px; height: 13px; margin-left: -1px; background: var(--text); box-shadow: 0 0 0 1px rgba(0,0,0,.6); }
.arm-cartouche-chiffres { display: grid; justify-items: end; gap: 4px; text-align: right; }
.arm-valeur { font: 700 30px/1 var(--font-num); font-variant-numeric: tabular-nums; color: var(--gold-hi, #f7dd8f); white-space: nowrap; }
.arm-mult { font: 500 13px/1.2 var(--font-ui); color: var(--text-dim); white-space: nowrap; }
.arm-cartouche.is-sobre .arm-valeur { color: var(--text); }          /* sous le prix : la valeur n'est pas dorée, rien ne fête une perte */
/* compact (×N) : une plaque sous chaque bande — l'arme, sa finition (un seul Limelight par révélation : en ×N, les noms passent en
   Jost), son palier et son usure, sa valeur et son net signé ; même grammaire que la grande (laque, équerres, barre du palier, la
   lumière du palier qui passe sous la plaque). Au téléphone, une ligne. */
.arm-cartouche--compact { flex: 1 1 0; min-width: 0; max-width: var(--arm-compact-l, 220px); grid-template-columns: minmax(0, 1fr); justify-items: center; align-content: start; gap: 8px; padding: 14px 14px 18px; text-align: center;
  overflow: visible; border-color: color-mix(in srgb, var(--arm-rc) 26%, rgba(222,184,92,.16));
  box-shadow: 0 14px 30px -12px rgba(0,0,0,.7), 0 22px 44px -22px color-mix(in srgb, var(--arm-rc) 72%, transparent), inset 0 1px 0 rgba(247,221,143,.08); }
.arm-cartouche--compact.is-sobre { box-shadow: 0 14px 30px -12px rgba(0,0,0,.7), 0 22px 44px -26px color-mix(in srgb, var(--arm-rc) 50%, transparent), inset 0 1px 0 rgba(247,221,143,.08); }
.arm-cartouche--compact::after { border-radius: 0 0 3px 3px; }
.arm-cartouche--compact .arm-cartouche-img { width: min(100%, 150px); }
.arm-cartouche--compact .arm-cartouche-corps { min-width: 0; width: 100%; }
.arm-cartouche--compact .arm-cartouche-nom { font: 600 17px/1.2 var(--font-ui); letter-spacing: 0; overflow-wrap: break-word; }
.arm-cartouche--compact .arm-cartouche-nom .arm-arme { display: block; margin: 0 0 4px; font-size: 12px; vertical-align: baseline; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.arm-cartouche--compact .arm-cartouche-meta { display: grid; justify-items: center; gap: 3px; margin-top: 8px; font-size: 12px; }
.arm-cartouche--compact .arm-cartouche-meta .arm-palier { font-size: 13px; }
.arm-cartouche--compact .arm-cartouche-meta .num, .arm-cartouche--compact .arm-float, .arm-cartouche--compact .arm-mult { display: none; }
.arm-cartouche--compact .arm-cartouche-chiffres { justify-items: center; text-align: center; gap: 3px; }
.arm-cartouche--compact .arm-valeur { font-size: 24px; }
.arm-cartouche--compact .arm-net { font-size: 16px; }
/* la grande révélation (×1 dans le calque plein écran ; revue n° 2, point 6 : à refaire). Trois plans : la lumière du palier, qui
   vit hors de la plaque et la déborde largement (.arm-cartouche-halo) ; la plaque de laque, son filet, ses équerres doubles et la
   barre du palier (.arm-cartouche-plaque) ; devant elle la lumière de l'arme (.arm-cartouche-lueur, des rayons pour un gain rose,
   rouge ou or seulement). Hiérarchie : l'arme (400 px), la finition en Limelight (56), la valeur (48), le net signé (24), l'arme
   et le palier (14). Les tailles suivent la hauteur de l'écran quand la scène en donne (--ar-*), sinon sa largeur.
   L'image tombe de la bande vers la plaque (continuité avec la carte gagnante, juste au-dessus). */
.arm-cartouche--grand { --arm-g-img: var(--ar-img, clamp(220px, calc(15 * var(--vw, 1vw)) + 40px, 400px)); width: var(--ar-plaque-l, min(100%, 1200px)); min-height: var(--ar-plaque-h, 0px);
  gap: 10px clamp(20px, calc(2.2 * var(--vw, 1vw)), 44px); padding: var(--ar-pad, 22px) clamp(24px, calc(2.6 * var(--vw, 1vw)), 52px) var(--ar-pad, 22px) clamp(16px, calc(1.5 * var(--vw, 1vw)), 30px);
  overflow: visible; isolation: isolate; border: 0; border-radius: 0; background: none; box-shadow: none; }
.arm-cartouche--grand::before, .arm-cartouche--grand::after { display: none; }
.arm-cartouche-halo { position: absolute; z-index: -3; left: -24%; right: -24%; top: -62%; bottom: -62%; pointer-events: none; opacity: .8;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--arm-rc) 44%, transparent), color-mix(in srgb, var(--arm-rc) 15%, transparent) 54%, transparent);
  animation: arm-halo .8s var(--arm-ease-sortie) both; }
.arm-cartouche--grand.is-sobre .arm-cartouche-halo { opacity: .5; }               /* une perte reste sobre : la lumière seule, plus basse */
.arm-cartouche-plaque { position: absolute; z-index: -2; inset: 0; border-radius: 3px; pointer-events: none;
  background: linear-gradient(180deg, rgba(17,21,42,.88), rgba(7,9,18,.95));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--arm-rc) 24%, rgba(222,184,92,.16)), inset 0 1px 0 rgba(247,221,143,.12), 0 30px 60px -24px rgba(0,0,0,.75); }
/* les équerres doubles, aux quatre coins : un grand trait de laiton et son écho, plus court, en retrait */
.arm-cartouche-plaque::before { content: ""; position: absolute; inset: 9px 9px 13px; pointer-events: none; --q: 30px; --r: 14px; --o: 6px; --t: 1.5px; --qc: rgba(222,184,92,.7); --rc2: rgba(222,184,92,.34);
  background:
    linear-gradient(var(--qc), var(--qc)) 0 0 / var(--q) var(--t), linear-gradient(var(--qc), var(--qc)) 0 0 / var(--t) var(--q),
    linear-gradient(var(--qc), var(--qc)) 100% 0 / var(--q) var(--t), linear-gradient(var(--qc), var(--qc)) 100% 0 / var(--t) var(--q),
    linear-gradient(var(--qc), var(--qc)) 0 100% / var(--q) var(--t), linear-gradient(var(--qc), var(--qc)) 0 100% / var(--t) var(--q),
    linear-gradient(var(--qc), var(--qc)) 100% 100% / var(--q) var(--t), linear-gradient(var(--qc), var(--qc)) 100% 100% / var(--t) var(--q),
    linear-gradient(var(--rc2), var(--rc2)) var(--o) var(--o) / var(--r) 1px, linear-gradient(var(--rc2), var(--rc2)) var(--o) var(--o) / 1px var(--r),
    linear-gradient(var(--rc2), var(--rc2)) calc(100% - var(--o)) var(--o) / var(--r) 1px, linear-gradient(var(--rc2), var(--rc2)) calc(100% - var(--o)) var(--o) / 1px var(--r),
    linear-gradient(var(--rc2), var(--rc2)) var(--o) calc(100% - var(--o)) / var(--r) 1px, linear-gradient(var(--rc2), var(--rc2)) var(--o) calc(100% - var(--o)) / 1px var(--r),
    linear-gradient(var(--rc2), var(--rc2)) calc(100% - var(--o)) calc(100% - var(--o)) / var(--r) 1px, linear-gradient(var(--rc2), var(--rc2)) calc(100% - var(--o)) calc(100% - var(--o)) / 1px var(--r);
  background-repeat: no-repeat; }
.arm-cartouche-plaque::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px; border-radius: 0 0 3px 3px; background: var(--arm-rc); box-shadow: 0 -10px 30px -6px var(--arm-rc); }
.arm-cartouche-lueur { position: absolute; z-index: -1; left: calc(clamp(16px, calc(1.5 * var(--vw, 1vw)), 30px) + var(--arm-g-img) * .5); top: 50%; width: calc(var(--arm-g-img) * 1.5); aspect-ratio: 1; margin: calc(var(--arm-g-img) * -.75) 0 0 calc(var(--arm-g-img) * -.75); pointer-events: none;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--arm-rc) 46%, transparent), color-mix(in srgb, var(--arm-rc) 13%, transparent) 56%, transparent); }
.arm-cartouche-lueur.a-rayons::after { content: ""; position: absolute; inset: -18%; background: repeating-conic-gradient(from 0deg, transparent 0deg, color-mix(in srgb, var(--arm-rc) 20%, transparent) 2.5deg, transparent 5deg, transparent 18deg);
  -webkit-mask-image: radial-gradient(closest-side, #000 14%, transparent 68%); mask-image: radial-gradient(closest-side, #000 14%, transparent 68%); animation: arm-rayons 60s linear infinite; }
.arm-cartouche--grand.is-sobre .arm-cartouche-lueur { opacity: .6; }
.arm-cartouche--grand .arm-cartouche-img { width: var(--arm-g-img); margin-block: calc(var(--ar-pad, 22px) * -1); animation: arm-revele-img .62s var(--arm-ease-sortie) both; }
.arm-cartouche--grand .arm-cartouche-img img { filter: drop-shadow(0 18px 20px rgba(0,0,0,.6)); }
.arm-cartouche--grand .arm-cartouche-corps { min-width: 0; animation: arm-apparition .46s var(--arm-ease-sortie) .08s both; }
.arm-cartouche--grand .arm-cartouche-nom { font-size: var(--ar-f-nom, clamp(30px, calc(1.9 * var(--vw, 1vw)) + 12px, 56px)); line-height: 1.04; overflow-wrap: break-word; }
.arm-cartouche--grand .arm-cartouche-nom.is-long { font-size: calc(var(--ar-f-nom, clamp(30px, calc(1.9 * var(--vw, 1vw)) + 12px, 56px)) * .8); }
.arm-cartouche--grand .arm-cartouche-nom .arm-arme { display: block; margin: 0 0 10px; font-size: 14px; line-height: 1.2; vertical-align: baseline; }
.arm-cartouche--grand .arm-cartouche-meta { margin-top: 14px; font-size: 14px; }
.arm-cartouche--grand .arm-cartouche-meta .arm-palier { font-size: 14px; }
.arm-cartouche--grand .arm-float { width: min(360px, 100%); margin-top: 12px; }
.arm-cartouche--grand .arm-cartouche-chiffres { gap: 8px; animation: arm-apparition .46s var(--arm-ease-sortie) .16s both; }
.arm-cartouche--grand .arm-valeur { font-size: var(--ar-f-val, clamp(30px, calc(1.2 * var(--vw, 1vw)) + 18px, 48px)); }
.arm-cartouche--grand .arm-net { font-size: var(--ar-f-net, clamp(18px, calc(.5 * var(--vw, 1vw)) + 13px, 24px)); }
.arm-cartouche--grand .arm-mult { font-size: 14px; }

/* ---------- téléphone et petits écrans ---------- */
@media (max-width: 640px) {
  .arm-scene { gap: 12px; }
  .arm-scene-bandes { gap: 10px; }
  .arm-cartouche { grid-template-columns: auto minmax(0, 1fr); padding: 16px 20px 22px; }
  .arm-cartouche::before { inset: 5px 5px 9px; --q: 10px; }          /* équerres plus petites : elles ne touchent plus les chiffres */
  .arm-cartouche-img { width: 104px; }
  .arm-cartouche-nom .arm-arme { display: block; margin: 0 0 4px; vertical-align: baseline; }   /* l'arme sur sa ligne : la finition ne se coupe plus */
  .arm-cartouche-chiffres { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; justify-content: flex-start; text-align: left; }
  .arm-valeur { font-size: 24px; }
  .arm-plateau { --arm-plateau-h: 332px; }   /* mesuré : résultat 257-326 px, commandes 313 px */
  .arm-scene[data-n]:not([data-n="1"]) .arm-plateau { --arm-plateau-h: 0px; }
  .arm-pouce { display: flex; position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; justify-content: center; padding: 22px 16px calc(14px + env(safe-area-inset-bottom, 0px));
    background: linear-gradient(180deg, rgba(5,6,11,0), rgba(5,6,11,.9) 34%, var(--bg-0, #05060b)); }
  .arm-pouce > .btn { width: 100%; height: 56px; }
  .arm-bande--y { --arm-fenetre-h: var(--arm-couloir-h, clamp(220px, calc(40 * var(--vh, 1vh)), 340px)); }
  .arm-scene[data-axe="y"] { --arm-ligne-y: calc(var(--arm-couloir-h, clamp(220px, calc(40 * var(--vh, 1vh)), 340px)) / 2); }
  .arm-verdict-liste { flex-direction: column; }
  .arm-cartouche--compact { flex: none; max-width: none; grid-template-columns: auto minmax(0, 1fr) auto; justify-items: start; text-align: left; gap: 4px 12px; padding: 8px 12px 11px; }
  .arm-cartouche--compact .arm-cartouche-img { width: 60px; }
  .arm-cartouche--compact::before { display: none; }                  /* lignes compactes : pas d'équerres, trop près des chiffres */
  .arm-cartouche--compact .arm-cartouche-nom { font-size: 15px; -webkit-line-clamp: 2; }
  .arm-cartouche--compact .arm-cartouche-meta { justify-content: flex-start; margin-top: 3px; }
  .arm-cartouche--compact .arm-cartouche-chiffres { grid-column: auto; grid-template-columns: none; width: auto; justify-items: end; text-align: right; }
  .arm-cartouche--grand { --arm-g-img: 132px; gap: 8px 16px; padding: 16px 20px 22px; min-height: 0; }
  .arm-cartouche--grand .arm-cartouche-img { margin-block: 0; }
  .arm-cartouche--grand .arm-cartouche-nom, .arm-cartouche--grand .arm-cartouche-nom.is-long { font-size: 26px; }
  .arm-cartouche--grand .arm-valeur { font-size: 26px; }
  .arm-cartouche--grand .arm-net { font-size: 18px; }
  .arm-cartouche-lueur { left: calc(20px + var(--arm-g-img) * .5); }
  .arm-cartouche-plaque::before { inset: 6px 6px 10px; --q: 16px; --r: 0px; }
  .arm-cartouche-halo { left: -40%; right: -40%; top: -40%; bottom: -40%; }
}

/* ---------- animations réduites, qualité allégée ---------- */
.arm-scene.is-reduit .arm-carte-c, .reduce-motion .arm-carte-c { transition: opacity .3s linear, box-shadow .3s linear; }
.arm-scene.is-reduit .arm-carte.is-gagnante .arm-carte-c, .reduce-motion .arm-carte.is-gagnante .arm-carte-c,
.arm-scene.is-reduit .arm-carte.is-gagnante::after, .reduce-motion .arm-carte.is-gagnante::after { transform: none; }
.arm-scene.is-reduit .arm-flip, .reduce-motion .arm-flip { transition: none; transform: none !important; }
.arm-scene.is-reduit .arm-face, .reduce-motion .arm-face { transition: opacity .3s linear; }
.arm-scene.is-reduit .arm-face--recto, .reduce-motion .arm-face--recto { transform: none; opacity: 0; }
.arm-scene.is-reduit .arm-carte.is-retournee .arm-face--recto, .reduce-motion .arm-carte.is-retournee .arm-face--recto { opacity: 1; }
.arm-scene.is-reduit .arm-carte.is-retournee .arm-face--dos, .reduce-motion .arm-carte.is-retournee .arm-face--dos { opacity: 0; }
.arm-scene.is-reduit .arm-lumiere::after, .reduce-motion .arm-lumiere::after { animation: none; }
.arm-scene.is-reduit .arm-bande[data-fete] .arm-carte.is-gagnante .arm-carte-c, .reduce-motion .arm-bande[data-fete] .arm-carte.is-gagnante .arm-carte-c { transform: none; animation: none; }
.arm-scene.is-reduit .arm-pluie, .reduce-motion .arm-pluie { display: none; }
.arm-scene.is-reduit .arm-scene-bandes::after, .reduce-motion .arm-scene-bandes::after { animation: none; }
.arm-scene.is-reduit .arm-verdict > *, .reduce-motion .arm-verdict > * { animation-name: arm-fondu; }
.arm-scene.is-reduit .arm-cartouche--grand .arm-cartouche-img, .reduce-motion .arm-cartouche--grand .arm-cartouche-img { animation: arm-fondu .3s linear both; }
.arm-scene.is-reduit .arm-cartouche--grand .arm-cartouche-corps, .reduce-motion .arm-cartouche--grand .arm-cartouche-corps,
.arm-scene.is-reduit .arm-cartouche--grand .arm-cartouche-chiffres, .reduce-motion .arm-cartouche--grand .arm-cartouche-chiffres,
.arm-scene.is-reduit .arm-cartouche-halo, .reduce-motion .arm-cartouche-halo { animation-name: arm-fondu; }
.arm-scene.is-reduit .arm-cartouche-lueur::after, .reduce-motion .arm-cartouche-lueur::after, .perf-low .arm-cartouche-lueur::after { animation: none; }
.perf-low .arm-carte-img img { filter: none; }
.perf-low .arm-bande[data-niveau="3"] .arm-lumiere::after { animation: none; }

@keyframes arm-rayons { to { transform: rotate(360deg); } }
@keyframes arm-secousse { 0%, 100% { transform: none; } 20% { transform: translateX(-2px); } 45% { transform: translateX(2px); } 70% { transform: translateX(-1px); } }
@keyframes arm-etincelle { 0% { opacity: 0; transform: translate(0, 0) rotate(45deg) scale(.6); } 15% { opacity: 1; } 100% { opacity: 0; transform: translate(var(--dx, 0), var(--dy, -120px)) rotate(45deg) scale(1); } }
@keyframes arm-eclat { 0% { opacity: 0; } 25% { opacity: 1; } 100% { opacity: 0; } }
@keyframes arm-pluie { 0% { opacity: 0; transform: translate(0, 0) rotate(45deg) scale(.4); } 12% { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--dx, 0), var(--dy, -200px)) rotate(var(--r, 180deg)) scale(1); } }
@keyframes arm-battement { 50% { transform: translateY(-6px) scale(calc(var(--arm-fete-k) + .04)); } }
@keyframes arm-battement-y { 50% { transform: scale(calc(1 + (var(--arm-fete-k) - 1) * .6 + .03)); } }
@keyframes arm-apparition { from { opacity: 0; transform: translateY(8px); } }
@keyframes arm-fondu { from { opacity: 0; } }
@keyframes arm-revele-img { from { opacity: 0; transform: translateY(-26px) scale(.82); } }
@keyframes arm-halo { from { opacity: 0; transform: scale(.72); } }