/* Adult content gate: blur chapter prose until the user dismisses the 18+ banner */
.immersive-reader .adult-content-gate--locked #user-content {
  filter: blur(2.5px);
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}

@media (prefers-reduced-motion: no-preference) {
  .immersive-reader #user-content {
    transition: filter 200ms ease;
  }
}

/* Bottom grid: fiction anchor + translator support (chapter reader + fiction show) */
.reader-bottom-grid {
  align-items: stretch;
}

.reader-bottom-grid__cell {
  display: flex;
  min-width: 0;
  min-height: 0;
}

.reader-bottom-grid__cell > .reader-bottom-card {
  flex: 1 1 auto;
  width: 100%;
  min-height: 100%;
}

.reader-bottom-card,
.reader-anchor-card,
.reader-support-card {
  min-height: 0;
}

.reader-bottom-card__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.reader-bottom-card__visual {
  flex-shrink: 0;
  align-self: stretch;
  width: 3rem;
}

@media (min-width: 640px) {
  .reader-bottom-card__visual {
    width: 3.75rem;
  }
}

@media (min-width: 768px) {
  .reader-bottom-card__visual {
    width: 4.5rem;
  }
}

@media (min-width: 1024px) {
  .reader-bottom-card__visual {
    width: 5.25rem;
  }

  .reader-support-card__visual {
    align-self: flex-start;
    aspect-ratio: 2 / 3;
  }
}

.reader-anchor-card__cover {
  align-self: flex-start;
  aspect-ratio: 2 / 3;
}

.reader-support-card__visual {
  display: flex;
}

.reader-bottom-card__action--full .reader-outlined-btn {
  width: 100%;
}

.reader-support-card__mascot {
  user-select: none;
  -webkit-user-select: none;
}

/* Fiction show: no stretched reader-grid height; match page gray palette in dark mode */
.fiction-support-card .reader-support-card {
  height: auto;
}

.dark .fiction-support-card .reader-support-card {
  border-color: rgb(55 65 81);
  background-color: rgb(31 41 55);
}

.dark .fiction-support-card .reader-support-card-title,
.dark .fiction-support-card #reader-support-card-title {
  color: rgb(255 255 255);
}

.dark .fiction-support-card .reader-bottom-card__body > p {
  color: rgb(156 163 175);
}

.dark .fiction-support-card .reader-outlined-btn {
  border-color: rgb(55 65 81);
  background-color: rgb(31 41 55);
  color: rgb(209 213 219);
}

.dark .fiction-support-card .reader-outlined-btn:hover {
  border-color: rgb(75 85 99);
  background-color: rgb(55 65 81);
}

.dark .fiction-support-card .reader-outlined-btn:focus-visible {
  --tw-ring-color: rgb(107 114 128);
  --tw-ring-offset-color: rgb(31 41 55);
}

/* Reader toolbar: slide off on scroll down; reappear instantly on scroll up (see reader_toolbar_controller.js) */
@media (prefers-reduced-motion: reduce) {
  .immersive-reader .reader-toolbar {
    transition: none;
  }
}

/* Immersive chapter reader — light mode (“sunlit” stone palette, cover-visible scrim) */

html:not(.dark) .immersive-reader #user-content {
  color: rgb(41 37 36); /* stone-800 */
}

html:not(.dark) .immersive-reader #user-content :where(h1, h2, h3, h4, h5, h6) {
  color: rgb(28 25 23); /* stone-900 */
}

html:not(.dark) .immersive-reader #user-content :where(a) {
  color: rgb(14 116 144); /* cyan-700 */
}

html:not(.dark) .immersive-reader #user-content :where(a:hover) {
  color: rgb(21 94 117); /* cyan-800 */
}

html:not(.dark) .immersive-reader #user-content :where(strong, b) {
  color: rgb(28 25 23);
}

html:not(.dark) .immersive-reader #user-content :where(blockquote) {
  border-left-color: rgb(214 211 209); /* stone-300 */
  color: rgb(87 83 78); /* stone-600 */
}

html:not(.dark) .immersive-reader .note-content {
  background: rgb(250 250 249); /* stone-50 */
  border-color: rgb(8 145 178 / 0.25);
  border-left-color: rgb(14 116 144 / 0.55);
  color: rgb(68 64 60); /* stone-700 */
}

/* Immersive chapter reader — dark mode (solid scrim, high contrast, no blue form glow) */

