/* The Relationship Codex(TM) */

:root {
  /* Structural tokens */
  --amethyst:      #8B79C9;
  --navy:          #100E0C;
  --indigo:        #1A1612;

  /* Violet — atmospheric depth ONLY, never primary (max .16 opacity) */
  --violet:        #2A2348;
  --violet-deep:   #181230;
  --violet-glow:   rgba(86,68,150,0.16);
  --violet-mist:   rgba(70,56,128,0.10);
  --violet-haze:   rgba(86,68,150,0.06);

  /* ── Arc stage colour palette ── */
  --arc-seeker:        #3E7C8C;  /* I  · Arrival     · deep teal  */
  --arc-seeing:        #8DAFD6;  /* II · Seeing       · sky blue     */
  --arc-feeling:       #A18BD8;  /* III· Feeling      · lavender     */
  --arc-practising:    #D8B87A;  /* IV · Practising   · warm amber   */
  --arc-integrating:   #E7D6A0;  /* V  · Integrating  · pale gold   */

  --arc-seeker-rgb:        62, 124, 140;
  --arc-seeing-rgb:        141, 175, 214;
  --arc-feeling-rgb:       161, 139, 216;
  --arc-practising-rgb:    216, 184, 122;
  --arc-integrating-rgb:   231, 214, 160;
}

/* ── Global base background ── */
html, body {
  background:
    radial-gradient(ellipse 150% 105% at 50% -12%,
      #15110d 0%,
      var(--bg, #080808) 48%,
      #120d26 88%,
      var(--violet-deep) 122%) fixed;
}

/* ── Global ambient atmosphere — amethyst-dominant, teal/sky only as accents ─ */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  /* Arc-spectrum aurora — the /mirror/arc stage palette flowing as an ambient
     rainbow: steel blue + sky blue (top right) → lavender/amethyst crown (top
     centre/left) → warm amber + pale gold (grounded at the base). Violet stays
     dominant; the warm tones live at the bottom so they never tint the purples
     green. */
  background:
    /* III Feeling · lavender/amethyst crown — top centre, now the dominant wash */
    radial-gradient(ellipse 130% 50% at 50% -8%,  rgba(161,139,216,0.26) 0%, transparent 62%),
    /* amethyst violet — left depth, raised */
    radial-gradient(ellipse 80% 60% at -8% 52%,   rgba(139,121,201,0.24) 0%, transparent 60%),
    /* amethyst violet — right depth, balances the old blue side */
    radial-gradient(ellipse 78% 58% at 108% 60%,  rgba(139,121,201,0.18) 0%, transparent 60%),
    /* II Seeing · sky blue — upper right, now a faint ACCENT only */
    radial-gradient(ellipse 62% 44% at 100% 4%,   rgba(141,175,214,0.08) 0%, transparent 52%),
    /* I Arrival · teal — mid right, faint ACCENT only */
    radial-gradient(ellipse 60% 46% at 110% 40%,  rgba(62,124,140,0.07) 0%, transparent 54%),
    /* deep violet floor — grounds the whole base in amethyst */
    radial-gradient(ellipse 120% 55% at 50% 112%, rgba(86,68,150,0.20) 0%, transparent 60%),
    /* IV Practising · warm amber — lower centre, faint grounding warmth */
    radial-gradient(ellipse 90% 42% at 40% 108%,  rgba(216,184,122,0.07) 0%, transparent 52%);
}

/* ── Card depth · warm gold halo ─────────────────────────────────────── */
.codex-card:hover,
.codex-card--tome:hover,
.codex-card--glass:hover,
.member-card:hover,
.post-card:hover,
.seal-tile:hover,
.offer-card:hover {
  box-shadow:
    0 16px 48px rgba(0,0,0,.42),
    0 0 40px rgba(200,167,106,.07),
    0 0 50px rgba(200,167,106,.04);
}

/* ── Button hover · warm gold glow ────────────────────────────────── */
.btn-primary:hover,
.btn-gold:hover,
.gold-btn:hover,
.btn-ritual--gold:hover,
.btn-post:hover,
.session-cta:hover,
.cta:hover,
.dash-quick-card:hover,
.mirror-hero-btn:hover {
  box-shadow:
    0 8px 24px rgba(0,0,0,.45),
    0 0 30px rgba(200,167,106,0.22),
    0 0 18px rgba(200,167,106,0.10);
}
.btn-ghost:hover,
.gold-btn--ghost:hover,
.btn-ritual--ghost:hover,
.btn-secondary:hover {
  box-shadow:
    0 0 22px rgba(200,167,106,0.10),
    0 0 14px rgba(200,167,106,0.06);
}

/* ── Navigation · active items gain gold underglow ──────────────── */
.sb-link.active,
.drawer-link.active,
.mobile-nav-item.active,
.mnav-item.active,
.mnav-link.active,
.mirror-nav-item.active,
.pub-nav-active {
  text-shadow: 0 0 14px rgba(200,167,106,0.30);
}
.sb-link.active { box-shadow: inset 2px 0 0 rgba(200,167,106,.55), -6px 0 22px -8px rgba(200,167,106,0.20); }

/* ══════════════════════════════════════════════════════════════════════
   HOUSE STANDARD · rounded edges + frozen logo
   ══════════════════════════════════════════════════════════════════════ */
.card, .panel, .box, .modal, .popup, .sheet, .tile,
.auth-card, .auth-box, .gate-card, .form-card, .login-card,
[class*="-card"], [class*="-panel"], [class*="-box"], [class*="-modal"],
[class*="-visual"], [class*="-media"], [class*="-frame"], [class*="-tile"] {
  border-radius: 12px;
}
input:not([type=checkbox]):not([type=radio]):not([type=range]),
textarea, select,
button:not(.detail-close), .btn, .btn-gold, .btn-ghost, .btn-outline,
.btn-primary, .btn-secondary, .gold-btn, .cta, .pill, .chip, .badge, .tag {
  border-radius: 8px;
}

