/* ==========================================================================
   CELYNTOR · OBSIDIAN — système de design de l'espace éditeur et administrateur
   --------------------------------------------------------------------------
   01 Police          07 Boutons             13 Tableaux        19 Toasts
   02 Tokens          08 Champs              14 Graphiques      20 Connexion
   03 Base            09 Badges & états      15 Avis & erreurs  21 Espace éditeur
   04 Coque           10 Panneaux            16 Squelettes      22 Opérations admin
   05 Navigation      11 Indicateurs         17 Dialogues       23 Statistiques
   06 En-tête         12 Chiffres            18 Barre mobile    24 Comparaison
   25 Motion · 26 Responsive · 27 Mouvement réduit · 28 Thème clair
   Les sélecteurs et identifiants utilisés par le JavaScript sont conservés.
   ========================================================================== */

/* 01 · Police --------------------------------------------------------------- */
@font-face {
  font-family: Inter;
  src: url("/brand/inter-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

/* 02 · Tokens --------------------------------------------------------------- */
:root {
  color-scheme: dark;
  /* Surfaces : noir profond puis anthracites différenciés */
  --c-void: #020306;
  --c-canvas: #05070b;
  --c-sunken: #07090e;
  --c-panel: #0a0d13;
  --c-raised: #0f131b;
  --c-overlay: #141924;
  --c-hover: rgba(148, 163, 184, 0.055);
  --c-press: rgba(148, 163, 184, 0.1);
  /* Lignes */
  --c-line-soft: rgba(148, 163, 184, 0.075);
  --c-line: rgba(148, 163, 184, 0.12);
  --c-line-strong: rgba(148, 163, 184, 0.22);
  /* Encres */
  --c-ink: #edf1f7;
  --c-ink-2: #a8b3c3;
  --c-ink-3: #74808f;
  --c-ink-4: #4a5465;
  /* Bleu Celyntor */
  --c-blue: #2e66f5;
  --c-blue-hi: #4078ff;
  --c-blue-deep: #1d47c4;
  --c-blue-ink: #8eb0ff;
  --c-blue-soft: rgba(46, 102, 245, 0.12);
  --c-blue-line: rgba(84, 134, 255, 0.4);
  --c-blue-glow: rgba(46, 102, 245, 0.28);
  /* Signaux */
  --c-success: #3ccf98;
  --c-success-soft: rgba(60, 207, 152, 0.1);
  --c-success-line: rgba(60, 207, 152, 0.3);
  --c-warning: #f0b450;
  --c-warning-soft: rgba(240, 180, 80, 0.1);
  --c-warning-line: rgba(240, 180, 80, 0.32);
  --c-danger: #f2687c;
  --c-danger-soft: rgba(242, 104, 124, 0.1);
  --c-danger-line: rgba(242, 104, 124, 0.34);
  /* Séries de données */
  --c-series-1: #4d84ff;
  --c-series-2: #36b9c6;
  --c-series-3: #9a8cff;
  --c-series-4: #e8a23e;
  --c-today: #5b8cff;
  --c-yesterday: #7b8799;
  --c-missing: rgba(148, 163, 184, 0.16);
  /* Typographie */
  --f-sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Mono", Consolas, monospace;
  /* Rayons */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-pill: 999px;
  /* Espacements */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-7: 32px;
  --s-8: 48px;
  /* Élévations */
  --sh-inner: inset 0 1px 0 rgba(255, 255, 255, 0.028);
  --sh-pop: 0 18px 48px -14px rgba(0, 0, 0, 0.75), 0 0 0 1px var(--c-line);
  --sh-dialog: 0 50px 140px -30px rgba(0, 0, 0, 0.9), 0 0 0 1px var(--c-line-strong);
  /* Mouvement */
  --e-out: cubic-bezier(0.16, 1, 0.3, 1);
  --e-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --e-in: cubic-bezier(0.5, 0, 0.75, 0);
  --e-spring: cubic-bezier(0.34, 1.45, 0.64, 1);
  --d-1: 120ms;
  --d-2: 200ms;
  --d-3: 320ms;
  --d-4: 520ms;
  --d-5: 820ms;
  /* Mise en page */
  --sidebar-w: 252px;
  --header-h: 56px;
  --content-max: 1360px;
  --gutter: 32px;
  /* Compatibilité avec les anciens noms */
  --n-bg: var(--c-panel);
  --n-canvas: var(--c-canvas);
  --n-surface: var(--c-raised);
  --n-card: var(--c-panel);
  --n-hover: var(--c-hover);
  --n-ink: var(--c-ink);
  --n-muted: var(--c-ink-2);
  --n-line: var(--c-line);
  --n-accent: var(--c-blue-ink);
  --n-accent-soft: var(--c-blue-soft);
  --n-primary: var(--c-blue);
  --n-success: var(--c-success);
  --n-success-soft: var(--c-success-soft);
  --n-warning: var(--c-warning);
  --n-warning-soft: var(--c-warning-soft);
  --n-error: var(--c-danger);
  --n-error-soft: var(--c-danger-soft);
  --n-radius: var(--r-lg);
}

/* 03 · Base ----------------------------------------------------------------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scrollbar-color: var(--c-line-strong) transparent;
}
body {
  margin: 0;
  min-height: 100dvh;
  background: var(--c-canvas);
  color: var(--c-ink);
  font: 14px/1.55 var(--f-sans);
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
/* Horizon : une seule lueur fixe, peinte une fois */
body::before {
  content: "";
  position: fixed;
  inset: 0 0 auto 0;
  height: 520px;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(900px 340px at 78% -160px, rgba(46, 102, 245, 0.11), transparent 70%),
    radial-gradient(600px 260px at 12% -140px, rgba(90, 120, 200, 0.05), transparent 70%);
}
::selection {
  background: rgba(46, 102, 245, 0.45);
  color: #fff;
}
h1,
h2,
h3,
h4 {
  margin: 0;
  font-weight: 600;
  letter-spacing: -0.015em;
  line-height: 1.25;
  text-wrap: balance;
}
p {
  margin: 0;
}
button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}
a {
  color: var(--c-blue-ink);
  text-decoration: none;
  text-underline-offset: 3px;
}
a:hover {
  text-decoration: underline;
  text-decoration-color: rgba(142, 176, 255, 0.45);
}
button {
  cursor: pointer;
}
button:disabled {
  cursor: not-allowed;
}
img,
svg {
  max-width: 100%;
}
code,
pre,
kbd {
  font-family: var(--f-mono);
}
[hidden] {
  display: none !important;
}
:focus {
  outline: none;
}
:focus-visible {
  outline: 2px solid var(--c-blue-hi);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: none;
}
details > summary {
  cursor: pointer;
  list-style: none;
}
details > summary::-webkit-details-marker {
  display: none;
}
.n-sr {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.n-skip {
  position: fixed;
  left: 16px;
  top: 12px;
  z-index: 1000;
  padding: 10px 16px;
  border-radius: var(--r-md);
  background: var(--c-blue);
  color: #fff;
  font-weight: 600;
  transform: translateY(-160%);
  transition: transform var(--d-2) var(--e-out);
}
.n-skip:focus {
  transform: none;
}
.n-svg-definitions {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

/* Bandeau d'aperçu local (fourni par /api/brand quand isPreview est vrai) */
.n-preview-strip {
  position: relative;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 30px;
  padding: 5px 16px;
  background: repeating-linear-gradient(-45deg, #151006, #151006 10px, #1a1408 10px, #1a1408 20px);
  border-bottom: 1px solid var(--c-warning-line);
  color: #f6cf86;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-align: center;
}

/* 04 · Coque ---------------------------------------------------------------- */
.n-shell {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: var(--sidebar-w) minmax(0, 1fr);
  min-height: 100dvh;
}
#page-shell {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.n-container {
  width: 100%;
  max-width: calc(var(--content-max) + 2 * var(--gutter));
  margin: 0 auto;
  padding: 0 var(--gutter) 72px;
  flex: 1;
}
.n-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 24px;
  margin-top: 56px;
  padding-top: 18px;
  border-top: 1px solid var(--c-line-soft);
  color: var(--c-ink-3);
  font-size: 12px;
}

/* 05 · Navigation ----------------------------------------------------------- */
.n-sidebar {
  position: sticky;
  top: 0;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 18px 12px 14px;
  background: linear-gradient(180deg, rgba(10, 13, 19, 0.92), rgba(5, 7, 11, 0.96));
  border-right: 1px solid var(--c-line-soft);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  z-index: 40;
}
.n-logo {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 4px 10px 18px;
  color: var(--c-ink);
  font-weight: 650;
  font-size: 15.5px;
  letter-spacing: -0.02em;
  line-height: 1;
}
.n-logo:hover {
  text-decoration: none;
}
.n-logo img {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 6px 18px -6px var(--c-blue-glow);
}
.n-logo span {
  display: grid;
  gap: 4px;
}
.n-logo small {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 0.24em;
  color: var(--c-ink-3);
}
.n-nav {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.n-nav-label {
  display: block;
  padding: 18px 10px 7px;
  color: var(--c-ink-3);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.n-nav-label:first-child {
  padding-top: 4px;
}
.n-nav a {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 34px;
  padding: 7px 10px;
  border-radius: var(--r-md);
  color: var(--c-ink-2);
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: -0.003em;
  transition:
    color var(--d-1) linear,
    background-color var(--d-2) var(--e-out);
}
.n-nav a:hover {
  color: var(--c-ink);
  background: var(--c-hover);
  text-decoration: none;
}
.n-nav a[aria-current="page"] {
  color: #fff;
  background: var(--c-blue-soft);
}
.n-nav.has-indicator a[aria-current="page"] {
  background: transparent;
}
.n-nav a[aria-current="page"] .n-icon {
  color: var(--c-blue-ink);
}
.n-nav a[target="_blank"]::after {
  content: "↗";
  margin-left: auto;
  color: var(--c-ink-4);
  font-size: 11px;
}
.n-nav-indicator {
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  top: 0;
  height: 34px;
  border-radius: var(--r-md);
  background: linear-gradient(90deg, rgba(46, 102, 245, 0.2), rgba(46, 102, 245, 0.07) 70%);
  box-shadow: inset 0 0 0 1px rgba(84, 134, 255, 0.16);
  pointer-events: none;
  opacity: 0;
  will-change: transform;
}
.n-nav-indicator::before {
  content: "";
  position: absolute;
  left: -12px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--c-blue-hi);
  box-shadow: 0 0 14px var(--c-blue-glow);
}
.n-icon {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  color: var(--c-ink-3);
  transition: color var(--d-1) linear;
}
.n-nav a:hover .n-icon {
  color: var(--c-ink-2);
}
.n-sidebar-foot {
  margin-top: auto;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 2px 11px;
  padding: 12px 10px 4px;
  border-top: 1px solid var(--c-line-soft);
  color: var(--c-ink-3);
  font-size: 12px;
  line-height: 1.35;
}
.n-sidebar-foot::before {
  content: attr(data-initial);
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: linear-gradient(145deg, #1a2336, #0f1420);
  box-shadow: inset 0 0 0 1px var(--c-line);
  color: var(--c-blue-ink);
  font-weight: 650;
  font-size: 13px;
}
.n-sidebar-foot br {
  display: none;
}
.n-sidebar-foot strong {
  color: var(--c-ink);
  font-size: 13px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.n-sidebar-foot > span {
  grid-column: 2;
}
.n-sidebar-foot .n-menu-button {
  grid-column: 1 / -1;
  margin-top: 10px;
}
.n-button.n-menu-button {
  display: none;
}

/* 06 · En-tête --------------------------------------------------------------- */
.n-admin-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px var(--gutter);
  background: linear-gradient(90deg, rgba(240, 180, 80, 0.07), transparent 60%);
  border-bottom: 1px solid var(--c-line-soft);
  color: #d9b679;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
}
.n-admin-strip::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--c-warning);
  box-shadow: 0 0 0 3px rgba(240, 180, 80, 0.14);
}
.n-header {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: var(--header-h);
  padding: 0 var(--gutter);
  background: rgba(5, 7, 11, 0.82);
  border-bottom: 1px solid var(--c-line-soft);
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .n-header {
    background: rgba(5, 7, 11, 0.66);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    backdrop-filter: blur(14px) saturate(140%);
  }
}
.n-header .n-row {
  flex-wrap: nowrap;
  min-width: 0;
}
.n-breadcrumb {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--c-ink-3);
  font-size: 13px;
}
.n-breadcrumb strong {
  color: var(--c-ink);
  font-weight: 550;
}
.n-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.n-header-actions .n-badge {
  height: 28px;
}
.n-utc {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 28px;
  padding: 0 10px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-pill);
  color: var(--c-ink-2);
  font: 500 12px/1 var(--f-sans);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.n-utc b {
  color: var(--c-ink-3);
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.12em;
}
/* Ligne de lecture : progression globale et signature d'entrée */
.n-scanline {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  overflow: hidden;
  pointer-events: none;
}
.n-scanline i {
  position: absolute;
  inset: 0;
  transform: scaleX(0);
  transform-origin: 0 50%;
  background: linear-gradient(90deg, transparent, var(--c-blue-hi) 30%, #9ec0ff 50%, var(--c-blue-hi) 70%, transparent);
  opacity: 0;
}
.n-scanline[data-state="busy"] i {
  opacity: 1;
  transform: scaleX(0.35);
  animation: n-scan-busy 1.15s var(--e-in-out) infinite;
}
.n-scanline[data-state="done"] i {
  opacity: 0;
  transform: scaleX(1);
  transition:
    transform var(--d-3) var(--e-out),
    opacity var(--d-4) linear var(--d-2);
}
@keyframes n-scan-busy {
  0% {
    transform: translateX(-40%) scaleX(0.3);
  }
  100% {
    transform: translateX(140%) scaleX(0.45);
  }
}

.n-theme-toggle .n-theme-moon {
  display: none;
}
:root[data-theme="light"] .n-theme-toggle .n-theme-moon {
  display: block;
}
:root[data-theme="light"] .n-theme-toggle .n-theme-sun {
  display: none;
}

/* Tête de page */
.n-page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 34px 0 22px;
}
.n-page-head > div {
  min-width: 0;
}
.n-page-head h1 {
  font-size: 28px;
  font-weight: 620;
  letter-spacing: -0.028em;
  line-height: 1.15;
}
.n-overline {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 9px;
  color: var(--c-ink-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.n-page-head .n-overline::before {
  content: "";
  width: 14px;
  height: 2px;
  border-radius: 2px;
  background: var(--c-blue-hi);
}
.n-description {
  margin-top: 8px;
  max-width: 68ch;
  color: var(--c-ink-2);
  font-size: 14px;
  line-height: 1.6;
}
.n-page-head #refresh {
  flex-shrink: 0;
}

/* 07 · Boutons ---------------------------------------------------------------- */
.n-button,
.r-button,
.su-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--c-line-strong);
  border-radius: var(--r-md);
  background: var(--c-raised);
  box-shadow: var(--sh-inner);
  color: var(--c-ink);
  font-size: 13px;
  font-weight: 550;
  line-height: 1.2;
  letter-spacing: -0.003em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition:
    background-color var(--d-1) linear,
    border-color var(--d-1) linear,
    color var(--d-1) linear,
    box-shadow var(--d-2) var(--e-out),
    transform var(--d-1) var(--e-out),
    opacity var(--d-1) linear;
}
.n-button:hover,
.r-button:hover,
.su-button:hover {
  background: var(--c-overlay);
  border-color: rgba(148, 163, 184, 0.32);
  text-decoration: none;
}
.n-button:active:not(:disabled),
.r-button:active:not(:disabled),
.su-button:active:not(:disabled) {
  transform: scale(0.98);
}
.n-button.primary,
.r-button.r-primary,
.su-button.su-primary {
  border-color: transparent;
  background: linear-gradient(180deg, #3a72ff, var(--c-blue));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.16),
    0 0 0 1px rgba(46, 102, 245, 0.6),
    0 8px 22px -10px var(--c-blue-glow);
  color: #fff;
}
.n-button.primary:hover,
.r-button.r-primary:hover,
.su-button.su-primary:hover {
  background: linear-gradient(180deg, #4a7fff, #3570ff);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    0 0 0 1px rgba(64, 120, 255, 0.8),
    0 10px 28px -10px rgba(46, 102, 245, 0.55);
}
.n-button.subtle,
.r-button.r-subtle {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  color: var(--c-ink-2);
}
.n-button.subtle:hover,
.r-button.r-subtle:hover {
  background: var(--c-hover);
  color: var(--c-ink);
}
.n-button.danger {
  border-color: var(--c-danger-line);
  background: var(--c-danger-soft);
  color: #ff9aa8;
}
.n-button.danger:hover {
  background: rgba(242, 104, 124, 0.16);
  border-color: rgba(242, 104, 124, 0.5);
}
.n-button:disabled,
.r-button:disabled,
.su-button:disabled {
  opacity: 0.45;
  box-shadow: none;
  transform: none;
}
.n-button .n-icon {
  width: 15px;
  height: 15px;
  color: currentColor;
}
.n-text-link {
  font-size: 13px;
  font-weight: 550;
}
.n-text-link::after {
  content: " →";
}
.n-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
/* Retour d'action : en cours, réussi, échoué */
.is-busy {
  color: transparent !important;
  pointer-events: none;
}
.is-busy::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 14px;
  margin: -7px 0 0 -7px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.25);
  border-top-color: #fff;
  animation: n-spin 0.7s linear infinite;
}
.n-button:not(.primary).is-busy::after {
  border-color: rgba(148, 163, 184, 0.25);
  border-top-color: var(--c-ink);
}
.is-done {
  border-color: var(--c-success-line) !important;
  box-shadow: 0 0 0 3px rgba(60, 207, 152, 0.12) !important;
}
.is-done::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: rgba(60, 207, 152, 0.14);
  animation: n-fade-out 1.1s var(--e-out) forwards;
  pointer-events: none;
}
.is-failed {
  animation: n-shake 0.38s var(--e-out);
  border-color: var(--c-danger-line) !important;
}
@keyframes n-spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes n-fade-out {
  to {
    opacity: 0;
  }
}
@keyframes n-shake {
  0%,
  100% {
    transform: translateX(0);
  }
  20% {
    transform: translateX(-4px);
  }
  45% {
    transform: translateX(3px);
  }
  70% {
    transform: translateX(-2px);
  }
}

