/* ================================================================
   SIZE OVERRIDES
   Universal rules at top level.
   Desktop-specific fixed dimensions wrapped in min-width: 769px.
================================================================ */

/* ----------------------------------------------------------------
   UNIVERSAL - apply at all breakpoints
---------------------------------------------------------------- */

/* World panels: always hidden until activated, always scrollable */
.world-panel {
  display: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  background: var(--color-bg) !important;
  z-index: 100 !important;
}

.world-panel.active {
  display: block !important;
  pointer-events: auto !important;
}

/* Hide overview content when a panel is open */
#world-of-indigo.panel-active #world-main-content {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Back button: universal base so it is always tappable on mobile */
.panel-back-btn {
  position: absolute !important;
  top: 1.2rem !important;
  left: 1.5rem !important;
  background: rgba(160, 165, 170, 0.08) !important;
  border: 1px solid rgba(160, 165, 170, 0.25) !important;
  color: var(--color-gold-light) !important;
  font-family: var(--font-heading) !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.12em !important;
  padding: 0.6rem 1.1rem !important;
  cursor: pointer !important;
  border-radius: 3px !important;
  transition: all 0.3s ease !important;
  z-index: 10000 !important;
  backdrop-filter: blur(8px) !important;
  pointer-events: auto !important;
  -webkit-tap-highlight-color: transparent !important;
  touch-action: manipulation !important;
}

/* ----------------------------------------------------------------
   DESKTOP ONLY (>= 769px)
---------------------------------------------------------------- */
@media (min-width: 769px) {

img.hero-title-img {
  max-width: min(432px, 99vw) !important;
  width: min(432px, 99vw) !important;
  left: 17px !important;
  margin-bottom: -1.6rem !important;
}

img.hero-subtitle-img {
  max-width: min(270px, 74vw) !important;
  width: min(270px, 74vw) !important;
}

img.hero-native-img {
  max-width: none !important;
  max-height: 33.6px !important;
}

.hero-subtitle,
.hero-native-title {
  height: 33.6px !important;
  max-height: 33.6px !important;
  min-height: 33.6px !important;
}

/* Reduce gap between subtitle and native title */
.hero-native-title {
  margin-top: -2rem !important;
}

.hero-cta {
  bottom: 1.5rem !important;
}

/* Positioning overrides */
.hero-content {
  position: absolute !important;
  top: 20vh !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  padding: 0 2rem !important;
  gap: 4rem !important;
}

.hero-tagline {
  bottom: 26% !important;
  transform: translateY(50%) !important;
}

/* Book One Section Overrides */
#book-one {
  padding: calc(var(--nav-height) + 3rem) 1rem 3rem !important;
}

#book-one .stub-content {
  max-width: 1800px !important;
}

.book-one-header-img {
  max-width: min(228px, 70vw) !important;
  margin: 0 auto 1.5rem !important;
  filter: drop-shadow(0 0 25px rgba(201,168,76,0.35)) !important;
  display: block !important;
}

#book-one .section-divider {
  margin: 0.6rem auto 1.5rem !important;
}

.book-one-images {
  display: flex !important;
  flex-direction: row !important;
  gap: 2rem !important;
  justify-content: center !important;
  align-items: flex-start !important;
  flex-wrap: nowrap !important;
  margin-top: 1rem !important;
  width: 100% !important;
}

.book-one-left-stack {
  display: flex !important;
  flex-direction: column !important;
  gap: 1rem !important;
  flex: 0 0 auto !important;
  width: auto !important;
  align-items: center !important;
}

.book-one-stack-image {
  width: auto !important;
  height: calc((94.5vh - 1rem) / 2) !important;
  max-height: calc((94.5vh - 1rem) / 2) !important;
  max-width: 52vw !important;
  object-fit: contain !important;
  display: block !important;
  border: none !important;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), filter 0.4s !important;
  cursor: pointer !important;
}

.book-one-stack-image:hover {
  transform: scale(1.30) !important;
  filter: brightness(1.08) drop-shadow(0 20px 60px rgba(0,0,0,0.8)) !important;
  z-index: 10 !important;
  position: relative !important;
}

.book-one-right-stack {
  display: flex !important;
  flex-direction: column !important;
  gap: 1rem !important;
  flex: 0 0 auto !important;
  width: auto !important;
  align-items: center !important;
}

