/* ============================================================
   IMPORTS
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;600;700&family=Caveat:wght@400;600&family=Lato:wght@300;400;700&display=swap');

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
:root {
  /* Dark / neutral palette (entry + map) */
  --dark-bg:       #09060f;
  --dark-surface:  #12091c;
  --dark-border:   rgba(212,175,122,.18);
  --gold:          #d4af7a;
  --gold-glow:     rgba(212,175,122,.25);
  --rose:          #c4607a;
  --text-light:    #f5e8d0;
  --text-muted:    rgba(245,232,208,.5);

  /* Chapter 1 — warm summer evening */
  --ch1-bg:        #fdf6ee;
  --ch1-surface:   #fef0e0;
  --ch1-card:      #fffff8;
  --ch1-text:      #3d2b1f;
  --ch1-muted:     #9a7060;
  --ch1-primary:   #e8844a;
  --ch1-secondary: #d4507e;
  --ch1-accent:    #f5c842;

  /* Chapter 2 — autumn */
  --ch2-bg:        #faf4ec;
  --ch2-surface:   #f5ece0;
  --ch2-card:      #fffdf8;
  --ch2-text:      #3a2518;
  --ch2-muted:     #96704a;
  --ch2-primary:   #c05030;
  --ch2-secondary: #a04828;

  /* Chapter 3 — spring */
  --ch3-bg:        #f8f4fb;
  --ch3-surface:   #f0e8f5;
  --ch3-card:      #fdfaff;
  --ch3-text:      #2e1f38;
  --ch3-muted:     #806898;
  --ch3-primary:   #9060c0;
  --ch3-secondary: #d060a0;

  /* Chapter 4 — graduation green/gold */
  --ch4-bg:        #f4f9f2;
  --ch4-surface:   #e8f4e4;
  --ch4-card:      #fafffc;
  --ch4-text:      #1e3220;
  --ch4-muted:     #5a7858;
  --ch4-primary:   #3a8050;
  --ch4-secondary: #c09828;

  /* Typography */
  --font-heading: 'Dancing Script', cursive;
  --font-accent:  'Caveat', cursive;
  --font-body:    'Lato', sans-serif;

  /* Spacing */
  --sp-xs:  .25rem;
  --sp-sm:  .5rem;
  --sp-md:  1rem;
  --sp-lg:  2rem;
  --sp-xl:  3rem;
  --sp-2xl: 5rem;

  --ease: .3s ease;
}

/* ============================================================
   RESET
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html   { font-size: 16px; scroll-behavior: smooth; }
body   { font-family: var(--font-body); -webkit-font-smoothing: antialiased; }
img    { max-width: 100%; height: auto; display: block; }
button { font-family: inherit; cursor: pointer; border: none; }
a      { color: inherit; }

/* ============================================================
   ENTRY SCREEN
   ============================================================ */
.entry-screen {
  min-height: 100dvh;
  background: var(--dark-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  padding: var(--sp-lg);
}

/* Soft bokeh blobs */
.entry-screen::before,
.entry-screen::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(90px);
}
.entry-screen::before {
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(212,175,122,.22) 0%, transparent 70%);
  top: -10%; left: 5%;
  animation: blob1 9s ease-in-out infinite;
}
.entry-screen::after {
  width: 420px; height: 420px;
  background: radial-gradient(circle, rgba(196,96,122,.18) 0%, transparent 70%);
  bottom: 0; right: 0;
  animation: blob2 12s ease-in-out infinite;
}
@keyframes blob1 {
  0%,100% { transform: translate(0,0); }
  40%     { transform: translate(60px,-40px); }
  70%     { transform: translate(-20px,30px); }
}
@keyframes blob2 {
  0%,100% { transform: translate(0,0); }
  50%     { transform: translate(-50px,-60px); }
}

/* Particles */
.particles      { position: absolute; inset: 0; pointer-events: none; }
.particle {
  position: absolute;
  border-radius: 50%;
  background: rgba(245,200,120,.7);
  animation: twinkle var(--dur,4s) ease-in-out infinite;
  animation-delay: var(--delay,0s);
}
@keyframes twinkle {
  0%,100% { opacity:0; transform:scale(.4); }
  50%     { opacity:1; transform:scale(1.2); }
}

/* Content card */
.entry-content {
  position: relative;
  z-index: 1;
  text-align: center;
  width: 100%;
  max-width: 380px;
}
.entry-for {
  font-family: var(--font-accent);
  font-size: 1rem;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: rgba(212,175,122,.65);
  margin-bottom: var(--sp-sm);
}
.entry-title {
  font-family: var(--font-heading);
  font-size: clamp(3rem, 9vw, 4.5rem);
  color: var(--text-light);
  line-height: 1;
  margin-bottom: var(--sp-lg);
  text-shadow: 0 0 60px var(--gold-glow);
}
.entry-rule {
  width: 60px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  margin: 0 auto var(--sp-lg);
}
.entry-label {
  font-family: var(--font-accent);
  font-size: 1.1rem;
  color: rgba(212,175,122,.8);
  margin-bottom: var(--sp-md);
}
.entry-input {
  width: 100%;
  padding: .9rem 1rem;
  font-family: var(--font-accent);
  font-size: 2.4rem;
  letter-spacing: 1.4rem;
  text-align: center;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--dark-border);
  border-radius: 14px;
  color: var(--text-light);
  outline: none;
  caret-color: var(--gold);
  transition: border-color var(--ease), box-shadow var(--ease);
  margin-bottom: var(--sp-sm);
}
.entry-input:focus {
  border-color: rgba(212,175,122,.55);
  box-shadow: 0 0 24px rgba(212,175,122,.12);
}
.entry-input.error {
  border-color: rgba(220,80,80,.6);
  animation: shake .4s ease;
}
.entry-input.success {
  border-color: rgba(100,200,130,.6);
}
@keyframes shake {
  20% { transform: translateX(-8px); }
  40% { transform: translateX( 8px); }
  60% { transform: translateX(-5px); }
  80% { transform: translateX( 5px); }
}
.entry-error {
  font-family: var(--font-accent);
  font-size: .95rem;
  color: rgba(230,130,130,.9);
  min-height: 1.4em;
  margin-bottom: var(--sp-sm);
  transition: opacity var(--ease);
}
.entry-btn {
  width: 100%;
  padding: .95rem;
  font-family: var(--font-heading);
  font-size: 1.5rem;
  color: #1a1020;
  background: linear-gradient(135deg, #d4af7a 0%, #c09050 100%);
  border-radius: 14px;
  transition: transform var(--ease), box-shadow var(--ease);
  box-shadow: 0 4px 24px rgba(212,175,122,.3);
}
.entry-btn:hover  { transform: translateY(-2px); box-shadow: 0 8px 32px rgba(212,175,122,.4); }
.entry-btn:active { transform: translateY(0); }
.entry-hint {
  margin-top: var(--sp-lg);
  font-family: var(--font-accent);
  font-size: .9rem;
  color: rgba(212,175,122,.3);
  font-style: italic;
}

/* ============================================================
   MAP PAGE
   ============================================================ */
.map-page { min-height: 100dvh; background: var(--dark-bg); color: var(--text-light); }

.map-header {
  position: sticky; top: 0; z-index: 200;
  padding: .85rem var(--sp-lg);
  background: rgba(9,6,15,.9);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--dark-border);
  display: flex; align-items: center; justify-content: space-between;
}
.map-header-title {
  font-family: var(--font-heading);
  font-size: 1.7rem;
  color: var(--gold);
}
.map-progress {
  font-family: var(--font-accent);
  font-size: .9rem;
  color: var(--text-muted);
}

#map { width: 100%; height: 52vh; min-height: 280px; }

