/* ============================================================================
   bffr.fr/raid/rebirth - LA RENAISSANCE (Ascension) - refonte du 2026-09-26, préfixe rgrb-
   ----------------------------------------------------------------------------
   Chargée par la route /raid/rebirth (option head de shell()), donc APRÈS raids/ds.css.
   Remplace raid_rebirth.css. HTML entièrement rendu côté serveur (routes_raid_game.mjs),
   aucun script propre. Icônes = SVG inline (.rgrb-i) + icônes custom des matériaux (.rgrb-mi)
   + emblèmes des paliers (/raid/rebirth/tier-N.webp).
   Ordre : encart « où tu en es » -> chemin des 5 paliers -> cartes détaillées -> comparatif
   -> gardé/perdu -> appel à l'action (/rebirth sur Discord).
   Couleurs = variables de ds.css ; cibles tactiles >= 40 px ; pas d'effet lourd.
   ============================================================================ */

body.raidnew .rgrb { min-width: 0; }
body.raidnew .rgrb-i { width: 1.05em; height: 1.05em; flex: none; vertical-align: -.16em; }
body.raidnew .rgrb-i.g { color: var(--accent2); }
body.raidnew .rgrb-i.ok, body.raidnew .rgrb-i.keep { color: var(--ok); }
body.raidnew .rgrb-i.no { color: var(--line2); }
body.raidnew .rgrb-i.lose { color: var(--bad); }
body.raidnew .rgrb-i.warn { color: var(--warn); }
body.raidnew .rgrb-mi { width: 22px; height: 22px; object-fit: contain; flex: none; }
body.raidnew .rgrb-kick { display: block; color: var(--accent2); font: 700 .68rem/1.2 var(--font); letter-spacing: .14em; text-transform: uppercase; }
body.raidnew .rgrb-sec { margin-top: 34px; }
body.raidnew .rgrb-sec > h2 { margin-bottom: 6px; }
body.raidnew .rgrb-sec-s { margin: 0 0 16px; color: var(--mut); font-size: .9rem; line-height: 1.55; }
body.raidnew .rgrb-note { margin: 12px 0 0; color: var(--mut); font-size: .84rem; line-height: 1.55; }
body.raidnew .rgrb-swipe { display: none; }
body.raidnew .rgrb-note b { color: var(--txt2); }
body.raidnew .rgrb-note a { text-decoration: underline; text-underline-offset: 2px; }