.book-one-blurb {
  width: auto !important;
  height: 94.5vh !important;
  max-height: 94.5vh !important;
  max-width: 52vw !important;
  object-fit: contain !important;
  object-position: top center !important;
  display: block !important;
  border: none !important;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), filter 0.4s !important;
  cursor: pointer !important;
}

.book-one-blurb:hover {
  transform: scale(1.35) !important;
  filter: brightness(1.08) drop-shadow(0 20px 60px rgba(0,0,0,0.8)) !important;
  z-index: 10 !important;
  position: relative !important;
}

@media (min-width: 769px) {
  .book-one-links-row {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 2rem !important;
    margin-top: 3.5rem !important;
    width: 100% !important;
  }

  .book-one-link {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-decoration: none !important;
    flex: 0 0 auto !important;
    max-width: none !important;
  }

  .book-one-link:first-child {
    margin-left: 0 !important;
  }

  .book-one-link-img {
    width: auto !important;
    height: 15px !important;
    display: block !important;
    transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), filter 0.3s !important;
    cursor: pointer !important;
    filter: drop-shadow(0 4px 20px rgba(0,0,0,0.6)) !important;
  }

  .book-one-link-img:hover {
    transform: scale(1.1) !important;
    filter: drop-shadow(0 8px 30px rgba(0,0,0,0.8)) !important;
  }
}

/* Change section divider to gunmetal grey */
.section-divider {
  display: block !important;
  background: linear-gradient(90deg, transparent, rgba(160, 165, 170, 0.6), transparent) !important;
}

#world-of-indigo .section-divider {
  background: linear-gradient(90deg, transparent, rgba(160, 165, 170, 0.6), transparent) !important;
}

/* The Series Section Overrides */
#the-series {
  padding: calc(var(--nav-height) + 3rem) 1rem 2rem !important;
}

#the-series .stub-header-img {
  max-width: min(456px, 85vw) !important;
  margin: 0 auto 1.5rem !important;
  filter: drop-shadow(0 0 25px rgba(201,168,76,0.35)) !important;
}

#the-series .section-divider {
  margin: 0.6rem auto 2rem !important;
}

#the-series .series-covers {
  margin-top: 1.5rem !important;
}

#the-series .series-cover-wrap {
  width: 170px !important;
}

#the-series .series-cover-link {
  display: block !important;
  width: 170px !important;
  line-height: 0 !important;
}

#the-series .series-cover {
  width: 170px !important;
  height: auto !important;
  aspect-ratio: 2 / 3 !important;
  object-fit: cover !important;
  display: block !important;
}

#the-series .series-cover-placeholder {
  width: 170px !important;
  height: auto !important;
  aspect-ratio: 2 / 3 !important;
}

/* World of Indigo Section Overrides – universal base */
#world-of-indigo {
  padding: calc(var(--nav-height) + 1.5rem) 1rem 2rem !important;
}

.world-header-img {
  max-width: min(440px, 85vw) !important;
  margin: 0 auto 1rem !important;
  filter: drop-shadow(0 0 25px rgba(201,168,76,0.35)) !important;
  display: block !important;
}

.world-column-link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.5rem !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.world-column-label {
  max-width: none !important;
  width: auto !important;
  height: auto !important;
  transform: scale(0.65) !important;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.7)) !important;
  transition: filter 0.3s !important;
  display: block !important;
  margin: 0 auto !important;
}

.world-column-link:hover .world-column-label {
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.7)) !important;
}

/* Desktop world panel: fixed full-screen slide-in overlay */
.world-panel {
  position: fixed !important;
  top: var(--nav-height) !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: calc(100vh - var(--nav-height)) !important;
  padding: 3rem 1rem 6rem 1rem !important;
  transform: translateX(100%) !important;
  transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important;
  pointer-events: none !important;
}

.world-panel.active {
  transform: translateX(0) !important;
  pointer-events: auto !important;
}

/* The Warrior Panel Styling */
.warrior-header-img {
  max-width: min(228px, 70vw) !important;
  margin: 0 auto 0.75rem !important;
  filter: drop-shadow(0 0 25px rgba(201,168,76,0.35)) !important;
  display: block !important;
}