/* 08 · Champs ---------------------------------------------------------------- */
.n-field {
  display: grid;
  gap: 7px;
  min-width: 0;
}
.n-field > label,
.n-field > span,
.n-stack > label,
.n-op-dialog label:not(.n-op-attestation):not(.n-check) {
  color: var(--c-ink-2);
  font-size: 12.5px;
  font-weight: 550;
}
.n-input,
.r-input,
.h-field input,
.h-field select,
.h-field textarea,
.cm label > input,
.cm label > select,
.cm label > textarea,
.su-field select,
.nw-site-search {
  width: 100%;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid var(--c-line-strong);
  border-radius: var(--r-md);
  background: var(--c-sunken);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3);
  color: var(--c-ink);
  font-size: 14px;
  transition:
    border-color var(--d-1) linear,
    box-shadow var(--d-2) var(--e-out),
    background-color var(--d-1) linear;
}
.n-input::placeholder,
.r-input::placeholder,
.h-field input::placeholder {
  color: var(--c-ink-4);
}
.n-input:hover,
.r-input:hover,
.h-field input:hover,
.h-field select:hover {
  border-color: rgba(148, 163, 184, 0.32);
}
.n-input:focus,
.r-input:focus,
.h-field input:focus,
.h-field select:focus,
.h-field textarea:focus,
.cm label > input:focus,
.cm label > select:focus,
.cm label > textarea:focus,
.su-field select:focus,
.nw-site-search:focus {
  border-color: var(--c-blue-hi);
  box-shadow:
    0 0 0 3px rgba(46, 102, 245, 0.22),
    inset 0 1px 2px rgba(0, 0, 0, 0.3);
  background: #080b11;
}
.n-input[aria-invalid="true"],
.n-input:user-invalid {
  border-color: var(--c-danger-line);
}
.n-input:read-only {
  background: var(--c-canvas);
}
.n-input:disabled {
  opacity: 0.55;
}
select.n-input,
.h-field select,
.cm label > select,
.su-field select {
  appearance: none;
  padding-right: 34px;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--c-ink-3) 50%),
    linear-gradient(135deg, var(--c-ink-3) 50%, transparent 50%);
  background-position:
    calc(100% - 17px) 50%,
    calc(100% - 12px) 50%;
  background-size:
    5px 5px,
    5px 5px;
  background-repeat: no-repeat;
}
select.n-input option {
  background: var(--c-raised);
  color: var(--c-ink);
}
textarea.n-input {
  min-height: 96px;
  line-height: 1.6;
  resize: vertical;
}
input[type="checkbox"],
input[type="radio"] {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--c-blue);
  flex: 0 0 auto;
}
input[type="date"].n-input {
  color-scheme: dark;
}
.n-check {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--c-ink-2);
  font-size: 13px;
  cursor: pointer;
}
.n-hint {
  color: var(--c-ink-3);
  font-size: 12.5px;
  line-height: 1.55;
}
.n-code,
.n-input.n-code {
  font-family: var(--f-mono);
  font-size: 12.5px;
  letter-spacing: 0.01em;
  overflow-wrap: anywhere;
}
p.n-code,
code.n-code {
  display: block;
  padding: 9px 12px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  background: var(--c-sunken);
  color: var(--c-ink);
  line-height: 1.55;
  word-break: break-all;
}
.n-secret,
.n-recovery {
  display: block;
  margin: 12px 0 4px;
  padding: 12px 14px;
  border: 1px dashed var(--c-blue-line);
  border-radius: var(--r-md);
  background: var(--c-sunken);
  color: #dbe6ff;
  font: 500 13px/1.8 var(--f-mono);
  letter-spacing: 0.06em;
  word-break: break-all;
  white-space: pre-wrap;
}
.n-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
}

/* 09 · Badges & états ---------------------------------------------------------- */
.n-badge,
.h-status,
.r-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  padding: 0 9px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-pill);
  background: rgba(148, 163, 184, 0.06);
  color: var(--c-ink-2);
  font-size: 11.5px;
  font-weight: 550;
  line-height: 1;
  white-space: nowrap;
  vertical-align: middle;
}
.n-badge::before,
.h-status::before,
.r-pill::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.85;
}
.n-badge.success,
.h-status.good,
.r-pill.r-live {
  border-color: var(--c-success-line);
  background: var(--c-success-soft);
  color: var(--c-success);
}
.n-badge.warning,
.h-status:not(.good) {
  border-color: var(--c-warning-line);
  background: var(--c-warning-soft);
  color: var(--c-warning);
}
.n-badge.danger {
  border-color: var(--c-danger-line);
  background: var(--c-danger-soft);
  color: var(--c-danger);
}
.n-badge.info {
  border-color: var(--c-blue-line);
  background: var(--c-blue-soft);
  color: var(--c-blue-ink);
}
.n-state-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 1.5px solid var(--c-ink-4);
  flex: 0 0 auto;
}
.n-state-dot.done {
  border-color: var(--c-success);
  background: var(--c-success);
  box-shadow: 0 0 0 3px var(--c-success-soft);
}
.n-progress {
  position: relative;
  height: 4px;
  margin: 14px 0 6px;
  border-radius: 4px;
  background: var(--c-line);
  overflow: hidden;
}
.n-progress span {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--c-blue), var(--c-blue-hi));
  box-shadow: 0 0 12px var(--c-blue-glow);
  transition: width var(--d-5) var(--e-out);
}
/* Pastille de synchronisation */
.n-sync-chip,
.n-op-sync {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  color: var(--c-ink-2);
  font-size: 12.5px;
}
.n-sync-dot {
  position: relative;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--c-blue-hi);
  flex: 0 0 auto;
}
.n-sync-dot::after {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1px solid currentColor;
  color: var(--c-blue-hi);
  opacity: 0.35;
}
.n-sync-dot[data-tone="ok"] {
  background: var(--c-success);
}
.n-sync-dot[data-tone="ok"]::after {
  color: var(--c-success);
}
.n-sync-dot[data-tone="warn"] {
  background: var(--c-warning);
}
.n-sync-dot[data-tone="warn"]::after {
  color: var(--c-warning);
}
.n-sync-dot[data-tone="none"] {
  background: var(--c-ink-4);
}
.n-sync-dot[data-tone="none"]::after {
  display: none;
}
.n-op-sync small {
  flex-basis: 100%;
  color: var(--c-ink-3);
  font-size: 11.5px;
}

