/* Recovery reuses VEIL materials and live copy; no new button theme. */
#game [data-ui-screen] .screen-recovery {
  min-width: 0;
  margin: var(--ui-space-2) 0;
  padding: var(--ui-space-2) var(--ui-space-3);
  border: 12px solid transparent;
  border-image: var(--ui-panel-art) 10% fill / 12px;
  background: var(--ui-surface);
  color: var(--ui-ink);
}
#game [data-ui-screen] .screen-recovery > strong {
  display: block;
  font-size: var(--ui-body);
  line-height: 1.4;
}
#game [data-ui-screen] .screen-recovery > p {
  margin: var(--ui-space-2) 0;
  color: var(--ui-muted);
  font-size: var(--ui-small);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
#game [data-ui-screen] .screen-recovery > button {
  min-height: var(--ui-control-height);
  width: 100%;
  white-space: normal;
}
#game [data-ui-screen] .screen-recovery[data-state="error"] > strong { color: var(--ui-danger); }
#game [data-ui-screen] .screen-recovery-locked { opacity: .55; pointer-events: none; }
#game [data-ui-screen] .screen-recovery [hidden],
#game [data-ui-screen] .screen-recovery[hidden] { display: none !important; }

/* A recovery panel is a real row, not an overlay covering the controls. */
#game [data-ui-screen] :is(.inventory-modal, .forge-shell):has(> .screen-recovery:not([hidden])) {
  grid-template-rows: auto auto minmax(0, 1fr);
}
#game [data-ui-screen] .story-shell:has(> .screen-recovery:not([hidden])) {
  grid-template-rows: auto auto auto minmax(0, 1fr);
}
#game [data-ui-screen] .cutscene-shell:has(> .screen-recovery:not([hidden])) {
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}
#game [data-ui-screen] .cutscene-shell:has(> .screen-recovery:not([hidden])) > .screen-recovery { grid-row: 2; }
#game [data-ui-screen] .cutscene-shell:has(> .screen-recovery:not([hidden])) > .cutscene-visual { grid-row: 3; }
#game [data-ui-screen] .cutscene-shell:has(> .screen-recovery:not([hidden])) > .cutscene-caption { grid-row: 4; }
#game [data-ui-screen] .screen-recovery {
  max-height: 40dvh;
  overflow-y: auto;
  scrollbar-width: thin;
}

/* Battle synchronization belongs inside the existing pause panel. */
#game #pauseOverlay .modal { max-height: calc(100dvh - 32px); overflow-y: auto; }
#game #pauseStatus { min-height: 3em; overflow-wrap: anywhere; line-height: 1.55; }
#game #pauseStatus[data-state="error"] { color: var(--ui-danger); }
#game #settingsBattleStatus[data-state="error"] { color: var(--ui-danger); }
#game #settingsBattleStatus[hidden] { display: none !important; }
#game #pauseOverlay button { margin-top: var(--ui-space-2); width: 100%; }
#game #pauseOverlay [hidden] { display: none !important; }