.warrior-columns {
  display: flex !important;
  justify-content: center !important;
  align-items: flex-start !important;
  gap: 1.5rem !important;
  margin-top: 1rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  flex-wrap: nowrap !important;
  width: fit-content !important;
  max-width: 95vw !important;
}

.warrior-column {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  flex: 0 0 auto !important;
}

/* Warrior columns must not create competing stacking contexts –
   override the reveal animation so opacity is always 1 and
   z-index works correctly between columns for the blurb pop-out */
#panel-the-warrior .warrior-column {
  opacity: 1 !important;
  transform: none !important;
}

/* Column 1 - Yona Canon portrait - give it proportional space */
.warrior-column:nth-child(1) {
  flex: 0 0 auto !important;
  width: auto !important;
}

/* Column 2 - Blurb - give it proportional space */
.warrior-column:nth-child(2) {
  flex: 0 0 auto !important;
  width: auto !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Column 3 - Stack of narrow portraits - give it proportional space */
.warrior-column:nth-child(3) {
  flex: 0 0 auto !important;
  width: auto !important;
  position: relative !important;
  z-index: 1 !important;
}

.warrior-column-img {
  width: auto !important;
  height: 420px !important;
  max-height: 420px !important;
  object-fit: contain !important;
  border: none !important;
  box-shadow: 0 8px 40px rgba(0,0,0,0.7) !important;
  border-radius: 2px !important;
  transition: none !important;
  cursor: default !important;
}

.warrior-column-img:hover {
  transform: none !important;
  box-shadow: 0 8px 40px rgba(0,0,0,0.7) !important;
}

/* Center blurb special styling with hover effect */
.warrior-column:nth-child(2) .warrior-column-img {
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s !important;
  cursor: pointer !important;
  position: relative !important;
}

.warrior-column:nth-child(2) .warrior-column-img:hover {
  transform: scale(1.35) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.8) !important;
  z-index: 100 !important;
}

.warrior-stack {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.75rem !important;
  height: 420px !important;
}

.warrior-stack-img {
  width: auto !important;
  height: calc((420px - 1.5rem) / 3) !important;
  object-fit: contain !important;
  border: none !important;
  box-shadow: 0 6px 30px rgba(0,0,0,0.6) !important;
  border-radius: 2px !important;
  transition: none !important;
  cursor: default !important;
}

.warrior-stack-img:hover {
  transform: none !important;
  box-shadow: 0 6px 30px rgba(0,0,0,0.6) !important;
}

.warrior-taglines {
  margin-top: 3rem !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
  min-height: 100px !important;
  position: relative !important;
  width: 100% !important;
}

.warrior-tagline-row {
  width: 100% !important;
  text-align: center !important;
  min-height: 50px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
}

.warrior-tagline-img {
  max-width: min(768px, 90vw) !important;
  height: auto !important;
  display: block !important;
  filter: drop-shadow(0 2px 10px rgba(0,0,0,0.9)) !important;
  opacity: 1 !important;
  visibility: visible !important;
  clip-path: inset(0 100% 0 0) !important;
  transition: opacity 0.3s ease-in-out !important;
}

.warrior-tagline-img.writing {
  animation: writeIn 3s linear forwards !important;
}

.warrior-tagline-img.fading {
  animation: fadeOutTagline 3s ease-out forwards !important;
}

@keyframes writeIn {
  0% {
    opacity: 1;
    clip-path: inset(0 100% 0 0);
  }
  100% {
    opacity: 1;
    clip-path: inset(0 0% 0 0);
  }
}

@keyframes fadeOutTagline {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* Book One Gallery Styling */
.book-one-gallery {
  width: 100% !important;
  max-width: 52vw !important;
}

.book-one-gallery .world-gallery {
  aspect-ratio: 16 / 10 !important;
  height: calc((94.5vh - 1rem) / 2) !important;
  max-height: calc((94.5vh - 1rem) / 2) !important;
  width: auto !important;
  max-width: 52vw !important;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
  cursor: pointer !important;
}

.book-one-gallery .world-gallery:hover {
  transform: scale(1.35) !important;
  z-index: 10 !important;
  position: relative !important;
}

.book-one-gallery .gallery-slide img {
  border: none !important;
  box-shadow: 0 8px 60px rgba(0,0,0,0.85) !important;
  border-radius: 2px !important;
}

/* .panel-back-btn is declared in universal section above */

/* Hide main world content when panel is active */
/* (panel-active hide already declared in universal section above) */

.book-one-gallery .gallery-caption-bar {
  display: none !important;
}

.book-one-gallery .gallery-btn {
  display: none !important;
}

.book-one-gallery .gallery-dots {
  display: none !important;
}

/* THOSE HE LOVED MOST - Character Grid Overrides */
#panel-those-he-loved-most .stub-header-img {
  max-width: min(380px, 70vw) !important;
  margin: 0 auto 0.75rem !important;
  filter: drop-shadow(0 0 25px rgba(201,168,76,0.35)) !important;
  display: block !important;
}

