/* =====================================================================
   Mu Guard : barre du haut, menu « Plus » (méga-menu) et notifications.
   Chargée en dernier (après la variante de couleurs) : fonctionne avec
   Légende (sombre), Céleste (clair) et Épuré.
   ===================================================================== */

/* ---------- Couleurs (sombre par défaut) ---------- */
html body.hx {
  --nv-bg: #15110e; --nv-bg2: #1d1814; --nv-card: rgba(255, 255, 255, .035);
  --nv-ink: #f3ead8; --nv-ink2: #cfc5b1; --nv-muted: #9d937f;
  --nv-line: rgba(214, 167, 92, .2); --nv-line2: rgba(214, 167, 92, .42);
  --nv-acc: #d6a75c; --nv-acc-hi: #f1cd8c; --nv-tint: rgba(214, 167, 92, .12); --nv-tint2: rgba(214, 167, 92, .2);
  --nv-cta: linear-gradient(180deg, #f5d27e 0%, #d89c36 100%); --nv-cta-ink: #2a1a02; --nv-cta-line: #b9822a;
  --nv-ok: #5cc28a; --nv-bad: #e2553f;
  --nv-shadow: 0 34px 80px -24px rgba(0, 0, 0, .8), 0 0 0 1px rgba(214, 167, 92, .06);
  --nv-sans: "Alegreya Sans", "Sora", system-ui, -apple-system, "Segoe UI", sans-serif;
  --nv-title: var(--lg-title, "Cinzel", serif);
  --nv-strip: linear-gradient(180deg, #0b0a09, #100d0b);
}
html body.hx.style-carre {
  --nv-bg: #10141b; --nv-bg2: #161b24; --nv-acc: var(--k-accent, #d08a54); --nv-acc-hi: var(--k-accent-hi, #f0b07e);
  --nv-line: rgba(255, 255, 255, .09); --nv-line2: rgba(208, 138, 84, .45); --nv-tint: rgba(208, 138, 84, .12); --nv-tint2: rgba(208, 138, 84, .2);
  --nv-sans: "Sora", system-ui, sans-serif; --nv-strip: #0a0d12;
}
html body.hx.skin-celeste {
  --nv-bg: #fffdf8; --nv-bg2: #f7efdf; --nv-card: #fffaf0;
  --nv-ink: #262a36; --nv-ink2: #4f5564; --nv-muted: #776f60;
  --nv-line: rgba(185, 131, 32, .2); --nv-line2: rgba(185, 131, 32, .45);
  --nv-acc: #b98320; --nv-acc-hi: #7c540c; --nv-tint: rgba(226, 178, 74, .13); --nv-tint2: rgba(226, 178, 74, .24);
  --nv-cta: linear-gradient(180deg, #f8d374 0%, #e0a238 100%); --nv-cta-ink: #3a2604; --nv-cta-line: #c88a22;
  --nv-shadow: 0 34px 70px -30px rgba(50, 55, 75, .55), 0 2px 6px rgba(60, 45, 20, .06);
  --nv-strip: linear-gradient(180deg, #f4ebd8, #f0e5ce);
}

/* =====================================================================
   1. Barre du haut
   ===================================================================== */
html body.hx .hx-strip.nv-strip { background: var(--nv-strip) !important; border-bottom: 1px solid var(--nv-line) !important; font: 500 13px/1 var(--nv-sans) !important; }
html body.hx .nv-strip .hx-strip-in { display: flex !important; align-items: center !important; gap: 14px !important; min-height: 38px !important; flex-wrap: nowrap !important; }
html body.hx .nv-strip-l { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1 1 auto; }

/* état du serveur et visiteurs : petites pastilles */
html body.hx .nv-strip .hx-status { display: inline-flex !important; align-items: center; gap: 7px; height: 26px; padding: 0 11px 0 9px; border-radius: 999px; border: 1px solid var(--nv-line); background: var(--nv-card); color: var(--nv-ink2) !important; white-space: nowrap; font-size: 12.5px; }
html body.hx .nv-strip .hx-status b { color: var(--nv-ink) !important; font-weight: 700; }
html body.hx .nv-strip .hx-status > i { width: 7px; height: 7px; border-radius: 50%; background: var(--nv-ok); box-shadow: 0 0 0 3px rgba(92, 194, 138, .18) !important; animation: nv-pulse 2.4s ease-in-out infinite; }
html body.hx .nv-strip .hx-status.is-off > i { background: var(--nv-bad); box-shadow: 0 0 0 3px rgba(226, 85, 63, .18) !important; animation: none; }
html body.hx .nv-strip .hx-status.is-soon > i { background: var(--nv-acc) !important; box-shadow: 0 0 0 3px var(--nv-tint2) !important; }
html body.hx .nv-strip .hx-visitors .ic { color: var(--nv-acc); }
@keyframes nv-pulse { 50% { box-shadow: 0 0 0 6px rgba(92, 194, 138, 0) !important; } }

/* taux du serveur : « Season 19 · EXP x100 · Drop 30 % » en étiquettes */
html body.hx .nv-strip .hx-strip-rates { display: inline-flex !important; align-items: center; gap: 0; margin-left: 4px; font: 700 10.5px/1 var(--nv-sans) !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--nv-acc-hi) !important; opacity: 1 !important; white-space: nowrap; }
html body.hx .nv-strip .hx-strip-rates em { font-style: normal; color: inherit !important; }
html body.hx .nv-strip .hx-strip-rates em + em::before { content: ""; display: inline-block; width: 4px; height: 4px; margin: 0 9px 2px; border-radius: 50%; background: var(--nv-acc); opacity: .55; vertical-align: middle; }

/* liens : pastilles discrètes au survol */
html body.hx .nv-strip .hx-strip-links { display: flex !important; align-items: center; gap: 2px !important; flex: 0 1 auto; min-width: 0; }
html body.hx .nv-strip .hx-strip-links > a { display: inline-flex !important; align-items: center; gap: 6px; height: 28px; padding: 0 9px; border-radius: 8px; color: var(--nv-ink2) !important; font-size: 13px; text-decoration: none; white-space: nowrap; transition: background .15s, color .15s; }
html body.hx .nv-strip .hx-strip-links > a .ic { width: 15px; height: 15px; color: var(--nv-acc); opacity: .9; }
html body.hx .nv-strip .hx-strip-links > a:hover { background: var(--nv-tint); color: var(--nv-ink) !important; }
html body.hx .nv-strip .hx-strip-links > a.has { color: var(--nv-acc-hi) !important; font-weight: 700; }
html body.hx .nv-strip .hx-strip-links > a b { display: inline-grid; place-items: center; min-width: 17px; height: 17px; padding: 0 5px; border-radius: 9px; background: var(--nv-bad); color: #fff !important; font-size: 10.5px; }
html body.hx .nv-strip .lang-sw { margin-right: 6px; }

@media (max-width: 1480px) { html body.hx .nv-strip .hx-strip-rates { display: none !important; } }
@media (max-width: 1240px) { html body.hx .nv-strip .hx-visitors { display: none !important; } }
@media (max-width: 1100px) {
  html body.hx .nv-strip .hx-strip-links > a { font-size: 0; gap: 0; padding: 0 7px; }
  html body.hx .nv-strip .hx-strip-links > a .ic { width: 16px; height: 16px; }
  html body.hx .nv-strip .hx-strip-links > a b { font-size: 10.5px; margin-left: 4px; }
}
@media (max-width: 700px) {
  html body.hx .nv-strip .hx-strip-in { gap: 8px !important; min-height: 40px !important; }
  html body.hx .nv-strip .hx-strip-links > a { display: none !important; }
  html body.hx .nv-strip .hx-status { height: 24px; padding: 0 9px 0 8px; font-size: 12px; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  html body.hx .nv-strip-l { overflow: hidden; }
  html body.hx .nv-strip .lang-sw { margin-right: 0; }
}

/* =====================================================================
   2. Menu « Plus » (méga-menu)
   ===================================================================== */
html body.hx .hx-more > button { gap: 6px !important; border-radius: 8px; transition: color .15s, background .15s; }
html body.hx .hx-more > button .ic { transform: rotate(90deg); transition: transform .2s ease; }
html body.hx .hx-more.is-open > button .ic { transform: rotate(-90deg); }
html body.hx .hx-more.is-open > button { color: var(--nv-acc-hi) !important; }

html body.hx .hx-more-menu.nv-mega {
  display: grid !important; grid-template-columns: 1fr 250px; gap: 0; padding: 0 !important; overflow: hidden;
  background: var(--nv-bg) !important; border: 1px solid var(--nv-line2) !important; border-radius: 16px !important; box-shadow: var(--nv-shadow) !important;
  font-family: var(--nv-sans); text-align: left; text-transform: none; letter-spacing: 0;
}
html body.hx .hx-more-menu.nv-mega::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--nv-acc), transparent); opacity: .8; }
html body.hx .nv-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 18px 14px 16px; }
html body.hx .nv-col { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
html body.hx .nv-col + .nv-col { border-left: 1px solid var(--nv-line); padding-left: 8px; }
html body.hx .nv-h { display: block; margin: 0 0 6px; padding: 0 10px; font: 700 10.5px/1.2 var(--nv-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--nv-acc) !important; }

html body.hx .hx-more-menu.nv-mega a {
  display: flex !important; align-items: center; gap: 11px; padding: 9px 10px !important; border-radius: 10px !important; border: 0 !important;
  text-decoration: none !important; text-transform: none !important; letter-spacing: 0 !important; white-space: normal !important;
  background: transparent; transition: background .15s, transform .15s;
}
html body.hx .hx-more-menu.nv-mega a::after { display: none !important; }
html body.hx .nv-ic { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--nv-tint); border: 1px solid var(--nv-line); color: var(--nv-acc-hi); transition: background .15s, border-color .15s, color .15s, transform .2s; }
html body.hx .nv-ic .ic { width: 18px; height: 18px; color: inherit !important; }
html body.hx .nv-tx { display: block; min-width: 0; }
html body.hx .hx-more-menu.nv-mega .nv-tx b { display: block; font: 700 14.5px/1.2 var(--nv-sans) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--nv-ink) !important; }
html body.hx .hx-more-menu.nv-mega .nv-tx small { display: block; margin-top: 3px; font: 400 12.5px/1.3 var(--nv-sans) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--nv-muted) !important; }
html body.hx .hx-more-menu.nv-mega a:hover { background: var(--nv-tint) !important; }
html body.hx .hx-more-menu.nv-mega a:hover .nv-ic { background: var(--nv-cta); border-color: var(--nv-cta-line); color: var(--nv-cta-ink); transform: scale(1.05); }
html body.hx .hx-more-menu.nv-mega a[aria-current="page"] { background: var(--nv-tint2) !important; }
html body.hx .hx-more-menu.nv-mega a[aria-current="page"] .nv-tx b { color: var(--nv-acc-hi) !important; }
html body.hx .hx-more-menu.nv-mega a:focus-visible { outline: 2px solid var(--nv-acc); outline-offset: -2px; }