/* ── 1. Encart « où tu en es » ─────────────────────────────────────────────── */
body.raidnew .rgrb-status {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px 26px;
  padding: 18px 22px; background: var(--card); border: 1px solid var(--line2); border-radius: var(--r-l); box-shadow: var(--hl);
}
body.raidnew .rgrb-st-rank { display: flex; align-items: center; gap: 14px; min-width: 0; }
body.raidnew .rgrb-st-em { width: 72px; height: 72px; object-fit: contain; flex: 0 0 72px; }
body.raidnew .rgrb-st-badge {
  display: inline-grid; place-items: center; flex: 0 0 auto; min-width: 72px; height: 72px; padding: 0 10px; border-radius: 18px;
  font: 800 1.1rem/1.1 var(--font); color: var(--on-accent); background: var(--accent); text-align: center;
}
body.raidnew .rgrb-st-badge.rgrb-zero { background: var(--bg2); color: var(--mut); border: 1px dashed var(--line2); font-size: .8rem; }
body.raidnew .rgrb-st-tx { display: flex; flex-direction: column; gap: 3px; min-width: 0; line-height: 1.3; }
body.raidnew .rgrb-st-tx b { color: var(--txt); font-size: 1.08rem; }
body.raidnew .rgrb-st-tx small { color: var(--mut); font-size: .84rem; line-height: 1.45; }
body.raidnew .rgrb-st-prog { min-width: 0; }
body.raidnew .rgrb-pl { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; margin: 0 0 8px; color: var(--mut); font-size: .84rem; }
body.raidnew .rgrb-pl b { color: var(--txt); font-variant-numeric: tabular-nums; }
body.raidnew .rgrb-bar { height: 10px; overflow: hidden; border-radius: 999px; background: var(--bg2); border: 1px solid var(--line); }
body.raidnew .rgrb-bar > i { display: block; height: 100%; border-radius: 999px; background: var(--accent); }
body.raidnew .rgrb-st-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 8px; color: var(--mut); font-size: .78rem; }
body.raidnew .rgrb-st-meta b { color: var(--txt2); font-variant-numeric: tabular-nums; }
/* Lien vers la fiche (joueur absent du classement) : vraie cible tactile, pas un lien de 19 px. */
body.raidnew .rgrb-st-meta { align-items: center; }
body.raidnew .rgrb-st-link { display: inline-flex; align-items: center; min-height: 32px; font-weight: 650; }
body.raidnew .rgrb-st-go {
  display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 11px; white-space: nowrap;
  background: var(--accent-dim); border: 1px solid var(--accent-line); color: var(--accent2); font-size: .84rem; font-weight: 700;
}
body.raidnew .rgrb-st-go:hover { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
body.raidnew .rgrb-status.is-anon, body.raidnew .rgrb-status.is-max { grid-template-columns: minmax(0, 1fr) auto; }
body.raidnew .rgrb-status.is-anon .rgbtn { margin: 0; }

/* ── 2. Chemin des 5 paliers ───────────────────────────────────────────────── */
body.raidnew .rgrb-path { margin: 16px 0 0; }
body.raidnew .rgrb-path ol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
body.raidnew .rgrb-step a {
  position: relative; display: flex; align-items: center; gap: 12px; min-height: 76px; height: 100%; padding: 10px 14px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-m); box-shadow: var(--hl); color: var(--txt2);
  transition: border-color .15s, background-color .15s;
}
body.raidnew .rgrb-step a:hover { border-color: var(--line2); background: var(--card2); color: var(--txt2); }
body.raidnew .rgrb-step-em { width: 48px; height: 48px; object-fit: contain; flex: 0 0 48px; }
body.raidnew .rgrb-step-t { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
body.raidnew .rgrb-step-t b { color: var(--txt); font-size: .95rem; white-space: nowrap; }
body.raidnew .rgrb-step-t small { color: var(--accent2); font-size: .8rem; font-weight: 700; font-variant-numeric: tabular-nums; }
body.raidnew .rgrb-step-s {
  position: absolute; top: 8px; right: 8px; display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px;
  border-radius: 999px; background: var(--ok); color: var(--on-accent); font-size: .64rem; font-weight: 800; letter-spacing: .02em;
}
body.raidnew .rgrb-step-s .rgrb-i { width: 13px; height: 13px; }
body.raidnew .rgrb-step-s.is-next { background: var(--accent); text-transform: uppercase; }
body.raidnew .rgrb-step.is-next a { border-color: var(--accent-line); background: var(--accent-dim); }
body.raidnew .rgrb-step:not(.is-done):not(.is-next) .rgrb-step-em { opacity: .78; }

/* ── 3. Cartes des paliers ─────────────────────────────────────────────────── */
body.raidnew .rgrb-rail { display: flex; flex-direction: column; gap: 14px; }
body.raidnew .rgrb-card {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px 28px; align-items: start;
  padding: 20px 22px 20px 25px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-l); box-shadow: var(--hl);
  scroll-margin-top: 84px; overflow: hidden;
}
body.raidnew .rgrb-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--line2); }
body.raidnew .rgrb-card.is-done::before { background: var(--ok); }
body.raidnew .rgrb-card.is-next { border-color: var(--accent-line); }
body.raidnew .rgrb-card.is-next::before { background: var(--accent); }
body.raidnew .rgrb-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
body.raidnew .rgrb-ch { display: flex; align-items: center; gap: 14px; min-width: 0; }
body.raidnew .rgrb-emblem { width: 64px; height: 64px; object-fit: contain; flex: 0 0 64px; }
body.raidnew .rgrb-ch-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
body.raidnew .rgrb-ch h3 { margin: 0; font-size: 1.22rem; color: var(--txt); }
body.raidnew .rgrb-mult { color: var(--accent2); font-size: .88rem; font-weight: 700; }
body.raidnew .rgrb-tag {
  display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; margin-left: auto; align-self: flex-start;
  padding: 4px 10px; border-radius: 999px; font-size: .7rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
}
body.raidnew .rgrb-tag.done { color: var(--ok); border: 1px solid currentColor; }
body.raidnew .rgrb-tag.next { color: var(--on-accent); background: var(--accent); }
body.raidnew .rgrb-unlock, body.raidnew .rgrb-reward { display: flex; align-items: flex-start; gap: 10px; margin: 0; line-height: 1.5; }
body.raidnew .rgrb-unlock .rgrb-i, body.raidnew .rgrb-reward .rgrb-i { margin-top: 3px; }
body.raidnew .rgrb-unlock { color: var(--txt2); font-size: .95rem; }
body.raidnew .rgrb-unlock b { color: var(--txt); }
body.raidnew .rgrb-reward { padding: 10px 12px; background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; color: var(--mut); font-size: .86rem; }
body.raidnew .rgrb-reward b { color: var(--txt2); }
body.raidnew .rgrb-side { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
body.raidnew .rgrb-req { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
body.raidnew .rgrb-req > span {
  display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 10px; align-items: center;
  padding: 11px 13px; background: var(--bg2); border: 1px solid var(--line); border-radius: 12px;
}
body.raidnew .rgrb-req .rgrb-i { grid-row: 1 / span 2; width: 20px; height: 20px; }
body.raidnew .rgrb-req small { color: var(--mut); font-size: .74rem; }
body.raidnew .rgrb-req b { color: var(--txt); font-size: 1.08rem; font-variant-numeric: tabular-nums; }
body.raidnew .rgrb-req b i { font-style: normal; color: var(--mut); font-size: .76rem; font-weight: 600; }
body.raidnew .rgrb-matsw { padding: 12px 13px; background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; }
body.raidnew .rgrb-mats-h { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; color: var(--txt2); font-size: .82rem; font-weight: 700; }
body.raidnew .rgrb-mats-c { margin-left: auto; color: var(--mut); font-weight: 600; font-size: .76rem; }
body.raidnew .rgrb-mats { display: flex; flex-wrap: wrap; gap: 6px; }
body.raidnew .rgrb-chip {
  display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 3px 11px 3px 6px;
  background: var(--card); border: 1px solid var(--line); border-radius: 999px; color: var(--txt2); font-size: .8rem;
}
body.raidnew .rgrb-chip b { color: var(--txt); font-variant-numeric: tabular-nums; }
body.raidnew .rgrb-chip .rgrb-sl { margin: 0 2px; font-style: normal; font-weight: 400; color: var(--mut); }
body.raidnew .rgrb-chip.ok { border-color: var(--ok-line); }
body.raidnew .rgrb-chip.ok b { color: var(--ok); }
body.raidnew .rgrb-i.chk { width: .95em; height: .95em; color: var(--ok); }

/* ── 4. Comparatif ─────────────────────────────────────────────────────────── */
body.raidnew .rgrb-tblwrap { overflow-x: auto; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-l); box-shadow: var(--hl); }
body.raidnew .rgrb-tbl { width: 100%; min-width: 640px; border-collapse: separate; border-spacing: 0; }
body.raidnew .rgrb-tbl th, body.raidnew .rgrb-tbl td { padding: 12px 14px; text-align: center; border-bottom: 1px solid var(--line); font-size: .88rem; }
body.raidnew .rgrb-tbl thead th { color: var(--txt); font-weight: 800; font-size: .92rem; background: var(--card); vertical-align: bottom; }
body.raidnew .rgrb-tbl thead th:not(:first-child) span { display: block; margin-top: 4px; }
body.raidnew .rgrb-th-em { width: 30px; height: 30px; object-fit: contain; display: block; margin: 0 auto; }
body.raidnew .rgrb-tbl thead th:first-child { color: var(--mut); font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; text-align: left; }
body.raidnew .rgrb-tbl th:first-child, body.raidnew .rgrb-tbl td:first-child { position: sticky; left: 0; z-index: 1; background: var(--card); box-shadow: 1px 0 0 var(--line); }
body.raidnew .rgrb-tbl tbody td:first-child { text-align: left; color: var(--txt); font-weight: 600; }
body.raidnew .rgrb-tbl tbody tr:last-child td { border-bottom: 0; }
body.raidnew .rgrb-tbl .rgrb-v { color: var(--txt); font-weight: 700; font-variant-numeric: tabular-nums; }
body.raidnew .rgrb-tbl .is-next { background: var(--accent-dim); }
body.raidnew .rgrb-tbl thead th.is-next span { color: var(--accent2); }
/* Colonnes des paliers atteints : voile vert très léger (15 cellules par colonne, color-mix sans risque). */
body.raidnew .rgrb-tbl .is-done { background: rgba(59, 224, 138, .04); background: color-mix(in srgb, var(--ok) 5%, transparent); }
body.raidnew .rgrb-tbl .rgrb-i { width: 1.15em; height: 1.15em; }

/* ── 5. Gardé / perdu ──────────────────────────────────────────────────────── */
body.raidnew .rgrb-kl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
body.raidnew .rgrb-kl > div { padding: 18px 20px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-l); box-shadow: var(--hl); }
body.raidnew .rgrb-keep { border-top: 3px solid var(--ok) !important; }
body.raidnew .rgrb-lose { border-top: 3px solid var(--bad) !important; }
body.raidnew .rgrb-kl h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 1rem; }
body.raidnew .rgrb-keep h3 { color: var(--ok); }
body.raidnew .rgrb-lose h3 { color: var(--bad); }
body.raidnew .rgrb-kl ul { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
body.raidnew .rgrb-kl li { display: flex; align-items: flex-start; gap: 10px; color: var(--txt2); font-size: .9rem; line-height: 1.45; }
body.raidnew .rgrb-kl li .rgrb-i { margin-top: 3px; }

/* ── 6. Appel à l'action ───────────────────────────────────────────────────── */
body.raidnew .rgrb-cta {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px 22px; margin: 34px 0 8px;
  padding: 22px 24px; background: var(--card); border: 1px solid var(--accent-line); border-radius: var(--r-xl); box-shadow: var(--hl);
}
body.raidnew .rgrb-cta-em { width: 88px; height: 88px; object-fit: contain; }
body.raidnew .rgrb-cta h3 { margin: 0 0 4px; font-size: 1.2rem; color: var(--txt); }
body.raidnew .rgrb-cta p { margin: 0 0 8px; color: var(--txt2); font-size: .94rem; }
body.raidnew .rgrb-cta small { display: flex; align-items: flex-start; gap: 8px; color: var(--mut); font-size: .8rem; line-height: 1.5; }
body.raidnew .rgrb-cta small .rgrb-i { margin-top: 2px; }
/* La commande se lit comme du code (contour, police mono, pas de fond d'accent) : ce n'est pas un bouton.
   Le vrai bouton « Copier » à côté n'apparaît que si le presse-papiers est disponible (script en bas de page). */
body.raidnew .rgrb-cmdw { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
body.raidnew .rgrb-cmd {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 12px;
  font-family: ui-monospace, 'SFMono-Regular', Consolas, monospace; font-size: 1.08rem; font-weight: 700; letter-spacing: 0;
  color: var(--accent2); background: var(--bg2); border: 1px solid var(--accent-line); user-select: all; cursor: text; white-space: nowrap;
}
body.raidnew .rgrb-copy { min-height: 44px; padding: 0 14px; }
body.raidnew .rgrb-copy[hidden] { display: none; }
body.raidnew .rgrb-copy .rgrb-i { width: 17px; height: 17px; }
body.raidnew .rgrb-copy.is-ok, body.raidnew .rgrb-copy.is-ok:hover { color: var(--ok); border-color: var(--ok-line); }

/* ── 7. Adaptations ────────────────────────────────────────────────────────── */
@media (max-width: 960px) {
  body.raidnew .rgrb-status { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 16px; }
  body.raidnew .rgrb-status.is-anon, body.raidnew .rgrb-status.is-max { grid-template-columns: minmax(0, 1fr); }
  body.raidnew .rgrb-status.is-anon .rgbtn { justify-self: start; }
  body.raidnew .rgrb-st-go { justify-self: start; }
  body.raidnew .rgrb-st-link { min-height: 40px; }
  body.raidnew .rgrb-card { grid-template-columns: minmax(0, 1fr); padding: 18px 16px 18px 19px; }
  body.raidnew .rgrb-step a { flex-direction: column; justify-content: center; gap: 6px; min-height: 0; padding: 12px 4px 10px; text-align: center; }
  body.raidnew .rgrb-step-t { align-items: center; }
  body.raidnew .rgrb-step-w { display: none; }
  body.raidnew .rgrb-step-em { width: 40px; height: 40px; flex-basis: auto; }
  body.raidnew .rgrb-step-s { top: 5px; right: 5px; }
  body.raidnew .rgrb-step-s.is-next { width: 10px; min-width: 10px; height: 10px; padding: 0; font-size: 0; }
}
@media (max-width: 640px) {
  body.raidnew .rgrb-path ol { gap: 6px; }
  body.raidnew .rgrb-emblem { width: 54px; height: 54px; flex-basis: 54px; }
  body.raidnew .rgrb-ch h3 { font-size: 1.1rem; }
  /* Étiquette « Prochain / Atteint » dans le coin : le titre garde toute sa ligne. */
  body.raidnew .rgrb-tag { position: absolute; top: 14px; right: 14px; }
  body.raidnew .rgrb-card:has(.rgrb-tag) .rgrb-ch-t { padding-right: 86px; }
  body.raidnew .rgrb-req { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  body.raidnew .rgrb-req > span { padding: 10px; }
  body.raidnew .rgrb-kl { grid-template-columns: minmax(0, 1fr); }
  /* Comparatif : 1re colonne collée + 3 paliers visibles, le reste en glissant. */
  body.raidnew .rgrb-tbl { min-width: 520px; }
  body.raidnew .rgrb-tbl th, body.raidnew .rgrb-tbl td { padding: 10px 8px; font-size: .8rem; }
  body.raidnew .rgrb-tbl tbody td:first-child, body.raidnew .rgrb-tbl thead th:first-child { width: 118px; min-width: 118px; max-width: 118px; white-space: normal; padding-left: 12px; }
  body.raidnew .rgrb-swipe { display: block; margin: 8px 2px 0; color: var(--mut); font-size: .78rem; }
  body.raidnew .rgrb-cta { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; padding: 22px 18px; }
  body.raidnew .rgrb-cta small { justify-content: center; text-align: left; }
  body.raidnew .rgrb-cmdw { justify-content: center; }
  body.raidnew .rgrb-cta-em { width: 72px; height: 72px; }
}
/* Planchers de lecture sur téléphone (charte §4.5) : micro-étiquettes en capitales et compteurs à 12 px. */
@media (max-width: 560px) {
  body.raidnew .rgrb-st-tx .rgrb-kick, body.raidnew .rgrb-ch-t .rgrb-kick { font-size: .75rem; letter-spacing: .1em; }
  body.raidnew .rgrb-step-t small { font-size: .75rem; }
  body.raidnew .rgrb-ch .rgrb-tag { font-size: .75rem; }
  body.raidnew .rgrb-card:has(.rgrb-tag) .rgrb-ch-t { padding-right: 116px; }   /* étiquette 108 + décalage 14 - marge 16 + 10 d'écart */
  body.raidnew .rgrb-req small { font-size: .75rem; }
  body.raidnew .rgrb-tbl thead th:first-child { font-size: .75rem; letter-spacing: .06em; }
}
/* Intro du bandeau : sous 480 px, ds.css la coupe à 2 lignes (bandeau compact) ; la version courte y tient
   entière au lieu de finir en « en échange de bonus... » (recette finale du 2026-09-27). */
body.raidnew .rgrb-lead-s { display: none; }
@media (max-width: 480px) {
  body.raidnew .rgrb-lead-l { display: none; }
  body.raidnew .rgrb-lead-s { display: inline; }
}
@media (max-width: 400px) {
  body.raidnew .rgrb-step-t b { font-size: .86rem; }
  body.raidnew .rgrb-step-t small { font-size: .75rem; }
  body.raidnew .rgrb-step-em { width: 34px; height: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  body.raidnew .rgrb-step a { transition: none; }
}