#panel-those-he-loved-most .character-grid {
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 0.5rem 0.5rem !important;
  margin-top: 1rem !important;
  max-width: 90vw !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: fit-content !important;
  justify-content: center !important;
}

#panel-those-he-loved-most .character-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
  cursor: pointer !important;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
  position: relative !important;
}

#panel-those-he-loved-most .character-card:hover {
  transform: scale(1.50) !important;
  z-index: 100 !important;
}

#panel-those-he-loved-most .character-card-portrait {
  width: 100% !important;
  max-width: 165px !important;
  overflow: hidden !important;
  border: none !important;
  border-radius: 2px 2px 0 0 !important;
  box-shadow: 0 4px 30px rgba(0,0,0,0.6) !important;
  transition: box-shadow 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
  position: relative !important;
}

#panel-those-he-loved-most .character-canon-img {
  width: 100% !important;
  max-width: 165px !important;
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1), filter 0.4s !important;
  background: var(--color-bg) !important;
}

#panel-those-he-loved-most .character-card:hover .character-card-portrait {
  box-shadow: 0 20px 70px rgba(0,0,0,0.9) !important;
}

#panel-those-he-loved-most .character-card:hover .character-canon-img {
  filter: brightness(1.08) saturate(1.1) !important;
}

/* Hide name plaques - names are embedded in images */
#panel-those-he-loved-most .character-title-img {
  display: none !important;
  visibility: hidden !important;
}

} /* end @media (min-width: 769px) */

/* ----------------------------------------------------------------
   WORLD OF INDIGO – desktop column layout
---------------------------------------------------------------- */
@media (min-width: 769px) {
  .world-columns {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 0.35rem !important;
    margin-top: 1rem !important;
    margin-bottom: 4rem !important;
    flex-wrap: nowrap !important;
  }

  .world-column {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    flex: 0 0 auto !important;
  }

  .world-column-img {
    width: 220px !important;
    height: auto !important;
    max-height: 50vh !important;
    object-fit: contain !important;
    border: none !important;
    box-shadow: 0 8px 40px rgba(0,0,0,0.7) !important;
    border-radius: 2px !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s !important;
  }

  .world-column-link:hover .world-column-img {
    transform: translateY(-8px) scale(1.35) !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.8) !important;
    z-index: 10 !important;
    position: relative !important;
  }
}

/* SCENES FROM THE STORY - Minimalistic Gallery Overrides */
#panel-scenes-from-story {
  display: none !important;
  min-height: 100vh !important;
  padding: 0 !important;
  align-items: center !important;
  justify-content: center !important;
}

#panel-scenes-from-story.active {
  display: flex !important;
}

#panel-scenes-from-story .world-map-bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background-size: 90% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

#panel-scenes-from-story .world-map-overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: rgba(8, 10, 15, 0.3) !important;
}

#panel-scenes-from-story .world-gallery-wrapper {
  position: relative !important;
  z-index: 2 !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: min(608px, 92vw) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#panel-scenes-from-story .world-gallery {
  width: 100% !important;
  max-width: min(608px, 92vw) !important;
  aspect-ratio: 16 / 10 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

#panel-scenes-from-story .gallery-slide {
  border: none !important;
  box-shadow: none !important;
}

#panel-scenes-from-story .gallery-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border: none !important;
  box-shadow: 0 20px 80px rgba(0, 0, 0, 0.9) !important;
  border-radius: 0 !important;
}

/* Hide all navigation and caption elements */
#panel-scenes-from-story .gallery-caption-bar,
#panel-scenes-from-story .gallery-btn-prev,
#panel-scenes-from-story .gallery-btn-next,
#panel-scenes-from-story .gallery-dots {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Ensure back button is visible */
#panel-scenes-from-story .panel-back-btn {
  z-index: 1000 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* FOOTER - Monad Press Publisher Section */