.dark .immersive-reader #user-content {
  color: rgb(228 228 231); /* zinc-200 */
}

.dark .immersive-reader #user-content :where(h1, h2, h3, h4, h5, h6) {
  color: rgb(250 250 250); /* zinc-50 */
}

.dark .immersive-reader #user-content :where(a) {
  color: rgb(251 113 133); /* rose-400 */
}

.dark .immersive-reader #user-content :where(a:hover) {
  color: rgb(253 164 175); /* rose-300 */
}

.dark .immersive-reader #user-content :where(strong, b) {
  color: rgb(250 250 250);
}

.dark .immersive-reader #user-content :where(blockquote) {
  border-left-color: rgb(82 82 91); /* zinc-600 */
  color: rgb(161 161 170); /* zinc-400 */
}

.dark .immersive-reader .note-content {
  background: rgb(24 24 27);
  border-color: rgb(159 18 57 / 0.35);
  border-left-color: rgb(190 18 60 / 0.55);
  color: rgb(228 228 231);
}

/* Collapse unfilled manual AdSense units (Google data-ad-status) */
.immersive-reader .reader-ad-slot ins.adsbygoogle[data-ad-status='unfilled'] {
  display: none !important;
}

.immersive-reader .reader-ad-slot--collapsed {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

/* Reader ad drawer: panel sits below sticky reader toolbar (top-12); grid fits in remaining viewport */
.immersive-reader .reader-ad-drawer__body {
  background: rgb(12 10 9 / 0.92); /* stone-950 */
}

.dark .immersive-reader .reader-ad-drawer__body {
  background: rgb(9 9 11 / 0.94); /* zinc-950 */
}

.immersive-reader .reader-ad-drawer__grid {
  max-height: calc(100dvh - 7rem);
}

.immersive-reader .reader-ad-drawer__cell ins.adsbygoogle[data-ad-status='unfilled'] {
  display: none !important;
}

.immersive-reader .reader-ad-drawer__cell:has(ins.adsbygoogle[data-ad-status='unfilled']) {
  display: none;
}

.immersive-reader .reader-ad-drawer__cell ins.adsbygoogle {
  min-height: 3.75rem;
  max-height: calc((100dvh - 7.5rem) / 3 - 0.35rem);
}

@media (min-width: 640px) {
  .immersive-reader .reader-ad-drawer__grid {
    max-height: calc(100dvh - 8rem);
  }

  .immersive-reader .reader-ad-drawer__cell ins.adsbygoogle {
    min-height: 4.5rem;
    max-height: calc((100dvh - 8.5rem) / 3 - 0.5rem);
  }
}

/* Reader settings drawer — match site primary buttons (cyan-700) */
.immersive-reader .reader-settings__font--active {
  border-color: rgb(14 116 144);
  background-color: rgb(14 116 144);
  color: rgb(255 255 255);
}

.dark .immersive-reader .reader-settings__font--active {
  border-color: rgb(225 29 72);
  background-color: rgb(225 29 72);
  color: rgb(255 255 255);
}

/* Comments drawer: keep body tight under timestamp (no turbo-frame / paragraph stack gap) */
.immersive-reader turbo-frame.reader-comments-drawer__content {
  display: block;
  margin: 0;
  padding: 0;
  min-height: 0;
}

.immersive-reader .reader-comments-drawer__content > p {
  margin: 0;
}

/* Comments drawer — textarea padding (composer + inline edit/reply inside cards) */
.immersive-reader .reader-comments-drawer__input,
.immersive-reader .reader-comments-drawer__composer textarea,
.immersive-reader .reader-comments-drawer__card form.comment textarea {
  box-sizing: border-box;
  padding: 0.75rem;
}

.dark .immersive-reader .reader-comments-drawer__input,
.dark .immersive-reader .reader-comments-drawer__composer textarea,
.dark .immersive-reader .reader-comments-drawer__card form.comment textarea {
  background-color: rgb(39 39 42);
  color: rgb(244 244 245);
  border-color: rgb(63 63 70);
}

.dark .immersive-reader .reader-comments-drawer__input:focus,
.dark .immersive-reader .reader-comments-drawer__composer textarea:focus,
.dark .immersive-reader .reader-comments-drawer__card form.comment textarea:focus {
  border-color: rgb(244 63 94);
  outline: none;
  box-shadow: 0 0 0 2px rgb(244 63 94 / 0.2);
}