/* Leaflet popup override */
.leaflet-popup-content-wrapper {
  background: #1c1228;
  border: 1px solid rgba(212,175,122,.28);
  border-radius: 14px;
  color: var(--text-light);
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
}
.leaflet-popup-tip { background: #1c1228; }
.leaflet-popup-content { margin: 12px 14px; }

.popup-title {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  color: var(--gold);
  margin-bottom: 2px;
}
.popup-sub {
  font-family: var(--font-accent);
  font-size: .85rem;
  color: var(--text-muted);
  margin-bottom: 8px;
}
.popup-link, .popup-unlock-btn {
  display: inline-block;
  padding: 6px 16px;
  font-family: var(--font-accent);
  font-size: .95rem;
  border-radius: 20px;
  transition: opacity var(--ease);
  text-decoration: none;
  cursor: pointer;
}
.popup-link        { background: var(--gold); color: #12091c; }
.popup-unlock-btn  { background: rgba(212,175,122,.15); color: var(--gold); border: 1px solid rgba(212,175,122,.4); }
.popup-link:hover, .popup-unlock-btn:hover { opacity: .8; }

/* Location cards */
.locations-list {
  padding: var(--sp-md);
  max-width: 680px;
  margin: 0 auto;
}
.list-heading {
  font-family: var(--font-accent);
  font-size: .85rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: var(--sp-md) var(--sp-sm) var(--sp-sm);
}
.location-card {
  display: flex; align-items: center; gap: var(--sp-md);
  padding: var(--sp-md);
  margin-bottom: .5rem;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
  text-decoration: none; color: inherit;
  transition: all var(--ease);
  cursor: pointer;
}
.location-card.is-unlocked {
  border-color: rgba(212,175,122,.25);
  background: rgba(212,175,122,.06);
  cursor: pointer;
}
.location-card.is-locked { opacity: .55; cursor: default; }
.location-card.is-unlocked:hover { background: rgba(212,175,122,.1); transform: translateY(-1px); }

.loc-icon {
  width: 42px; height: 42px; flex-shrink: 0;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem;
  background: rgba(255,255,255,.06);
}
.location-card.is-unlocked .loc-icon { background: rgba(212,175,122,.15); }

.loc-info { flex: 1; }
.loc-name {
  font-family: var(--font-accent);
  font-size: 1.05rem;
  color: var(--text-light);
  margin-bottom: 2px;
}
.loc-chapter {
  font-family: var(--font-body);
  font-size: .8rem;
  color: var(--text-muted);
}
.loc-arrow { color: rgba(212,175,122,.4); font-size: 1rem; transition: transform var(--ease); }
.location-card.is-unlocked .loc-arrow { color: var(--gold); }
.location-card.is-unlocked:hover .loc-arrow { transform: translateX(3px); }

/* Unlock modal */
.modal-backdrop {
  display: none;
  position: fixed; inset: 0; z-index: 500;
  background: rgba(0,0,0,.7);
  backdrop-filter: blur(6px);
  align-items: flex-end; justify-content: center;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
.modal-backdrop.open { display: flex; }
.modal-sheet {
  width: 100%; max-width: 480px;
  background: #1c1228;
  border: 1px solid rgba(212,175,122,.2);
  border-radius: 24px 24px 0 0;
  padding: var(--sp-lg) var(--sp-lg) calc(var(--sp-lg) + env(safe-area-inset-bottom, 0));
  animation: slideUp .35s ease;
}
@keyframes slideUp {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}
.modal-handle {
  width: 40px; height: 4px;
  background: rgba(255,255,255,.2);
  border-radius: 2px;
  margin: 0 auto var(--sp-md);
}
.modal-loc-title {
  font-family: var(--font-heading);
  font-size: 1.8rem;
  color: var(--gold);
  margin-bottom: 4px;
}
.modal-chapter-info {
  font-family: var(--font-accent);
  font-size: 1rem;
  color: var(--text-muted);
  margin-bottom: var(--sp-lg);
}
.modal-unlock-btn {
  width: 100%;
  padding: 1rem;
  font-family: var(--font-heading);
  font-size: 1.4rem;
  color: #12091c;
  background: linear-gradient(135deg, var(--gold) 0%, #b8904a 100%);
  border-radius: 14px;
  box-shadow: 0 4px 20px rgba(212,175,122,.3);
  transition: transform var(--ease), box-shadow var(--ease);
}
.modal-unlock-btn:hover   { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(212,175,122,.4); }
.modal-unlock-btn:disabled { opacity: .6; cursor: default; transform: none; }
.modal-status {
  margin-top: var(--sp-md);
  font-family: var(--font-accent);
  font-size: 1rem;
  color: var(--text-muted);
  text-align: center;
  min-height: 1.5em;
}
.modal-go-btn {
  display: block; width: 100%; text-align: center;
  padding: 1rem;
  font-family: var(--font-heading);
  font-size: 1.4rem;
  color: white;
  background: linear-gradient(135deg, #e8844a 0%, #d4507e 100%);
  border-radius: 14px;
  text-decoration: none;
  margin-top: var(--sp-md);
  box-shadow: 0 4px 20px rgba(232,132,74,.3);
  transition: transform var(--ease);
}
.modal-go-btn:hover { transform: translateY(-2px); }
.modal-close {
  position: absolute; top: 16px; right: 20px;
  font-size: 1.4rem; color: var(--text-muted);
  background: none; cursor: pointer; line-height: 1;
}

/* ============================================================
   CHAPTER PAGES — shared
   ============================================================ */
/* Locked state */
.locked-view {
  min-height: 100dvh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center; padding: var(--sp-xl) var(--sp-lg);
}
.lock-icon   { font-size: 4rem; margin-bottom: var(--sp-lg); opacity: .45; }
.locked-title {
  font-family: var(--font-heading);
  font-size: 2rem; margin-bottom: var(--sp-md);
}
.locked-msg {
  font-family: var(--font-accent);
  font-size: 1rem; line-height: 1.7;
  max-width: 300px; margin-bottom: var(--sp-xl);
}
.unlock-btn {
  padding: .9rem 2.2rem;
  font-family: var(--font-heading);
  font-size: 1.35rem; color: white;
  background: linear-gradient(135deg, #e8844a 0%, #d4507e 100%);
  border-radius: 50px;
  box-shadow: 0 4px 22px rgba(232,132,74,.3);
  transition: transform var(--ease), box-shadow var(--ease);
}
.unlock-btn:hover    { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(232,132,74,.4); }
.unlock-btn:disabled { opacity:.6; cursor:default; transform:none; }
.unlock-status {
  margin-top: var(--sp-md);
  font-family: var(--font-accent);
  font-size: .95rem; min-height: 2em; line-height: 1.5;
}

/* Chapter nav */
.chapter-nav {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; gap: var(--sp-md);
  padding: .8rem var(--sp-lg);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.back-btn {
  display: flex; align-items: center; gap: 4px;
  font-family: var(--font-accent);
  font-size: .95rem; text-decoration: none;
  transition: opacity var(--ease);
}
.back-btn:hover { opacity: .65; }
.chapter-nav-title {
  font-family: var(--font-heading);
  font-size: 1.15rem;
}

/* Chapter hero */
.chapter-hero {
  padding: var(--sp-2xl) var(--sp-lg) var(--sp-xl);
  text-align: center;
  position: relative; overflow: hidden;
}
.hero-glow {
  position: absolute; inset: 0; pointer-events: none;
}
.chapter-number {
  font-family: var(--font-accent);
  font-size: .85rem;
  letter-spacing: 3px; text-transform: uppercase;
  margin-bottom: var(--sp-sm);
}
.chapter-title {
  font-family: var(--font-heading);
  font-size: clamp(2.8rem, 9vw, 5rem);
  line-height: 1.05;
  margin-bottom: .4rem;
}
.chapter-subtitle {
  font-family: var(--font-accent);
  font-size: 1.1rem;
  margin-bottom: var(--sp-lg);
}
.hero-divider {
  display: flex; align-items: center; gap: var(--sp-md); justify-content: center;
}
.hero-line { flex: 0 0 60px; height: 1px; }
.hero-heart { font-size: .9rem; }

/* Story sections */
.chapter-section {
  max-width: 680px; margin: 0 auto;
  padding: var(--sp-xl) var(--sp-lg);
}
.section-eyebrow {
  font-family: var(--font-accent);
  font-size: .85rem; letter-spacing: 2px; text-transform: uppercase;
  margin-bottom: var(--sp-sm);
}
.section-heading {
  font-family: var(--font-heading);
  font-size: 2rem; margin-bottom: var(--sp-md);
}
.story-body {
  font-family: var(--font-body);
  font-size: 1.05rem; line-height: 1.85;
}
.story-body p { margin-bottom: var(--sp-md); }

/* Placeholder blocks (Reese fills these in) */
.placeholder {
  font-family: var(--font-accent);
  font-size: 1rem; font-style: italic; line-height: 1.7;
  padding: var(--sp-md) var(--sp-lg);
  border-left: 3px solid rgba(0,0,0,.12);
  border-radius: 0 8px 8px 0;
  background: rgba(0,0,0,.04);
  margin-bottom: var(--sp-md);
}

/* Pull-quote */
.pull-quote {
  text-align: center;
  padding: var(--sp-xl) var(--sp-lg);
}
.quote-mark {
  font-family: var(--font-heading);
  font-size: 4rem; line-height: .5;
  opacity: .25;
  margin-bottom: var(--sp-md);
  display: block;
}
.quote-text {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 4vw, 2.2rem);
  line-height: 1.35;
  max-width: 520px; margin: 0 auto var(--sp-sm);
}
.quote-attr {
  font-family: var(--font-accent);
  font-size: .95rem;
}

/* ============================================================
   POLAROID GALLERY
   ============================================================ */
.gallery-section {
  padding: var(--sp-xl) var(--sp-sm);
}
.gallery-heading {
  font-family: var(--font-heading);
  font-size: 2rem; text-align: center;
  margin-bottom: var(--sp-xl);
}
.polaroid-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.5rem 1.5rem;
  max-width: 900px; margin: 0 auto;
  padding: var(--sp-lg) var(--sp-md);
}
@media (min-width: 600px) {
  .polaroid-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 900px) {
  .polaroid-grid { grid-template-columns: repeat(4, 1fr); gap: 3rem 2rem; }
}

.polaroid {
  background: #fffff8;
  padding: 8px 8px 36px;
  box-shadow: 0 4px 18px rgba(0,0,0,.13), 0 1px 4px rgba(0,0,0,.07);
  transform: rotate(var(--r, -2deg));
  transition: transform .3s ease, box-shadow .3s ease;
  position: relative; cursor: zoom-in;
  border: 1px solid rgba(0,0,0,.04);
}
.polaroid:nth-child(2n) { --r:  1.8deg; }
.polaroid:nth-child(3n) { --r: -1.2deg; }
.polaroid:nth-child(4n) { --r:  2.6deg; }
.polaroid:nth-child(5n) { --r: -2.4deg; }
.polaroid:nth-child(6n) { --r:  0.7deg; }

.polaroid:hover {
  transform: rotate(0deg) scale(1.06) translateY(-4px);
  box-shadow: 0 14px 40px rgba(0,0,0,.2);
  z-index: 10;
}
/* Tape strip */
.polaroid::before {
  content: '';
  position: absolute; top: -10px; left: 50%;
  transform: translateX(-50%);
  width: 36px; height: 16px;
  background: rgba(245,220,120,.65);
  border-radius: 2px;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}
.polaroid-img {
  width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block;
  background: linear-gradient(135deg, #e0d4c0, #ccc0a8);
  image-orientation: from-image;
}
.polaroid-img.loading { filter: blur(2px); transition: filter .4s ease; }
.polaroid-caption {
  font-family: var(--font-accent);
  font-size: .82rem; text-align: center;
  margin-top: 6px; padding: 0 4px; line-height: 1.3;
}

/* Lightbox */
.lightbox {
  display: none; position: fixed; inset: 0; z-index: 900;
  background: rgba(0,0,0,.9);
  align-items: center; justify-content: center;
  padding: var(--sp-lg);
}
.lightbox.open { display: flex; }
.lightbox-img  {
  max-width: 100%; max-height: 90dvh;
  border-radius: 4px;
  box-shadow: 0 8px 60px rgba(0,0,0,.7);
  animation: fadeIn .2s ease;
  image-orientation: from-image;
}
@keyframes fadeIn { from { opacity:0; transform:scale(.95); } to { opacity:1; transform:scale(1); } }
.lightbox-close {
  position: absolute; top: 20px; right: 20px;
  font-size: 2rem; color: white; opacity: .7;
  background: none; line-height: 1;
  transition: opacity var(--ease);
}
.lightbox-close:hover { opacity: 1; }

/* ============================================================
   WHAT'S NEXT CTA
   ============================================================ */
.whats-next {
  text-align: center;
  padding: var(--sp-2xl) var(--sp-lg);
}
.next-eyebrow {
  font-family: var(--font-accent);
  font-size: .85rem; letter-spacing: 2px; text-transform: uppercase;
  margin-bottom: var(--sp-sm);
}
.next-title {
  font-family: var(--font-heading);
  font-size: clamp(2rem, 6vw, 3rem);
  margin-bottom: var(--sp-md);
}
.next-hint {
  font-family: var(--font-accent);
  font-size: 1rem; line-height: 1.7;
  max-width: 400px; margin: 0 auto var(--sp-xl);
}
.cta-btn {
  display: inline-flex; align-items: center; gap: var(--sp-sm);
  padding: 1rem 2.2rem;
  font-family: var(--font-heading);
  font-size: 1.5rem; color: white;
  border-radius: 50px; text-decoration: none;
  transition: transform var(--ease), box-shadow var(--ease);
}
.cta-btn:hover   { transform: translateY(-3px); }
.cta-btn:active  { transform: translateY(0); }

/* ============================================================
   PLACEHOLDER CHAPTER (2/3/4)
   ============================================================ */
.placeholder-chapter {
  min-height: 100dvh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center; padding: var(--sp-xl) var(--sp-lg);
}
.placeholder-chapter-title {
  font-family: var(--font-heading);
  font-size: 2.5rem; margin-bottom: var(--sp-md);
}
.placeholder-chapter-note {
  font-family: var(--font-accent);
  font-size: 1rem; line-height: 1.7;
  max-width: 420px; padding: var(--sp-md) var(--sp-lg);
  border-radius: 12px;
  border: 1px dashed rgba(0,0,0,.2);
  background: rgba(0,0,0,.04);
}

/* ============================================================
   CHAPTER 1 THEMING
   ============================================================ */
.ch1 { background: var(--ch1-bg); color: var(--ch1-text); }
.ch1 .chapter-nav {
  background: rgba(253,246,238,.88);
  border-bottom-color: rgba(232,132,74,.15);
}
.ch1 .back-btn          { color: var(--ch1-primary); }
.ch1 .chapter-nav-title { color: var(--ch1-text); }
.ch1 .chapter-hero      { background: linear-gradient(180deg, #fdf0e0 0%, var(--ch1-bg) 100%); }
.ch1 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(245,200,70,.14) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(232,132,74,.11) 0%, transparent 60%);
}
.ch1 .chapter-number    { color: var(--ch1-primary); }
.ch1 .chapter-title     { color: var(--ch1-text); }
.ch1 .chapter-subtitle  { color: var(--ch1-muted); }
.ch1 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch1-primary), transparent); }
.ch1 .hero-heart        { color: var(--ch1-secondary); }
.ch1 .section-eyebrow   { color: var(--ch1-primary); }
.ch1 .section-heading   { color: var(--ch1-text); }
.ch1 .story-body        { color: var(--ch1-text); }
.ch1 .placeholder       { border-left-color: rgba(232,132,74,.35); background: rgba(232,132,74,.05); color: var(--ch1-muted); }
.ch1 .pull-quote        { background: linear-gradient(135deg, var(--ch1-surface) 0%, var(--ch1-bg) 100%); }
.ch1 .quote-text        { color: var(--ch1-text); }
.ch1 .quote-attr        { color: var(--ch1-muted); }
.ch1 .gallery-section   { background: var(--ch1-surface); }
.ch1 .gallery-heading   { color: var(--ch1-text); }
.ch1 .polaroid-caption  { color: var(--ch1-muted); }
.ch1 .whats-next        { background: linear-gradient(180deg, var(--ch1-bg) 0%, #fde0c8 100%); }
.ch1 .next-eyebrow      { color: var(--ch1-primary); }
.ch1 .next-title        { color: var(--ch1-text); }
.ch1 .next-hint         { color: var(--ch1-muted); }
.ch1 .cta-btn {
  background: linear-gradient(135deg, var(--ch1-primary) 0%, var(--ch1-secondary) 100%);
  box-shadow: 0 4px 24px rgba(232,132,74,.35);
}
.ch1 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(232,132,74,.45); }
.ch1 .locked-view       { background: var(--ch1-bg); color: var(--ch1-text); }
.ch1 .locked-title      { color: var(--ch1-text); }
.ch1 .locked-msg        { color: var(--ch1-muted); }

/* ============================================================
   CHAPTER 2 THEMING
   ============================================================ */
.ch2 { background: var(--ch2-bg); color: var(--ch2-text); }
.ch2 .chapter-nav {
  background: rgba(250,244,236,.88);
  border-bottom-color: rgba(192,80,48,.15);
}
.ch2 .back-btn          { color: var(--ch2-primary); }
.ch2 .chapter-nav-title { color: var(--ch2-text); }
.ch2 .chapter-hero      { background: linear-gradient(180deg, #f5e8d4 0%, var(--ch2-bg) 100%); }
.ch2 .chapter-number    { color: var(--ch2-primary); }
.ch2 .chapter-title     { color: var(--ch2-text); }
.ch2 .chapter-subtitle  { color: var(--ch2-muted); }
.ch2 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch2-primary), transparent); }
.ch2 .hero-heart        { color: var(--ch2-secondary); }
.ch2 .section-eyebrow   { color: var(--ch2-primary); }
.ch2 .gallery-section   { background: var(--ch2-surface); }
.ch2 .whats-next        { background: linear-gradient(180deg, var(--ch2-bg) 0%, #f0dcc8 100%); }
.ch2 .next-eyebrow      { color: var(--ch2-primary); }
.ch2 .next-title        { color: var(--ch2-text); }
.ch2 .next-hint         { color: var(--ch2-muted); }
.ch2 .cta-btn {
  background: linear-gradient(135deg, var(--ch2-primary) 0%, var(--ch2-secondary) 100%);
  box-shadow: 0 4px 24px rgba(192,80,48,.35);
}
.ch2 .locked-view       { background: var(--ch2-bg); color: var(--ch2-text); }
.ch2 .placeholder-chapter { background: var(--ch2-bg); color: var(--ch2-text); }
.ch2 .placeholder-chapter-title { color: var(--ch2-text); }

/* ============================================================
   CHAPTER 3 THEMING
   ============================================================ */
.ch3 { background: var(--ch3-bg); color: var(--ch3-text); }
.ch3 .chapter-nav {
  background: rgba(248,244,251,.88);
  border-bottom-color: rgba(144,96,192,.15);
}
.ch3 .back-btn          { color: var(--ch3-primary); }
.ch3 .chapter-nav-title { color: var(--ch3-text); }
.ch3 .chapter-hero      { background: linear-gradient(180deg, #eee0f8 0%, var(--ch3-bg) 100%); }
.ch3 .chapter-number    { color: var(--ch3-primary); }
.ch3 .chapter-title     { color: var(--ch3-text); }
.ch3 .chapter-subtitle  { color: var(--ch3-muted); }
.ch3 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch3-primary), transparent); }
.ch3 .hero-heart        { color: var(--ch3-secondary); }
.ch3 .section-eyebrow   { color: var(--ch3-primary); }
.ch3 .gallery-section   { background: var(--ch3-surface); }
.ch3 .whats-next        { background: linear-gradient(180deg, var(--ch3-bg) 0%, #e8d0f4 100%); }
.ch3 .next-eyebrow      { color: var(--ch3-primary); }
.ch3 .next-title        { color: var(--ch3-text); }
.ch3 .next-hint         { color: var(--ch3-muted); }
.ch3 .cta-btn {
  background: linear-gradient(135deg, var(--ch3-primary) 0%, var(--ch3-secondary) 100%);
  box-shadow: 0 4px 24px rgba(144,96,192,.35);
}
.ch3 .locked-view       { background: var(--ch3-bg); color: var(--ch3-text); }
.ch3 .placeholder-chapter { background: var(--ch3-bg); color: var(--ch3-text); }
.ch3 .placeholder-chapter-title { color: var(--ch3-text); }

/* ============================================================
   CHAPTER 4 THEMING
   ============================================================ */
.ch4 { background: var(--ch4-bg); color: var(--ch4-text); }
.ch4 .chapter-nav {
  background: rgba(244,249,242,.88);
  border-bottom-color: rgba(58,128,80,.15);
}
.ch4 .back-btn          { color: var(--ch4-primary); }
.ch4 .chapter-nav-title { color: var(--ch4-text); }
.ch4 .chapter-hero      { background: linear-gradient(180deg, #d8f0dc 0%, var(--ch4-bg) 100%); }
.ch4 .chapter-number    { color: var(--ch4-primary); }
.ch4 .chapter-title     { color: var(--ch4-text); }
.ch4 .chapter-subtitle  { color: var(--ch4-muted); }
.ch4 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch4-primary), transparent); }
.ch4 .hero-heart        { color: var(--ch4-secondary); }
.ch4 .section-eyebrow   { color: var(--ch4-primary); }
.ch4 .gallery-section   { background: var(--ch4-surface); }
.ch4 .whats-next        { background: linear-gradient(180deg, var(--ch4-bg) 0%, #d4ecd4 100%); }
.ch4 .next-eyebrow      { color: var(--ch4-primary); }
.ch4 .next-title        { color: var(--ch4-text); }
.ch4 .next-hint         { color: var(--ch4-muted); }
.ch4 .cta-btn {
  background: linear-gradient(135deg, var(--ch4-primary) 0%, var(--ch4-secondary) 100%);
  box-shadow: 0 4px 24px rgba(58,128,80,.35);
}
.ch4 .locked-view       { background: var(--ch4-bg); color: var(--ch4-text); }
.ch4 .placeholder-chapter { background: var(--ch4-bg); color: var(--ch4-text); }
.ch4 .placeholder-chapter-title { color: var(--ch4-text); }

/* ============================================================
   LEAFLET PIN ICONS
   ============================================================ */
.pin-wrap {
  width: 36px; height: 44px; position: relative;
}
.pin-body {
  width: 36px; height: 36px;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 3px 10px rgba(0,0,0,.35);
  transition: transform .2s ease;
}
.pin-body.unlocked-pin {
  background: linear-gradient(135deg, #d4af7a 0%, #c09050 100%);
}
.pin-body.locked-pin {
  background: rgba(80,70,100,.6);
  border: 2px solid rgba(255,255,255,.2);
}
.pin-emoji { transform: rotate(45deg); font-size: .95rem; }
.pin-shadow {
  position: absolute; bottom: 0; left: 50%;
  transform: translateX(-50%);
  width: 12px; height: 4px;
  background: rgba(0,0,0,.25);
  border-radius: 50%;
  filter: blur(2px);
}
.pin-pulse {
  position: absolute; inset: -4px;
  border-radius: 50%;
  border: 2px solid rgba(212,175,122,.5);
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
  0%,100% { transform:scale(1);   opacity:.6; }
  50%     { transform:scale(1.25); opacity:0; }
}

/* ============================================================
   CHAPTER 5 — FRESHMAN FALL
   ============================================================ */
:root {
  --ch5-bg:        #faf3f3;
  --ch5-surface:   #f5e8e8;
  --ch5-card:      #fffafa;
  --ch5-text:      #2d1010;
  --ch5-muted:     #8a5050;
  --ch5-primary:   #660000;
  --ch5-secondary: #D4AF37;
}
.ch5 { background: var(--ch5-bg); color: var(--ch5-text); }
.ch5 .chapter-nav {
  background: rgba(250,243,243,.88);
  border-bottom-color: rgba(102,0,0,.15);
}
.ch5 .back-btn          { color: var(--ch5-primary); }
.ch5 .chapter-nav-title { color: var(--ch5-text); }
.ch5 .chapter-hero      { background: linear-gradient(180deg, #f5e8e8 0%, var(--ch5-bg) 100%); }
.ch5 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(212,175,55,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(102,0,0,.10) 0%, transparent 60%);
}
.ch5 .chapter-number    { color: var(--ch5-primary); }
.ch5 .chapter-title     { color: var(--ch5-text); }
.ch5 .chapter-subtitle  { color: var(--ch5-muted); }
.ch5 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch5-primary), transparent); }
.ch5 .hero-heart        { color: var(--ch5-secondary); }
.ch5 .section-eyebrow   { color: var(--ch5-primary); }
.ch5 .section-heading   { color: var(--ch5-text); }
.ch5 .story-body        { color: var(--ch5-text); }
.ch5 .placeholder       { border-left-color: rgba(102,0,0,.35); background: rgba(102,0,0,.05); color: var(--ch5-muted); }
.ch5 .pull-quote        { background: linear-gradient(135deg, var(--ch5-surface) 0%, var(--ch5-bg) 100%); }
.ch5 .quote-text        { color: var(--ch5-text); }
.ch5 .quote-attr        { color: var(--ch5-muted); }
.ch5 .gallery-section   { background: var(--ch5-surface); }
.ch5 .gallery-heading   { color: var(--ch5-text); }
.ch5 .polaroid-caption  { color: var(--ch5-muted); }
.ch5 .whats-next        { background: linear-gradient(180deg, var(--ch5-bg) 0%, #f0dada 100%); }
.ch5 .next-eyebrow      { color: var(--ch5-primary); }
.ch5 .next-title        { color: var(--ch5-text); }
.ch5 .next-hint         { color: var(--ch5-muted); }
.ch5 .cta-btn {
  background: linear-gradient(135deg, var(--ch5-primary) 0%, var(--ch5-secondary) 100%);
  box-shadow: 0 4px 24px rgba(102,0,0,.35);
}
.ch5 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(102,0,0,.45); }
.ch5 .locked-view       { background: var(--ch5-bg); color: var(--ch5-text); }
.ch5 .locked-title      { color: var(--ch5-text); }
.ch5 .locked-msg        { color: var(--ch5-muted); }

/* ============================================================
   CHAPTER 6 — FRESHMAN WINTER
   ============================================================ */
:root {
  --ch6-bg:        #f0f2f8;
  --ch6-surface:   #e4e8f4;
  --ch6-card:      #f8faff;
  --ch6-text:      #0f1a38;
  --ch6-muted:     #5a6a8a;
  --ch6-primary:   #1a2a5e;
  --ch6-secondary: #8899cc;
}
.ch6 { background: var(--ch6-bg); color: var(--ch6-text); }
.ch6 .chapter-nav {
  background: rgba(240,242,248,.88);
  border-bottom-color: rgba(26,42,94,.15);
}
.ch6 .back-btn          { color: var(--ch6-primary); }
.ch6 .chapter-nav-title { color: var(--ch6-text); }
.ch6 .chapter-hero      { background: linear-gradient(180deg, #e4e8f4 0%, var(--ch6-bg) 100%); }
.ch6 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(136,153,204,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(26,42,94,.10) 0%, transparent 60%);
}
.ch6 .chapter-number    { color: var(--ch6-primary); }
.ch6 .chapter-title     { color: var(--ch6-text); }
.ch6 .chapter-subtitle  { color: var(--ch6-muted); }
.ch6 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch6-primary), transparent); }
.ch6 .hero-heart        { color: var(--ch6-secondary); }
.ch6 .section-eyebrow   { color: var(--ch6-primary); }
.ch6 .section-heading   { color: var(--ch6-text); }
.ch6 .story-body        { color: var(--ch6-text); }
.ch6 .placeholder       { border-left-color: rgba(26,42,94,.35); background: rgba(26,42,94,.05); color: var(--ch6-muted); }
.ch6 .pull-quote        { background: linear-gradient(135deg, var(--ch6-surface) 0%, var(--ch6-bg) 100%); }
.ch6 .quote-text        { color: var(--ch6-text); }
.ch6 .quote-attr        { color: var(--ch6-muted); }
.ch6 .gallery-section   { background: var(--ch6-surface); }
.ch6 .gallery-heading   { color: var(--ch6-text); }
.ch6 .polaroid-caption  { color: var(--ch6-muted); }
.ch6 .whats-next        { background: linear-gradient(180deg, var(--ch6-bg) 0%, #dde4f0 100%); }
.ch6 .next-eyebrow      { color: var(--ch6-primary); }
.ch6 .next-title        { color: var(--ch6-text); }
.ch6 .next-hint         { color: var(--ch6-muted); }
.ch6 .cta-btn {
  background: linear-gradient(135deg, var(--ch6-primary) 0%, var(--ch6-secondary) 100%);
  box-shadow: 0 4px 24px rgba(26,42,94,.35);
}
.ch6 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(26,42,94,.45); }
.ch6 .locked-view       { background: var(--ch6-bg); color: var(--ch6-text); }
.ch6 .locked-title      { color: var(--ch6-text); }
.ch6 .locked-msg        { color: var(--ch6-muted); }

/* ============================================================
   CHAPTER 7 — FRESHMAN SPRING, PART 1
   ============================================================ */
:root {
  --ch7-bg:        #f0fbf9;
  --ch7-surface:   #e0f5f2;
  --ch7-card:      #f8fffd;
  --ch7-text:      #0e2a28;
  --ch7-muted:     #4a8a80;
  --ch7-primary:   #1a8a80;
  --ch7-secondary: #4ecdc4;
}
.ch7 { background: var(--ch7-bg); color: var(--ch7-text); }
.ch7 .chapter-nav {
  background: rgba(240,251,249,.88);
  border-bottom-color: rgba(26,138,128,.15);
}
.ch7 .back-btn          { color: var(--ch7-primary); }
.ch7 .chapter-nav-title { color: var(--ch7-text); }
.ch7 .chapter-hero      { background: linear-gradient(180deg, #e0f5f2 0%, var(--ch7-bg) 100%); }
.ch7 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(78,205,196,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(26,138,128,.10) 0%, transparent 60%);
}
.ch7 .chapter-number    { color: var(--ch7-primary); }
.ch7 .chapter-title     { color: var(--ch7-text); }
.ch7 .chapter-subtitle  { color: var(--ch7-muted); }
.ch7 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch7-primary), transparent); }
.ch7 .hero-heart        { color: var(--ch7-secondary); }
.ch7 .section-eyebrow   { color: var(--ch7-primary); }
.ch7 .section-heading   { color: var(--ch7-text); }
.ch7 .story-body        { color: var(--ch7-text); }
.ch7 .placeholder       { border-left-color: rgba(26,138,128,.35); background: rgba(26,138,128,.05); color: var(--ch7-muted); }
.ch7 .pull-quote        { background: linear-gradient(135deg, var(--ch7-surface) 0%, var(--ch7-bg) 100%); }
.ch7 .quote-text        { color: var(--ch7-text); }
.ch7 .quote-attr        { color: var(--ch7-muted); }
.ch7 .gallery-section   { background: var(--ch7-surface); }
.ch7 .gallery-heading   { color: var(--ch7-text); }
.ch7 .polaroid-caption  { color: var(--ch7-muted); }
.ch7 .whats-next        { background: linear-gradient(180deg, var(--ch7-bg) 0%, #d8f0ec 100%); }
.ch7 .next-eyebrow      { color: var(--ch7-primary); }
.ch7 .next-title        { color: var(--ch7-text); }
.ch7 .next-hint         { color: var(--ch7-muted); }
.ch7 .cta-btn {
  background: linear-gradient(135deg, var(--ch7-primary) 0%, var(--ch7-secondary) 100%);
  box-shadow: 0 4px 24px rgba(26,138,128,.35);
}
.ch7 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(26,138,128,.45); }
.ch7 .locked-view       { background: var(--ch7-bg); color: var(--ch7-text); }
.ch7 .locked-title      { color: var(--ch7-text); }
.ch7 .locked-msg        { color: var(--ch7-muted); }

/* ============================================================
   CHAPTER 8 — ORLANDO SPRING BREAK
   ============================================================ */
:root {
  --ch8-bg:        #f0fafb;
  --ch8-surface:   #e0f4f7;
  --ch8-card:      #f5ffff;
  --ch8-text:      #0a2028;
  --ch8-muted:     #3a7a8a;
  --ch8-primary:   #0097b2;
  --ch8-secondary: #ff6b6b;
}
.ch8 { background: var(--ch8-bg); color: var(--ch8-text); }
.ch8 .chapter-nav {
  background: rgba(240,250,251,.88);
  border-bottom-color: rgba(0,151,178,.15);
}
.ch8 .back-btn          { color: var(--ch8-primary); }
.ch8 .chapter-nav-title { color: var(--ch8-text); }
.ch8 .chapter-hero      { background: linear-gradient(180deg, #e0f4f7 0%, var(--ch8-bg) 100%); }
.ch8 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(255,107,107,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(0,151,178,.10) 0%, transparent 60%);
}
.ch8 .chapter-number    { color: var(--ch8-primary); }
.ch8 .chapter-title     { color: var(--ch8-text); }
.ch8 .chapter-subtitle  { color: var(--ch8-muted); }
.ch8 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch8-primary), transparent); }
.ch8 .hero-heart        { color: var(--ch8-secondary); }
.ch8 .section-eyebrow   { color: var(--ch8-primary); }
.ch8 .section-heading   { color: var(--ch8-text); }
.ch8 .story-body        { color: var(--ch8-text); }
.ch8 .placeholder       { border-left-color: rgba(0,151,178,.35); background: rgba(0,151,178,.05); color: var(--ch8-muted); }
.ch8 .pull-quote        { background: linear-gradient(135deg, var(--ch8-surface) 0%, var(--ch8-bg) 100%); }
.ch8 .quote-text        { color: var(--ch8-text); }
.ch8 .quote-attr        { color: var(--ch8-muted); }
.ch8 .gallery-section   { background: var(--ch8-surface); }
.ch8 .gallery-heading   { color: var(--ch8-text); }
.ch8 .polaroid-caption  { color: var(--ch8-muted); }
.ch8 .whats-next        { background: linear-gradient(180deg, var(--ch8-bg) 0%, #fce8e8 100%); }
.ch8 .next-eyebrow      { color: var(--ch8-primary); }
.ch8 .next-title        { color: var(--ch8-text); }
.ch8 .next-hint         { color: var(--ch8-muted); }
.ch8 .cta-btn {
  background: linear-gradient(135deg, var(--ch8-primary) 0%, var(--ch8-secondary) 100%);
  box-shadow: 0 4px 24px rgba(0,151,178,.35);
}
.ch8 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(0,151,178,.45); }
.ch8 .locked-view       { background: var(--ch8-bg); color: var(--ch8-text); }
.ch8 .locked-title      { color: var(--ch8-text); }
.ch8 .locked-msg        { color: var(--ch8-muted); }

/* ============================================================
   CHAPTER 9 — FRESHMAN SPRING, PART 2
   ============================================================ */
:root {
  --ch9-bg:        #f4f8f0;
  --ch9-surface:   #e8f4e0;
  --ch9-card:      #f8fff4;
  --ch9-text:      #1a2e18;
  --ch9-muted:     #5a8050;
  --ch9-primary:   #4a8040;
  --ch9-secondary: #8fbc8f;
}
.ch9 { background: var(--ch9-bg); color: var(--ch9-text); }
.ch9 .chapter-nav {
  background: rgba(244,248,240,.88);
  border-bottom-color: rgba(74,128,64,.15);
}
.ch9 .back-btn          { color: var(--ch9-primary); }
.ch9 .chapter-nav-title { color: var(--ch9-text); }
.ch9 .chapter-hero      { background: linear-gradient(180deg, #e8f4e0 0%, var(--ch9-bg) 100%); }
.ch9 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(143,188,143,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(74,128,64,.10) 0%, transparent 60%);
}
.ch9 .chapter-number    { color: var(--ch9-primary); }
.ch9 .chapter-title     { color: var(--ch9-text); }
.ch9 .chapter-subtitle  { color: var(--ch9-muted); }
.ch9 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch9-primary), transparent); }
.ch9 .hero-heart        { color: var(--ch9-secondary); }
.ch9 .section-eyebrow   { color: var(--ch9-primary); }
.ch9 .section-heading   { color: var(--ch9-text); }
.ch9 .story-body        { color: var(--ch9-text); }
.ch9 .placeholder       { border-left-color: rgba(74,128,64,.35); background: rgba(74,128,64,.05); color: var(--ch9-muted); }
.ch9 .pull-quote        { background: linear-gradient(135deg, var(--ch9-surface) 0%, var(--ch9-bg) 100%); }
.ch9 .quote-text        { color: var(--ch9-text); }
.ch9 .quote-attr        { color: var(--ch9-muted); }
.ch9 .gallery-section   { background: var(--ch9-surface); }
.ch9 .gallery-heading   { color: var(--ch9-text); }
.ch9 .polaroid-caption  { color: var(--ch9-muted); }
.ch9 .whats-next        { background: linear-gradient(180deg, var(--ch9-bg) 0%, #dff0da 100%); }
.ch9 .next-eyebrow      { color: var(--ch9-primary); }
.ch9 .next-title        { color: var(--ch9-text); }
.ch9 .next-hint         { color: var(--ch9-muted); }
.ch9 .cta-btn {
  background: linear-gradient(135deg, var(--ch9-primary) 0%, var(--ch9-secondary) 100%);
  box-shadow: 0 4px 24px rgba(74,128,64,.35);
}
.ch9 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(74,128,64,.45); }
.ch9 .locked-view       { background: var(--ch9-bg); color: var(--ch9-text); }
.ch9 .locked-title      { color: var(--ch9-text); }
.ch9 .locked-msg        { color: var(--ch9-muted); }

/* ============================================================
   CHAPTER 10 — SUMMER 2023
   ============================================================ */
:root {
  --ch10-bg:        #fffbf0;
  --ch10-surface:   #fff5dc;
  --ch10-card:      #fffef8;
  --ch10-text:      #2a1e08;
  --ch10-muted:     #8a7030;
  --ch10-primary:   #d4900a;
  --ch10-secondary: #f4c842;
}
.ch10 { background: var(--ch10-bg); color: var(--ch10-text); }
.ch10 .chapter-nav {
  background: rgba(255,251,240,.88);
  border-bottom-color: rgba(212,144,10,.15);
}
.ch10 .back-btn          { color: var(--ch10-primary); }
.ch10 .chapter-nav-title { color: var(--ch10-text); }
.ch10 .chapter-hero      { background: linear-gradient(180deg, #fff5dc 0%, var(--ch10-bg) 100%); }
.ch10 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(244,200,66,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(212,144,10,.10) 0%, transparent 60%);
}
.ch10 .chapter-number    { color: var(--ch10-primary); }
.ch10 .chapter-title     { color: var(--ch10-text); }
.ch10 .chapter-subtitle  { color: var(--ch10-muted); }
.ch10 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch10-primary), transparent); }
.ch10 .hero-heart        { color: var(--ch10-secondary); }
.ch10 .section-eyebrow   { color: var(--ch10-primary); }
.ch10 .section-heading   { color: var(--ch10-text); }
.ch10 .story-body        { color: var(--ch10-text); }
.ch10 .placeholder       { border-left-color: rgba(212,144,10,.35); background: rgba(212,144,10,.05); color: var(--ch10-muted); }
.ch10 .pull-quote        { background: linear-gradient(135deg, var(--ch10-surface) 0%, var(--ch10-bg) 100%); }
.ch10 .quote-text        { color: var(--ch10-text); }
.ch10 .quote-attr        { color: var(--ch10-muted); }
.ch10 .gallery-section   { background: var(--ch10-surface); }
.ch10 .gallery-heading   { color: var(--ch10-text); }
.ch10 .polaroid-caption  { color: var(--ch10-muted); }
.ch10 .whats-next        { background: linear-gradient(180deg, var(--ch10-bg) 0%, #fff0cc 100%); }
.ch10 .next-eyebrow      { color: var(--ch10-primary); }
.ch10 .next-title        { color: var(--ch10-text); }
.ch10 .next-hint         { color: var(--ch10-muted); }
.ch10 .cta-btn {
  background: linear-gradient(135deg, var(--ch10-primary) 0%, var(--ch10-secondary) 100%);
  box-shadow: 0 4px 24px rgba(212,144,10,.35);
}
.ch10 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(212,144,10,.45); }
.ch10 .locked-view       { background: var(--ch10-bg); color: var(--ch10-text); }
.ch10 .locked-title      { color: var(--ch10-text); }
.ch10 .locked-msg        { color: var(--ch10-muted); }

/* ============================================================
   CHAPTER 11 — SCANDINAVIA
   ============================================================ */
:root {
  --ch11-bg:        #f0f4f8;
  --ch11-surface:   #e4ecf4;
  --ch11-card:      #f8fafd;
  --ch11-text:      #0e1e2e;
  --ch11-muted:     #5a7a9a;
  --ch11-primary:   #2c5f8a;
  --ch11-secondary: #7a9ab5;
}
.ch11 { background: var(--ch11-bg); color: var(--ch11-text); }
.ch11 .chapter-nav {
  background: rgba(240,244,248,.88);
  border-bottom-color: rgba(44,95,138,.15);
}
.ch11 .back-btn          { color: var(--ch11-primary); }
.ch11 .chapter-nav-title { color: var(--ch11-text); }
.ch11 .chapter-hero      { background: linear-gradient(180deg, #e4ecf4 0%, var(--ch11-bg) 100%); }
.ch11 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(122,154,181,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(44,95,138,.10) 0%, transparent 60%);
}
.ch11 .chapter-number    { color: var(--ch11-primary); }
.ch11 .chapter-title     { color: var(--ch11-text); }
.ch11 .chapter-subtitle  { color: var(--ch11-muted); }
.ch11 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch11-primary), transparent); }
.ch11 .hero-heart        { color: var(--ch11-secondary); }
.ch11 .section-eyebrow   { color: var(--ch11-primary); }
.ch11 .section-heading   { color: var(--ch11-text); }
.ch11 .story-body        { color: var(--ch11-text); }
.ch11 .placeholder       { border-left-color: rgba(44,95,138,.35); background: rgba(44,95,138,.05); color: var(--ch11-muted); }
.ch11 .pull-quote        { background: linear-gradient(135deg, var(--ch11-surface) 0%, var(--ch11-bg) 100%); }
.ch11 .quote-text        { color: var(--ch11-text); }
.ch11 .quote-attr        { color: var(--ch11-muted); }
.ch11 .gallery-section   { background: var(--ch11-surface); }
.ch11 .gallery-heading   { color: var(--ch11-text); }
.ch11 .polaroid-caption  { color: var(--ch11-muted); }
.ch11 .whats-next        { background: linear-gradient(180deg, var(--ch11-bg) 0%, #dde6ef 100%); }
.ch11 .next-eyebrow      { color: var(--ch11-primary); }
.ch11 .next-title        { color: var(--ch11-text); }
.ch11 .next-hint         { color: var(--ch11-muted); }
.ch11 .cta-btn {
  background: linear-gradient(135deg, var(--ch11-primary) 0%, var(--ch11-secondary) 100%);
  box-shadow: 0 4px 24px rgba(44,95,138,.35);
}
.ch11 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(44,95,138,.45); }
.ch11 .locked-view       { background: var(--ch11-bg); color: var(--ch11-text); }
.ch11 .locked-title      { color: var(--ch11-text); }
.ch11 .locked-msg        { color: var(--ch11-muted); }

/* ============================================================
   CHAPTER 12 — SOPHOMORE FALL & WINTER
   ============================================================ */
:root {
  --ch12-bg:        #faf5ef;
  --ch12-surface:   #f5ede0;
  --ch12-card:      #fffdf8;
  --ch12-text:      #281800;
  --ch12-muted:     #8a6030;
  --ch12-primary:   #b5651d;
  --ch12-secondary: #cd9040;
}
.ch12 { background: var(--ch12-bg); color: var(--ch12-text); }
.ch12 .chapter-nav {
  background: rgba(250,245,239,.88);
  border-bottom-color: rgba(181,101,29,.15);
}
.ch12 .back-btn          { color: var(--ch12-primary); }
.ch12 .chapter-nav-title { color: var(--ch12-text); }
.ch12 .chapter-hero      { background: linear-gradient(180deg, #f5ede0 0%, var(--ch12-bg) 100%); }
.ch12 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(205,144,64,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(181,101,29,.10) 0%, transparent 60%);
}
.ch12 .chapter-number    { color: var(--ch12-primary); }
.ch12 .chapter-title     { color: var(--ch12-text); }
.ch12 .chapter-subtitle  { color: var(--ch12-muted); }
.ch12 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch12-primary), transparent); }
.ch12 .hero-heart        { color: var(--ch12-secondary); }
.ch12 .section-eyebrow   { color: var(--ch12-primary); }
.ch12 .section-heading   { color: var(--ch12-text); }
.ch12 .story-body        { color: var(--ch12-text); }
.ch12 .placeholder       { border-left-color: rgba(181,101,29,.35); background: rgba(181,101,29,.05); color: var(--ch12-muted); }
.ch12 .pull-quote        { background: linear-gradient(135deg, var(--ch12-surface) 0%, var(--ch12-bg) 100%); }
.ch12 .quote-text        { color: var(--ch12-text); }
.ch12 .quote-attr        { color: var(--ch12-muted); }
.ch12 .gallery-section   { background: var(--ch12-surface); }
.ch12 .gallery-heading   { color: var(--ch12-text); }
.ch12 .polaroid-caption  { color: var(--ch12-muted); }
.ch12 .whats-next        { background: linear-gradient(180deg, var(--ch12-bg) 0%, #f0e4d0 100%); }
.ch12 .next-eyebrow      { color: var(--ch12-primary); }
.ch12 .next-title        { color: var(--ch12-text); }
.ch12 .next-hint         { color: var(--ch12-muted); }
.ch12 .cta-btn {
  background: linear-gradient(135deg, var(--ch12-primary) 0%, var(--ch12-secondary) 100%);
  box-shadow: 0 4px 24px rgba(181,101,29,.35);
}
.ch12 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(181,101,29,.45); }
.ch12 .locked-view       { background: var(--ch12-bg); color: var(--ch12-text); }
.ch12 .locked-title      { color: var(--ch12-text); }
.ch12 .locked-msg        { color: var(--ch12-muted); }

/* ============================================================
   CHAPTER 13 — SOPHOMORE SPRING
   ============================================================ */
:root {
  --ch13-bg:        #fdf5f5;
  --ch13-surface:   #f9e8ec;
  --ch13-card:      #fff8fa;
  --ch13-text:      #2e0e1e;
  --ch13-muted:     #9a6070;
  --ch13-primary:   #c06080;
  --ch13-secondary: #e090a8;
}
.ch13 { background: var(--ch13-bg); color: var(--ch13-text); }
.ch13 .chapter-nav {
  background: rgba(253,245,245,.88);
  border-bottom-color: rgba(192,96,128,.15);
}
.ch13 .back-btn          { color: var(--ch13-primary); }
.ch13 .chapter-nav-title { color: var(--ch13-text); }
.ch13 .chapter-hero      { background: linear-gradient(180deg, #f9e8ec 0%, var(--ch13-bg) 100%); }
.ch13 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(224,144,168,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(192,96,128,.10) 0%, transparent 60%);
}
.ch13 .chapter-number    { color: var(--ch13-primary); }
.ch13 .chapter-title     { color: var(--ch13-text); }
.ch13 .chapter-subtitle  { color: var(--ch13-muted); }
.ch13 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch13-primary), transparent); }
.ch13 .hero-heart        { color: var(--ch13-secondary); }
.ch13 .section-eyebrow   { color: var(--ch13-primary); }
.ch13 .section-heading   { color: var(--ch13-text); }
.ch13 .story-body        { color: var(--ch13-text); }
.ch13 .placeholder       { border-left-color: rgba(192,96,128,.35); background: rgba(192,96,128,.05); color: var(--ch13-muted); }
.ch13 .pull-quote        { background: linear-gradient(135deg, var(--ch13-surface) 0%, var(--ch13-bg) 100%); }
.ch13 .quote-text        { color: var(--ch13-text); }
.ch13 .quote-attr        { color: var(--ch13-muted); }
.ch13 .gallery-section   { background: var(--ch13-surface); }
.ch13 .gallery-heading   { color: var(--ch13-text); }
.ch13 .polaroid-caption  { color: var(--ch13-muted); }
.ch13 .whats-next        { background: linear-gradient(180deg, var(--ch13-bg) 0%, #f5e0e6 100%); }
.ch13 .next-eyebrow      { color: var(--ch13-primary); }
.ch13 .next-title        { color: var(--ch13-text); }
.ch13 .next-hint         { color: var(--ch13-muted); }
.ch13 .cta-btn {
  background: linear-gradient(135deg, var(--ch13-primary) 0%, var(--ch13-secondary) 100%);
  box-shadow: 0 4px 24px rgba(192,96,128,.35);
}
.ch13 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(192,96,128,.45); }
.ch13 .locked-view       { background: var(--ch13-bg); color: var(--ch13-text); }
.ch13 .locked-title      { color: var(--ch13-text); }
.ch13 .locked-msg        { color: var(--ch13-muted); }

/* ============================================================
   CHAPTER 14 — SUMMER 2024
   ============================================================ */
:root {
  --ch14-bg:        #f5fafe;
  --ch14-surface:   #e8f4ff;
  --ch14-card:      #f8fbff;
  --ch14-text:      #0a1a2e;
  --ch14-muted:     #4a7aaa;
  --ch14-primary:   #1a78c2;
  --ch14-secondary: #f5a623;
}
.ch14 { background: var(--ch14-bg); color: var(--ch14-text); }
.ch14 .chapter-nav {
  background: rgba(245,250,254,.88);
  border-bottom-color: rgba(26,120,194,.15);
}
.ch14 .back-btn          { color: var(--ch14-primary); }
.ch14 .chapter-nav-title { color: var(--ch14-text); }
.ch14 .chapter-hero      { background: linear-gradient(180deg, #e8f4ff 0%, var(--ch14-bg) 100%); }
.ch14 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(245,166,35,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(26,120,194,.10) 0%, transparent 60%);
}
.ch14 .chapter-number    { color: var(--ch14-primary); }
.ch14 .chapter-title     { color: var(--ch14-text); }
.ch14 .chapter-subtitle  { color: var(--ch14-muted); }
.ch14 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch14-primary), transparent); }
.ch14 .hero-heart        { color: var(--ch14-secondary); }
.ch14 .section-eyebrow   { color: var(--ch14-primary); }
.ch14 .section-heading   { color: var(--ch14-text); }
.ch14 .story-body        { color: var(--ch14-text); }
.ch14 .placeholder       { border-left-color: rgba(26,120,194,.35); background: rgba(26,120,194,.05); color: var(--ch14-muted); }
.ch14 .pull-quote        { background: linear-gradient(135deg, var(--ch14-surface) 0%, var(--ch14-bg) 100%); }
.ch14 .quote-text        { color: var(--ch14-text); }
.ch14 .quote-attr        { color: var(--ch14-muted); }
.ch14 .gallery-section   { background: var(--ch14-surface); }
.ch14 .gallery-heading   { color: var(--ch14-text); }
.ch14 .polaroid-caption  { color: var(--ch14-muted); }
.ch14 .whats-next        { background: linear-gradient(180deg, var(--ch14-bg) 0%, #deeef8 100%); }
.ch14 .next-eyebrow      { color: var(--ch14-primary); }
.ch14 .next-title        { color: var(--ch14-text); }
.ch14 .next-hint         { color: var(--ch14-muted); }
.ch14 .cta-btn {
  background: linear-gradient(135deg, var(--ch14-primary) 0%, var(--ch14-secondary) 100%);
  box-shadow: 0 4px 24px rgba(26,120,194,.35);
}
.ch14 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(26,120,194,.45); }
.ch14 .locked-view       { background: var(--ch14-bg); color: var(--ch14-text); }
.ch14 .locked-title      { color: var(--ch14-text); }
.ch14 .locked-msg        { color: var(--ch14-muted); }

/* ============================================================
   CHAPTER 15 — JUNIOR FALL
   ============================================================ */
:root {
  --ch15-bg:        #faf3ee;
  --ch15-surface:   #f5e8da;
  --ch15-card:      #fffaf5;
  --ch15-text:      #2a1408;
  --ch15-muted:     #8a5a3a;
  --ch15-primary:   #b5451a;
  --ch15-secondary: #cd7040;
}
.ch15 { background: var(--ch15-bg); color: var(--ch15-text); }
.ch15 .chapter-nav {
  background: rgba(250,243,238,.88);
  border-bottom-color: rgba(181,69,26,.15);
}
.ch15 .back-btn          { color: var(--ch15-primary); }
.ch15 .chapter-nav-title { color: var(--ch15-text); }
.ch15 .chapter-hero      { background: linear-gradient(180deg, #f5e8da 0%, var(--ch15-bg) 100%); }
.ch15 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(205,112,64,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(181,69,26,.10) 0%, transparent 60%);
}
.ch15 .chapter-number    { color: var(--ch15-primary); }
.ch15 .chapter-title     { color: var(--ch15-text); }
.ch15 .chapter-subtitle  { color: var(--ch15-muted); }
.ch15 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch15-primary), transparent); }
.ch15 .hero-heart        { color: var(--ch15-secondary); }
.ch15 .section-eyebrow   { color: var(--ch15-primary); }
.ch15 .section-heading   { color: var(--ch15-text); }
.ch15 .story-body        { color: var(--ch15-text); }
.ch15 .placeholder       { border-left-color: rgba(181,69,26,.35); background: rgba(181,69,26,.05); color: var(--ch15-muted); }
.ch15 .pull-quote        { background: linear-gradient(135deg, var(--ch15-surface) 0%, var(--ch15-bg) 100%); }
.ch15 .quote-text        { color: var(--ch15-text); }
.ch15 .quote-attr        { color: var(--ch15-muted); }
.ch15 .gallery-section   { background: var(--ch15-surface); }
.ch15 .gallery-heading   { color: var(--ch15-text); }
.ch15 .polaroid-caption  { color: var(--ch15-muted); }
.ch15 .whats-next        { background: linear-gradient(180deg, var(--ch15-bg) 0%, #f0e0d0 100%); }
.ch15 .next-eyebrow      { color: var(--ch15-primary); }
.ch15 .next-title        { color: var(--ch15-text); }
.ch15 .next-hint         { color: var(--ch15-muted); }
.ch15 .cta-btn {
  background: linear-gradient(135deg, var(--ch15-primary) 0%, var(--ch15-secondary) 100%);
  box-shadow: 0 4px 24px rgba(181,69,26,.35);
}
.ch15 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(181,69,26,.45); }
.ch15 .locked-view       { background: var(--ch15-bg); color: var(--ch15-text); }
.ch15 .locked-title      { color: var(--ch15-text); }
.ch15 .locked-msg        { color: var(--ch15-muted); }

/* ============================================================
   CHAPTER 16 — CHRISTMAS 2024
   ============================================================ */
:root {
  --ch16-bg:        #f2f8f3;
  --ch16-surface:   #e4f0e6;
  --ch16-card:      #f8fff9;
  --ch16-text:      #0e2010;
  --ch16-muted:     #4a7a50;
  --ch16-primary:   #2d6a35;
  --ch16-secondary: #a31e32;
}
.ch16 { background: var(--ch16-bg); color: var(--ch16-text); }
.ch16 .chapter-nav {
  background: rgba(242,248,243,.88);
  border-bottom-color: rgba(45,106,53,.15);
}
.ch16 .back-btn          { color: var(--ch16-primary); }
.ch16 .chapter-nav-title { color: var(--ch16-text); }
.ch16 .chapter-hero      { background: linear-gradient(180deg, #e4f0e6 0%, var(--ch16-bg) 100%); }
.ch16 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(163,30,50,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(45,106,53,.10) 0%, transparent 60%);
}
.ch16 .chapter-number    { color: var(--ch16-primary); }
.ch16 .chapter-title     { color: var(--ch16-text); }
.ch16 .chapter-subtitle  { color: var(--ch16-muted); }
.ch16 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch16-primary), transparent); }
.ch16 .hero-heart        { color: var(--ch16-secondary); }
.ch16 .section-eyebrow   { color: var(--ch16-primary); }
.ch16 .section-heading   { color: var(--ch16-text); }
.ch16 .story-body        { color: var(--ch16-text); }
.ch16 .placeholder       { border-left-color: rgba(45,106,53,.35); background: rgba(45,106,53,.05); color: var(--ch16-muted); }
.ch16 .pull-quote        { background: linear-gradient(135deg, var(--ch16-surface) 0%, var(--ch16-bg) 100%); }
.ch16 .quote-text        { color: var(--ch16-text); }
.ch16 .quote-attr        { color: var(--ch16-muted); }
.ch16 .gallery-section   { background: var(--ch16-surface); }
.ch16 .gallery-heading   { color: var(--ch16-text); }
.ch16 .polaroid-caption  { color: var(--ch16-muted); }
.ch16 .whats-next        { background: linear-gradient(180deg, var(--ch16-bg) 0%, #ddeedd 100%); }
.ch16 .next-eyebrow      { color: var(--ch16-primary); }
.ch16 .next-title        { color: var(--ch16-text); }
.ch16 .next-hint         { color: var(--ch16-muted); }
.ch16 .cta-btn {
  background: linear-gradient(135deg, var(--ch16-primary) 0%, var(--ch16-secondary) 100%);
  box-shadow: 0 4px 24px rgba(45,106,53,.35);
}
.ch16 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(45,106,53,.45); }
.ch16 .locked-view       { background: var(--ch16-bg); color: var(--ch16-text); }
.ch16 .locked-title      { color: var(--ch16-text); }
.ch16 .locked-msg        { color: var(--ch16-muted); }

/* ============================================================
   CHAPTER 17 — JUNIOR SPRING
   ============================================================ */
:root {
  --ch17-bg:        #fdf8f0;
  --ch17-surface:   #f8f0e0;
  --ch17-card:      #fffdf5;
  --ch17-text:      #281808;
  --ch17-muted:     #8a6840;
  --ch17-primary:   #7B5B3A;
  --ch17-secondary: #c8a060;
}
.ch17 { background: var(--ch17-bg); color: var(--ch17-text); }
.ch17 .chapter-nav {
  background: rgba(253,248,240,.88);
  border-bottom-color: rgba(123,91,58,.15);
}
.ch17 .back-btn          { color: var(--ch17-primary); }
.ch17 .chapter-nav-title { color: var(--ch17-text); }
.ch17 .chapter-hero      { background: linear-gradient(180deg, #f8f0e0 0%, var(--ch17-bg) 100%); }
.ch17 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(200,160,96,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(123,91,58,.10) 0%, transparent 60%);
}
.ch17 .chapter-number    { color: var(--ch17-primary); }
.ch17 .chapter-title     { color: var(--ch17-text); }
.ch17 .chapter-subtitle  { color: var(--ch17-muted); }
.ch17 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch17-primary), transparent); }
.ch17 .hero-heart        { color: var(--ch17-secondary); }
.ch17 .section-eyebrow   { color: var(--ch17-primary); }
.ch17 .section-heading   { color: var(--ch17-text); }
.ch17 .story-body        { color: var(--ch17-text); }
.ch17 .placeholder       { border-left-color: rgba(123,91,58,.35); background: rgba(123,91,58,.05); color: var(--ch17-muted); }
.ch17 .pull-quote        { background: linear-gradient(135deg, var(--ch17-surface) 0%, var(--ch17-bg) 100%); }
.ch17 .quote-text        { color: var(--ch17-text); }
.ch17 .quote-attr        { color: var(--ch17-muted); }
.ch17 .gallery-section   { background: var(--ch17-surface); }
.ch17 .gallery-heading   { color: var(--ch17-text); }
.ch17 .polaroid-caption  { color: var(--ch17-muted); }
.ch17 .whats-next        { background: linear-gradient(180deg, var(--ch17-bg) 0%, #f0e8d5 100%); }
.ch17 .next-eyebrow      { color: var(--ch17-primary); }
.ch17 .next-title        { color: var(--ch17-text); }
.ch17 .next-hint         { color: var(--ch17-muted); }
.ch17 .cta-btn {
  background: linear-gradient(135deg, var(--ch17-primary) 0%, var(--ch17-secondary) 100%);
  box-shadow: 0 4px 24px rgba(123,91,58,.35);
}
.ch17 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(123,91,58,.45); }
.ch17 .locked-view       { background: var(--ch17-bg); color: var(--ch17-text); }
.ch17 .locked-title      { color: var(--ch17-text); }
.ch17 .locked-msg        { color: var(--ch17-muted); }

/* ============================================================
   CHAPTER 18 — PRE-MCAT SUMMER
   ============================================================ */
:root {
  --ch18-bg:        #f4f4fb;
  --ch18-surface:   #eaeaf5;
  --ch18-card:      #f8f8ff;
  --ch18-text:      #0e0e28;
  --ch18-muted:     #5a5a8a;
  --ch18-primary:   #3949AB;
  --ch18-secondary: #7986CB;
}
.ch18 { background: var(--ch18-bg); color: var(--ch18-text); }
.ch18 .chapter-nav {
  background: rgba(244,244,251,.88);
  border-bottom-color: rgba(57,73,171,.15);
}
.ch18 .back-btn          { color: var(--ch18-primary); }
.ch18 .chapter-nav-title { color: var(--ch18-text); }
.ch18 .chapter-hero      { background: linear-gradient(180deg, #eaeaf5 0%, var(--ch18-bg) 100%); }
.ch18 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(121,134,203,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(57,73,171,.10) 0%, transparent 60%);
}
.ch18 .chapter-number    { color: var(--ch18-primary); }
.ch18 .chapter-title     { color: var(--ch18-text); }
.ch18 .chapter-subtitle  { color: var(--ch18-muted); }
.ch18 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch18-primary), transparent); }
.ch18 .hero-heart        { color: var(--ch18-secondary); }
.ch18 .section-eyebrow   { color: var(--ch18-primary); }
.ch18 .section-heading   { color: var(--ch18-text); }
.ch18 .story-body        { color: var(--ch18-text); }
.ch18 .placeholder       { border-left-color: rgba(57,73,171,.35); background: rgba(57,73,171,.05); color: var(--ch18-muted); }
.ch18 .pull-quote        { background: linear-gradient(135deg, var(--ch18-surface) 0%, var(--ch18-bg) 100%); }
.ch18 .quote-text        { color: var(--ch18-text); }
.ch18 .quote-attr        { color: var(--ch18-muted); }
.ch18 .gallery-section   { background: var(--ch18-surface); }
.ch18 .gallery-heading   { color: var(--ch18-text); }
.ch18 .polaroid-caption  { color: var(--ch18-muted); }
.ch18 .whats-next        { background: linear-gradient(180deg, var(--ch18-bg) 0%, #e4e4f5 100%); }
.ch18 .next-eyebrow      { color: var(--ch18-primary); }
.ch18 .next-title        { color: var(--ch18-text); }
.ch18 .next-hint         { color: var(--ch18-muted); }
.ch18 .cta-btn {
  background: linear-gradient(135deg, var(--ch18-primary) 0%, var(--ch18-secondary) 100%);
  box-shadow: 0 4px 24px rgba(57,73,171,.35);
}
.ch18 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(57,73,171,.45); }
.ch18 .locked-view       { background: var(--ch18-bg); color: var(--ch18-text); }
.ch18 .locked-title      { color: var(--ch18-text); }
.ch18 .locked-msg        { color: var(--ch18-muted); }

/* ============================================================
   CHAPTER 19 — CAYMAN TRIP
   ============================================================ */
:root {
  --ch19-bg:        #f0fbfd;
  --ch19-surface:   #e0f6fa;
  --ch19-card:      #f5ffff;
  --ch19-text:      #002830;
  --ch19-muted:     #3a8090;
  --ch19-primary:   #0097a7;
  --ch19-secondary: #00bcd4;
}
.ch19 { background: var(--ch19-bg); color: var(--ch19-text); }
.ch19 .chapter-nav {
  background: rgba(240,251,253,.88);
  border-bottom-color: rgba(0,151,167,.15);
}
.ch19 .back-btn          { color: var(--ch19-primary); }
.ch19 .chapter-nav-title { color: var(--ch19-text); }
.ch19 .chapter-hero      { background: linear-gradient(180deg, #e0f6fa 0%, var(--ch19-bg) 100%); }
.ch19 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(0,188,212,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(0,151,167,.10) 0%, transparent 60%);
}
.ch19 .chapter-number    { color: var(--ch19-primary); }
.ch19 .chapter-title     { color: var(--ch19-text); }
.ch19 .chapter-subtitle  { color: var(--ch19-muted); }
.ch19 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch19-primary), transparent); }
.ch19 .hero-heart        { color: var(--ch19-secondary); }
.ch19 .section-eyebrow   { color: var(--ch19-primary); }
.ch19 .section-heading   { color: var(--ch19-text); }
.ch19 .story-body        { color: var(--ch19-text); }
.ch19 .placeholder       { border-left-color: rgba(0,151,167,.35); background: rgba(0,151,167,.05); color: var(--ch19-muted); }
.ch19 .pull-quote        { background: linear-gradient(135deg, var(--ch19-surface) 0%, var(--ch19-bg) 100%); }
.ch19 .quote-text        { color: var(--ch19-text); }
.ch19 .quote-attr        { color: var(--ch19-muted); }
.ch19 .gallery-section   { background: var(--ch19-surface); }
.ch19 .gallery-heading   { color: var(--ch19-text); }
.ch19 .polaroid-caption  { color: var(--ch19-muted); }
.ch19 .whats-next        { background: linear-gradient(180deg, var(--ch19-bg) 0%, #d8f2f5 100%); }
.ch19 .next-eyebrow      { color: var(--ch19-primary); }
.ch19 .next-title        { color: var(--ch19-text); }
.ch19 .next-hint         { color: var(--ch19-muted); }
.ch19 .cta-btn {
  background: linear-gradient(135deg, var(--ch19-primary) 0%, var(--ch19-secondary) 100%);
  box-shadow: 0 4px 24px rgba(0,151,167,.35);
}
.ch19 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(0,151,167,.45); }
.ch19 .locked-view       { background: var(--ch19-bg); color: var(--ch19-text); }
.ch19 .locked-title      { color: var(--ch19-text); }
.ch19 .locked-msg        { color: var(--ch19-muted); }

/* ============================================================
   CHAPTER 20 — POST-CAYMAN SUMMER
   ============================================================ */
:root {
  --ch20-bg:        #fff8f0;
  --ch20-surface:   #fff0e0;
  --ch20-card:      #fffdf8;
  --ch20-text:      #2a1408;
  --ch20-muted:     #9a6030;
  --ch20-primary:   #d45a20;
  --ch20-secondary: #f4a040;
}
.ch20 { background: var(--ch20-bg); color: var(--ch20-text); }
.ch20 .chapter-nav {
  background: rgba(255,248,240,.88);
  border-bottom-color: rgba(212,90,32,.15);
}
.ch20 .back-btn          { color: var(--ch20-primary); }
.ch20 .chapter-nav-title { color: var(--ch20-text); }
.ch20 .chapter-hero      { background: linear-gradient(180deg, #fff0e0 0%, var(--ch20-bg) 100%); }
.ch20 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(244,160,64,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(212,90,32,.10) 0%, transparent 60%);
}
.ch20 .chapter-number    { color: var(--ch20-primary); }
.ch20 .chapter-title     { color: var(--ch20-text); }
.ch20 .chapter-subtitle  { color: var(--ch20-muted); }
.ch20 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch20-primary), transparent); }
.ch20 .hero-heart        { color: var(--ch20-secondary); }
.ch20 .section-eyebrow   { color: var(--ch20-primary); }
.ch20 .section-heading   { color: var(--ch20-text); }
.ch20 .story-body        { color: var(--ch20-text); }
.ch20 .placeholder       { border-left-color: rgba(212,90,32,.35); background: rgba(212,90,32,.05); color: var(--ch20-muted); }
.ch20 .pull-quote        { background: linear-gradient(135deg, var(--ch20-surface) 0%, var(--ch20-bg) 100%); }
.ch20 .quote-text        { color: var(--ch20-text); }
.ch20 .quote-attr        { color: var(--ch20-muted); }
.ch20 .gallery-section   { background: var(--ch20-surface); }
.ch20 .gallery-heading   { color: var(--ch20-text); }
.ch20 .polaroid-caption  { color: var(--ch20-muted); }
.ch20 .whats-next        { background: linear-gradient(180deg, var(--ch20-bg) 0%, #ffe8d0 100%); }
.ch20 .next-eyebrow      { color: var(--ch20-primary); }
.ch20 .next-title        { color: var(--ch20-text); }
.ch20 .next-hint         { color: var(--ch20-muted); }
.ch20 .cta-btn {
  background: linear-gradient(135deg, var(--ch20-primary) 0%, var(--ch20-secondary) 100%);
  box-shadow: 0 4px 24px rgba(212,90,32,.35);
}
.ch20 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(212,90,32,.45); }
.ch20 .locked-view       { background: var(--ch20-bg); color: var(--ch20-text); }
.ch20 .locked-title      { color: var(--ch20-text); }
.ch20 .locked-msg        { color: var(--ch20-muted); }

/* ============================================================
   CHAPTER 21 — SENIOR FALL
   ============================================================ */
:root {
  --ch21-bg:        #faf2f2;
  --ch21-surface:   #f4e4e4;
  --ch21-card:      #fff8f8;
  --ch21-text:      #1e0808;
  --ch21-muted:     #7a3040;
  --ch21-primary:   #6B1E2C;
  --ch21-secondary: #C8A000;
}
.ch21 { background: var(--ch21-bg); color: var(--ch21-text); }
.ch21 .chapter-nav {
  background: rgba(250,242,242,.88);
  border-bottom-color: rgba(107,30,44,.15);
}
.ch21 .back-btn          { color: var(--ch21-primary); }
.ch21 .chapter-nav-title { color: var(--ch21-text); }
.ch21 .chapter-hero      { background: linear-gradient(180deg, #f4e4e4 0%, var(--ch21-bg) 100%); }
.ch21 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(200,160,0,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(107,30,44,.10) 0%, transparent 60%);
}
.ch21 .chapter-number    { color: var(--ch21-primary); }
.ch21 .chapter-title     { color: var(--ch21-text); }
.ch21 .chapter-subtitle  { color: var(--ch21-muted); }
.ch21 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch21-primary), transparent); }
.ch21 .hero-heart        { color: var(--ch21-secondary); }
.ch21 .section-eyebrow   { color: var(--ch21-primary); }
.ch21 .section-heading   { color: var(--ch21-text); }
.ch21 .story-body        { color: var(--ch21-text); }
.ch21 .placeholder       { border-left-color: rgba(107,30,44,.35); background: rgba(107,30,44,.05); color: var(--ch21-muted); }
.ch21 .pull-quote        { background: linear-gradient(135deg, var(--ch21-surface) 0%, var(--ch21-bg) 100%); }
.ch21 .quote-text        { color: var(--ch21-text); }
.ch21 .quote-attr        { color: var(--ch21-muted); }
.ch21 .gallery-section   { background: var(--ch21-surface); }
.ch21 .gallery-heading   { color: var(--ch21-text); }
.ch21 .polaroid-caption  { color: var(--ch21-muted); }
.ch21 .whats-next        { background: linear-gradient(180deg, var(--ch21-bg) 0%, #f0d8d8 100%); }
.ch21 .next-eyebrow      { color: var(--ch21-primary); }
.ch21 .next-title        { color: var(--ch21-text); }
.ch21 .next-hint         { color: var(--ch21-muted); }
.ch21 .cta-btn {
  background: linear-gradient(135deg, var(--ch21-primary) 0%, var(--ch21-secondary) 100%);
  box-shadow: 0 4px 24px rgba(107,30,44,.35);
}
.ch21 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(107,30,44,.45); }
.ch21 .locked-view       { background: var(--ch21-bg); color: var(--ch21-text); }
.ch21 .locked-title      { color: var(--ch21-text); }
.ch21 .locked-msg        { color: var(--ch21-muted); }

/* ============================================================
   CHAPTER 22 — WESTERN ROAD TRIP
   ============================================================ */
:root {
  --ch22-bg:        #faf6f0;
  --ch22-surface:   #f4ece0;
  --ch22-card:      #fffdf8;
  --ch22-text:      #281808;
  --ch22-muted:     #8a6040;
  --ch22-primary:   #c1600a;
  --ch22-secondary: #7a9a70;
}
.ch22 { background: var(--ch22-bg); color: var(--ch22-text); }
.ch22 .chapter-nav {
  background: rgba(250,246,240,.88);
  border-bottom-color: rgba(193,96,10,.15);
}
.ch22 .back-btn          { color: var(--ch22-primary); }
.ch22 .chapter-nav-title { color: var(--ch22-text); }
.ch22 .chapter-hero      { background: linear-gradient(180deg, #f4ece0 0%, var(--ch22-bg) 100%); }
.ch22 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(122,154,112,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(193,96,10,.10) 0%, transparent 60%);
}
.ch22 .chapter-number    { color: var(--ch22-primary); }
.ch22 .chapter-title     { color: var(--ch22-text); }
.ch22 .chapter-subtitle  { color: var(--ch22-muted); }
.ch22 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch22-primary), transparent); }
.ch22 .hero-heart        { color: var(--ch22-secondary); }
.ch22 .section-eyebrow   { color: var(--ch22-primary); }
.ch22 .section-heading   { color: var(--ch22-text); }
.ch22 .story-body        { color: var(--ch22-text); }
.ch22 .placeholder       { border-left-color: rgba(193,96,10,.35); background: rgba(193,96,10,.05); color: var(--ch22-muted); }
.ch22 .pull-quote        { background: linear-gradient(135deg, var(--ch22-surface) 0%, var(--ch22-bg) 100%); }
.ch22 .quote-text        { color: var(--ch22-text); }
.ch22 .quote-attr        { color: var(--ch22-muted); }
.ch22 .gallery-section   { background: var(--ch22-surface); }
.ch22 .gallery-heading   { color: var(--ch22-text); }
.ch22 .polaroid-caption  { color: var(--ch22-muted); }
.ch22 .whats-next        { background: linear-gradient(180deg, var(--ch22-bg) 0%, #ede0d0 100%); }
.ch22 .next-eyebrow      { color: var(--ch22-primary); }
.ch22 .next-title        { color: var(--ch22-text); }
.ch22 .next-hint         { color: var(--ch22-muted); }
.ch22 .cta-btn {
  background: linear-gradient(135deg, var(--ch22-primary) 0%, var(--ch22-secondary) 100%);
  box-shadow: 0 4px 24px rgba(193,96,10,.35);
}
.ch22 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(193,96,10,.45); }
.ch22 .locked-view       { background: var(--ch22-bg); color: var(--ch22-text); }
.ch22 .locked-title      { color: var(--ch22-text); }
.ch22 .locked-msg        { color: var(--ch22-muted); }

/* ============================================================
   CHAPTER 23 — SPRING 2026
   ============================================================ */
:root {
  --ch23-bg:        #f8f5fd;
  --ch23-surface:   #f0e8fa;
  --ch23-card:      #fdfaff;
  --ch23-text:      #1e0e30;
  --ch23-muted:     #7a60a0;
  --ch23-primary:   #7c5cbf;
  --ch23-secondary: #6a9e70;
}
.ch23 { background: var(--ch23-bg); color: var(--ch23-text); }
.ch23 .chapter-nav {
  background: rgba(248,245,253,.88);
  border-bottom-color: rgba(124,92,191,.15);
}
.ch23 .back-btn          { color: var(--ch23-primary); }
.ch23 .chapter-nav-title { color: var(--ch23-text); }
.ch23 .chapter-hero      { background: linear-gradient(180deg, #f0e8fa 0%, var(--ch23-bg) 100%); }
.ch23 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(106,158,112,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(124,92,191,.10) 0%, transparent 60%);
}
.ch23 .chapter-number    { color: var(--ch23-primary); }
.ch23 .chapter-title     { color: var(--ch23-text); }
.ch23 .chapter-subtitle  { color: var(--ch23-muted); }
.ch23 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch23-primary), transparent); }
.ch23 .hero-heart        { color: var(--ch23-secondary); }
.ch23 .section-eyebrow   { color: var(--ch23-primary); }
.ch23 .section-heading   { color: var(--ch23-text); }
.ch23 .story-body        { color: var(--ch23-text); }
.ch23 .placeholder       { border-left-color: rgba(124,92,191,.35); background: rgba(124,92,191,.05); color: var(--ch23-muted); }
.ch23 .pull-quote        { background: linear-gradient(135deg, var(--ch23-surface) 0%, var(--ch23-bg) 100%); }
.ch23 .quote-text        { color: var(--ch23-text); }
.ch23 .quote-attr        { color: var(--ch23-muted); }
.ch23 .gallery-section   { background: var(--ch23-surface); }
.ch23 .gallery-heading   { color: var(--ch23-text); }
.ch23 .polaroid-caption  { color: var(--ch23-muted); }
.ch23 .whats-next        { background: linear-gradient(180deg, var(--ch23-bg) 0%, #eee5f5 100%); }
.ch23 .next-eyebrow      { color: var(--ch23-primary); }
.ch23 .next-title        { color: var(--ch23-text); }
.ch23 .next-hint         { color: var(--ch23-muted); }
.ch23 .cta-btn {
  background: linear-gradient(135deg, var(--ch23-primary) 0%, var(--ch23-secondary) 100%);
  box-shadow: 0 4px 24px rgba(124,92,191,.35);
}
.ch23 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(124,92,191,.45); }
.ch23 .locked-view       { background: var(--ch23-bg); color: var(--ch23-text); }
.ch23 .locked-title      { color: var(--ch23-text); }
.ch23 .locked-msg        { color: var(--ch23-muted); }

/* ============================================================
   CHAPTER 24 — THE NEXT CHAPTER
   ============================================================ */
:root {
  --ch24-bg:        #fdf8f5;
  --ch24-surface:   #faf0ea;
  --ch24-card:      #fffdfb;
  --ch24-text:      #280e18;
  --ch24-muted:     #9a6070;
  --ch24-primary:   #C2185B;
  --ch24-secondary: #D4AF37;
}
.ch24 { background: var(--ch24-bg); color: var(--ch24-text); }
.ch24 .chapter-nav {
  background: rgba(253,248,245,.88);
  border-bottom-color: rgba(194,24,91,.15);
}
.ch24 .back-btn          { color: var(--ch24-primary); }
.ch24 .chapter-nav-title { color: var(--ch24-text); }
.ch24 .chapter-hero      { background: linear-gradient(180deg, #faf0ea 0%, var(--ch24-bg) 100%); }
.ch24 .hero-glow {
  background:
    radial-gradient(circle at 25% 60%, rgba(212,175,55,.13) 0%, transparent 60%),
    radial-gradient(circle at 75% 30%, rgba(194,24,91,.10) 0%, transparent 60%);
}
.ch24 .chapter-number    { color: var(--ch24-primary); }
.ch24 .chapter-title     { color: var(--ch24-text); }
.ch24 .chapter-subtitle  { color: var(--ch24-muted); }
.ch24 .hero-line         { background: linear-gradient(90deg, transparent, var(--ch24-primary), transparent); }
.ch24 .hero-heart        { color: var(--ch24-secondary); }
.ch24 .section-eyebrow   { color: var(--ch24-primary); }
.ch24 .section-heading   { color: var(--ch24-text); }
.ch24 .story-body        { color: var(--ch24-text); }
.ch24 .placeholder       { border-left-color: rgba(194,24,91,.35); background: rgba(194,24,91,.05); color: var(--ch24-muted); }
.ch24 .pull-quote        { background: linear-gradient(135deg, var(--ch24-surface) 0%, var(--ch24-bg) 100%); }
.ch24 .quote-text        { color: var(--ch24-text); }
.ch24 .quote-attr        { color: var(--ch24-muted); }
.ch24 .gallery-section   { background: var(--ch24-surface); }
.ch24 .gallery-heading   { color: var(--ch24-text); }
.ch24 .polaroid-caption  { color: var(--ch24-muted); }
.ch24 .whats-next        { background: linear-gradient(180deg, var(--ch24-bg) 0%, #f8e8e8 100%); }
.ch24 .next-eyebrow      { color: var(--ch24-primary); }
.ch24 .next-title        { color: var(--ch24-text); }
.ch24 .next-hint         { color: var(--ch24-muted); }
.ch24 .cta-btn {
  background: linear-gradient(135deg, var(--ch24-primary) 0%, var(--ch24-secondary) 100%);
  box-shadow: 0 4px 24px rgba(194,24,91,.35);
}
.ch24 .cta-btn:hover     { box-shadow: 0 8px 32px rgba(194,24,91,.45); }
.ch24 .locked-view       { background: var(--ch24-bg); color: var(--ch24-text); }
.ch24 .locked-title      { color: var(--ch24-text); }
.ch24 .locked-msg        { color: var(--ch24-muted); }