.footer-logo-img {
  max-width: 100px !important;
  height: auto !important;
  margin: 0 auto 0.5rem !important;
  display: block !important;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.5)) !important;
}

.footer-tagline {
  font-family: 'GoudyOldStyleBT-Bold', Georgia, serif !important;
  font-style: italic !important;
  font-size: 0.5rem !important;
  color: var(--color-gold-light) !important;
  text-align: center !important;
  letter-spacing: 0.05em !important;
  margin: 0 auto 1.5rem !important;
  max-width: 600px !important;
}

.footer-publisher {
  margin: 2rem auto 1.5rem !important;
  padding: 1.5rem 2rem !important;
  max-width: 600px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 1rem !important;
  border-top: 1px solid rgba(160, 165, 170, 0.25) !important;
  border-bottom: 1px solid rgba(160, 165, 170, 0.25) !important;
}

.footer-publisher-text {
  font-family: 'GoudyOldStyleBT-Bold', Georgia, serif !important;
  font-size: 0.9rem !important;
  color: var(--color-gold-light) !important;
  text-align: center !important;
  letter-spacing: 0.02em !important;
  margin: 0 !important;
}

.footer-monad-logo {
  max-width: 120px !important;
  height: auto !important;
  opacity: 0.85 !important;
  transition: opacity 0.3s ease !important;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.5)) !important;
}

.footer-monad-logo:hover {
  opacity: 1 !important;
}

.footer-copy {
  font-family: 'Trajan Pro', 'Trajan', serif !important;
  font-weight: bold !important;
  font-size: 0.75rem !important;
  color: var(--color-gold-light) !important;
  letter-spacing: 0.08em !important;
}

/* ABOUT THE AUTHOR - Content Styling */
#about-author {
  padding: calc(var(--nav-height) + 3rem) 2rem 4rem !important;
}

#about-author .stub-content {
  max-width: 900px !important;
  margin: 0 auto !important;
}

.author-content {
  margin-top: 2.5rem !important;
  text-align: left !important;
}

.author-paragraph {
  font-family: var(--font-body) !important;
  font-size: 1.05rem !important;
  line-height: 1.8 !important;
  color: var(--color-off-white) !important;
  margin-bottom: 1.5rem !important;
  text-align: justify !important;
  letter-spacing: 0.02em !important;
}

.author-paragraph em {
  font-style: italic !important;
  color: var(--color-gold-light) !important;
}

.author-closing {
  text-align: center !important;
  font-style: italic !important;
  font-size: 1.1rem !important;
  color: var(--color-gold-light) !important;
  margin-top: 2.5rem !important;
  margin-bottom: 0 !important;
  letter-spacing: 0.05em !important;
}

@media (max-width: 768px) {
  .author-paragraph {
    font-size: 0.95rem !important;
    text-align: left !important;
  }

  .book-one-links-row {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 3rem !important;
    margin-top: 2.5rem !important;
    width: 100% !important;
  }

  .book-one-link {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-decoration: none !important;
  }

  .book-one-link:first-child {
    margin-left: 0 !important;
  }

  .book-one-link-img {
    width: 38vw !important;
    height: auto !important;
    display: block !important;
    filter: drop-shadow(0 4px 20px rgba(0,0,0,0.6)) !important;
  }

  /* ---- World of Indigo – mobile centering ---- */
  #world-of-indigo .stub-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  .world-header-img {
    margin: 0 auto 1rem !important;
    max-width: 80vw !important;
  }

  .world-columns {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 2rem !important;
    width: 100% !important;
    margin-bottom: 2rem !important;
  }

  .world-column {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    flex: none !important;
    width: 100% !important;
  }

  .world-column-link {
    align-items: center !important;
    justify-content: center !important;
  }

  .world-column-img {
    width: 62vw !important;
    max-width: 260px !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    border: none !important;
    box-shadow: 0 8px 40px rgba(0,0,0,0.7) !important;
    border-radius: 2px !important;
    display: block !important;
    margin: 0 auto !important;
  }

  /* Hide name plaque PNGs on mobile – names are embedded in the images */
  #panel-those-he-loved-most .character-title-img {
    display: none !important;
    visibility: hidden !important;
  }
}