/* 10 · Panneaux ---------------------------------------------------------------- */
.n-card {
  position: relative;
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  background: var(--c-panel);
  box-shadow: var(--sh-inner);
}
.n-card > h2,
.n-card-head h2,
.n-owner-panel > h2 {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.012em;
}
.n-card > h2 + .n-hint,
.n-card-head .n-hint,
.n-owner-panel > h2 + .n-hint {
  margin-top: 4px;
  max-width: 72ch;
}
.n-card h3 {
  font-size: 14px;
  font-weight: 600;
}
.n-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.n-card > * + * {
  margin-top: 12px;
}
.n-owner-kpi > * + *,
.n-metric > * + *,
.n-ledger-hero > * + *,
.n-next-action > * + *,
.n-op-shortcut > * + *,
.n-op-smartlink > * + *,
.n-publisher-money-grid > .n-card > * + *,
.n-operations:not(.n-publisher-links) .n-op-payment-list > .n-card > * + * {
  margin-top: 0;
}
.n-owner-panel > :not(h2):not(.n-hint):first-of-type,
.n-owner-panel > h2 + .n-hint + * {
  margin-top: 18px;
}
.n-strong-card {
  background:
    linear-gradient(160deg, rgba(46, 102, 245, 0.1), transparent 55%),
    var(--c-panel);
  border-color: rgba(84, 134, 255, 0.24);
}
.n-section-gap {
  margin-top: 16px;
}
.n-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.n-stack {
  display: grid;
  gap: 14px;
}
.n-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.n-list {
  display: grid;
}
.n-list > .n-row,
.n-list-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 42px;
  padding: 9px 0;
  border-bottom: 1px solid var(--c-line-soft);
}
.n-list > .n-row:last-child,
.n-list-item:last-child {
  border-bottom: 0;
}
.n-list > .n-row > .n-label {
  color: var(--c-ink-2);
}
.n-list > .n-row > strong {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  text-align: right;
}
label.n-list-item {
  justify-content: flex-start;
  cursor: pointer;
}
.n-divider {
  height: 1px;
  margin: 24px 0;
  border: 0;
  background: var(--c-line-soft);
}
.n-live-note,
.n-owner-footnote {
  color: var(--c-ink-3);
  font-size: 12px;
  line-height: 1.6;
}
/* Empilement vertical des rubriques */
.n-owner,
.n-operations,
.n-publisher-live,
.n-publisher-live > div,
.h-stack,
.cm,
.rnk,
.ntx,
.n-routing,
.n-flow,
#page-content > div:not([class]) {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}
.n-owner > a.n-button,
.n-operations > a.n-button,
.n-operations > .n-buttons,
.n-flow > a.n-button,
#page-content > div:not([class]) > a.n-button,
.cm > button,
.cm > .cm-link {
  align-self: flex-start;
}
details.n-card > summary,
.n-owner-daily > summary,
.n-op-wallet-edit > summary,
.n-owner-custom > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--c-ink);
  font-weight: 550;
  font-size: 13.5px;
}
details.n-card > summary::after,
.n-owner-daily > summary::after,
.n-op-wallet-edit > summary::after,
.n-owner-custom > summary::after {
  content: "";
  width: 7px;
  height: 7px;
  margin-right: 4px;
  border-right: 1.5px solid var(--c-ink-3);
  border-bottom: 1.5px solid var(--c-ink-3);
  transform: rotate(45deg) translateY(-2px);
  transition: transform var(--d-3) var(--e-out);
}
details[open] > summary::after {
  transform: rotate(225deg) translate(-2px, 0);
}
details.n-card[open] > summary {
  margin-bottom: 14px;
}

/* 11 · Indicateurs (bandeau de chiffres, sans grille de cartes identiques) ------ */
.n-metrics,
.n-owner-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 1px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  background: var(--c-line-soft);
  overflow: hidden;
  box-shadow: var(--sh-inner);
}
.n-owner-kpis:has(> :nth-child(3):last-child) {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.n-owner-kpis:has(> :nth-child(3):last-child) > .n-owner-kpi-primary {
  grid-column: span 2;
}
.n-metric,
.n-owner-kpi {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  padding: 18px 20px 17px;
  border: 0;
  border-radius: 0;
  background: var(--c-panel);
  box-shadow: none;
  overflow: hidden;
  isolation: isolate;
}
.n-label {
  color: var(--c-ink-2);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.35;
}
.n-value,
.n-owner-value {
  display: block;
  color: var(--c-ink);
  font-size: 26px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.n-metric .n-hint,
.n-owner-kpi .n-hint {
  margin-top: auto;
  font-size: 12px;
}
.n-metric-wide .n-value {
  font-size: 22px;
}
.n-owner-kpi-primary {
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(46, 102, 245, 0.13), transparent 55%),
    var(--c-panel);
}
.n-owner-kpi-primary .n-owner-value,
.n-strong-card > .n-value {
  font-size: 34px;
  letter-spacing: -0.035em;
}
.n-owner-kpi-primary .n-label::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 8px 1px 0;
  border-radius: 2px;
  background: var(--c-blue-hi);
  box-shadow: 0 0 10px var(--c-blue-glow);
}
/* Projecteur discret au survol (desktop uniquement) */
@media (hover: hover) and (pointer: fine) {
  .n-owner-kpi::after,
  .n-metric::after,
  .n-op-shortcut::after,
  .n-tower-cell::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(140, 170, 255, 0.07), transparent 60%);
    opacity: 0;
    transition: opacity var(--d-3) linear;
    pointer-events: none;
  }
  .n-owner-kpi:hover::after,
  .n-metric:hover::after,
  .n-op-shortcut:hover::after,
  .n-tower-cell:hover::after {
    opacity: 1;
  }
}

/* 12 · Chiffres ---------------------------------------------------------------- */
.n-fig {
  display: inline-flex;
  align-items: baseline;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.n-fig-dec {
  color: var(--c-ink-2);
  font-size: 0.74em;
  font-weight: 550;
  letter-spacing: -0.01em;
}
.n-fig.is-small .n-fig-dec {
  color: inherit;
  font-size: 1em;
}
.n-fig-cur {
  margin-left: 0.32em;
  color: var(--c-ink-3);
  font-size: 0.46em;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.is-absent {
  color: var(--c-ink-4) !important;
  font-weight: 500 !important;
}
.is-pending {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  color: var(--c-warning) !important;
  font-size: 0.68em !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.is-pending::before {
  content: "";
  width: 0.62em;
  height: 0.62em;
  border-radius: 50%;
  border: 2px solid currentColor;
  border-right-color: transparent;
  opacity: 0.8;
}
.n-flash-up,
.n-flash-down {
  animation: n-flash 1.6s var(--e-out);
}
.n-flash-up {
  --flash: rgba(60, 207, 152, 0.16);
}
.n-flash-down {
  --flash: rgba(242, 104, 124, 0.14);
}
@keyframes n-flash {
  0% {
    box-shadow: inset 0 0 0 999px var(--flash);
  }
  100% {
    box-shadow: inset 0 0 0 999px transparent;
  }
}

/* 13 · Tableaux ---------------------------------------------------------------- */
.n-table-wrap,
.h-table-scroll,
.rnk-scroll {
  position: relative;
  overflow: auto;
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  background: var(--c-panel);
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.n-card .n-table-wrap,
.n-card .h-table-scroll,
.h-panel .h-table-scroll {
  border-radius: var(--r-md);
  background: var(--c-sunken);
}
.n-table-wrap:focus-visible {
  outline: 2px solid var(--c-blue-hi);
  outline-offset: 2px;
}
.n-table,
.h-table,
.rnk-scroll table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
  text-align: left;
}
.n-table th,
.h-table th,
.rnk-scroll th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 10px 14px;
  border-bottom: 1px solid var(--c-line);
  background: var(--c-raised);
  color: var(--c-ink-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}
.n-table td,
.h-table td,
.rnk-scroll td {
  padding: 11px 14px;
  border-bottom: 1px solid var(--c-line-soft);
  color: var(--c-ink);
  vertical-align: middle;
}
.n-table tbody tr:last-child td,
.h-table tbody tr:last-child td,
.rnk-scroll tbody tr:last-child td {
  border-bottom: 0;
}
.n-table tbody tr,
.h-table tbody tr,
.rnk-scroll tbody tr {
  transition: background-color var(--d-1) linear;
}
.n-table tbody tr:hover,
.h-table tbody tr:hover,
.rnk-scroll tbody tr:hover {
  background: var(--c-hover);
}
.number,
.n-table .num,
.h-table .num,
.rnk-scroll .num,
th.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.n-table td .n-hint {
  font-size: 11.5px;
}
.n-table td:first-child,
.h-table td:first-child {
  white-space: nowrap;
}
.n-table td .n-button {
  min-height: 30px;
  padding: 0 11px;
  font-size: 12.5px;
}
.n-table a[target="_blank"] {
  white-space: nowrap;
}
.n-table-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 2px 0;
}
.n-table-tools .n-button {
  min-height: 30px;
}
td.is-dash,
.n-table td.is-dash {
  color: var(--c-ink-4);
}

/* 14 · Graphiques ---------------------------------------------------------------- */
.n-chart,
.n-owner-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
.n-chart-grid,
.n-owner-grid {
  stroke: var(--c-line-soft);
  stroke-width: 1;
  shape-rendering: crispEdges;
}
.n-owner-grid:first-of-type {
  stroke: var(--c-line);
}
.n-chart-label,
.n-owner-axis {
  fill: var(--c-ink-3);
  font: 500 11px var(--f-sans);
  font-variant-numeric: tabular-nums;
}
.n-chart-line,
.n-owner-line {
  fill: none;
  stroke: var(--c-series-1);
  stroke-width: 2;
  stroke-linejoin: round;
  stroke-linecap: round;
}
.n-chart-fill {
  fill: rgba(77, 132, 255, 0.1);
}
.n-chart-point,
.n-owner-dot {
  fill: var(--c-panel);
  stroke: var(--c-series-1);
  stroke-width: 2;
  cursor: pointer;
  transition: r var(--d-2) var(--e-spring);
}
.n-chart-point:hover,
.n-chart-point:focus,
.n-owner-dot:hover,
.n-owner-dot:focus {
  r: 5.5;
  outline: none;
}
.n-owner-bar {
  fill: var(--c-series-1);
  opacity: 0.86;
  cursor: pointer;
  transition: opacity var(--d-1) linear;
}
.n-owner-bar-teal {
  fill: var(--c-series-2);
}
.n-owner-bar:hover,
.n-owner-bar:focus,
.n-owner-bar.is-active {
  opacity: 1;
  outline: none;
}
.n-owner-svg:hover .n-owner-bar:not(:hover):not(.is-active) {
  opacity: 0.55;
}
.n-owner-missing {
  fill: url(#n-hatch);
  stroke: var(--c-missing);
  stroke-dasharray: 2 3;
  stroke-width: 1;
}
.n-owner-cursor {
  stroke: var(--c-ink-3);
  stroke-dasharray: 3 4;
  stroke-width: 1;
  pointer-events: none;
}
.n-owner-plot,
.n-performance-plot {
  position: relative;
  min-height: 220px;
  margin-top: 14px;
}
.n-owner-tooltip {
  position: absolute;
  top: 6px;
  z-index: 3;
  display: grid;
  gap: 3px;
  min-width: 180px;
  padding: 10px 12px;
  border-radius: var(--r-md);
  background: rgba(20, 25, 36, 0.96);
  box-shadow: var(--sh-pop);
  pointer-events: none;
  transition:
    left var(--d-2) var(--e-out),
    opacity var(--d-1) linear;
}
.n-owner-tooltip strong {
  color: var(--c-ink-2);
  font-size: 11.5px;
  font-weight: 550;
}
.n-owner-tooltip span {
  color: var(--c-ink);
  font-size: 16px;
  font-weight: 620;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.n-owner-tooltip small {
  color: var(--c-ink-3);
  font-size: 11.5px;
}
.n-owner-chart-detail {
  min-height: 20px;
  margin-top: 10px;
  color: var(--c-ink-3);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.n-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  margin-top: 8px;
  color: var(--c-ink-3);
  font-size: 11.5px;
}
.n-legend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.n-legend i {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  background: var(--c-series-1);
}
.n-legend i.is-missing {
  background: repeating-linear-gradient(-45deg, var(--c-missing), var(--c-missing) 2px, transparent 2px, transparent 4px);
  box-shadow: inset 0 0 0 1px var(--c-missing);
}
.n-legend i.is-zero {
  height: 2px;
  margin: 4px 0;
}
.n-graph-field {
  max-width: 220px;
  margin-top: 14px;
}
.n-performance-card .n-chart {
  margin-top: 12px;
}
/* Onglets de graphique et périodes : contrôles segmentés */
.n-owner-chart-tabs,
.n-owner-periods,
.r-inventory-tabs,
.cm-tabs,
.nw-tabs {
  position: relative;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border: 1px solid var(--c-line);
  border-radius: 10px;
  background: var(--c-sunken);
  isolation: isolate;
}
.n-owner-chart-tab,
.n-owner-period,
.r-inventory-tabs > button,
.cm-tabs > button,
.nw-tab {
  position: relative;
  z-index: 1;
  min-height: 30px;
  padding: 0 12px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  box-shadow: none;
  color: var(--c-ink-2);
  font-size: 12.5px;
  font-weight: 550;
  white-space: nowrap;
  transition:
    color var(--d-2) linear,
    background-color var(--d-2) linear;
}
.n-owner-chart-tab:hover,
.n-owner-period:hover,
.r-inventory-tabs > button:hover,
.cm-tabs > button:hover,
.nw-tab:hover {
  color: var(--c-ink);
  background: transparent;
}
.n-owner-chart-tab[aria-pressed="true"],
.n-owner-period[aria-pressed="true"],
.r-inventory-tabs > button[aria-pressed="true"],
.cm-tabs > button[aria-selected="true"],
.nw-tab[aria-selected="true"] {
  color: #fff;
  background: var(--c-overlay);
  box-shadow: inset 0 0 0 1px var(--c-line-strong);
}
.has-thumb > [aria-pressed="true"],
.has-thumb > [aria-selected="true"] {
  background: transparent !important;
  box-shadow: none !important;
}
.n-thumb {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  border-radius: 7px;
  background: linear-gradient(180deg, #1a2131, #141a26);
  box-shadow:
    inset 0 0 0 1px var(--c-line-strong),
    0 4px 12px -4px rgba(0, 0, 0, 0.6);
  pointer-events: none;
  transition:
    transform var(--d-4) var(--e-out),
    width var(--d-4) var(--e-out),
    height var(--d-4) var(--e-out),
    opacity var(--d-2) linear;
}
.n-thumb::after {
  content: "";
  position: absolute;
  left: 22%;
  right: 22%;
  bottom: -1px;
  height: 2px;
  border-radius: 2px;
  background: var(--c-blue-hi);
  box-shadow: 0 0 10px var(--c-blue-glow);
}
.nw-tabs .n-thumb::after,
.cm-tabs .n-thumb::after {
  display: none;
}

/* 15 · Avis, erreurs, états vides -------------------------------------------------- */
.n-notice,
.n-publisher-notice {
  position: relative;
  padding: 11px 14px 11px 40px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  background: linear-gradient(90deg, rgba(46, 102, 245, 0.06), transparent 60%), var(--c-sunken);
  color: var(--c-ink-2);
  font-size: 13px;
  line-height: 1.6;
}
.n-notice::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 13px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background:
    linear-gradient(var(--c-blue-ink), var(--c-blue-ink)) 50% 72% / 2px 6px no-repeat,
    radial-gradient(circle, var(--c-blue-ink) 1.2px, transparent 1.6px) 50% 28% / 4px 4px no-repeat;
  box-shadow: inset 0 0 0 1.5px var(--c-blue-ink);
}
.n-notice p + p {
  margin-top: 6px;
}
/* Tonalités d'état : réussite, vérification, action en cours, annulation */
.n-notice.is-success,
.n-notice.is-paid {
  border-color: var(--c-success-line);
  background: linear-gradient(90deg, rgba(60, 207, 152, 0.08), transparent 60%), var(--c-sunken);
  color: #bdf2da;
}
.n-notice.is-success::before,
.n-notice.is-paid::before,
.n-notice.is-review::before,
.n-notice.is-sender::before,
.n-notice.is-cancelled::before {
  display: grid;
  place-items: center;
  box-shadow: none;
  font-size: 10.5px;
  font-weight: 800;
  line-height: 1;
}
.n-notice.is-success::before,
.n-notice.is-paid::before {
  content: "✓";
  background: var(--c-success);
  color: #052016;
}
.n-notice.is-review,
.n-notice.is-sender {
  border-color: var(--c-warning-line);
  background: linear-gradient(90deg, rgba(240, 180, 80, 0.08), transparent 60%), var(--c-sunken);
  color: #f6d496;
}
.n-notice.is-review::before,
.n-notice.is-sender::before {
  content: "!";
  background: var(--c-warning);
  color: #1d1303;
}
.n-notice.is-cancelled {
  border-color: var(--c-danger-line);
  background: var(--c-danger-soft);
  color: #ffb3bd;
}
.n-notice.is-cancelled::before {
  content: "×";
  background: var(--c-danger);
  color: #1a0509;
  font-size: 13px;
}
.n-notice.is-waiting::before,
.n-notice.is-received::before,
.n-notice.is-accounting::before {
  border-radius: 50%;
  background: none;
  box-shadow: none;
  border: 2px solid rgba(142, 176, 255, 0.25);
  border-top-color: var(--c-blue-ink);
  animation: n-spin 1s linear infinite;
}
.n-celebrate-small {
  width: 72px;
  height: 72px;
  margin: 0 auto 4px;
}
.n-notice strong {
  color: var(--c-ink);
}
.n-form-error,
.cm-error:not(:empty),
.r-error,
.nw-payment-error {
  position: relative;
  padding: 11px 14px 11px 40px;
  border: 1px solid var(--c-danger-line);
  border-radius: var(--r-md);
  background: var(--c-danger-soft);
  color: #ffb3bd;
  font-size: 13px;
  line-height: 1.55;
  animation: n-rise var(--d-3) var(--e-out);
}
.n-form-error::before,
.cm-error:not(:empty)::before,
.r-error::before {
  content: "!";
  position: absolute;
  left: 13px;
  top: 11px;
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--c-danger);
  color: #1a0509;
  font-size: 12px;
  font-weight: 800;
}
#page-error {
  margin-bottom: 16px;
}
.n-empty,
.h-empty,
.c-empty,
.n-comparison-empty {
  display: grid;
  justify-items: center;
  gap: 6px;
  padding: 34px 20px;
  border: 1px dashed var(--c-line-strong);
  border-radius: var(--r-lg);
  background:
    radial-gradient(circle at 50% 0%, rgba(46, 102, 245, 0.05), transparent 60%),
    transparent;
  color: var(--c-ink-3);
  font-size: 13px;
  text-align: center;
  line-height: 1.6;
}
.n-empty:not(:has(.n-empty-icon))::before,
.h-empty::before,
.c-empty::before {
  content: "";
  width: 34px;
  height: 34px;
  margin-bottom: 6px;
  border-radius: 10px;
  border: 1px solid var(--c-line-strong);
  background:
    linear-gradient(var(--c-ink-4), var(--c-ink-4)) 50% 40% / 14px 1.5px no-repeat,
    linear-gradient(var(--c-ink-4), var(--c-ink-4)) 50% 60% / 9px 1.5px no-repeat,
    var(--c-sunken);
}
.n-empty-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-bottom: 6px;
  border-radius: 12px;
  border: 1px solid var(--c-line-strong);
  background: var(--c-sunken);
  color: var(--c-ink-3);
  font-size: 16px;
}
.n-empty h3 {
  color: var(--c-ink);
  font-size: 14.5px;
  font-weight: 600;
}
.n-empty p {
  max-width: 48ch;
}
.n-error-state {
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 48px 20px;
  border: 1px solid var(--c-danger-line);
  border-radius: var(--r-lg);
  background: radial-gradient(circle at 50% 0%, rgba(242, 104, 124, 0.08), transparent 60%), var(--c-panel);
  text-align: center;
}
.n-error-state h3 {
  font-size: 16px;
}
.n-error-state p {
  max-width: 52ch;
  color: var(--c-ink-2);
}
.n-error-glyph {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: var(--c-danger-soft);
  box-shadow: inset 0 0 0 1px var(--c-danger-line);
  color: var(--c-danger);
  font-size: 20px;
  font-weight: 700;
}

/* 16 · Squelettes ------------------------------------------------------------------ */
.n-skeleton,
.n-sk {
  position: relative;
  height: 12px;
  border-radius: var(--r-sm);
  background: rgba(148, 163, 184, 0.075);
  overflow: hidden;
}
.n-skeleton.large {
  width: 42%;
  height: 26px;
}
.n-skeleton::after,
.n-sk::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(160, 185, 255, 0.07), transparent);
  animation: n-shimmer 1.7s var(--e-in-out) infinite;
}
@keyframes n-shimmer {
  to {
    transform: translateX(100%);
  }
}
.n-sk-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.n-sk-strip {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 1px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  background: var(--c-line-soft);
  overflow: hidden;
}
.n-sk-strip > div,
.n-sk-block {
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 20px;
  background: var(--c-panel);
}
.n-sk-block {
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
}
.n-sk-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.n-sk-chart {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 180px;
  padding-top: 12px;
}
.n-sk-chart span {
  flex: 1;
  border-radius: 3px 3px 0 0;
  background: rgba(148, 163, 184, 0.07);
}
.n-sk-lines {
  display: grid;
  gap: 0;
}
.n-sk-lines > div {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 18px;
  padding: 14px 0;
  border-bottom: 1px solid var(--c-line-soft);
}
.n-sk.w-20 {
  width: 20%;
}
.n-sk.w-30 {
  width: 30%;
}
.n-sk.w-45 {
  width: 45%;
}
.n-sk.w-60 {
  width: 60%;
}
.n-sk.h-big {
  height: 30px;
}
.n-sk.h-mid {
  height: 18px;
}
#page-content {
  position: relative;
  min-height: 240px;
  transition: opacity var(--d-2) linear;
}
#page-content.is-leaving {
  opacity: 0;
  transition-duration: var(--d-1);
}
#page-content.is-refreshing,
[aria-busy="true"].n-owner > div:last-child {
  opacity: 0.6;
  transition: opacity var(--d-2) linear;
}

