/*
 * Interface127 — ambiance nocturne unique.
 *
 * Chargée après les modules, cette couche garantit les mêmes surfaces,
 * contrastes et identités des Sept Sœurs sur tout L'Onirologue.
 */

:root,
html[data-theme="night"] {
  color-scheme: dark;

  --i127-bg-canvas: #080a13;
  --i127-bg-section: #101426;
  --i127-bg-card: #171c31;
  --i127-bg-elevated: #202742;
  --i127-bg-translucent: rgb(16 20 38 / 94%);
  --i127-bg-soft: rgb(255 255 255 / 3.5%);
  --i127-bg-active: rgb(223 194 125 / 10%);

  --i127-text-primary: #f8f5ed;
  --i127-text-secondary: #c9c8d5;
  --i127-text-muted: #a7a9ba;
  --i127-text-disabled: #858696;
  --i127-text-inverse: #221b29;

  --i127-border-subtle: rgb(248 245 237 / 13%);
  --i127-border-strong: rgb(248 245 237 / 29%);
  --i127-focus: #f2dea8;

  --i127-accent-violet: #a798ee;
  --i127-accent-violet-soft: #d7cff9;
  --i127-accent-gold: #dfc27d;
  --i127-accent-gold-soft: #f2dea8;
  --i127-status-success: #8fd2a6;
  --i127-status-error: #ffb6ae;

  --i127-sister-oni: #d9cdfb;
  --i127-sister-alka: #a9c2f7;
  --i127-sister-naia: #8fdad3;
  --i127-sister-terra: #a9c98a;
  --i127-sister-ignis: #eb9a68;
  --i127-sister-astria: #f2dea8;
  --i127-sister-irma: #f3f1fb;

  --i127-gradient-canvas:
    radial-gradient(circle at 15% 12%, rgb(167 152 238 / 14%), transparent 31rem),
    radial-gradient(circle at 86% 74%, rgb(223 194 125 / 8%), transparent 29rem),
    linear-gradient(180deg, var(--i127-bg-canvas), var(--i127-bg-section));
  --i127-gradient-card:
    radial-gradient(circle at 15% 0%, rgb(167 152 238 / 10%), transparent 44%),
    linear-gradient(145deg, var(--i127-bg-card), var(--i127-bg-section));
  --i127-shadow-card: 0 18px 50px rgb(0 0 0 / 32%);
  --i127-shadow-active: 0 22px 70px rgb(0 0 0 / 45%);
  --i127-backdrop: rgb(2 4 10 / 72%);

  /* Compatibilité avec les composants historiques. */
  --night: var(--i127-bg-canvas);
  --night2: var(--i127-bg-section);
  --panel: var(--i127-bg-card);
  --ivory: var(--i127-text-primary);
  --text: var(--i127-text-secondary);
  --muted: var(--i127-text-muted);
  --violet: var(--i127-accent-violet);
  --violet-soft: var(--i127-accent-violet-soft);
  --gold: var(--i127-accent-gold);
  --gold-soft: var(--i127-accent-gold-soft);
  --line: var(--i127-border-subtle);
}

html,
body {
  color-scheme: dark;
  background: var(--i127-bg-canvas);
}

body {
  color: var(--i127-text-secondary);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--i127-text-primary);
}

:where(a, button, input, textarea, select, summary):focus-visible {
  outline: 3px solid var(--i127-focus);
  outline-offset: 3px;
}

::selection {
  color: var(--i127-text-inverse);
  background: var(--i127-accent-violet);
}

.sister-link--oni { --sister-accent: var(--i127-sister-oni) !important; }
.sister-link--alka { --sister-accent: var(--i127-sister-alka) !important; }
.sister-link--naia { --sister-accent: var(--i127-sister-naia) !important; }
.sister-link--terra { --sister-accent: var(--i127-sister-terra) !important; }
.sister-link--ignis { --sister-accent: var(--i127-sister-ignis) !important; }
.sister-link--astria { --sister-accent: var(--i127-sister-astria) !important; }
.sister-link--irma { --sister-accent: var(--i127-sister-irma) !important; }

.site-header,
.site-header__main {
  color: var(--i127-text-secondary);
  border-color: var(--i127-border-subtle);
  background: var(--i127-bg-canvas);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.soeurs-bar {
  color: var(--i127-text-secondary);
  border-color: var(--i127-border-subtle);
  background: var(--i127-bg-section);
}

.promise,
.news,
.symbol-search-panel,
.symbol-card__link,
.symbol-card details,
.symbol-ethics-card,
.dream-auth__grid,
.dream-deposit,
.dream-patterns,
.dream-entry > details,
.page-bridge__inner {
  color: var(--i127-text-secondary);
  border-color: var(--i127-border-subtle);
  background: var(--i127-gradient-card);
  box-shadow: var(--i127-shadow-card);
}

.page-bridge__card {
  color: var(--i127-text-secondary) !important;
  border-color: var(--i127-border-subtle) !important;
  background: var(--i127-bg-soft);
}

.page-bridge__card:hover,
.page-bridge__card:focus-visible {
  border-color: var(--i127-border-strong) !important;
  background: var(--i127-bg-elevated);
  box-shadow: var(--i127-shadow-card);
}

@media (prefers-reduced-motion: reduce) {
  html,
  body,
  html *,
  html *::before,
  html *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}