/* ══════════════════════════════════════════════════════════════════════
   GLOBAL ATMOSPHERE · warm gold fog / shimmer / vignette on every page
   ══════════════════════════════════════════════════════════════════════ */
#codexAtmos{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}

@keyframes globalFogDrift{
  0%   {transform:translate(0,0)   scale(1);}
  50%  {transform:translate(3%,2%) scale(1.06);}
  100% {transform:translate(0,0)   scale(1);}
}
@keyframes globalShimmerBreath{
  0%,100%{opacity:.22;}
  50%    {opacity:.52;}
}

.atmos-fog{
  position:absolute;inset:-8%;
  background:
    radial-gradient(ellipse 72% 58% at 78% 24%, rgba(139,121,201,.14) 0%, transparent 62%),
    radial-gradient(ellipse 60% 52% at 16% 76%, rgba(108,139,170,.10) 0%, transparent 60%);
  animation:globalFogDrift 46s ease-in-out infinite;
  opacity:.8;
}
.atmos-shimmer{
  position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 45% at 50% 28%, rgba(200,167,106,.028) 0%, transparent 65%);
  animation:globalShimmerBreath 11s ease-in-out infinite;
}
.atmos-vignette{
  position:absolute;inset:0;
  background:radial-gradient(ellipse 120% 110% at 50% 50%, transparent 38%, rgba(3,3,3,.78) 100%);
}

/* Logo rotation freeze */
.sb-sigil-svg, .sb-sigil-ring,
.sigil-ring, .sigil-ring-svg,
.lc-outer-ring, .lc-inner-ring,
.rc-spin, .rc-spin-rev, .rc-ring-1, .rc-ring-2,
.orb-ring, .orb-ring.r1, .orb-ring.r2,
.adm-sigil-ring, .gate-ring, .auth-sigil-ring {
  animation: none !important;
}

/* ══════════════════════════════════════════════════════════════════════
   ARC STAGE GLOW CYCLING — nth-child hover variants
   Cards, journal entries, post cards, offer cards rotate through the
   5 arc stage colors as glow on hover. Gold is always the base.
   ══════════════════════════════════════════════════════════════════════ */

/* base card hover — gold foundation */
.codex-card:hover,.codex-card--tome:hover,.codex-card--glass:hover,
.post-card:hover,.seal-tile:hover,.offer-card:hover,.member-card:hover {
  box-shadow:
    0 16px 48px rgba(0,0,0,.42),
    0 0 32px rgba(var(--arc-integrating-rgb),.10),
    0 0 8px  rgba(var(--arc-integrating-rgb),.06);
}

/* 1 of 5 — Arrival blue */
.codex-card:nth-child(5n+1):hover,.post-card:nth-child(5n+1):hover,
.offer-card:nth-child(5n+1):hover,.mirror-entry:nth-child(5n+1):hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.40),
    0 0 28px rgba(var(--arc-seeker-rgb),.18),
    0 0 10px rgba(var(--arc-seeker-rgb),.08);
}
/* 2 of 5 — Seeing sky blue */
.codex-card:nth-child(5n+2):hover,.post-card:nth-child(5n+2):hover,
.offer-card:nth-child(5n+2):hover,.mirror-entry:nth-child(5n+2):hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.40),
    0 0 28px rgba(var(--arc-seeing-rgb),.16),
    0 0 10px rgba(var(--arc-seeing-rgb),.07);
}
/* 3 of 5 — Feeling lavender */
.codex-card:nth-child(5n+3):hover,.post-card:nth-child(5n+3):hover,
.offer-card:nth-child(5n+3):hover,.mirror-entry:nth-child(5n+3):hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.40),
    0 0 28px rgba(var(--arc-feeling-rgb),.18),
    0 0 10px rgba(var(--arc-feeling-rgb),.08);
}
/* 4 of 5 — Practising amber */
.codex-card:nth-child(5n+4):hover,.post-card:nth-child(5n+4):hover,
.offer-card:nth-child(5n+4):hover,.mirror-entry:nth-child(5n+4):hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.40),
    0 0 28px rgba(var(--arc-practising-rgb),.20),
    0 0 10px rgba(var(--arc-practising-rgb),.09);
}
/* 5 of 5 — Integrating gold (default) */
.codex-card:nth-child(5n+5):hover,.post-card:nth-child(5n+5):hover,
.offer-card:nth-child(5n+5):hover,.mirror-entry:nth-child(5n+5):hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.40),
    0 0 28px rgba(var(--arc-integrating-rgb),.22),
    0 0 10px rgba(var(--arc-integrating-rgb),.10);
}

/* ── Lore image treatment ── */
.article-hero img{
  filter: brightness(.55) contrast(1.05) saturate(.94) !important;
}
.article-hero-overlay{
  background: linear-gradient(to bottom,
    rgba(8,8,8,.55) 0%,
    rgba(18,12,28,.42) 45%,
    rgba(8,8,8,.92) 100%) !important;
}
/* Lore index grid cards + featured lead visual (background-image divs) */
.entry-visual{
  filter: brightness(.6) saturate(.95) !important;
}

/* ── Global mobile safety · lock side-to-side scroll + kill the white overscroll gutter (loads last, applies everywhere) ── */
html{background:#080808;overscroll-behavior:none;overflow-x:clip;}
body{max-width:100%;overscroll-behavior-x:none;}