/* 17 · Dialogues ------------------------------------------------------------------- */
dialog {
  color: var(--c-ink);
}
.n-dialog,
.r-dialog,
.h-decision {
  width: min(560px, calc(100% - 32px));
  max-height: calc(100dvh - 48px);
  padding: 26px;
  overflow: auto;
  border: 0;
  border-radius: var(--r-xl);
  background:
    radial-gradient(120% 70% at 50% -20%, rgba(46, 102, 245, 0.1), transparent 60%),
    var(--c-raised);
  box-shadow: var(--sh-dialog);
  scrollbar-width: thin;
}
.n-dialog > h2,
.r-dialog h2,
.h-decision h2 {
  font-size: 19px;
  font-weight: 620;
  letter-spacing: -0.02em;
}
.n-dialog > h2 + p,
.n-dialog > h2 + .n-hint {
  margin-top: 6px;
}
.n-dialog > * + * {
  margin-top: 14px;
}
.n-dialog .n-stack {
  margin-top: 18px;
}
dialog::backdrop {
  background: rgba(2, 3, 6, 0.74);
}
@media (min-width: 700px) {
  dialog::backdrop {
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }
}
/* Entrée/sortie natives (progressive : @starting-style) */
.n-dialog,
.r-dialog,
.h-decision,
.su-dialog,
.nw-dialog {
  opacity: 0;
  transform: translateY(14px) scale(0.975);
  transition:
    opacity var(--d-3) var(--e-out),
    transform var(--d-4) var(--e-spring),
    overlay var(--d-3) allow-discrete,
    display var(--d-3) allow-discrete;
}
.n-dialog[open],
.r-dialog[open],
.h-decision[open],
.su-dialog[open],
.nw-dialog[open] {
  opacity: 1;
  transform: none;
}
@starting-style {
  .n-dialog[open],
  .r-dialog[open],
  .h-decision[open],
  .su-dialog[open],
  .nw-dialog[open] {
    opacity: 0;
    transform: translateY(14px) scale(0.975);
  }
}
dialog::backdrop {
  opacity: 0;
  transition:
    opacity var(--d-3) linear,
    overlay var(--d-3) allow-discrete,
    display var(--d-3) allow-discrete;
}
dialog[open]::backdrop {
  opacity: 1;
}
@starting-style {
  dialog[open]::backdrop {
    opacity: 0;
  }
}
.n-dialog .n-buttons,
.r-dialog-actions {
  justify-content: flex-end;
  margin-top: 22px;
}
.n-op-dialog form > .n-button:last-of-type,
.n-op-dialog form > button:last-child {
  justify-self: start;
}
.n-op-dialog .n-stack > .n-button {
  justify-self: stretch;
}

/* 18 · Toasts ---------------------------------------------------------------------- */
#toast-root {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 2000;
  display: grid;
  justify-items: end;
  gap: 8px;
  max-width: min(440px, calc(100vw - 32px));
  pointer-events: none;
}
.n-toast {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
  min-width: 280px;
  padding: 13px 12px 15px 14px;
  border-radius: var(--r-lg);
  background: rgba(20, 25, 36, 0.97);
  box-shadow:
    0 24px 60px -18px rgba(0, 0, 0, 0.85),
    0 0 0 1px var(--c-line-strong);
  color: var(--c-ink);
  font-size: 13.5px;
  line-height: 1.5;
  overflow: hidden;
  pointer-events: auto;
  animation: n-toast-in var(--d-4) var(--e-spring) both;
}
.n-toast.is-leaving {
  animation: n-toast-out var(--d-2) var(--e-in) forwards;
}
.n-toast-icon {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  margin-top: -1px;
  border-radius: 50%;
  background: var(--c-blue-soft);
  color: var(--c-blue-ink);
  font-size: 12px;
  font-weight: 800;
}
.n-toast[data-type="success"] .n-toast-icon {
  background: var(--c-success-soft);
  color: var(--c-success);
  box-shadow: inset 0 0 0 1px var(--c-success-line);
}
.n-toast[data-type="error"] .n-toast-icon {
  background: var(--c-danger-soft);
  color: var(--c-danger);
  box-shadow: inset 0 0 0 1px var(--c-danger-line);
}
.n-toast[data-type="error"] {
  box-shadow:
    0 24px 60px -18px rgba(0, 0, 0, 0.85),
    0 0 0 1px var(--c-danger-line);
}
.n-toast-icon svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.n-toast[data-type="success"] .n-toast-icon path {
  stroke-dasharray: 20;
  stroke-dashoffset: 20;
  animation: n-draw 0.45s var(--e-out) 0.15s forwards;
}
.n-toast > button {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  margin: -2px -2px 0 0;
  border: 0;
  border-radius: var(--r-sm);
  background: transparent;
  color: var(--c-ink-3);
  font-size: 17px;
  line-height: 1;
}
.n-toast > button:hover {
  background: var(--c-hover);
  color: var(--c-ink);
}
.n-toast-timer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: currentColor;
  color: var(--c-blue-hi);
  transform-origin: 0 50%;
  opacity: 0.7;
  animation: n-toast-timer var(--toast-ms, 6000ms) linear forwards;
}
.n-toast[data-type="success"] .n-toast-timer {
  color: var(--c-success);
}
.n-toast[data-type="error"] .n-toast-timer {
  color: var(--c-danger);
}
.n-toast:hover .n-toast-timer {
  animation-play-state: paused;
}
@keyframes n-toast-in {
  from {
    opacity: 0;
    transform: translateY(16px) scale(0.96);
  }
}
@keyframes n-toast-out {
  to {
    opacity: 0;
    transform: translateY(8px) scale(0.98);
  }
}
@keyframes n-toast-timer {
  from {
    transform: scaleX(1);
  }
  to {
    transform: scaleX(0);
  }
}
@keyframes n-draw {
  to {
    stroke-dashoffset: 0;
  }
}

