/* ============================================================================
   Daniel — "Illustrated Atlas" → Direction C, applied site-wide.
   A single cinematic navy + gold + serif theme for every page.

   The site is a Next.js/Tailwind build using shadcn HSL-channel tokens
   (hsl(var(--token))). Redefining those 15 tokens re-skins the whole app.
   ========================================================================== */

:root,
.dark {
  --background: 213 58% 13%;
  --foreground: 41 44% 89%;
  --card: 213 42% 16%;
  --card-foreground: 41 42% 88%;
  --popover: 213 44% 15%;
  --popover-foreground: 41 42% 88%;
  --primary: 42 54% 54%;
  --primary-foreground: 213 60% 10%;
  --secondary: 213 38% 19%;
  --secondary-foreground: 41 40% 88%;
  --muted: 213 34% 18%;
  --muted-foreground: 41 20% 68%;
  --accent: 213 40% 22%;
  --accent-foreground: 42 54% 62%;
  --border: 213 26% 27%;
  --input: 213 26% 27%;
  --ring: 42 54% 54%;
  --font-sans: "Jost", ui-sans-serif, system-ui, sans-serif;
  --font-serif: "EB Garamond", Georgia, serif;
}

body {
  background:
    radial-gradient(1200px 520px at 50% -12%, rgba(201, 164, 76, .10), transparent 60%),
    linear-gradient(180deg, #0d1c33 0%, #0b1f3a 55%, #081521 100%) !important;
  background-attachment: fixed !important;
}

/* Compact the Daniel app header so the section navigation does not dominate. */
body.mbe-shell-managed > header.sticky[class*="top-0"][class*="z-50"][class*="border-b"] {
  top: 46px !important;
}

body.mbe-shell-managed > header.sticky[class*="top-0"][class*="z-50"][class*="border-b"] > div:first-child {
  height: 4rem !important;
  min-height: 4rem !important;
}

body.mbe-shell-managed > header.sticky[class*="top-0"][class*="z-50"][class*="border-b"] nav[aria-label="Main navigation"] {
  gap: clamp(1.75rem, 3vw, 2.5rem) !important;
}

body.mbe-shell-managed > div.fixed[class*="top-16"][class*="z-40"] {
  top: calc(46px + 4rem) !important;
}

body[data-daniel-chapter] main[data-bible-panel] article > div:first-child > .mt-4.flex.flex-wrap.gap-2 {
  display: none !important;
}

body[data-daniel-chapter] main[data-bible-panel] article > div:first-child {
  border-bottom-width: 0 !important;
  padding-bottom: 0 !important;
}

body[data-daniel-chapter] main[data-bible-panel] article > div:first-child + div > div:first-child > .passage-outline-divider {
  border-top-width: 0 !important;
}

.daniel-inline-note {
  display: none !important;
}

@keyframes daniel-inline-note-open {
  from {
    opacity: 0;
    transform: translateY(-.35rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 1023px) {
  body[data-daniel-chapter] button[aria-label="Open study notes"],
  body[data-daniel-chapter] aside[data-commentary-panel],
  body[data-daniel-chapter] .fixed.inset-0.z-40[class*="bg-black/45"] {
    display: none !important;
  }

  body[data-daniel-chapter] main[data-bible-panel] button[id^="v-"][aria-expanded="true"] {
    border-color: hsl(var(--primary) / .72) !important;
    box-shadow: inset 3px 0 0 hsl(var(--primary)) !important;
  }

  body[data-daniel-chapter] .daniel-inline-note[data-daniel-inline-note] {
    display: block !important;
    margin: .85rem 0 1.15rem !important;
    padding: 1rem !important;
    border: 1px solid hsl(var(--primary) / .45) !important;
    border-radius: .5rem !important;
    background:
      linear-gradient(180deg, hsl(var(--card) / .98), hsl(var(--background) / .96)) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, .04),
      0 18px 36px -28px rgba(0, 0, 0, .85) !important;
    font-family: var(--font-sans) !important;
    overflow: hidden !important;
    transform-origin: top center;
    animation: daniel-inline-note-open .2s ease-out both;
  }

  body[data-daniel-chapter] .daniel-inline-note[data-daniel-inline-note] > div:first-child {
    margin-bottom: .75rem !important;
    padding-bottom: .6rem !important;
    border-bottom: 1px solid hsl(var(--primary) / .22) !important;
  }

  body[data-daniel-chapter] .daniel-inline-note[data-daniel-inline-note] span:first-child {
    color: hsl(var(--accent-foreground)) !important;
    font-family: var(--font-sans) !important;
    font-size: .76rem !important;
    font-weight: 700 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
  }

  body[data-daniel-chapter] .daniel-inline-note[data-daniel-inline-note] [class*="text-lg"] {
    font-size: 1rem !important;
    line-height: 1.75rem !important;
  }

  body[data-daniel-chapter] .daniel-inline-note[data-daniel-inline-note] p {
    color: hsl(var(--foreground) / .9) !important;
  }
}

@media (max-width: 1023px) and (prefers-reduced-motion: reduce) {
  body[data-daniel-chapter] .daniel-inline-note[data-daniel-inline-note] {
    animation: none;
  }
}

body[data-daniel-chapter] .daniel-word-notes {
  margin-top: 1.25rem;
  padding: 1rem;
  border: 1px solid hsl(var(--border));
  border-radius: .375rem;
  background: hsl(var(--background) / .72);
}

body[data-daniel-chapter] .daniel-word-notes-title {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .8rem;
  color: hsl(var(--primary));
  font-family: var(--font-sans);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .14em;
  line-height: 1.3;
  text-transform: uppercase;
}

body[data-daniel-chapter] .daniel-word-notes-title svg {
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
}

body[data-daniel-chapter] .daniel-word-notes-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem 1.15rem;
}

body[data-daniel-chapter] .daniel-word-note {
  min-width: 0;
  padding-left: .85rem;
  border-left: 3px solid hsl(var(--primary) / .7);
}

body[data-daniel-chapter] .daniel-word-note h3 {
  margin: 0;
  color: hsl(var(--primary));
  font-family: var(--font-sans) !important;
  font-size: .98rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.35;
}

body[data-daniel-chapter] .daniel-word-note p {
  margin: .35rem 0 0;
  color: hsl(var(--foreground) / .9);
  font-family: var(--font-sans);
  font-size: .96rem;
  line-height: 1.65;
}

body[data-daniel-chapter] .daniel-word-note-references {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .65rem;
}

body[data-daniel-chapter] .daniel-word-note-references span {
  max-width: 100%;
  padding: .22rem .52rem;
  overflow-wrap: anywhere;
  border: 1px solid hsl(var(--border));
  border-radius: 999px;
  background: hsl(var(--secondary) / .76);
  color: hsl(var(--secondary-foreground));
  font-family: var(--font-sans);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.25;
  text-transform: none;
}

@media (max-width: 760px) {
  body[data-daniel-chapter] .daniel-word-notes-list {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-daniel-chapter] .daniel-word-notes {
    padding: .9rem;
  }

  body[data-daniel-chapter] .daniel-word-note p {
    font-size: .92rem !important;
    line-height: 1.6 !important;
  }
}

@media (max-width: 760px) {
  body.mbe-shell-managed > header.sticky[class*="top-0"][class*="z-50"][class*="border-b"] > div:first-child {
    height: 3.75rem !important;
    min-height: 3.75rem !important;
  }

  body.mbe-shell-managed > div.fixed[class*="top-16"][class*="z-40"] {
    top: calc(46px + 3.75rem) !important;
  }
}

/* Type system: Cinzel display caps · EB Garamond text · Jost UI. */
h1, h2 {
  font-family: "Cinzel", Georgia, serif !important;
  letter-spacing: .015em;
  line-height: 1.12;
}
h3, h4 {
  font-family: "EB Garamond", Georgia, serif !important;
}

/* Accent text was too close to the dark card color; keep accent backgrounds
   navy, but render accent labels and small section titles in gold. */
body.mbe-shell-managed .text-accent,
body.mbe-shell-managed [class*="text-accent/"] {
  color: hsl(var(--accent-foreground)) !important;
}

body[data-daniel-route="charts"] h1,
body[data-daniel-route="charts"] h2,
body[data-daniel-route="charts"] h3,
body[data-daniel-route="charts"] h4,
body.mbe-shell-managed main h1,
body.mbe-shell-managed main h2,
body.mbe-shell-managed main h3,
body.mbe-shell-managed main h4 {
  max-width: 100%;
  overflow-wrap: break-word;
  text-wrap: balance;
}

/* Home hero title: small formal title line, huge book name. */
main > section:first-child h1[class*="clamp(5.25rem,13vw,13.5rem)"] {
  max-width: min(100%, 58rem) !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  line-height: .88 !important;
  letter-spacing: 0 !important;
}

main > section:first-child h1[class*="clamp(5.25rem,13vw,13.5rem)"] > span:nth-child(1),
main > section:first-child h1[class*="clamp(5.25rem,13vw,13.5rem)"] > span:nth-child(2) {
  display: inline !important;
  color: hsl(var(--primary)) !important;
  font-size: clamp(1.15rem, 2.7vw, 2.55rem) !important;
  font-weight: 600 !important;
  letter-spacing: clamp(.18em, .72vw, .36em) !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .5);
}

