/* Barre de navigation de la revue : reprend les tokens du board
   (fond #121110, texte #EDE9E1, accent #FF6B2C, pilules, labels mono). */
:root { --rn-h: 52px; }
html { scroll-padding-top: calc(var(--rn-h) + 16px); }
body.rn-flow { padding-top: var(--rn-h); box-sizing: border-box; }

.rn {
  position: fixed; top: 0; left: 0; right: 0; z-index: 2147483000;
  height: var(--rn-h); box-sizing: border-box;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 0 24px;
  background: rgba(18, 17, 16, .88);
  -webkit-backdrop-filter: saturate(140%) blur(12px);
  backdrop-filter: saturate(140%) blur(12px);
  border-bottom: 1px solid rgba(237, 233, 225, .14);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  color: #EDE9E1;
  -webkit-font-smoothing: antialiased;
}
.rn__label {
  display: flex; align-items: center; gap: 10px; min-width: 0;
  font: 500 11px/1 'JetBrains Mono', ui-monospace, monospace;
  letter-spacing: .14em; text-transform: uppercase; color: #9C968B;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rn__dot { width: 7px; height: 7px; border-radius: 50%; background: #FF6B2C; flex: none; }
.rn__label b { font-weight: 500; color: #EDE9E1; }
.rn__tabs { display: flex; gap: 8px; flex: none; }
.rn__tab {
  display: flex; align-items: baseline; gap: 10px;
  padding: 8px 14px; border-radius: 999px;
  border: 1px solid rgba(237, 233, 225, .16);
  color: #EDE9E1; text-decoration: none; font-size: 14px; line-height: 1.2;
  transition: color .15s, border-color .15s, background-color .15s;
}
.rn__tab span { font: 500 11px/1 'JetBrains Mono', ui-monospace, monospace; color: #8A847A; }
.rn__tab:hover { color: #FF6B2C; border-color: #FF6B2C; }
.rn__tab:focus-visible { outline: 2px solid #FF6B2C; outline-offset: 2px; }
.rn__tab[aria-current="page"] { background: #EDE9E1; border-color: #EDE9E1; color: #121110; }
.rn__tab[aria-current="page"] span { color: #6B665E; }

@media (max-width: 640px) {
  .rn { padding: 0 12px; justify-content: center; }
  .rn__label { display: none; }
  .rn__tab { padding: 7px 12px; font-size: 13px; gap: 8px; }
}