/* 19 · Barre mobile ------------------------------------------------------------------ */
.n-tabbar {
  display: none;
}

/* 20 · Connexion --------------------------------------------------------------------- */
.n-auth-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(420px, 0.92fr);
  min-height: 100dvh;
}
.n-auth-story {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
  padding: 40px clamp(28px, 5vw, 72px);
  overflow: hidden;
  border-right: 1px solid var(--c-line-soft);
  background:
    radial-gradient(70% 60% at 85% 10%, rgba(46, 102, 245, 0.16), transparent 70%),
    linear-gradient(180deg, #070a10, #04060a);
  isolation: isolate;
}
.n-auth-art {
  position: absolute;
  inset: auto -2% 0 -2%;
  z-index: -1;
  height: 44%;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%);
  mask-image: linear-gradient(180deg, transparent, #000 30%);
}
.n-auth-art svg {
  width: 100%;
  height: 100%;
}
.n-auth-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.n-auth-top .n-logo {
  padding: 0;
}
.n-auth-story h1 {
  max-width: 13ch;
  font-size: clamp(38px, 4.6vw, 64px);
  font-weight: 640;
  letter-spacing: -0.045em;
  line-height: 1.02;
}
.n-auth-story h1 em {
  font-style: normal;
  color: transparent;
  background: linear-gradient(90deg, #9ec0ff, #4d84ff);
  -webkit-background-clip: text;
  background-clip: text;
}
.n-auth-story > div > p:not(.n-overline) {
  max-width: 46ch;
  margin-top: 20px;
  color: var(--c-ink-2);
  font-size: 15.5px;
  line-height: 1.65;
}
.n-auth-points {
  display: grid;
  gap: 0;
  max-width: 440px;
  margin-top: 34px;
  border-top: 1px solid var(--c-line-soft);
}
.n-auth-points p {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 13px 0;
  border-bottom: 1px solid var(--c-line-soft);
  color: var(--c-ink);
  font-size: 14px;
}
.n-point {
  color: var(--c-blue-ink);
  font: 600 11px var(--f-mono);
  letter-spacing: 0.06em;
}
.n-auth-story > .n-hint {
  max-width: 46ch;
}
.n-auth-form {
  display: grid;
  place-items: center;
  padding: 40px clamp(20px, 4vw, 56px);
}
.n-auth-box {
  width: min(420px, 100%);
  display: grid;
  gap: 16px;
}
.n-auth-box > .n-overline {
  margin: 0;
  color: var(--c-blue-ink);
}
.n-auth-title {
  font-size: 26px;
  font-weight: 620;
  letter-spacing: -0.03em;
}
.n-auth-box > .n-description {
  margin-top: -6px;
}
.n-auth-box form,
.n-auth-box > section {
  margin-top: 6px;
}
.n-auth-box form .n-button.primary,
.n-auth-box form .n-button.subtle {
  width: 100%;
  min-height: 42px;
}
.n-auth-box .n-input {
  min-height: 42px;
}
.n-auth-box #registration-actions {
  padding-top: 16px;
  border-top: 1px solid var(--c-line-soft);
}
.n-auth-box #registration-actions .n-button {
  width: 100%;
}
.n-auth-box #recovery-panel,
.n-auth-box #pending-panel {
  display: grid;
  gap: 12px;
}
.n-auth-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--c-line-soft);
  color: var(--c-ink-3);
  font-size: 11.5px;
}
.n-auth-foot::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--c-success);
  box-shadow: 0 0 0 3px var(--c-success-soft);
}
.n-auth-box form[hidden],
.n-auth-box section[hidden] {
  display: none !important;
}
.n-auth-box > form:not([hidden]),
.n-auth-box > section:not([hidden]) {
  animation: n-rise var(--d-4) var(--e-out);
}

/* 21 · Espace éditeur ------------------------------------------------------------------ */
.n-status-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  min-height: 36px;
}
.n-status-row .n-button {
  min-height: 32px;
}
.n-ledger-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, 1fr);
  gap: 0;
  padding: 0;
  overflow: hidden;
  background:
    radial-gradient(90% 120% at 0% 0%, rgba(46, 102, 245, 0.14), transparent 55%),
    var(--c-panel);
  border-color: rgba(84, 134, 255, 0.22);
}
.n-ledger-main {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  padding: 24px 26px 22px;
}
.n-ledger-main > .n-owner-kpi {
  padding: 0;
  background: transparent;
  gap: 8px;
}
.n-ledger-main > .n-owner-kpi .n-owner-value {
  font-size: clamp(38px, 4.4vw, 56px);
  font-weight: 620;
  letter-spacing: -0.045em;
  line-height: 1.02;
}
.n-ledger-main > .n-owner-kpi .n-label {
  color: var(--c-ink-2);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.n-ledger-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-top: 10px;
  border-top: 1px solid var(--c-line-soft);
}
.n-ledger-strip > .n-owner-kpi {
  padding: 14px 18px 2px 0;
  background: transparent;
}
.n-ledger-strip > .n-owner-kpi + .n-owner-kpi {
  padding-left: 18px;
  border-left: 1px solid var(--c-line-soft);
}
.n-ledger-strip .n-owner-value {
  font-size: 22px;
}
.n-ledger-periods {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  padding: 24px 24px 22px;
  border-left: 1px solid var(--c-line-soft);
  background: rgba(3, 5, 8, 0.35);
}
.n-ledger-periods > h2 {
  margin-bottom: 8px;
  color: var(--c-ink-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.n-ledger-periods > .n-button {
  align-self: flex-start;
  margin-top: auto;
}
.n-publisher-summary-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--c-line-soft);
  font-size: 13px;
}
.n-publisher-summary-row:last-of-type {
  border-bottom: 0;
}
.n-publisher-summary-row span {
  color: var(--c-ink-2);
}
.n-publisher-summary-row strong {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  text-align: right;
}
.n-ledger-periods .n-publisher-summary-row strong {
  font-size: 15px;
}
.n-ledger-periods .n-publisher-summary-row:last-of-type {
  margin-bottom: 14px;
}
.n-publisher-money-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 16px;
}
.n-publisher-money-grid > .n-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.n-publisher-money-grid > .n-card > .n-button {
  align-self: flex-start;
  margin-top: 16px;
}
.n-publisher-money-grid .n-owner-value {
  margin-top: 14px;
}
.n-vault {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent 40%),
    var(--c-panel);
}
.n-vault > h2::before,
.n-paycard > h2::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 9px 2px 0;
  border-radius: 50%;
  background: var(--c-ink);
}
.n-paycard > h2::before {
  border-radius: 1px;
  transform: rotate(45deg);
  background: var(--c-success);
}
.n-vault .n-owner-value {
  font-size: 36px;
}
.n-vault > .n-hint {
  margin-top: 6px;
}
.n-vault .n-publisher-summary-row {
  margin-top: 10px;
  border-top: 1px solid var(--c-line-soft);
  border-bottom: 0;
}
.n-publisher-payment-date {
  display: block;
  margin-top: 14px;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: -0.025em;
}
.n-paycard .n-publisher-summary-row:first-of-type {
  margin-top: 10px;
  border-top: 1px solid var(--c-line-soft);
}
.n-next-action {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 16px 20px;
  border-color: rgba(240, 180, 80, 0.22);
  background:
    linear-gradient(90deg, rgba(240, 180, 80, 0.07), transparent 50%),
    var(--c-panel);
}
.n-next-action h2 {
  font-size: 14.5px;
}
.n-next-action .n-hint {
  margin-top: 2px;
}
.n-next-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.n-next-steps a,
.n-next-steps span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid var(--c-line-strong);
  border-radius: var(--r-pill);
  background: var(--c-sunken);
  color: var(--c-ink);
  font-size: 12.5px;
  font-weight: 550;
  text-decoration: none;
  transition:
    border-color var(--d-1) linear,
    background-color var(--d-1) linear;
}
.n-next-steps a::after {
  content: "→";
  color: var(--c-blue-ink);
}
.n-next-steps a:hover {
  border-color: var(--c-blue-line);
  background: var(--c-blue-soft);
}
.n-ring {
  position: relative;
  width: 52px;
  height: 52px;
  flex: 0 0 auto;
}
.n-ring svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.n-ring circle {
  fill: none;
  stroke-width: 4;
}
.n-ring .n-ring-track {
  stroke: var(--c-line);
}
.n-ring .n-ring-value {
  stroke: var(--c-warning);
  stroke-linecap: round;
  transition: stroke-dashoffset var(--d-5) var(--e-out);
}
.n-ring b {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 12.5px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.n-publisher-main-grid {
  display: block;
}
.n-owner-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr);
  gap: 16px;
  align-items: start;
}
.n-publisher-home > .n-owner-daily .n-publisher-summary-row {
  max-width: 640px;
}
/* Smartlinks */
.n-publisher-links .n-card > .n-buttons {
  margin-top: 14px;
}
.n-link-create {
  border-color: rgba(84, 134, 255, 0.26);
  background:
    radial-gradient(80% 140% at 0% 0%, rgba(46, 102, 245, 0.12), transparent 60%),
    var(--c-panel);
}
.n-link-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 10px;
  margin: 16px 0 10px;
}
.n-link-form .n-field > span {
  color: var(--c-ink-2);
  font-size: 12.5px;
  font-weight: 550;
}
.n-link-form .n-input {
  min-height: 42px;
}
.n-link-form .n-button {
  min-height: 42px;
}
.n-link-form .n-form-error {
  grid-column: 1 / -1;
}
.n-link-create > .n-button {
  margin-top: 12px;
}
.n-op-payment-list {
  display: grid;
  gap: 10px;
}
.n-op-smartlink {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px 18px;
  padding: 16px 18px;
  transition:
    border-color var(--d-2) linear,
    transform var(--d-3) var(--e-out);
}
.n-op-smartlink:hover {
  border-color: var(--c-line-strong);
}
.n-op-smartlink > div {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 8px 12px;
  min-width: 0;
}
.n-op-smartlink > div > strong {
  font-size: 14px;
  font-weight: 600;
}
.n-op-smartlink > div > .n-badge {
  justify-self: start;
}
.n-op-smartlink > div > .n-input,
.n-op-smartlink > div > .n-hint {
  grid-column: 1 / -1;
}
.n-op-smartlink .n-input.n-code {
  min-height: 36px;
  text-overflow: ellipsis;
  color: #c9d8f5;
  cursor: text;
}
.n-link-ready {
  text-align: left;
}
.n-link-ready h2 {
  font-size: 22px;
}
.n-link-ready .n-input {
  margin-top: 6px;
}
.n-success-mark {
  display: block;
  width: 56px;
  height: 56px;
  margin-bottom: 4px;
}
/* Paiements éditeur */
.n-op-payment-config {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 16px;
  align-items: start;
}
.n-op-payment-config > .n-card > * + * {
  margin-top: 16px;
}
.n-weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}
.n-weekday {
  position: relative;
  display: block;
  cursor: pointer;
}
.n-weekday input {
  position: absolute;
  opacity: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}
.n-weekday span {
  display: grid;
  place-items: center;
  height: 52px;
  border: 1px solid var(--c-line-strong);
  border-radius: var(--r-md);
  background: var(--c-sunken);
  color: var(--c-ink-2);
  font-size: 12px;
  font-weight: 600;
  transition:
    background-color var(--d-2) linear,
    border-color var(--d-2) linear,
    color var(--d-2) linear,
    transform var(--d-3) var(--e-spring);
}
.n-weekday:hover span {
  border-color: rgba(148, 163, 184, 0.34);
  color: var(--c-ink);
}
.n-weekday input:checked + span {
  border-color: var(--c-blue-hi);
  background: linear-gradient(180deg, rgba(64, 120, 255, 0.28), rgba(46, 102, 245, 0.14));
  color: #fff;
  box-shadow: 0 0 0 3px rgba(46, 102, 245, 0.14);
  transform: translateY(-1px);
}
.n-weekday input:focus-visible + span {
  outline: 2px solid var(--c-blue-hi);
  outline-offset: 2px;
}
.n-op-mini-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1px;
  border: 1px solid var(--c-line-soft);
  border-radius: var(--r-md);
  background: var(--c-line-soft);
  overflow: hidden;
}
.n-op-pair {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 11px 13px;
  background: var(--c-sunken);
}
.n-op-pair > span {
  color: var(--c-ink-3);
  font-size: 11.5px;
  font-weight: 500;
}
.n-op-pair > strong {
  color: var(--c-ink);
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.n-op-pair > small {
  font-size: 11.5px;
}
.n-wallet-summary {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.025), transparent 50%),
    var(--c-sunken);
}
.n-wallet-summary > strong {
  font-size: 14px;
}
.n-wallet-summary > .n-badge {
  justify-self: start;
}
.n-wallet-summary > .n-code {
  margin: 0;
}
/* Les tuiles pilotent la valeur du menu : on ne montre qu'une seule commande. */
.n-op-wallet-edit #wallet-currency {
  display: none;
}
.n-op-crypto-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
  gap: 8px;
  margin-top: 4px;
}
.n-op-crypto {
  display: grid;
  gap: 2px;
  justify-items: start;
  padding: 11px 12px;
  border: 1px solid var(--c-line-strong);
  border-radius: var(--r-md);
  background: var(--c-sunken);
  color: var(--c-ink);
  text-align: left;
  transition:
    border-color var(--d-1) linear,
    background-color var(--d-1) linear,
    transform var(--d-3) var(--e-spring);
}
.n-op-crypto strong {
  font-size: 14px;
  font-weight: 650;
}
.n-op-crypto small {
  color: var(--c-ink-3);
  font-size: 11px;
}
.n-op-crypto:hover:not(:disabled) {
  border-color: rgba(148, 163, 184, 0.36);
}
.n-op-crypto[aria-pressed="true"] {
  border-color: var(--c-blue-hi);
  background: linear-gradient(180deg, rgba(64, 120, 255, 0.2), rgba(46, 102, 245, 0.08));
  box-shadow: 0 0 0 3px rgba(46, 102, 245, 0.12);
}
.n-op-crypto[aria-pressed="true"] small {
  color: var(--c-blue-ink);
}
.n-op-crypto:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.n-op-wallet-edit {
  border-top: 1px solid var(--c-line-soft);
  padding-top: 14px;
}
.n-op-wallet-edit[open] > summary {
  margin-bottom: 16px;
}
.n-op-wallet-edit form {
  padding: 16px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  background: var(--c-sunken);
}
.n-op-conversion-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0 12px;
}
.n-op-conversion {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  background: var(--c-sunken);
}
.n-op-conversion .n-button {
  align-self: flex-start;
  margin-top: auto;
}

