/* A reading surface over the existing world, with its tools still close by. */
.reader-chapter { font: 500 1.05rem Georgia, serif; margin: 22px 0 18px; color: var(--ink); }
.reading-context { margin: 20px 0; padding: 20px; border: 1px solid var(--line); background: var(--card); border-radius: 7px; }
.reading-context > button { font-size: .78rem; }
.recap-earlier { font-size: .8rem; color: var(--muted); margin: 6px 0; }
.recap-earlier summary { cursor: pointer; }
body[data-reading="true"] .older-heading { display: none; }
body[data-reading="true"] .event .recap-link { border: 0; padding: 2px 0; background: transparent;
  color: var(--muted); font-size: .75rem; text-decoration: underline; text-underline-offset: 3px; }
body[data-reading="true"] .event[data-opening-passage="true"] { display: none; }
body[data-reading="true"] .event[data-reader-scene-start="false"] { margin-top: 0; padding-top: 6px; border-top: 0; }
body[data-reading="true"] .event[data-reader-scene-start="false"] > time { visibility: hidden; }
body[data-reading="true"] .event[data-reader-scene-start="false"] .event-location { display: none; }
body[data-reading="true"] .event.is-prose[data-reader-scene-start="false"] { border-radius: 0 0 6px 6px; }
.newcomer-orientation { max-width: 72ch; margin: 12px 0 20px; font-size: .82rem; line-height: 1.65; }
.newcomer-orientation > summary { cursor: pointer; color: var(--ink); }
.newcomer-body { padding: 8px 0 4px; }
.newcomer-body p { margin: 7px 0; }
.newcomer-body ul { padding-left: 18px; margin: 5px 0; }
body[data-reading="true"] #newcomer-orientation[open] ~ #reading-pair,
body[data-reading="true"] #newcomer-orientation[open] ~ .world-status:not(#stories-section) { display: none; }
.newcomer-body button { border: 0; padding: 2px 0; text-align: left; background: transparent; color: var(--ink); font: inherit; text-decoration: underline; text-underline-offset: 3px; }
.reader-context { font: 600 .73rem system-ui, sans-serif; color: var(--muted); letter-spacing: .035em; margin: 0 0 12px; }
.story-index { margin: 18px 0; font-size: .82rem; }
.story-index > summary { cursor: pointer; }
.reading-sequence-note, .reading-routine-control { color: var(--muted); font-size: .76rem; line-height: 1.5; }
.reading-routine-control { display: block; margin: 10px 0 18px; }
body[data-reading="false"] .reading-sequence-note, body[data-reading="false"] .reading-routine-control { display: none; }
body[data-reading="true"]:not([data-quiet-records="true"]) .event[data-narrative-weight="0"] { display: none; }
body[data-reading="true"] .event[data-narrative-weight="1"] { padding-top: 10px; padding-bottom: 10px; }
body[data-reading="true"] .event[data-narrative-weight="1"] .event-meta { display: none; }
body[data-reading="true"] .event[data-narrative-weight="3"] { margin-top: 24px; margin-bottom: 24px; }
body[data-reading="true"] .event[data-reader-context="true"] > div > .event-location { display: none; }
body[data-reading="true"] .story-trail-event.has-prose .story-trail-description { display: none; }
main { overflow-anchor: none; padding-bottom: 115px; }
.page-header { align-items: flex-start; gap: 16px; }
.page-header .intro { max-width: 48ch; }
.reading-header-controls { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; flex-shrink: 0; }
#reading-view-toggle { font-size: .78rem; border-radius: 999px; padding: 6px 11px; }
#reading-view-toggle[aria-pressed="true"] { border-color: #7a9bb9; }
.world-tools { position: relative; }
.world-tools > summary, .world-overview > summary { cursor: pointer; color: var(--ink); font-size: .83rem; padding: 7px 0; }
.world-tools summary:focus-visible, .world-overview summary:focus-visible, .story-trail summary:focus-visible { outline: 2px solid #78a8d0; outline-offset: 4px; }
.tools-panel { position: absolute; right: 0; top: calc(100% + 8px); z-index: 30; width: min(470px, calc(100vw - 32px)); padding: 18px;
  max-height: 72dvh; overflow-y: auto; border: 1px solid var(--edge); border-radius: 9px; background: var(--card); box-shadow: 0 12px 40px rgba(0,0,0,.26); }
.tools-panel .header-actions { margin: 0 0 18px; }
.tools-panel .atmosphere-controls { margin: 0; }
.tools-panel .atmosphere-options { padding: 10px; gap: 12px; }
.reading-preferences { border: 0; padding: 14px 0 0; margin: 12px 0 0; border-top: 1px solid var(--line); font-size: .82rem; }
.reading-preferences legend { padding: 0 0 7px; font-weight: 600; }
.reading-preferences label { display: flex; gap: 8px; align-items: center; margin: 8px 0; }
.reading-preferences input { accent-color: #7497b8; }
body[data-reading="true"] .page-header { margin-bottom: 20px; }
body[data-reading="true"] .conditions { gap: 12px; padding: 14px 0; }
body[data-reading="true"] .conditions h2 { font-size: .72rem; color: var(--muted); }
body[data-reading="true"] .clock { font-size: 1.3rem; }
body[data-reading="true"] #date { font-size: .72rem; }
body[data-reading="true"] #sun, body[data-reading="true"] #scene { font-size: .72rem; }
body[data-reading="true"] .world-status { margin: 18px 0; }
body[data-reading="true"] .world-status > h2 { font-size: .76rem; color: var(--muted); }
.reading-pair { display: flex; gap: 10px; margin: 10px 0 24px; }
.reading-person { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; font-size: .8rem; }
.reading-person img { width: 36px; height: 36px; object-fit: contain; }
.reading-person strong { display: block; font-size: .82rem; }
.reading-person span { color: var(--muted); font-size: .75rem; }
.latest-passage { padding: clamp(20px, 4vw, 34px); margin: 22px 0 26px; border: 1px solid var(--line); border-radius: 7px;
  background: var(--card); box-shadow: 0 6px 32px rgba(0,0,0,.05); }
.latest-passage .passage-label { font: 600 .66rem system-ui, sans-serif; color: var(--muted); text-transform: uppercase; letter-spacing: .12em; margin: 0 0 10px; }
.latest-passage .passage-time { font: .74rem system-ui, sans-serif; color: var(--muted); margin-bottom: 18px; }
.passage-prose, .passage-utterance { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1.07rem, 2vw, 1.24rem); line-height: 1.8; max-width: 65ch; }
.passage-prose + .passage-prose, .passage-utterance { margin-top: 14px; }
.passage-utterance cite { display: block; font: .7rem system-ui, sans-serif; color: var(--muted); margin-top: 5px; }
.passage-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.passage-actions button { font-size: .76rem; }
/* Viewpoint effects stay inside the existing reading surface. No layout shift. */
.latest-passage { position: relative; isolation: isolate; transition: box-shadow 1.8s ease; }
.latest-passage::before { content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  pointer-events: none; background: var(--passage-art) center / cover no-repeat; opacity: 0; transition: opacity 1.8s ease; }
.latest-passage.passage-elsewhere::before { opacity: .13; }
.latest-passage.passage-spotlight { z-index: 6; box-shadow: 0 0 0 100vmax rgba(3, 9, 19, .11), 0 8px 35px rgba(0,0,0,.1); }
.latest-passage:focus-within { box-shadow: 0 6px 32px rgba(0,0,0,.05); }
/* Light moves; the architecture and text do not. Only visible art animates. */
.world-backdrop-layer::after { content: ''; position: absolute; inset: -30%; pointer-events: none;
  background: linear-gradient(112deg, transparent 35%, rgba(255,224,168,.14) 48%, rgba(166,202,229,.06) 55%, transparent 66%);
  transform: translateX(-12%) rotate(-3deg); animation: world-light-drift 54s ease-in-out infinite alternate; animation-play-state: paused; }
.world-backdrop-layer.is-visible::after { animation-play-state: running; }
body[data-reading-fx-hidden="true"] .world-backdrop-layer::after { animation-play-state: paused; }
body[data-phase="night"] .world-backdrop-layer::after { background: linear-gradient(112deg, transparent 35%, rgba(163,191,227,.055) 51%, transparent 65%); }
@keyframes world-light-drift { to { transform: translateX(12%) rotate(3deg); } }
body.atmosphere-still .world-backdrop-layer::after, body.scene-open .world-backdrop-layer::after { animation: none; opacity: 0; }
body.atmosphere-still .latest-passage, body.scene-open .latest-passage { box-shadow: none; }
@media (prefers-reduced-motion: reduce) {
  .world-backdrop-layer::after { display: none; }
  .latest-passage, .latest-passage::before { transition: none; }
  .latest-passage.passage-spotlight { box-shadow: none; }
  .latest-passage.passage-elsewhere::before { opacity: 0; }
}
.reading-new { position: sticky; top: 10px; z-index: 5; display: block; margin: 18px auto; border-radius: 999px; padding: 9px 17px;
  border-color: #7799b8; box-shadow: 0 4px 16px rgba(0,0,0,.15); font-size: .82rem; }
body[data-reading="true"] .history { margin-top: 24px; }
body[data-reading="true"] .event { grid-template-columns: 88px minmax(0,1fr); gap: 16px; padding: 19px 0; }
body[data-reading="true"] .event.is-prose { margin: 12px 0; padding: 23px 20px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); }
body[data-reading="true"] .event.is-prose .event-prose { font-family: Georgia, 'Times New Roman', serif; font-size: 1.07rem; line-height: 1.8; }
/* A scene continues across its source anchors without becoming another card
   after every paragraph. The source controls remain reachable on focus/hover. */
body[data-reading="true"] .event.is-prose[data-reader-scene-end="false"] { margin-bottom: 0; border-bottom: 0; border-radius: 6px 6px 0 0; padding-bottom: 6px; }
body[data-reading="true"] .event.is-prose[data-reader-scene-start="false"] { margin-top: 0; border-top: 0; border-radius: 0; padding-top: 6px; }
body[data-reading="true"] .event.is-prose[data-reader-scene-start="false"][data-reader-scene-end="true"] { border-radius: 0 0 6px 6px; }
body[data-reading="true"] .event .event-prose + .event-prose { margin-top: .9em; }
body[data-reading="true"] .event .reader-dialogue { padding: 0; border: 0; }
body[data-reading="true"] .event[data-reader-scene-end="false"]:not(:hover):not(:focus-within) .event-meta { opacity: 0; pointer-events: none; }
body[data-reading="true"] .event .event-meta { opacity: .75; gap: 8px; }
body[data-reading="true"] .event .reaction-palette,
body[data-reading="true"] .event .world-reaction-stat, body[data-reading="true"] .event .clock-advance-chip,
body[data-reading="true"] .event .event-wager-slot { display: none; }
body[data-reading="true"] .event .event-canonical { margin-top: 10px; font-size: .77rem; color: var(--muted); }
body[data-reading="true"] .event.is-prose .event-canonical { display: none !important; }
.world-overview { margin: 30px 0; padding: 13px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.world-overview > summary { font-weight: 600; }
.world-overview > summary span { margin-left: 10px; font-size: .73rem; font-weight: 400; }
.overview-content { padding: 20px 0 0; }
body[data-reading="false"] .latest-passage, body[data-reading="false"] .reading-pair { display: none; }
body[data-reading="false"] #reading-live { display: none; }
#reading-live .reading-new { position: static; }
.story-card { padding: 15px 18px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); margin-top: 10px; }
.story-card h3 { font-size: .94rem; }
.story-card .story-orientation { font-size: .8rem; color: var(--muted); margin: 2px 0 6px; font-style: italic; }
.story-card p { margin-top: 7px; font-size: .85rem; }
.reading-recap { padding: 18px; border-left: 2px solid #839bb3; background: var(--card); border-radius: 4px; margin: 18px 0; }
.reading-recap .recap-title { font-size: .95rem; }
.reading-recap p, .reading-recap li { font-size: .86rem; line-height: 1.6; }
.reading-recap ol, .reading-recap ul { padding-left: 20px; margin: 12px 0; }
.reading-recap li + li { margin-top: 9px; }
.reading-recap button { font-size: .76rem; margin: 5px 8px 0 0; }
.reading-recap a, .story-trail a { color: inherit; text-decoration-color: #849eb6; text-underline-offset: 3px; }
.story-trail { border-top: 1px solid var(--line); margin-top: 14px; padding-top: 8px; }
.story-trail summary { cursor: pointer; font-size: .8rem; }
.story-trail ol { padding-left: 20px; }
.story-trail li { margin: 12px 0; font-size: .85rem; line-height: 1.6; }
.story-trail h4 { font-size: .77rem; color: var(--muted); margin: 18px 0 5px; }
.story-trail time { font-size: .72rem; color: var(--muted); }
.story-trail .event-location { margin-left: 9px; font-size: .72rem; color: var(--muted); }

/* Inline contextual bridge: discreet, muted serif styling for antecedent carry-forwards */
.context-bridge {
  margin: 10px 0 6px;
  padding: 4px 0 4px 12px;
  border-left: 2px solid rgba(120, 155, 185, 0.35);
  font-size: 0.88rem;
}
.context-bridge-summary {
  cursor: pointer;
  color: var(--muted);
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  user-select: none;
}
.context-bridge-summary:hover {
  color: var(--ink);
}
.context-bridge-summary:focus-visible {
  outline: 2px solid #78a8d0;
  outline-offset: 2px;
}
.context-bridge-snippet {
  margin: 6px 0 2px;
  color: var(--muted);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.92rem;
  line-height: 1.6;
  font-style: italic;
}
body[data-reading="false"] .context-bridge {
  display: none !important;
}

/* Inline memory callbacks: subtle, earned character recall with origin jump button */
.memory-callback {
  margin: 10px 0 6px;
  padding: 4px 0 4px 12px;
  border-left: 2px solid rgba(175, 140, 110, 0.4);
  font-size: 0.88rem;
}
.memory-callback-summary {
  cursor: pointer;
  color: var(--muted);
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  user-select: none;
}
.memory-callback-summary:hover {
  color: var(--ink);
}
.memory-callback-summary:focus-visible {
  outline: 2px solid #c89d70;
  outline-offset: 2px;
}
.memory-callback-body {
  margin-top: 6px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.memory-callback-time {
  font-size: 0.75rem;
  color: var(--muted);
  font-family: system-ui, -apple-system, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.memory-callback-snippet {
  margin: 2px 0;
  color: var(--muted);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.90rem;
  line-height: 1.55;
  font-style: italic;
}
.memory-callback-body .exchange {
  margin: 4px 0 6px;
  border-left: none;
  padding-left: 0;
}
.memory-callback-jump-btn {
  align-self: flex-start;
  background: transparent;
  border: 1px solid rgba(175, 140, 110, 0.35);
  color: var(--muted);
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 0.74rem;
  padding: 3px 8px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.memory-callback-jump-btn:hover {
  background: rgba(175, 140, 110, 0.12);
  color: var(--ink);
  border-color: rgba(175, 140, 110, 0.6);
}
body[data-reading="false"] .memory-callback {
  display: none !important;
}

@media (max-width: 760px) {
  .page-header { display: block; }
  .reading-header-controls { margin-top: 12px; }
  .tools-panel { left: -114px; right: auto; }
  body[data-reading="true"] .conditions { grid-template-columns: 1fr 1fr; }
  body[data-reading="true"] .conditions > div:nth-child(2) { display: none; }
  body[data-reading="true"] .event { grid-template-columns: 1fr; gap: 7px; }
  body[data-reading="true"] .event.is-prose { padding: 20px 16px; }
  .world-overview > summary span { display: block; margin: 4px 0 0 15px; }
}
@media (max-width: 420px) {
  main { padding-left: 17px; padding-right: 17px; }
  .reading-pair { gap: 8px; }
  .reading-person img { width: 29px; height: 29px; }
  .reading-person span { font-size: .7rem; }
}