/* Butamax · navigation unifiée (voir nav.js). Autonome : valeurs de repli si ds.css n'est pas chargé. */
.bmn{
  --n-bg:var(--bg,#09090B); --n-surface:var(--surface,#131316); --n-surface-2:var(--surface-2,#1B1B1F);
  --n-line:var(--line,#28282E); --n-fg:var(--fg,#F4F4F5); --n-muted:var(--muted,#8C8C96);
  --n-accent:#A6FF3A; --n-grad:linear-gradient(100deg,#A6FF3A,#2FD94F); --n-on:#061200; --n-danger:#FF5468;
  position:sticky;top:0;z-index:40;
  padding-top:env(safe-area-inset-top,0px);
  background:rgba(9,9,11,.94);
  -webkit-backdrop-filter:saturate(140%) blur(12px);backdrop-filter:saturate(140%) blur(12px);
  border-bottom:1px solid var(--n-line);
  color:var(--n-fg);font-family:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:15px;line-height:1.4;
}
.bmn *,.bmn-tabs *{box-sizing:border-box}
.bmn a{color:inherit;text-decoration:none}
.bmn ul,.bmn-tabs ul{list-style:none;margin:0;padding:0}
.bmn-in{max-width:1240px;margin:0 auto;height:60px;display:flex;align-items:center;gap:20px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.bmn-skip{position:absolute;left:-999px;top:8px;z-index:60;background:var(--n-fg);color:var(--n-bg)!important;padding:8px 12px;border-radius:8px;font-weight:700}
.bmn-skip:focus{left:8px}
.bmn-brand{flex:none;display:flex;align-items:center;border-radius:6px}
.bmn-brand img{display:block;height:28px;width:auto}

.bmn-ico{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.bmn-links{flex:1;min-width:0;height:100%}
.bmn-links ul{display:flex;height:100%;gap:2px}
.bmn-links a{position:relative;height:100%;display:flex;align-items:center;gap:8px;padding:0 12px;color:var(--n-muted);font-weight:600;font-size:.92rem;white-space:nowrap;transition:color .15s}
.bmn-links a .bmn-ico{width:18px;height:18px}
.bmn-links a:hover{color:var(--n-fg)}
.bmn-links a[aria-current="page"]{color:var(--n-fg)}
.bmn-links a[aria-current="page"]::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;border-radius:2px;background:var(--n-grad)}
.bmn-links a[aria-current="page"] .bmn-ico{color:var(--n-accent)}

.bmn-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.bmn-prem{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;background:var(--n-grad);color:var(--n-on);font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.bmn-upgrade{font-size:.84rem;font-weight:700;color:var(--n-accent)!important;padding:6px 4px;border-radius:6px}
.bmn-upgrade:hover{text-decoration:underline;text-underline-offset:3px}
.bmn-iconbtn{position:relative;width:40px;height:40px;display:grid;place-items:center;border-radius:999px;color:var(--n-muted);transition:color .15s,background .15s}
.bmn-iconbtn:hover,.bmn-iconbtn[aria-current="page"]{color:var(--n-fg);background:var(--n-surface-2)}
.bmn-count{position:absolute;top:4px;right:2px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--n-danger);color:#fff;font-size:.68rem;font-weight:800;line-height:18px;text-align:center;font-variant-numeric:tabular-nums;box-shadow:0 0 0 2px var(--n-bg)}

.bmn-acct{position:relative}
.bmn-me{display:flex;align-items:center;gap:8px;height:40px;padding:0 10px 0 4px;border:1px solid var(--n-line);border-radius:999px;background:var(--n-surface);color:var(--n-fg);font:inherit;font-weight:600;font-size:.88rem;cursor:pointer;transition:border-color .15s}
.bmn-me:hover,.bmn-me[aria-expanded="true"]{border-color:var(--n-muted)}
.bmn-av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--n-surface-2);border:1px solid var(--n-line);font-size:.72rem;font-weight:800;letter-spacing:.02em}
.bmn-me-name{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bmn-chev{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;color:var(--n-muted);transition:transform .2s}
.bmn-me[aria-expanded="true"] .bmn-chev{transform:rotate(180deg)}
.bmn-menu{position:absolute;right:0;top:calc(100% + 8px);width:260px;padding:6px;background:var(--n-surface);border:1px solid var(--n-line);border-radius:14px;box-shadow:0 18px 50px -12px rgba(0,0,0,.8);animation:bmn-in .16s cubic-bezier(.2,.8,.2,1)}
.bmn-menu[hidden]{display:none}
.bmn-menu-head{margin:0;padding:10px 12px 12px;display:flex;flex-direction:column;gap:2px;border-bottom:1px solid var(--n-line);margin-bottom:6px}
.bmn-menu-head b{font-size:.95rem}
.bmn-menu-head span{font-size:.8rem;color:var(--n-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bmn-menu a,.bmn-menu button{width:100%;display:flex;align-items:center;gap:10px;padding:9px 12px;border:0;border-radius:9px;background:none;color:var(--n-fg);font:inherit;font-size:.9rem;font-weight:500;text-align:left;cursor:pointer}
.bmn-menu .bmn-ico{width:18px;height:18px;color:var(--n-muted)}
.bmn-menu a:hover,.bmn-menu button:hover{background:var(--n-surface-2)}
.bmn-menu a[aria-current="page"]{background:var(--n-surface-2)}
.bmn-sep{border-top:1px solid var(--n-line);margin-top:6px;padding-top:6px}
.bmn-menu [data-logout]{color:var(--n-danger)}
.bmn-menu [data-logout] .bmn-ico{color:var(--n-danger)}
.bmn-pill{margin-left:auto;min-width:20px;padding:0 6px;border-radius:999px;background:var(--n-danger);color:#fff;font-size:.72rem;font-weight:800;text-align:center}
.bmn-link{font-weight:600;font-size:.9rem;padding:8px 6px;border-radius:6px}
.bmn-link:hover{color:var(--n-accent)}
.bmn-cta{display:inline-flex;align-items:center;height:38px;padding:0 16px;border-radius:999px;background:var(--n-grad);color:var(--n-on)!important;font-weight:800;font-size:.88rem;white-space:nowrap}
.bmn-cta:hover{filter:brightness(1.08)}
.bmn a:focus-visible,.bmn button:focus-visible,.bmn-tabs a:focus-visible{outline:none;box-shadow:0 0 0 2px #09090B,0 0 0 4px #A6FF3A;border-radius:8px}

/* barre d'onglets mobile */
.bmn-tabs{display:none}
@media (max-width:900px){
  .bmn-links,.bmn-me-name,.bmn-me .bmn-chev,.bmn-upgrade{display:none}
  .bmn-in{height:56px;gap:12px}
  .bmn-me{padding:0 4px;border-color:transparent;background:none}
  .bmn-tabs{display:block;position:fixed;left:0;right:0;bottom:0;z-index:40;
    padding:0 max(6px,env(safe-area-inset-right,0px)) env(safe-area-inset-bottom,0px) max(6px,env(safe-area-inset-left,0px));
    background:rgba(9,9,11,.96);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid #28282E;
    font-family:"Archivo",system-ui,-apple-system,sans-serif}
  .bmn-tabs[hidden]{display:none}
  .bmn-tabs ul{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;max-width:560px;margin:0 auto}
  .bmn-tabs a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:60px;color:#8C8C96;text-decoration:none;font-size:.68rem;font-weight:600;letter-spacing:.01em}
  .bmn-tabs a[aria-current="page"]{color:#F4F4F5}
  .bmn-tabs a[aria-current="page"] .bmn-ico{color:#A6FF3A}
  .bmn-tabs a[aria-current="page"]::before{content:"";position:absolute;top:-1px;left:30%;right:30%;height:2px;border-radius:2px;background:linear-gradient(100deg,#A6FF3A,#2FD94F)}
  html.bmn-tabs-on body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
  .bmn-menu{position:fixed;left:12px;right:12px;top:calc(60px + env(safe-area-inset-top,0px));width:auto}
}
@media (max-width:380px){ .bmn-prem{display:none} }
@keyframes bmn-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.bmn-menu{animation:none}.bmn-chev{transition:none}}

/* ---------- paliers, rôles et grades (partagés : nav, appli, communauté, compte) ---------- */
:root{--tier-prem:linear-gradient(100deg,#A6FF3A,#2FD94F);--tier-vip:linear-gradient(100deg,#FFE7A3,#E0B04A 55%,#B9832A);--tier-vip-ink:#1E1503;--tier-vip-fg:#F2C866}
.bmn-prem{gap:5px}
.bmn-prem .bmn-ico{width:14px;height:14px;stroke-width:2.2}
.bmn-prem-vip{background:var(--tier-vip);color:var(--tier-vip-ink)}
.bmn-upgrade-vip{color:var(--tier-vip-fg)!important}
html[data-tier="vip"] .bmn{border-bottom-color:rgba(224,176,74,.45)}
html[data-tier="vip"] .bmn-links a[aria-current="page"]::after{background:var(--tier-vip)}
html[data-tier="vip"] .bmn-av{border-color:#E0B04A;color:var(--tier-vip-fg)}
.bmn-menu-grades{margin:0 0 6px;padding:0 12px 10px;display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid var(--n-line)}
.bm-grade{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;font-size:.7rem;font-weight:800;letter-spacing:.04em;white-space:nowrap;border:1px solid #33333B;background:#1B1B1F;color:#D4D4D8;font-family:"Archivo",system-ui,sans-serif;line-height:1}
.bm-grade-premium{background:var(--tier-prem);color:#061200;border-color:transparent}
.bm-grade-vip{background:var(--tier-vip);color:var(--tier-vip-ink);border-color:transparent}
.bm-grade-role{background:#26113A;color:#E2C7FF;border-color:#4B2A70}
.bm-grade-role.bm-role-superadmin{background:linear-gradient(100deg,#3B1C5C,#5A2A1E);color:#FFE7A3;border-color:#8A5A2A}
.bm-grade-game{color:#A6FF3A;border-color:rgba(166,255,58,.35);background:rgba(166,255,58,.06)}

/* barre d'outils de l'équipe (sous l'en-tête, non collante) */
.bmn-staff{position:relative;z-index:30;top:auto;padding-top:0;background:#120B1A;border-bottom:1px solid #2E1E40;-webkit-backdrop-filter:none;backdrop-filter:none;font-size:13px}
.bmn-staff-in{max-width:1240px;margin:0 auto;min-height:40px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:6px max(16px,env(safe-area-inset-right,0px)) 6px max(16px,env(safe-area-inset-left,0px))}
.bmn-role{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;background:#26113A;color:#E2C7FF;font-weight:800;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}
.bmn-role .bmn-ico{width:14px;height:14px}
.bmn-role-superadmin{background:linear-gradient(100deg,#3B1C5C,#5A2A1E);color:#FFE7A3}
.bmn-staff-txt{color:#A79BB5}
.bmn-staff ul{display:flex;flex-wrap:wrap;gap:4px;margin-left:auto}
.bmn-staff a{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:8px;color:#E4DCEC;font-weight:600}
.bmn-staff a:hover{background:#22152F}
.bmn-staff a .bmn-ico{width:16px;height:16px;color:#C69CFF}
@media (max-width:900px){.bmn-staff-txt{display:none}.bmn-staff a span{display:none}.bmn-staff a{padding:0 8px}}

/* ---------- transitions entre les pages de l'espace membre (View Transitions, sans script) ----------
   L'en-tête et la barre d'onglets restent en place ; le contenu change par un fondu court (usage quotidien). */
@view-transition{navigation:auto}
header.bmn{view-transition-name:bm-nav}
.bmn-tabs{view-transition-name:bm-tabs}
::view-transition-group(bm-nav),::view-transition-group(bm-tabs){animation-duration:0s}
::view-transition-old(root){animation:bmn-page-out .14s ease-in both}
::view-transition-new(root){animation:bmn-page-in .24s cubic-bezier(.16,1,.3,1) both}
@keyframes bmn-page-out{to{opacity:0}}
@keyframes bmn-page-in{from{opacity:0;transform:translateY(8px)}}
@media (prefers-reduced-motion:reduce){::view-transition-new(root){animation:bmn-fade .18s ease both}}
@keyframes bmn-fade{from{opacity:0}}

/* barre secondaire de la Communauté (Arena, Vestiaires, Pronostics, Classements) */
.bmn-sub{position:relative;top:auto;z-index:30;padding-top:0;background:var(--n-bg);border-bottom:1px solid var(--n-line);-webkit-backdrop-filter:none;backdrop-filter:none}
.bmn-sub ul{max-width:1240px;margin:0 auto;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:0 max(12px,env(safe-area-inset-left,0px))}
.bmn-sub a{display:flex;align-items:center;height:46px;padding:0 14px;color:var(--n-muted);font-weight:700;font-size:.9rem;white-space:nowrap;position:relative}
.bmn-sub a:hover{color:var(--n-fg)}
.bmn-sub a[aria-current="page"]{color:var(--n-fg)}
.bmn-sub a[aria-current="page"]::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;border-radius:2px;background:var(--n-grad)}
.bmn-tabs a .bmn-count{top:4px;right:calc(50% - 20px)}