/* 22 · Opérations administrateur ---------------------------------------------------------- */
.n-tower {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 16px;
  align-items: start;
}
.n-tower-main,
.n-tower-side {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}
.n-tower-side {
  position: sticky;
  top: calc(var(--header-h) + 16px);
}
.n-op-shortcuts {
  display: grid;
  gap: 1px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  background: var(--c-line-soft);
  overflow: hidden;
}
.n-op-shortcuts > h2 {
  padding: 14px 16px 10px;
  background: var(--c-panel);
  color: var(--c-ink-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.n-op-shortcut {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2px 12px;
  padding: 14px 16px;
  border: 0;
  border-radius: 0;
  background: var(--c-panel);
  color: var(--c-ink);
  isolation: isolate;
  overflow: hidden;
  transition: background-color var(--d-1) linear;
}
.n-op-shortcut:hover {
  background: var(--c-raised);
  text-decoration: none;
}
.n-op-shortcut > span {
  color: var(--c-ink-2);
  font-size: 13px;
}
.n-op-shortcut > strong {
  grid-row: span 2;
  font-size: 22px;
  font-weight: 620;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
}
.n-op-shortcut > small {
  color: var(--c-blue-ink);
  font-size: 12px;
  transition: transform var(--d-3) var(--e-out);
}
.n-op-shortcut:hover > small {
  transform: translateX(3px);
}
.n-op-shortcut[data-attention="true"] > strong {
  color: var(--c-warning);
}
.n-op-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.n-op-account-grid {
  display: grid;
  gap: 0;
}
.n-op-attestation {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  background: var(--c-sunken);
  color: var(--c-ink-2);
  font-size: 13px;
  line-height: 1.5;
  cursor: pointer;
}
.n-op-attestation input {
  margin-top: 2px;
}
.n-op-attestation:has(input:checked) {
  border-color: var(--c-blue-line);
  background: var(--c-blue-soft);
  color: var(--c-ink);
}
.n-op-payment-amount {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 12px;
}
.n-op-payment-amount strong {
  font-size: 24px;
  font-weight: 620;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
}
/* Liste des comptes : registre dense */
.n-ledger-table {
  display: grid;
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  background: var(--c-panel);
  overflow: hidden;
}
.n-ledger-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.8fr) 132px repeat(4, minmax(104px, 1fr));
  align-items: center;
  gap: 10px 16px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--c-line-soft);
  font-size: 13px;
  transition: background-color var(--d-1) linear;
}
.n-ledger-row > .n-ledger-actions {
  grid-column: 1 / -1;
  justify-content: flex-start;
  padding-left: 43px;
}
.n-ledger-head > :last-child {
  display: none;
}
.n-ledger-row:last-child {
  border-bottom: 0;
}
.n-ledger-row:not(.n-ledger-head):hover {
  background: var(--c-hover);
}
.n-ledger-head {
  padding-top: 10px;
  padding-bottom: 10px;
  background: var(--c-raised);
  color: var(--c-ink-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.n-ledger-row > .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.n-ledger-who {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 0 11px;
  min-width: 0;
}
.n-ledger-who::before {
  content: attr(data-initial);
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: var(--c-raised);
  box-shadow: inset 0 0 0 1px var(--c-line);
  color: var(--c-ink-2);
  font-weight: 650;
  font-size: 12.5px;
}
.n-ledger-who strong {
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.n-ledger-who small {
  color: var(--c-ink-3);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.n-ledger-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}
.n-ledger-actions .n-button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 12.5px;
}
.n-ledger-row .n-hint {
  grid-column: 3 / -1;
}
/* Paiements administrateur : cartes d'opérations */
.n-operations:not(.n-publisher-links) .n-op-payment-list {
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 12px;
}
.n-operations:not(.n-publisher-links) .n-op-payment-list > .n-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.n-operations:not(.n-publisher-links) .n-op-payment-list > .n-card > h2 + .n-hint {
  margin-top: -6px;
}
.n-operations:not(.n-publisher-links) .n-op-payment-list > .n-card > .n-badge {
  align-self: flex-start;
}
.n-operations:not(.n-publisher-links) .n-op-payment-list > .n-card > .n-button {
  align-self: stretch;
}
.n-operations:not(.n-publisher-links) .n-op-payment-list > .n-card > .n-button.primary:last-child {
  margin-top: 4px;
}
.n-payment-overdue {
  border-color: var(--c-danger-line);
  background:
    linear-gradient(180deg, rgba(242, 104, 124, 0.07), transparent 40%),
    var(--c-panel);
}
.n-operations > .n-field {
  max-width: 420px;
}

/* 23 · Statistiques --------------------------------------------------------------------- */
.n-owner-toolbar {
  position: sticky;
  top: calc(var(--header-h) + 8px);
  z-index: 12;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 6px;
  border: 1px solid var(--c-line);
  border-radius: 12px;
  background: rgba(10, 13, 19, 0.88);
  box-shadow: 0 12px 30px -18px rgba(0, 0, 0, 0.9);
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .n-owner-toolbar {
    background: rgba(10, 13, 19, 0.72);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }
}
.n-owner-toolbar .n-owner-periods {
  border: 0;
  background: transparent;
  padding: 0;
}
.n-owner-toolbar > .n-button:first-of-type {
  margin-left: auto;
}
.n-owner-toolbar > .n-button {
  min-height: 32px;
}
.n-owner-custom {
  align-self: flex-start;
}
.n-owner-custom > summary {
  justify-content: flex-start;
  color: var(--c-ink-2);
  font-size: 12.5px;
}
.n-owner-custom-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}
.n-owner-custom-form .n-input {
  width: auto;
}
.n-owner-selected-period {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--c-ink-2);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.n-owner-selected-period::before {
  content: "";
  width: 18px;
  height: 1px;
  background: var(--c-ink-4);
}
.n-owner-links {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px;
}
.n-owner-link {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  background: var(--c-sunken);
}
.n-owner-link-head {
  display: flex;
  align-items: center;
  gap: 10px;
}
.n-owner-link h3 {
  font-size: 14px;
  overflow-wrap: anywhere;
}
.n-owner-color {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  flex: 0 0 auto;
}
.n-owner-link .n-label {
  margin-top: 2px;
  font-size: 11.5px;
  color: var(--c-ink-3);
}
.n-owner-link time,
.n-owner-link > strong {
  font-size: 15px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.n-owner-link-address {
  width: 100%;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-sm);
  background: var(--c-canvas);
  color: #c9d8f5;
  font: 12px var(--f-mono);
  text-overflow: ellipsis;
}
.n-owner-link-values {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}
.n-owner-link-values dt {
  color: var(--c-ink-3);
  font-size: 11px;
}
.n-owner-link-values dd {
  margin: 2px 0 0;
  font-size: 13.5px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.n-owner-link .n-button {
  align-self: flex-start;
  margin-top: auto;
}
.n-owner-share {
  display: grid;
  gap: 7px;
  padding: 12px 0;
  border-bottom: 1px solid var(--c-line-soft);
}
.n-owner-share:last-child {
  border-bottom: 0;
}
.n-owner-share-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 13px;
}
.n-owner-share-head strong {
  font-variant-numeric: tabular-nums;
}
.n-owner-share-track {
  height: 6px;
  border-radius: 6px;
  background: var(--c-line-soft);
  overflow: hidden;
}
.n-owner-share-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  transform-origin: 0 50%;
}
.n-owner-daily {
  padding: 16px 20px;
}
.n-owner-daily[open] > summary {
  margin-bottom: 14px;
}
.n-owner-daily .n-table-wrap {
  max-height: 520px;
}
.n-owner-daily > .n-hint {
  margin-top: 12px;
}
.n-owner-panel > .n-button {
  margin-top: 14px;
}
.n-owner-panel > .n-owner-value {
  margin-top: 14px;
}

