.scene .art {
  display: none;
}
#scene .text {
  background: var(--card);
  color: var(--ink);
  padding: 1.1rem;
  text-shadow: none;
}
#scene .text .ward {
  color: var(--muted);
  text-shadow: none;
  opacity: 1;
}
#scene .text h2,
#scene .text p {
  text-shadow: none;
}
#reverieIllustration[hidden] + #sceneCaption {
  display: none;
}
#reverieIllustration {
  background: #b6c8bd;
  aspect-ratio: 20/11;
}
#reverieIllustration svg {
  display: block;
  width: 100%;
  height: auto;
}
#sceneCaption {
  position: absolute;
  top: 0.7rem;
  left: 0.7rem;
  padding: 0.25rem 0.65rem;
  border-radius: 6px;
  background: #172a2de6;
  color: #fff;
  font-size: 0.78rem;
  max-width: calc(100% - 2.7rem);
}
#hangoutPanel {
  margin-top: 0.8rem;
  border-left: 5px solid #b67d52;
}
#hangoutPanel[hidden] {
  display: none;
}
#hangoutPrompt {
  font-size: 1.15rem;
  line-height: 1.6;
}
#hangoutMoments {
  padding-left: 1.5rem;
  max-height: 15rem;
  overflow: auto;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
#hangoutMoments li {
  margin: 0.5rem 0;
}
#hangoutPanel p {
  overflow-wrap: anywhere;
}
#compass {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#compass button {
  min-width: 0;
  overflow-wrap: anywhere;
}
#compass small {
  white-space: normal;
  overflow-wrap: anywhere;
}
#hangoutPanel .chips {
  margin: 0.65rem 0;
}
.easy-reading {
  font-family: Verdana, system-ui, sans-serif;
  font-size: 1.13rem;
  line-height: 1.75;
  letter-spacing: 0.025em;
  word-spacing: 0.08em;
}
.easy-reading #log {
  line-height: 1.9;
}
.easy-reading .chip,
.easy-reading .btn {
  line-height: 1.5;
  padding: 0.7rem 0.85rem;
}
@media (prefers-reduced-motion: reduce) {
  .scene *,
  .meter *,
  #hangoutPanel * {
    animation: none !important;
    transition: none !important;
  }
}

#reverieIllustration {
  position: relative;
  isolation: isolate;
  aspect-ratio: 16/10;
  background: #c7d9ca;
}
#reverieIllustration .reverie-canvas {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: auto;
  touch-action: pan-y pinch-zoom;
  cursor: pointer;
}
#reverieIllustration.has-stage .reverie-fallback {
  visibility: hidden;
}
.picture-controls {
  background: var(--card);
  padding: 0.75rem 1.1rem;
  border-bottom: 1px solid var(--line);
}
.picture-controls summary {
  min-height: 44px;
  align-content: center;
  cursor: pointer;
}
.picture-controls button {
  min-height: 44px;
}
.picture-controls p {
  margin-bottom: 0;
  line-height: 1.6;
}
#sceneCaption {
  pointer-events: none;
  font-size: 0.8rem;
  letter-spacing: 0.04em;
  padding: 0.45rem 0.7rem;
}
@media (max-width: 540px) {
  #reverieIllustration {
    aspect-ratio: 1.1;
  }
}
 .exploration { margin-top: .8rem; }
 .connected-exits { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: .5rem; margin-bottom: .8rem; }
 .connected-exit { min-height: 54px; padding: .75rem; border: 1px solid #788f87; border-radius: .65rem; color: inherit; background: transparent; font: inherit; text-align: left; overflow-wrap: anywhere; cursor: pointer; }
 .connected-exit.returning { border-width: 2px; }
 .connected-exit:focus-visible { outline: 3px solid #c78831; outline-offset: 3px; }
 .connected-exit:disabled { opacity: .65; cursor: wait; }

.pocket-controls { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.pocket-controls button { flex: 1 1 8rem; min-height: 48px; }
@media (max-width: 700px) {
  .world-shortcuts { position: sticky; top: 0; z-index: 8; background: var(--bg); padding: .4rem; border-bottom: 1px solid var(--line); }
  .world-shortcuts a { flex: 1 1 auto; justify-content: center; }
  #choicesBox, #moveBox, #hudBox, #log, #cmdInput { scroll-margin-top: 8rem; }
}