main > section:first-child h1[class*="clamp(5.25rem,13vw,13.5rem)"] > span:nth-child(2)::before {
  content: " ";
}

main > section:first-child h1[class*="clamp(5.25rem,13vw,13.5rem)"] > span:nth-child(3) {
  display: block !important;
  margin-top: .18em !important;
  color: #fff4d8 !important;
  font-size: clamp(3rem, 11.25vw, 10.25rem) !important;
  font-weight: 500 !important;
  letter-spacing: clamp(.01em, .22vw, .045em) !important;
  line-height: .78 !important;
  text-transform: uppercase !important;
  text-shadow:
    0 3px 22px rgba(0, 0, 0, .55),
    0 0 1px rgba(255, 244, 216, .5);
}

/* Home hero artwork: engraved Daniel scene, faded behind the content. */
main > section:first-child > div:first-child {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

main > section:first-child > div:first-child::before {
  content: "";
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(90deg, rgba(11, 31, 58, .72) 0%, rgba(11, 31, 58, .28) 36%, rgba(11, 31, 58, .08) 100%),
    linear-gradient(180deg, rgba(11, 31, 58, .03) 0%, rgba(11, 31, 58, .32) 57%, rgba(11, 31, 58, .9) 100%),
    url("/assets/daniel-hero-engraving.jpg?v=mbe-20260715-1");
  background-position: center top;
  background-size: cover;
  opacity: .86;
}

main > section:first-child > div:first-child::after {
  content: "";
  position: absolute;
  inset: 0 calc(50% - 50vw);
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 76%, rgba(11, 31, 58, .76) 0%, rgba(11, 31, 58, .34) 24%, transparent 52%),
    radial-gradient(circle at 86% 52%, rgba(201, 164, 76, .11) 0%, transparent 36%);
}