/* 24 · Comparaison horaire ------------------------------------------------------------------ */
.n-comparison {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}
.n-comparison-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
}
.n-comparison-head h2 {
  margin-top: 4px;
  font-size: 18px;
  letter-spacing: -0.02em;
}
.n-comparison-head .n-hint {
  margin-top: 4px;
}
.n-comparison-eyebrow {
  color: var(--c-blue-ink);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.13em;
}
.n-comparison-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(0, 1.3fr);
  gap: 1px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  background: var(--c-line-soft);
  overflow: hidden;
}
.n-comparison-summary > div {
  display: grid;
  gap: 4px;
  align-content: start;
  padding: 16px 18px;
  background: var(--c-panel);
}
.n-comparison-value {
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
}
.n-comparison-status > span {
  color: var(--c-ink-3);
  font-size: 12.5px;
}
.n-comparison-status[data-direction="up"] > strong {
  color: var(--c-success);
}
.n-comparison-status[data-direction="down"] > strong {
  color: var(--c-danger);
}
.n-comparison-status > strong:not(.n-comparison-value) {
  font-size: 14px;
  font-weight: 600;
}
.n-comparison-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.n-comparison-card > h3 {
  font-size: 14px;
}
.n-comparison-card > .n-hint {
  margin-top: 3px;
}
.n-comparison-legend {
  display: flex;
  gap: 16px;
  margin-top: 12px;
  font-size: 12px;
  color: var(--c-ink-2);
}
.n-comparison-legend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.n-comparison-legend span::before {
  content: "";
  width: 14px;
  height: 2px;
  border-radius: 2px;
}
.n-comparison-today::before {
  background: var(--c-today);
}
.n-comparison-yesterday::before {
  background: var(--c-yesterday);
}
.n-comparison-plot {
  position: relative;
  min-height: 200px;
  margin-top: 8px;
}
.n-comparison-line {
  fill: none;
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.n-comparison-line.n-comparison-today {
  stroke: var(--c-today);
}
.n-comparison-line.n-comparison-yesterday {
  stroke: var(--c-yesterday);
  opacity: 0.85;
}
.n-comparison-dot.n-comparison-today,
.n-comparison-bar.n-comparison-today {
  fill: var(--c-today);
}
.n-comparison-dot.n-comparison-yesterday,
.n-comparison-bar.n-comparison-yesterday {
  fill: var(--c-yesterday);
}
.n-comparison-dot {
  stroke: var(--c-panel);
  stroke-width: 2;
}
.n-comparison-target {
  cursor: pointer;
  outline: none;
}
.n-comparison-target:hover .n-comparison-dot,
.n-comparison-target:focus-visible .n-comparison-dot,
.n-comparison-target[aria-pressed="true"] .n-comparison-dot {
  r: 6;
}
.n-comparison-target:focus-visible circle:first-child {
  stroke: var(--c-blue-hi);
  stroke-width: 2;
}
.n-comparison-target[aria-pressed="true"] .n-comparison-bar {
  stroke: #fff;
  stroke-width: 1;
}
.n-comparison-inspector {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--c-line-soft);
  border-radius: var(--r-md);
  background: var(--c-sunken);
}
.n-comparison-prompt {
  color: var(--c-ink-3);
  font-size: 12.5px;
}
.n-comparison-inspector-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.n-comparison-inspector-head h4 {
  margin-top: 3px;
  font-size: 14px;
}
.n-comparison-clear {
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: var(--r-sm);
  background: transparent;
  color: var(--c-ink-3);
  font-size: 17px;
  line-height: 1;
}
.n-comparison-clear:hover {
  background: var(--c-hover);
  color: var(--c-ink);
}
.n-comparison-detail-table {
  display: grid;
  border-top: 1px solid var(--c-line-soft);
}
.n-comparison-detail-row {
  display: grid;
  grid-template-columns: minmax(90px, 1fr) repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: center;
  padding: 9px 0;
  border-bottom: 1px solid var(--c-line-soft);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.n-comparison-detail-row > :not(:first-child) {
  text-align: right;
}
.n-comparison-detail-heading {
  color: var(--c-ink-3);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.n-comparison-detail-delta {
  display: grid;
  justify-items: end;
}
.n-comparison-detail-delta small {
  color: var(--c-ink-3);
  font-size: 11px;
}
.n-comparison-detail-delta[data-direction="up"] strong {
  color: var(--c-success);
}
.n-comparison-detail-delta[data-direction="down"] strong {
  color: var(--c-danger);
}
.n-comparison-observations {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  margin-top: 10px;
  color: var(--c-ink-3);
  font-size: 11.5px;
}
.n-comparison-detail-note,
.n-comparison-note {
  margin-top: 8px;
  color: var(--c-ink-3);
  font-size: 12px;
  line-height: 1.55;
}
.n-comparison-detail-missing {
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: var(--r-sm);
  background: var(--c-warning-soft);
  color: #f3cd8a;
  font-size: 12px;
}
.n-comparison-empty {
  min-height: 190px;
  align-content: center;
}
.n-comparison-empty span {
  color: var(--c-ink-2);
  font-weight: 550;
}
.n-comparison-empty small {
  color: var(--c-ink-3);
}
.n-comparison-empty::before {
  content: "";
  width: 120px;
  height: 34px;
  margin-bottom: 8px;
  background:
    linear-gradient(90deg, var(--c-line-strong) 0 6px, transparent 6px 12px) 0 100% / 12px 1px repeat-x,
    linear-gradient(var(--c-line-soft), var(--c-line-soft)) 0 0 / 100% 1px no-repeat;
}
.n-owner-intraday > .n-card:first-of-type .n-comparison-detail-row {
  grid-template-columns: minmax(90px, 1fr) repeat(2, minmax(0, 1fr)) 0;
}

/* 25 · Motion -------------------------------------------------------------------------- */
@keyframes n-rise {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
}
@keyframes n-rise-x {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }
}
@keyframes n-fade {
  from {
    opacity: 0;
  }
}
@keyframes n-scan-enter {
  0% {
    opacity: 1;
    transform: scaleX(0);
  }
  70% {
    opacity: 1;
    transform: scaleX(1);
  }
  100% {
    opacity: 0;
    transform: scaleX(1);
  }
}
/* Entrée en scène (une fois par session) */
.is-entering .n-logo {
  animation: n-fade var(--d-4) var(--e-out) both;
}
.is-entering .n-nav > * {
  animation: n-rise-x var(--d-4) var(--e-out) both;
  animation-delay: calc(60ms + var(--i, 0) * 22ms);
}
.is-entering .n-nav-indicator {
  transition-delay: 380ms;
}
.is-entering .n-sidebar-foot {
  animation: n-fade var(--d-5) var(--e-out) 420ms both;
}
.is-entering .n-header > * {
  animation: n-fade var(--d-4) var(--e-out) 80ms both;
}
.is-entering .n-scanline i {
  animation: n-scan-enter 1.05s var(--e-in-out) 60ms both;
  background: linear-gradient(90deg, transparent, var(--c-blue-hi) 12%, #a9c6ff 88%, rgba(169, 198, 255, 0));
}
.is-entering .n-page-head > div > * {
  animation: n-rise var(--d-5) var(--e-out) both;
}
.is-entering .n-page-head .n-overline {
  animation-delay: 120ms;
}
.is-entering .n-page-head h1 {
  animation-delay: 170ms;
}
.is-entering .n-page-head .n-description {
  animation-delay: 230ms;
}
.is-entering .n-page-head #refresh {
  animation: n-fade var(--d-5) var(--e-out) 300ms both;
}
/* Interaction de carte : léger soulèvement pour les éléments cliquables */
@media (hover: hover) and (pointer: fine) {
  a.n-card:hover,
  .n-op-crypto:hover:not(:disabled),
  .n-owner-link:hover {
    transform: translateY(-1px);
  }
  .n-owner-link {
    transition:
      transform var(--d-3) var(--e-out),
      border-color var(--d-2) linear;
  }
  .n-owner-link:hover {
    border-color: var(--c-line-strong);
  }
}
/* Célébration : sceau dessiné + rayons, une seule fois */
.n-celebrate {
  position: relative;
  display: grid;
  place-items: center;
  width: 132px;
  height: 132px;
  margin: 0 auto;
}
.n-celebrate svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}
.n-celebrate .n-cel-ring {
  fill: none;
  stroke: url(#n-cel-gradient);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: n-draw 0.9s var(--e-out) 0.1s forwards;
}
.n-celebrate .n-cel-disc {
  fill: rgba(60, 207, 152, 0.08);
  transform-origin: 50% 50%;
  transform-box: fill-box;
  animation: n-cel-disc 0.7s var(--e-spring) 0.35s both;
}
.n-celebrate .n-cel-check {
  fill: none;
  stroke: #b5f3d6;
  stroke-width: 5;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: n-draw 0.5s var(--e-out) 0.6s forwards;
}
.n-celebrate .n-cel-ray {
  stroke: #9ec0ff;
  stroke-width: 1.5;
  stroke-linecap: round;
  opacity: 0;
  transform-origin: 66px 66px;
  animation: n-cel-ray 1.1s var(--e-out) 0.75s both;
}
.n-celebrate .n-cel-ray:nth-child(even) {
  stroke: #7ce6b6;
  animation-delay: 0.82s;
}
.n-celebrate .n-cel-halo {
  fill: none;
  stroke: rgba(124, 230, 182, 0.4);
  stroke-width: 1;
  transform-origin: 66px 66px;
  opacity: 0;
  animation: n-cel-halo 1.4s var(--e-out) 0.7s both;
}
@keyframes n-cel-disc {
  from {
    transform: scale(0.4);
    opacity: 0;
  }
}
@keyframes n-cel-ray {
  0% {
    opacity: 0;
    stroke-dasharray: 0 40;
    stroke-dashoffset: 0;
  }
  35% {
    opacity: 1;
    stroke-dasharray: 10 40;
  }
  100% {
    opacity: 0;
    stroke-dasharray: 2 40;
    stroke-dashoffset: -16;
  }
}
@keyframes n-cel-halo {
  0% {
    opacity: 0.9;
    transform: scale(0.85);
  }
  100% {
    opacity: 0;
    transform: scale(1.45);
  }
}
.n-sheen {
  position: relative;
  overflow: hidden;
}
.n-sheen::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, 0.14) 50%, transparent 70%);
  transform: translateX(-120%);
  animation: n-sheen 1.3s var(--e-in-out) 1s forwards;
  pointer-events: none;
}
@keyframes n-sheen {
  to {
    transform: translateX(120%);
  }
}

