/* =====================================================================
   IGTT THEME LAYER · 2026-09-09
   ---------------------------------------------------------------------
   PURPOSE
   - One source of truth for the site-wide palette and background.
   - Loaded AFTER styles.css, product-polish.css and experience-polish.css.
   - Keep page layout/components in their owning files; put global theme
     tokens and intentional cross-page palette decisions here.
   ===================================================================== */

:root {
  /* World */
  --igtt-world-top: #303236;
  --igtt-world-upper: #292b2f;
  --igtt-world-mid: #222428;
  --igtt-world-lower: #1a1c20;
  --igtt-world-deep: #131518;
  --igtt-world-floor: #0d0f11;

  /* Neutral ink surfaces */
  --igtt-ink-1: #171716;
  --igtt-ink-2: #0f0f0e;
  --igtt-ink-3: #080807;
  --igtt-ink-edge: rgba(255,255,255,.105);

  /* Paper / achievement */
  --igtt-paper: #eadfc9;
  --igtt-paper-deep: #d5bd99;
  --igtt-gold: #e8c9a0;

  /* Text */
  --igtt-text: #f5f0e8;
  --igtt-text-muted: rgba(245,240,232,.58);

  /* Shared elevation */
  --igtt-shadow-card: 0 20px 48px rgba(0,0,0,.34);
  --igtt-shadow-book: 0 36px 72px rgba(0,0,0,.58);
}

/* ---------------------------------------------------------------------
   SITE WORLD
   Replaces background.png. This intentionally keeps the same grayscale
   direction, but is darker, smoother, resolution-independent, and easier
   to tune in one place.
   --------------------------------------------------------------------- */
html,
body,
body[class],
body.app-shell {
  background-color: var(--igtt-world-deep) !important;
  background-image:
    radial-gradient(86% 34% at 50% -10%, rgba(255,255,255,.018) 0%, transparent 70%),
    linear-gradient(
      180deg,
      var(--igtt-world-top) 0%,
      var(--igtt-world-upper) 18%,
      var(--igtt-world-mid) 39%,
      var(--igtt-world-lower) 62%,
      var(--igtt-world-deep) 82%,
      var(--igtt-world-floor) 100%
    ) !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: 100% 100% !important;
  background-attachment: fixed !important;
}

@media (max-width: 900px), (hover:none) {
  html,
  body,
  body[class],
  body.app-shell {
    background-attachment: scroll !important;
    background-size: 100% 100% !important;
  }
}

/* ---------------------------------------------------------------------
   BOOK 1 — MIDNIGHT BLACK PHYSICAL BOOK
   Scope is intentionally limited to the five-chapter Book selector.
   Community Codex retains its separate parchment treatment.
   --------------------------------------------------------------------- */
.questions-hub-page .tier-book-shell {
  filter: drop-shadow(0 26px 38px rgba(0,0,0,.42));
}

.questions-hub-page .tier-book {
  background: linear-gradient(94deg, #030303 0%, #0b0b0b 3.8%, #070707 7.5%, #020202 100%) !important;
  box-shadow:
    var(--igtt-shadow-book),
    0 12px 28px rgba(0,0,0,.40),
    0 0 0 1px rgba(255,255,255,.055),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.questions-hub-page .tier-book-spine {
  background: linear-gradient(180deg,#111111 0%,#050505 38%,#0b0b0b 70%,#020202 100%) !important;
  box-shadow:
    inset -4px 0 6px rgba(0,0,0,.66),
    inset 1px 0 0 rgba(255,255,255,.045),
    4px 0 13px rgba(0,0,0,.44) !important;
}

.questions-hub-page .tier-book-spine::before {
  background: repeating-linear-gradient(180deg,transparent 0 8px,rgba(255,255,255,.055) 8px 9px) !important;
}

.questions-hub-page .book-page-inner {
  background: linear-gradient(150deg,#0d0d0d 0%,#080808 50%,#030303 100%) !important;
  border-color: rgba(255,255,255,.05) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    inset 10px 0 22px rgba(0,0,0,.40) !important;
}

.questions-hub-page .book-page::after {
  background: linear-gradient(90deg,#020202 0%,#0d0d0d 13%,#040404 100%) !important;
}

.questions-hub-page .book-page-edge {
  background:
    linear-gradient(90deg,rgba(0,0,0,.52),transparent 38%),
    repeating-linear-gradient(180deg,#101010 0 2px,#070707 2px 4px) !important;
}

/* Book 1 should read as matte black: no chapter/tier light blooming on the right. */
.questions-hub-page .book-page {
  --tier-glow: transparent !important;
}
.questions-hub-page .book-page .book-page-inner::before {
  background: none !important;
  box-shadow: none !important;
  opacity: 0 !important;
}
.questions-hub-page .book-page:hover .book-page-inner,
.questions-hub-page .book-page:focus-visible .book-page-inner {
  background: linear-gradient(150deg,#101010 0%,#090909 50%,#030303 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.075),
    inset 10px 0 22px rgba(0,0,0,.42),
    0 16px 34px rgba(0,0,0,.24) !important;
}