main > section:first-child > div:first-child > * {
  position: relative;
  z-index: 1;
}

body[data-daniel-route="home"] main > section:first-child > div:first-child {
  min-height: clamp(29rem, 65svh, 37rem) !important;
  padding-top: clamp(2.75rem, 5vh, 3.75rem) !important;
  padding-bottom: clamp(2rem, 4vh, 2.75rem) !important;
}

body[data-daniel-route="home"] main > section:first-child > div:first-child h1,
body[data-daniel-route="home"] main > section:first-child > div:first-child p[class*="text-foreground"] {
  color: #f4ead2 !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .5);
}

body[data-daniel-route="home"] main > section:first-child > div:first-child p[class*="text-muted-foreground"] {
  color: rgba(236, 224, 196, .82) !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .45);
}

body[data-daniel-route="home"] main > section:first-child > div:first-child .bg-border {
  background-color: rgba(236, 224, 196, .42) !important;
}

/* Introduction hero artwork: full-width, but held behind the page summary. */
body[data-daniel-route="introduction"] main > div > section:first-child {
  --daniel-introduction-artwork: url("/assets/daniel-introduction-engraving-1200.webp");
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: clamp(30rem, 58vh, 42rem);
  padding: clamp(4rem, 7vw, 6.5rem) clamp(2rem, 6vw, 5.5rem) !important;
  background: #0b1f3a !important;
  border-bottom: 1px solid rgba(201, 164, 76, .18) !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child::before,
body[data-daniel-route="introduction"] main > div > section:first-child::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

body[data-daniel-route="introduction"] main > div > section:first-child::before {
  inset: -4rem -1.5rem -1.5rem;
  background-image:
    linear-gradient(90deg, rgba(11, 31, 58, .94) 0%, rgba(11, 31, 58, .72) 38%, rgba(11, 31, 58, .20) 72%, rgba(11, 31, 58, .08) 100%),
    linear-gradient(180deg, rgba(11, 31, 58, .18) 0%, rgba(11, 31, 58, .20) 42%, rgba(11, 31, 58, .62) 78%, rgba(8, 21, 33, .96) 100%),
    var(--daniel-introduction-artwork);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: .76;
  transform: scale(1.025);
  transform-origin: center top;
  filter: saturate(.86) contrast(.96) brightness(.86);
}

@media (min-width: 900px) {
  body[data-daniel-route="introduction"] main > div > section:first-child {
    --daniel-introduction-artwork: url("/assets/daniel-introduction-engraving-1800.webp");
  }
}

body[data-daniel-route="introduction"] main > div > section:first-child::after {
  background:
    radial-gradient(ellipse at 16% 56%, rgba(11, 31, 58, .96) 0%, rgba(11, 31, 58, .70) 34%, transparent 62%),
    radial-gradient(ellipse at 74% 24%, rgba(201, 164, 76, .09) 0%, transparent 42%),
    linear-gradient(90deg, rgba(11, 31, 58, .86) 0%, rgba(11, 31, 58, .36) 42%, rgba(11, 31, 58, .12) 100%),
    linear-gradient(180deg, rgba(5, 15, 28, .08) 0%, rgba(5, 15, 28, 0) 34%, rgba(8, 21, 33, .34) 76%, #081521 100%);
}

body[data-daniel-route="introduction"] main > div > section:first-child > div {
  position: relative;
  z-index: 1;
  width: 100% !important;
  max-width: 100rem !important;
  margin: 0 auto !important;
  padding: clamp(1.25rem, 3vw, 2.25rem) 0 !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child h1,
body[data-daniel-route="introduction"] main > div > section:first-child h2,
body[data-daniel-route="introduction"] main > div > section:first-child h3,
body[data-daniel-route="introduction"] main > div > section:first-child .text-foreground,
body[data-daniel-route="introduction"] main > div > section:first-child [class*="text-foreground"] {
  color: #f4ead2 !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .5);
}

body[data-daniel-route="introduction"] main > div > section:first-child p,
body[data-daniel-route="introduction"] main > div > section:first-child .text-muted-foreground,
body[data-daniel-route="introduction"] main > div > section:first-child [class*="text-muted-foreground"] {
  color: rgba(236, 224, 196, .82) !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .45);
}

body[data-daniel-route="introduction"] main > div > section:first-child .text-primary,
body[data-daniel-route="introduction"] main > div > section:first-child [class*="text-primary"] {
  color: #d8b866 !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child .rounded-md.bg-card {
  background: rgba(12, 32, 57, .84) !important;
  border-color: rgba(201, 164, 76, .22) !important;
  box-shadow: 0 20px 60px -42px rgba(0, 0, 0, .9);
  backdrop-filter: blur(3px);
}

body[data-daniel-route="introduction"] main > div > section:first-child > div > p:first-child {
  display: inline-flex !important;
  align-items: center !important;
  gap: .7rem !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #d8b866 !important;
  font-family: "Jost", system-ui, sans-serif !important;
  font-size: .82rem !important;
  font-weight: 600 !important;
  letter-spacing: .24em !important;
  line-height: 1.3 !important;
  text-transform: uppercase !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child > div > p:first-child::before {
  content: "";
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 7v14'/%3E%3Cpath d='M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 7v14'/%3E%3Cpath d='M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z'/%3E%3C/svg%3E") center / contain no-repeat;
}

body[data-daniel-route="introduction"] main > div > section:first-child > div > h1 {
  max-width: min(100%, 72rem) !important;
  margin: 1.25rem 0 0 !important;
  color: #f3e8cc !important;
  font-size: 0 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-shadow: 0 18px 42px rgba(0, 0, 0, .34);
}

body[data-daniel-route="introduction"] main > div > section:first-child > div > h1::before,
body[data-daniel-route="introduction"] main > div > section:first-child > div > h1::after {
  display: block;
}

body[data-daniel-route="introduction"] main > div > section:first-child > div > h1::before {
  content: "Introduction to the Book of";
  margin-bottom: 1.125rem;
  color: #d8b866;
  font-family: "Jost", system-ui, sans-serif;
  font-size: clamp(1.32rem, 2.5vw, 2.25rem);
  font-weight: 500;
  letter-spacing: .18em;
  line-height: 1;
  white-space: nowrap;
}

body[data-daniel-route="introduction"] main > div > section:first-child > div > h1::after {
  content: "Daniel";
  color: #f3e8cc;
  font-family: "Cinzel", Georgia, serif;
  font-size: clamp(4.5rem, 8vw, 7rem);
  font-weight: 500;
  letter-spacing: 0;
  line-height: .9;
  white-space: nowrap;
}

body[data-daniel-route="introduction"] main > div > section:first-child > div > h1 + p {
  max-width: 43rem !important;
  margin: 1.6rem 0 0 !important;
  color: #cbbf9e !important;
  font-family: "EB Garamond", Georgia, serif !important;
  font-size: 1.25rem !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child > div > h1 + p + div {
  display: none !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child + div {
  padding: .75rem clamp(2rem, 6vw, 5.5rem) 1.8rem !important;
  border-color: rgba(201, 164, 76, .18) !important;
  background: linear-gradient(180deg, rgba(11, 31, 58, .98) 0%, rgba(8, 21, 33, .96) 100%) !important;
  color: #ece0c4 !important;
  box-shadow: none !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child + div > div {
  max-width: 100rem !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child + div > div > div:first-child {
  color: #d8b866 !important;
  border-color: rgba(201, 164, 76, .22) !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child + div > div > div:first-child p {
  color: #d8b866 !important;
  font-family: "Jost", system-ui, sans-serif !important;
  font-size: .78rem !important;
  font-weight: 600 !important;
  letter-spacing: .22em !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child + div nav {
  gap: .75rem !important;
  margin-top: 0 !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child + div nav a {
  min-height: 3.1rem !important;
  padding: .8rem 1rem !important;
  border-color: rgba(201, 164, 76, .22) !important;
  border-radius: 5px !important;
  background: rgba(18, 38, 63, .72) !important;
  color: #b9ad90 !important;
  font-family: "Jost", system-ui, sans-serif !important;
  font-size: .86rem !important;
  font-weight: 600 !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child + div nav a span:first-child {
  color: #d8b866 !important;
}

body[data-daniel-route="introduction"] main > div > section:first-child + div nav a:hover {
  border-color: rgba(201, 164, 76, .45) !important;
  background: rgba(201, 164, 76, .12) !important;
  color: #fff2d4 !important;
}

body[data-daniel-route="introduction"] main article.max-w-3xl {
  width: 100%;
  max-width: none !important;
}

@media (max-width: 760px) {
  body[data-daniel-route="introduction"] main > div > section:first-child {
    min-height: 25rem;
    padding: 3rem 1.35rem 1.75rem !important;
  }

  body[data-daniel-route="introduction"] main > div > section:first-child::before {
    background-position: 64% top;
    opacity: .52;
  }

  body[data-daniel-route="introduction"] main > div > section:first-child > div > p:first-child {
    font-size: .72rem !important;
    letter-spacing: .18em !important;
  }

  body[data-daniel-route="introduction"] main > div > section:first-child > div > h1::before {
    margin-bottom: .72rem;
    font-size: 1rem;
    line-height: 1.3;
    letter-spacing: .12em;
    white-space: normal;
  }

  body[data-daniel-route="introduction"] main > div > section:first-child > div > h1::after {
    font-size: 3.75rem;
    white-space: normal;
  }

  body[data-daniel-route="introduction"] main > div > section:first-child > div > h1 + p {
    margin-top: 1.25rem !important;
    font-size: 1.08rem !important;
  }

  body[data-daniel-route="introduction"] main > div > section:first-child + div {
    padding-right: 1.25rem !important;
    padding-left: 1.25rem !important;
  }

  body[data-daniel-route="home"] main > section:first-child > div:first-child {
    min-height: clamp(27rem, 60svh, 32rem) !important;
    padding-top: 2.5rem !important;
    padding-bottom: 2rem !important;
  }

}

/* Wordmark → Cinzel (the unique tracking-[0.3em] span in the header). */
.tracking-\[0\.3em\] {
  font-family: "Cinzel", Georgia, serif !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  font-size: .98rem !important;
}

/* Let Daniel 11's timeline spine continue through the gaps between cards
   without changing the chart's original colors. */
body[data-daniel-chart="daniel-11"] div.relative.grid.min-w-0.gap-6.overflow-x-hidden,
body[data-daniel-chart="daniel-11"] div.group.relative.isolate.grid.cursor-pointer.gap-4.overflow-hidden.rounded-lg.border {
  overflow: visible !important;
}

/* Avoid a white flash from the shell's loading skeleton. */
body > #root:empty::before {
  background:
    linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,.12), rgba(255,255,255,.05)) 0 0 / 220% 100%,
    linear-gradient(180deg, #0e2138 0%, #0b1f3a 100%) !important;
  border-color: rgba(201,164,76,.18) !important;
}

/* ---- Shared MBE shell (header / footer) --------------------------------
   Dark by default, matching the Daniel app theme. */
:root,
.dark {
  --mbe-ink: #ece0c4;
  --mbe-bg: #0b1f3a;
  --mbe-soft: #16304c;
  --mbe-muted: #b9ad90;
  --mbe-ivory: #0e2138;
  --mbe-rule: rgba(201,164,76,.18);
  --mbe-navy: #ece0c4;
  --mbe-gold-dark: #d8b866;
}

.mbe-global-shell,
.mbe-global-footer {
  background: linear-gradient(180deg, #0e2138 0%, #0b1f3a 100%) !important;
  border-color: var(--mbe-rule) !important;
  color: var(--mbe-muted);
}

.mbe-ribbon-brand { color: var(--mbe-navy); }
.mbe-ribbon-back::before { background: rgba(201,164,76,.30); }

/* My Bible Explorer logo art is dark-on-transparent; render it light on navy. */
.mbe-ribbon-logo,
.mbe-footer-logo {
  filter: grayscale(1) brightness(0) invert(88%) sepia(18%) saturate(320%) hue-rotate(2deg);
}

.mbe-library-panel {
  background: #12263f !important;
  color: #ece0c4 !important;
  border-color: rgba(201,164,76,.22) !important;
  box-shadow: 0 26px 60px -30px rgba(0,0,0,.7) !important;
}
.mbe-library-item { color: #ece0c4 !important; }
.mbe-library-item:hover { background: #17304c !important; }
.mbe-library-item[aria-current="page"] { background: rgba(201,164,76,.16) !important; }
.mbe-library-name { color: #f3e8cc !important; }
.mbe-library-desc { color: #b1a488 !important; }

.mbe-footer-link { color: #e0c37e !important; border-bottom-color: rgba(201,164,76,.45) !important; }
.mbe-footer-link:hover { color: #fff2d4 !important; border-bottom-color: #e0c37e !important; }

/* Text selection tint. */
::selection { background: rgba(201,164,76,.35); color: #fff6e4; }

/* Keep independently scrolled chapter panes from extending the document's
   visual overflow below the global footer. */
html:has(body[data-daniel-chapter]) {
  height: 100% !important;
  overflow: hidden !important;
}

body[data-daniel-chapter] {
  height: 100% !important;
  min-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}