/* 26 · Responsive -------------------------------------------------------------------------- */
@media (max-width: 1240px) {
  .n-tower {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-tower-side {
    position: static;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  }
  .n-ledger-row {
    grid-template-columns: minmax(190px, 1.6fr) 120px repeat(4, minmax(92px, 0.8fr));
  }
}
@media (max-width: 1100px) {
  :root {
    --gutter: 24px;
  }
  .n-owner-main-grid,
  .n-op-payment-config,
  .n-ledger-hero {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-ledger-periods {
    border-left: 0;
    border-top: 1px solid var(--c-line-soft);
  }
  .n-owner-kpis:has(> :nth-child(3):last-child) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .n-owner-kpis:has(> :nth-child(3):last-child) > .n-owner-kpi-primary {
    grid-column: auto;
  }
  .n-comparison-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 900px) {
  :root {
    --sidebar-w: 0px;
  }
  .n-shell {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(320px, 86vw);
    height: 100dvh;
    z-index: 200;
    padding-top: calc(18px + env(safe-area-inset-top));
    padding-bottom: calc(14px + env(safe-area-inset-bottom));
    background: var(--c-panel);
    border-right: 1px solid var(--c-line);
    box-shadow: 30px 0 80px -20px rgba(0, 0, 0, 0.8);
    transform: translateX(-104%);
    visibility: hidden;
    transition:
      transform var(--d-4) var(--e-out),
      visibility 0s linear var(--d-4);
  }
  .n-sidebar[data-open="true"] {
    transform: none;
    visibility: visible;
    transition:
      transform var(--d-4) var(--e-out),
      visibility 0s;
  }
  .n-sidebar[data-open="true"] .n-nav > * {
    animation: n-rise-x var(--d-4) var(--e-out) both;
    animation-delay: calc(40ms + var(--i, 0) * 16ms);
  }
  .n-sidebar + #page-shell::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 150;
    background: rgba(2, 3, 6, 0.7);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--d-3) linear;
  }
  .n-sidebar[data-open="true"] + #page-shell::after {
    opacity: 1;
  }
  .n-button.n-menu-button {
    display: inline-flex;
  }
  .n-header .n-menu-button {
    width: 36px;
    padding: 0;
  }
  .n-utc {
    display: none;
  }
  .n-owner-kpis:has(> :nth-child(3):last-child),
  .n-metrics,
  .n-owner-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .n-owner-kpis > .n-owner-kpi-primary,
  .n-owner-kpis:has(> :nth-child(3):last-child) > .n-owner-kpi-primary {
    grid-column: 1 / -1;
  }
  .n-auth-layout {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-auth-story {
    min-height: auto;
    padding: 24px 20px 30px;
    gap: 24px;
    border-right: 0;
    border-bottom: 1px solid var(--c-line-soft);
  }
  .n-auth-story h1 {
    font-size: 36px;
    max-width: 16ch;
  }
  .n-auth-points,
  .n-auth-story > .n-hint {
    display: none;
  }
  .n-auth-art {
    height: 100%;
    opacity: 0.6;
  }
  .n-auth-form {
    place-items: start center;
    padding: 28px 20px 48px;
  }
}
@media (max-width: 720px) {
  :root {
    --gutter: 16px;
    --header-h: 52px;
  }
  body {
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
  }
  .n-auth-layout,
  .h-marketing {
    padding-bottom: 0;
  }
  body:not([data-space]) {
    padding-bottom: 0;
  }
  .n-header {
    gap: 10px;
  }
  .n-header .n-button.n-menu-button {
    display: none;
  }
  .n-header-actions .n-badge,
  #logout .n-label-text {
    display: none;
  }
  #logout {
    padding: 0 10px;
  }
  .n-admin-strip {
    font-size: 10px;
    letter-spacing: 0.05em;
  }
  .n-page-head {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    padding: 22px 0 16px;
  }
  .n-page-head h1 {
    font-size: 24px;
  }
  .n-description {
    font-size: 13.5px;
  }
  .n-page-head {
    position: relative;
  }
  .n-page-head #refresh {
    position: absolute;
    top: 14px;
    right: 0;
    min-height: 32px;
    padding: 0 10px;
  }
  .n-page-head .n-overline {
    padding-right: 120px;
  }
  .n-card {
    padding: 16px;
  }
  .n-grid,
  .n-publisher-money-grid,
  .n-op-conversion-grid,
  .n-sk-row {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-metric,
  .n-owner-kpi {
    padding: 14px 14px 13px;
  }
  .n-value,
  .n-owner-value {
    font-size: 21px;
  }
  .n-owner-kpi-primary .n-owner-value {
    font-size: 30px;
  }
  .n-ledger-main {
    padding: 18px 16px 16px;
  }
  .n-ledger-periods {
    padding: 16px;
  }
  .n-ledger-main > .n-owner-kpi .n-owner-value {
    font-size: 42px;
  }
  .n-ledger-strip > .n-owner-kpi {
    padding-right: 10px;
  }
  .n-ledger-strip > .n-owner-kpi + .n-owner-kpi {
    padding-left: 12px;
  }
  .n-ledger-strip .n-owner-value {
    font-size: 19px;
  }
  .n-next-action {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
  .n-next-action .n-ring {
    display: none;
  }
  .n-owner-toolbar {
    top: calc(var(--header-h) + 6px);
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    padding: 4px;
  }
  .n-owner-toolbar::-webkit-scrollbar {
    display: none;
  }
  .n-owner-toolbar .n-owner-periods {
    flex-wrap: nowrap;
  }
  .n-owner-toolbar > .n-button {
    flex: 0 0 auto;
  }
  .n-comparison-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .n-comparison-status {
    grid-column: 1 / -1;
  }
  .n-comparison-detail-row {
    grid-template-columns: minmax(80px, 1fr) repeat(3, minmax(0, 1fr));
    font-size: 12px;
  }
  .n-link-form {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-link-form .n-button {
    width: 100%;
  }
  .n-op-smartlink {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-op-smartlink > .n-button {
    width: 100%;
  }
  .n-weekdays {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
  }
  .n-weekday span {
    height: 46px;
    font-size: 0;
  }
  .n-weekday span::after {
    content: attr(data-short);
    font-size: 11.5px;
  }
  .n-operations:not(.n-publisher-links) .n-op-payment-list {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-ledger-table {
    border: 0;
    background: transparent;
    gap: 10px;
  }
  .n-ledger-head {
    display: none;
  }
  .n-ledger-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
    padding: 14px;
    border: 1px solid var(--c-line);
    border-radius: var(--r-lg);
    background: var(--c-panel);
  }
  .n-ledger-row > .n-ledger-who {
    grid-column: 1 / -1;
  }
  .n-ledger-row > .num {
    display: grid;
    gap: 2px;
    text-align: left;
  }
  .n-ledger-row > .num::before {
    content: attr(data-label);
    color: var(--c-ink-3);
    font-size: 11px;
    font-weight: 500;
  }
  .n-ledger-row > .n-ledger-actions {
    padding-left: 0;
    justify-content: flex-start;
  }
  .n-ledger-row .n-hint {
    grid-column: 1 / -1;
  }
  /* Tableaux : défilement horizontal avec indice visuel */
  .n-table th,
  .n-table td,
  .h-table th,
  .h-table td,
  .rnk-scroll th,
  .rnk-scroll td {
    padding: 10px 12px;
  }
  .n-table-wrap,
  .h-table-scroll,
  .rnk-scroll {
    background:
      linear-gradient(90deg, var(--c-panel) 30%, transparent) left / 24px 100% no-repeat local,
      linear-gradient(270deg, var(--c-panel) 30%, transparent) right / 24px 100% no-repeat local,
      linear-gradient(90deg, rgba(0, 0, 0, 0.5), transparent) left / 12px 100% no-repeat scroll,
      linear-gradient(270deg, rgba(0, 0, 0, 0.5), transparent) right / 12px 100% no-repeat scroll,
      var(--c-panel);
  }
  /* Dialogues : feuille basse */
  .n-dialog,
  .r-dialog,
  .h-decision {
    width: 100%;
    max-width: none;
    max-height: 92dvh;
    margin: auto 0 0;
    padding: 22px 18px calc(22px + env(safe-area-inset-bottom));
    border-radius: 20px 20px 0 0;
    transform: translateY(40px);
  }
  @starting-style {
    .n-dialog[open],
    .r-dialog[open],
    .h-decision[open] {
      transform: translateY(40px);
    }
  }
  .n-dialog::before,
  .r-dialog::before,
  .h-decision::before {
    content: "";
    display: block;
    width: 38px;
    height: 4px;
    margin: -8px auto 14px;
    border-radius: 4px;
    background: var(--c-line-strong);
  }
  .n-dialog .n-buttons > .n-button {
    flex: 1;
  }
  #toast-root {
    left: 12px;
    right: 12px;
    bottom: calc(76px + env(safe-area-inset-bottom));
    justify-items: stretch;
    max-width: none;
  }
  .n-toast {
    min-width: 0;
  }
  /* Barre d'onglets mobile */
  .n-tabbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 120;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    padding: 6px 6px calc(6px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--c-line);
    background: rgba(7, 9, 14, 0.94);
    isolation: isolate;
  }
  @supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .n-tabbar {
      background: rgba(7, 9, 14, 0.78);
      -webkit-backdrop-filter: blur(16px) saturate(150%);
      backdrop-filter: blur(16px) saturate(150%);
    }
  }
  .n-tabbar a,
  .n-tabbar button {
    position: relative;
    z-index: 1;
    display: grid;
    justify-items: center;
    gap: 3px;
    min-height: 50px;
    padding: 7px 2px 5px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--c-ink-3);
    font-size: 10.5px;
    font-weight: 550;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    transition: color var(--d-2) linear;
  }
  .n-tabbar .n-icon {
    width: 20px;
    height: 20px;
    color: inherit;
  }
  .n-tabbar a[aria-current="page"] {
    color: #fff;
  }
  .n-tabbar a[aria-current="page"] .n-icon {
    color: var(--c-blue-ink);
  }
  .n-tabbar-indicator {
    position: absolute;
    z-index: 0;
    top: 6px;
    left: 0;
    height: 50px;
    border-radius: 12px;
    background: var(--c-blue-soft);
    box-shadow: inset 0 0 0 1px rgba(84, 134, 255, 0.18);
    pointer-events: none;
    transition:
      transform var(--d-4) var(--e-spring),
      width var(--d-4) var(--e-out),
      opacity var(--d-2) linear;
  }
}
@media (max-width: 359px) {
  .n-ledger-strip {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-ledger-strip > .n-owner-kpi + .n-owner-kpi {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--c-line-soft);
  }
}
@media (max-width: 420px) {
  .n-metrics,
  .n-owner-kpis,
  .n-owner-kpis:has(> :nth-child(3):last-child) {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-comparison-summary {
    grid-template-columns: minmax(0, 1fr);
  }
  .n-sk-strip {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* 27 · Mouvement réduit ---------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    transition-delay: 0ms !important;
    scroll-behavior: auto !important;
  }
  .n-skeleton::after,
  .n-sk::after,
  .n-scanline[data-state="busy"] i {
    animation: none !important;
  }
  .n-scanline[data-state="busy"] i {
    opacity: 0.6;
    transform: scaleX(1);
  }
}

/* 28 · Thème clair (secondaire) --------------------------------------------------------------- */
:root[data-theme="light"] {
  color-scheme: light;
  --c-void: #e9edf4;
  --c-canvas: #f4f6fa;
  --c-sunken: #eef1f6;
  --c-panel: #ffffff;
  --c-raised: #ffffff;
  --c-overlay: #f6f8fc;
  --c-hover: rgba(15, 23, 42, 0.04);
  --c-press: rgba(15, 23, 42, 0.07);
  --c-line-soft: rgba(15, 23, 42, 0.07);
  --c-line: rgba(15, 23, 42, 0.11);
  --c-line-strong: rgba(15, 23, 42, 0.19);
  --c-ink: #0b1220;
  --c-ink-2: #46526a;
  --c-ink-3: #66718a;
  --c-ink-4: #9aa3b5;
  --c-blue: #2557e8;
  --c-blue-hi: #2f63f2;
  --c-blue-ink: #2150d6;
  --c-blue-soft: rgba(37, 87, 232, 0.09);
  --c-blue-line: rgba(37, 87, 232, 0.35);
  --c-blue-glow: rgba(37, 87, 232, 0.2);
  --c-success: #12825a;
  --c-success-soft: rgba(18, 130, 90, 0.08);
  --c-success-line: rgba(18, 130, 90, 0.28);
  --c-warning: #a26408;
  --c-warning-soft: rgba(196, 128, 18, 0.1);
  --c-warning-line: rgba(196, 128, 18, 0.32);
  --c-danger: #c42f45;
  --c-danger-soft: rgba(196, 47, 69, 0.08);
  --c-danger-line: rgba(196, 47, 69, 0.3);
  --c-today: #2557e8;
  --c-yesterday: #8a94a6;
  --sh-inner: 0 1px 2px rgba(15, 23, 42, 0.04);
  --sh-pop: 0 18px 40px -16px rgba(15, 23, 42, 0.3), 0 0 0 1px var(--c-line);
  --sh-dialog: 0 40px 100px -30px rgba(15, 23, 42, 0.45), 0 0 0 1px var(--c-line);
}
:root[data-theme="light"] body::before {
  background: radial-gradient(900px 340px at 78% -160px, rgba(37, 87, 232, 0.08), transparent 70%);
}
:root[data-theme="light"] .n-sidebar {
  background: #fbfcfe;
}
:root[data-theme="light"] .n-ledger-periods {
  background: var(--c-sunken);
}
:root[data-theme="light"] .n-admin-strip {
  color: var(--c-warning);
}
:root[data-theme="light"] .n-form-error,
:root[data-theme="light"] .r-error,
:root[data-theme="light"] .n-notice.is-cancelled {
  color: var(--c-danger);
}
:root[data-theme="light"] .n-notice.is-success {
  color: var(--c-success);
}
:root[data-theme="light"] .n-notice.is-review,
:root[data-theme="light"] .n-notice.is-sender,
:root[data-theme="light"] .r-note strong,
:root[data-theme="light"] .n-comparison-detail-missing {
  color: var(--c-warning);
}
:root[data-theme="light"] .n-header {
  background: rgba(244, 246, 250, 0.82);
}
:root[data-theme="light"] .n-nav a[aria-current="page"],
:root[data-theme="light"] .n-tabbar a[aria-current="page"] {
  color: var(--c-ink);
}
:root[data-theme="light"] .n-sidebar-foot::before,
:root[data-theme="light"] .n-ledger-who::before {
  background: var(--c-sunken);
}
:root[data-theme="light"] .n-owner-toolbar {
  background: rgba(255, 255, 255, 0.86);
}
:root[data-theme="light"] .n-thumb {
  background: #fff;
  box-shadow:
    inset 0 0 0 1px var(--c-line-strong),
    0 2px 6px -2px rgba(15, 23, 42, 0.2);
}
:root[data-theme="light"] .n-owner-chart-tab[aria-pressed="true"],
:root[data-theme="light"] .n-owner-period[aria-pressed="true"],
:root[data-theme="light"] .nw-tab[aria-selected="true"],
:root[data-theme="light"] .cm-tabs > button[aria-selected="true"] {
  color: var(--c-ink);
  background: #fff;
}
:root[data-theme="light"] .n-input:focus,
:root[data-theme="light"] .h-field input:focus {
  background: #fff;
}
:root[data-theme="light"] .n-input,
:root[data-theme="light"] .r-input {
  box-shadow: none;
  background: #fff;
}
:root[data-theme="light"] input[type="date"].n-input {
  color-scheme: light;
}
:root[data-theme="light"] .n-toast,
:root[data-theme="light"] .n-owner-tooltip {
  background: rgba(255, 255, 255, 0.98);
}
:root[data-theme="light"] .n-form-error {
  color: var(--c-danger);
}
:root[data-theme="light"] .n-op-smartlink .n-input.n-code,
:root[data-theme="light"] .n-owner-link-address,
:root[data-theme="light"] .n-secret {
  color: var(--c-ink);
}
:root[data-theme="light"] .n-auth-story {
  background: radial-gradient(70% 60% at 85% 10%, rgba(37, 87, 232, 0.12), transparent 70%), #eef2f9;
}
:root[data-theme="light"] .n-tabbar {
  background: rgba(255, 255, 255, 0.9);
}
:root[data-theme="light"] .n-weekday input:checked + span,
:root[data-theme="light"] .n-op-crypto[aria-pressed="true"] {
  color: var(--c-ink);
}
:root[data-theme="light"] .n-preview-strip {
  color: #7a5200;
  background: repeating-linear-gradient(-45deg, #fff6e2, #fff6e2 10px, #fdf0d2 10px, #fdf0d2 20px);
}

/* 29 · Compléments de composition ------------------------------------------------------------- */
.n-list-title {
  font-size: 15px;
  font-weight: 600;
}
.n-status-row > .n-hint {
  flex: 1;
  min-width: 220px;
}
.n-op-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px 16px;
}
.n-op-toolbar > .n-field {
  flex: 1 1 260px;
  max-width: 380px;
}
.n-op-toolbar > .n-hint {
  margin-left: auto;
  padding-bottom: 8px;
  font-variant-numeric: tabular-nums;
}
.n-op-shortcut:hover {
  transform: none;
}
.n-goal {
  grid-template-columns: 76px minmax(0, 1fr);
  border-color: var(--c-success-line);
  background:
    radial-gradient(80% 140% at 0% 50%, rgba(60, 207, 152, 0.1), transparent 60%),
    var(--c-panel);
}
.n-goal .n-celebrate,
.n-link-ready .n-celebrate {
  width: 76px;
  height: 76px;
  margin: 0;
}
.n-link-ready .n-celebrate {
  margin-bottom: 4px;
}
.n-tower-main > .n-owner-panel > .n-button {
  margin-top: 12px;
}
/* Connexion : composition décorative tracée une fois, formulaire qui se pose */
.n-auth-art .a-line {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: n-draw 2.2s var(--e-in-out) 0.25s forwards;
}
.n-auth-art .a-line-muted {
  animation-delay: 0.05s;
  animation-duration: 2.6s;
}
.n-auth-art .a-area {
  opacity: 0;
  animation: n-fade-in 1.4s linear 1.3s forwards;
}
@keyframes n-fade-in {
  to {
    opacity: 1;
  }
}
.n-auth-story > div:not(.n-auth-art):not(.n-auth-top) > * {
  animation: n-rise var(--d-5) var(--e-out) both;
}
.n-auth-story > div > .n-overline {
  animation-delay: 0.1s;
}
.n-auth-story > div > h1 {
  animation-delay: 0.16s;
}
.n-auth-story > div > p:not(.n-overline) {
  animation-delay: 0.24s;
}
.n-auth-story > div > .n-auth-points {
  animation-delay: 0.32s;
}
.n-auth-box {
  animation: n-rise var(--d-5) var(--e-out) 0.18s both;
}
.n-strength:not(:empty)::before {
  content: "";
  display: block;
  height: 4px;
  margin: 2px 0 8px;
  border-radius: 4px;
  background:
    linear-gradient(90deg, var(--meter, var(--c-line)) var(--fill, 0%), var(--c-line) 0) 0 0 / 100% 100% no-repeat;
  transition: background-size var(--d-3) var(--e-out);
}
.n-strength[data-level="weak"] {
  --meter: var(--c-danger);
  --fill: 33%;
}
.n-strength[data-level="ok"] {
  --meter: var(--c-warning);
  --fill: 66%;
}
.n-strength[data-level="good"] {
  --meter: var(--c-success);
  --fill: 100%;
}
.n-otp {
  font: 600 20px/1 var(--f-mono);
  letter-spacing: 0.4em;
  text-align: center;
  min-height: 52px !important;
}