/* carte d'action à droite */
html body.hx .nv-side {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; padding: 22px 20px 18px; isolation: isolate;
  border-left: 1px solid var(--nv-line); color: #fff;
  background: linear-gradient(180deg, rgba(12, 10, 8, .15) 0%, rgba(12, 10, 8, .55) 45%, rgba(12, 10, 8, .92) 100%), var(--sk-cover, url("../img/home/hero.jpg")) center / cover no-repeat, #1b140e;
}
html body.hx .hx-more-menu.nv-mega .nv-side-k { font: 700 10.5px/1.2 var(--nv-sans); letter-spacing: .16em; text-transform: uppercase; color: #f6dc9a !important; }
html body.hx .hx-more-menu.nv-mega .nv-side-t { display: block; font: 700 21px/1.15 var(--nv-title) !important; letter-spacing: .02em !important; color: #fff !important; -webkit-text-fill-color: #fff !important; text-shadow: 0 2px 10px rgba(0, 0, 0, .6); }
html body.hx .hx-more-menu.nv-mega .nv-side p { margin: 0 0 6px; font: 400 13.5px/1.4 var(--nv-sans); color: rgba(255, 255, 255, .86) !important; text-shadow: 0 1px 6px rgba(0, 0, 0, .6); }
html body.hx .hx-more-menu.nv-mega a.nv-cta { justify-content: center; gap: 8px; padding: 11px 14px !important; border-radius: 10px !important; background: var(--nv-cta) !important; border: 1px solid var(--nv-cta-line) !important; color: var(--nv-cta-ink) !important; font: 800 14px/1 var(--nv-sans) !important; white-space: nowrap !important; box-shadow: 0 10px 22px -10px rgba(0, 0, 0, .7); }
html body.hx .hx-more-menu.nv-mega a.nv-cta .ic { color: var(--nv-cta-ink) !important; }
html body.hx .hx-more-menu.nv-mega a.nv-cta:hover { transform: translateY(-1px); background: var(--nv-cta) !important; filter: brightness(1.05); }
html body.hx .hx-more-menu.nv-mega a.nv-sub { justify-content: center; padding: 6px !important; font: 600 13px/1.2 var(--nv-sans) !important; color: rgba(255, 255, 255, .9) !important; text-decoration: underline !important; text-underline-offset: 3px; text-decoration-color: rgba(255, 255, 255, .4) !important; }
html body.hx .hx-more-menu.nv-mega a.nv-sub:hover { background: transparent !important; color: #fff !important; }

/* ordinateur : le menu se place sous l'en-tête, centré, avec une petite animation */
@media (min-width: 1231px) {
  html body.hx .hx-top-in { position: relative; }
  html body.hx .hx-nav, html body.hx .hx-nav > ul, html body.hx .hx-nav .hx-more { position: static !important; }
  html body.hx .hx-more-menu.nv-mega {
    position: absolute !important; top: calc(100% + 8px) !important; left: 50% !important; right: auto !important; z-index: 90;
    width: min(940px, calc(100vw - 32px)) !important; transform: translateX(-50%) translateY(8px) !important;
    opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .18s ease, transform .18s ease, visibility .18s;
  }
  html body.hx .hx-more.is-open .hx-more-menu.nv-mega { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0) !important; }
  /* passerelle invisible entre le bouton et le menu (la souris ne « tombe » pas dans le vide) */
  html body.hx .hx-more.is-open::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 12px; }
}
@media (min-width: 1231px) and (max-width: 1320px) { html body.hx .hx-more-menu.nv-mega { grid-template-columns: 1fr 220px; } }

/* mobile : dans le menu déroulant, en accordéon */
@media (max-width: 1230px) {
  html body.hx .hx-nav .hx-more { display: block !important; width: 100%; }
  html body.hx .hx-nav .hx-more > button { width: 100% !important; }
  html body.hx .hx-nav .hx-more-menu.nv-mega { grid-template-columns: 1fr !important; width: 100% !important; display: none !important; margin: 6px 0 10px !important; padding: 0 !important; border-radius: 14px !important; background: var(--nv-bg2) !important; box-shadow: none !important; }
  html body.hx .hx-nav .hx-more.is-open .hx-more-menu.nv-mega { display: grid !important; }
  html body.hx .nv-cols { grid-template-columns: 1fr 1fr; gap: 10px 8px; padding: 14px 10px 10px; }
  html body.hx .nv-col + .nv-col { border-left: 0; padding-left: 0; }
  html body.hx .nv-col:last-child:nth-child(3) { grid-column: 1 / -1; }
  html body.hx .nv-side { border-left: 0; border-top: 1px solid var(--nv-line); min-height: 170px; }
  html body.hx.skin-celeste .hx-nav .hx-more-menu.nv-mega a { border-bottom: 0 !important; padding: 8px !important; }
}
@media (max-width: 560px) {
  html body.hx .nv-cols { grid-template-columns: 1fr; }
  html body.hx .nv-tx small { display: none !important; }
  html body.hx .nv-ic { width: 32px; height: 32px; }
}

/* =====================================================================
   3. Notifications (cloche)
   Le menu est rangé dans la navigation : on annule les styles des liens du menu
   (majuscules, police des titres, liste en ligne) qui cassaient l'affichage.
   ===================================================================== */
html body.hx .nb-btn { transition: background .15s, border-color .15s, transform .15s; }
html body.hx .nb-btn:hover { transform: translateY(-1px); }
html body.hx .nb-count { box-shadow: 0 0 0 2px var(--nv-bg) !important; animation: nv-pop .4s ease; }
@keyframes nv-pop { 0% { transform: scale(.4); } 70% { transform: scale(1.15); } }
html body.hx.skin-celeste .nb-btn { background: #fffaf0 !important; border-color: var(--nv-line2) !important; }
html body.hx.skin-celeste .nb-btn:hover, html body.hx.skin-celeste .nb.is-open .nb-btn { background: var(--nv-tint2) !important; }

html body.hx .nb-menu {
  width: min(380px, calc(100vw - 24px)) !important; padding: 0 !important; overflow: hidden;
  background: var(--nv-bg) !important; border: 1px solid var(--nv-line2) !important; border-radius: 16px !important; box-shadow: var(--nv-shadow) !important;
  font-family: var(--nv-sans) !important; text-align: left; z-index: 95 !important;
}
html body.hx .nb.is-open .nb-menu { animation: nv-drop .16s ease; }
@keyframes nv-drop { from { opacity: 0; transform: translateY(6px); } }
html body.hx .nb-menu header { display: flex !important; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px 12px !important; border-bottom: 1px solid var(--nv-line) !important; background: var(--nv-bg2) !important; }
html body.hx .nb-menu header b { font: 700 16px/1.2 var(--nv-title) !important; letter-spacing: .03em !important; text-transform: none !important; color: var(--nv-ink) !important; }
html body.hx .nb-menu header a { display: inline-flex !important; padding: 5px 10px !important; border-radius: 999px; border: 1px solid var(--nv-line2) !important; font: 600 12px/1 var(--nv-sans) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--nv-acc-hi) !important; background: transparent !important; white-space: nowrap; }
html body.hx .nb-menu header a::after { display: none !important; }
html body.hx .nb-menu header a:hover { background: var(--nv-tint) !important; }

html body.hx .nb-menu ul { display: block !important; flex-wrap: nowrap !important; margin: 0 !important; padding: 8px !important; gap: 0 !important; max-height: min(430px, 65vh) !important; overflow-x: hidden !important; overflow-y: auto !important; list-style: none !important; height: auto !important; }
html body.hx .nb-menu li { display: block !important; width: auto !important; flex: none !important; margin: 0 0 4px !important; padding: 0 !important; border: 0 !important; background: none !important; }
html body.hx .nb-menu li:last-child { margin-bottom: 0 !important; }
html body.hx .nb-menu li a {
  display: flex !important; align-items: flex-start !important; gap: 12px !important; width: auto !important; height: auto !important; min-height: 0 !important;
  padding: 11px 12px !important; border-radius: 12px !important; border: 1px solid transparent !important; background: transparent !important; box-shadow: none !important;
  font: 500 14px/1.38 var(--nv-sans) !important; letter-spacing: 0 !important; text-transform: none !important; white-space: normal !important; text-align: left !important;
  color: var(--nv-ink) !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; text-decoration: none !important;
}
html body.hx .nb-menu li a::after, html body.hx .nb-menu li a::before { display: none !important; }
html body.hx .nb-menu li a > span:last-child { flex: 1; min-width: 0; overflow-wrap: anywhere; }
html body.hx .nb-menu li a:hover { background: var(--nv-tint) !important; border-color: var(--nv-line) !important; }
html body.hx .nb-menu li.is-live a { background: var(--nv-card) !important; border-color: var(--nv-line) !important; }
html body.hx .nb-menu li.is-live a:hover { background: var(--nv-tint) !important; }
html body.hx .nb-menu li.is-new a { background: var(--nv-tint) !important; }
html body.hx .nb-menu li.is-new a > span:last-child::before { content: ""; float: right; width: 8px; height: 8px; margin: 6px 0 0 8px; border-radius: 50%; background: var(--nv-bad); }
html body.hx .nb-menu li small { display: block !important; margin-top: 4px !important; font: 500 12px/1.2 var(--nv-sans) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--nv-muted) !important; }
html body.hx .nb-menu li.is-live small { display: flex !important; width: max-content; align-items: center; gap: 5px; margin-top: 6px !important; padding: 3px 8px; border-radius: 999px; background: var(--nv-tint2); font: 700 10.5px/1 var(--nv-sans) !important; letter-spacing: .08em !important; text-transform: uppercase !important; color: var(--nv-acc-hi) !important; }
html body.hx .nb-menu .nb-ic { width: 36px !important; height: 36px !important; border-radius: 11px !important; }
html body.hx .nb-menu .nb-empty { padding: 26px 12px !important; text-align: center; color: var(--nv-muted) !important; font: 500 14px/1.4 var(--nv-sans) !important; }
html body.hx.skin-celeste .nb-ic { background: rgba(226, 178, 74, .16); color: #7c540c; }
html body.hx.skin-celeste .nb-ic.k-security { background: rgba(184, 50, 30, .1); color: #a3311d; }
html body.hx.skin-celeste .nb-ic.k-gift { background: rgba(29, 127, 75, .11); color: #1d7f4b; }
html body.hx.skin-celeste .nb-ic.k-event { background: rgba(27, 127, 143, .12); color: #135f6b; }
html body.hx.skin-celeste .nb-ic.k-ref { background: rgba(120, 70, 190, .1); color: #6a3fb0; }

/* téléphone : le menu prend toute la largeur de l'écran, sous l'en-tête */
@media (max-width: 1230px) {
  html body.hx .nb-mob .nb { position: static !important; }
  html body.hx .nb-mob .nb-menu { position: absolute !important; left: 12px !important; right: 12px !important; top: calc(100% + 8px) !important; width: auto !important; max-width: 460px; margin-left: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html body.hx .nv-strip .hx-status > i, html body.hx .nb-count, html body.hx .nb.is-open .nb-menu { animation: none !important; }
  html body.hx .hx-more-menu.nv-mega { transition: none !important; }
}

/* =====================================================================
   4. Le bouton d'inscription (un seul, bien visible)
   Bordure de lumière qui tourne, reflet qui passe, icône qui respire.
   ===================================================================== */
@property --nv-ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
html body.hx {
  --br-a: #ff6a4d; --br-b: #c8151f; --br-c: #7d0a12; --br-ink: #fff; --br-ic-bg: linear-gradient(180deg, #ffe7a8, #f1b443); --br-ic-ink: #6a1206;
  --br-glow: rgba(226, 50, 40, .55); --br-ring: #ffd77a;
}
html body.hx.skin-celeste {
  --br-a: #ffe39b; --br-b: #f0b23e; --br-c: #c97d16; --br-ink: #2f1d02; --br-ic-bg: linear-gradient(180deg, #1f8c9c, #135f6b); --br-ic-ink: #fff;
  --br-glow: rgba(214, 145, 30, .6); --br-ring: #1b7f8f;
}
html body.hx.style-carre {
  --br-a: #f4b07b; --br-b: #d0804a; --br-c: #8e4c22; --br-ink: #1d0f05; --br-ic-bg: #10141b; --br-ic-ink: #f4b07b;
  --br-glow: rgba(208, 128, 74, .55); --br-ring: #ffd2ad;
}

html body.hx a.nv-bigreg {
  position: relative; isolation: isolate; flex: none; display: inline-flex !important; align-items: center; gap: 10px;
  height: 48px; padding: 0 14px 0 5px !important; border-radius: 999px !important; border: 0 !important;
  color: var(--br-ink) !important; text-decoration: none !important; text-transform: none !important; letter-spacing: 0 !important; white-space: nowrap;
  background:
    linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .55) 50%, transparent 62%) 160% 0 / 260% 100% no-repeat,
    linear-gradient(135deg, var(--br-a) 0%, var(--br-b) 52%, var(--br-c) 100%) !important;
  box-shadow: 0 14px 30px -12px var(--br-glow), 0 0 0 1px rgba(255, 255, 255, .18) inset, 0 1px 0 rgba(255, 255, 255, .45) inset !important;
  animation: nv-br-shine 4.5s ease-in-out infinite;
  transition: transform .2s cubic-bezier(.2, .8, .2, 1), box-shadow .2s;
}
/* anneau lumineux qui tourne autour du bouton */
html body.hx a.nv-bigreg::before {
  content: ""; position: absolute; inset: -3px; z-index: -1; border-radius: inherit; padding: 2px;
  background: conic-gradient(from var(--nv-ang), transparent 0 55%, var(--br-ring) 72%, #fff 80%, var(--br-ring) 88%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  animation: nv-br-spin 3.2s linear infinite;
}
/* halo doux derrière */
html body.hx a.nv-bigreg::after { content: ""; position: absolute; inset: 6px 10px -8px; z-index: -2; border-radius: inherit; background: var(--br-glow); filter: blur(14px); opacity: .55; transition: opacity .2s; }
html body.hx a.nv-bigreg:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 20px 36px -12px var(--br-glow), 0 0 0 1px rgba(255, 255, 255, .25) inset, 0 1px 0 rgba(255, 255, 255, .5) inset !important; }
html body.hx a.nv-bigreg:hover::after { opacity: .9; }
html body.hx a.nv-bigreg:active { transform: translateY(0) scale(.98); }
html body.hx a.nv-bigreg:focus-visible { outline: 3px solid var(--br-ring); outline-offset: 4px; }

html body.hx .nv-br-ic { position: relative; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--br-ic-bg); color: var(--br-ic-ink); box-shadow: 0 4px 10px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255, 255, 255, .45); }
html body.hx .nv-br-ic .ic { color: inherit !important; transition: transform .35s cubic-bezier(.2, .8, .2, 1); }
html body.hx .nv-br-ic::after { content: ""; position: absolute; inset: -2px; border-radius: 50%; border: 2px solid var(--br-ring); opacity: 0; animation: nv-br-ping 2.6s ease-out infinite; }
html body.hx a.nv-bigreg:hover .nv-br-ic .ic { transform: rotate(-12deg) scale(1.15); }

html body.hx .nv-br-tx { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; line-height: 1; }
html body.hx .nv-br-tx b { font: 800 15px/1 var(--nv-sans) !important; letter-spacing: .01em !important; color: var(--br-ink) !important; text-shadow: 0 1px 0 rgba(0, 0, 0, .12); }
html body.hx .nv-br-tx small { font: 600 11.5px/1 var(--nv-sans) !important; letter-spacing: .02em !important; color: var(--br-ink) !important; opacity: .82; text-transform: none !important; }
html body.hx .nv-br-go { display: grid; place-items: center; width: 22px; height: 22px; margin-left: 2px; border-radius: 50%; background: rgba(255, 255, 255, .22); transition: transform .25s, background .25s; }
html body.hx .nv-br-go .ic { color: var(--br-ink) !important; }
html body.hx a.nv-bigreg:hover .nv-br-go { transform: translateX(4px); background: rgba(255, 255, 255, .38); }

@keyframes nv-br-spin { to { --nv-ang: 360deg; } }
@keyframes nv-br-shine { 0%, 55% { background-position: 160% 0, 0 0; } 100% { background-position: -70% 0, 0 0; } }
@keyframes nv-br-ping { 0% { transform: scale(1); opacity: .8; } 70%, 100% { transform: scale(1.55); opacity: 0; } }

/* lien Connexion à côté (discret, pour ne pas faire doublon) */
html body.hx a.nv-login { display: inline-flex !important; align-items: center; gap: 6px; padding: 8px 10px !important; border-radius: 10px; color: var(--nv-ink2) !important; font: 700 14px/1 var(--nv-sans) !important; text-transform: none !important; letter-spacing: 0 !important; text-decoration: none !important; }
html body.hx a.nv-login .ic { color: var(--nv-acc); }
html body.hx a.nv-login:hover { background: var(--nv-tint); color: var(--nv-ink) !important; }
html body.hx a.nv-login::after { display: none !important; }

/* un seul bouton visible : dans l'en-tête sur ordinateur, à côté du menu sur téléphone */
html body.hx a.nv-bigreg.is-mob { display: none !important; }
@media (max-width: 1230px) {
  html body.hx .hx-user a.nv-bigreg { display: none !important; }
  html body.hx a.nv-bigreg.is-mob { display: inline-flex !important; order: 2; margin-left: auto; margin-right: 10px; height: 42px; padding-right: 12px !important; gap: 8px; }
  html body.hx a.nv-bigreg.is-mob .nv-br-ic { width: 32px; height: 32px; }
  html body.hx a.nv-bigreg.is-mob .nv-br-tx b { font-size: 14px !important; }
  html body.hx .hx-top-in .hx-burger { margin-left: 0 !important; }
}
@media (max-width: 440px) {
  html body.hx a.nv-bigreg.is-mob .nv-br-go { display: none; }
  html body.hx a.nv-bigreg.is-mob .nv-br-tx small { font-size: 10.5px !important; }
}
@media (max-width: 360px) { html body.hx a.nv-bigreg.is-mob .nv-br-tx small { display: none; } }
@media (min-width: 1231px) and (max-width: 1360px) {
  html body.hx .hx-user a.nv-bigreg .nv-br-go { display: none; }
  html body.hx .hx-user a.nv-login { font-size: 0 !important; gap: 0; padding: 10px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body.hx a.nv-bigreg, html body.hx a.nv-bigreg::before, html body.hx .nv-br-ic::after { animation: none !important; }
}