/* Generic free-roam reader; isolated from the approved Production Home and Mini Games styles. */
.fr-reader {
  width: min(100%, 760px);
  height: 100dvh;
  min-height: 0;
  margin: 0 auto;
  padding: max(20px, env(safe-area-inset-top)) 18px max(24px, env(safe-area-inset-bottom));
  display: flex;
  flex-direction: column;
  gap: 18px;
  overflow-x: hidden;
  overflow-y: hidden;
  color: var(--text-color);
}
.fr-header, .fr-modal-header { display: flex; align-items: center; gap: 12px; min-width: 0; }
.fr-header, .fr-modal-header, .fr-utilities, .fr-main-actions, .fr-tabs { flex: 0 0 auto; }
.fr-header span, .fr-modal-header h1 { overflow-wrap: anywhere; font-size: 1rem; font-weight: 700; }
.fr-prose { display: grid; gap: 14px; line-height: 1.75; overflow-wrap: anywhere; }
.fr-reader-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scrollbar-gutter: stable;
  align-content: start;
}
.fr-utilities, .fr-main-actions, .fr-tabs { display: flex; flex-wrap: wrap; gap: 10px; }
.fr-utilities > button { flex: 0 1 auto; }
.fr-main-actions > button { flex: 1 1 220px; }
.fr-reader button, .fr-reader select, .fr-reader input {
  max-width: 100%;
  min-height: 44px;
  border: 1px solid var(--card-border);
  border-radius: var(--radius-sm);
  background: var(--card-bg);
  color: inherit;
  padding: 10px 14px;
}
.fr-reader button { cursor: pointer; text-align: left; }
.fr-reader button:disabled { cursor: not-allowed; opacity: .45; }
.fr-list, .fr-map, .fr-notebook { display: grid; gap: 12px; min-width: 0; }
.fr-list > button, .fr-map section, .fr-notebook article, .fr-action, .fr-interaction {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--card-border);
  border-radius: var(--radius-sm);
  background: var(--card-bg);
}
.fr-interaction { display: grid; gap: 8px; }
.fr-disabled-explanation { color: var(--text-second); overflow-wrap: anywhere; }
.fr-action label { display: grid; gap: 6px; overflow-wrap: anywhere; }
.fr-label-lines, .fr-label-line { display: grid; gap: 4px; overflow-wrap: anywhere; }
.fr-disclosure-description { display: block; margin-top: 8px; color: var(--text-second); }
.fr-input-field, .fr-input-choice, .fr-action fieldset { display: grid; gap: 8px; min-width: 0; }
.fr-action fieldset { padding: 12px; border: 1px solid var(--card-border); border-radius: var(--radius-sm); }
.fr-input-choice { grid-template-columns: auto minmax(0, 1fr); align-items: start; }
.fr-input-choice input { min-height: 20px; margin-top: 2px; }
.fr-map-location { display: grid; gap: 6px; min-width: 0; }
.fr-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
.fr-tabs button { flex: 0 0 auto; }
.fr-loading { position: fixed; inset: 0; display: grid; place-items: center; background: rgba(10, 5, 20, .58); }
.fr-error { padding: 12px; border-radius: var(--radius-sm); background: rgba(190, 24, 93, .22); }
.fr-terminal { min-height: 70dvh; display: grid; place-items: center; }
@media (max-width: 430px) {
  .fr-reader { width: 100%; padding-inline: 14px; }
  .fr-main-actions > button { flex: 1 1 140px; }
}
@media (max-height: 420px) {
  .fr-reader {
    gap: 8px;
    padding-top: max(8px, env(safe-area-inset-top));
    padding-bottom: max(8px, env(safe-area-inset-bottom));
  }
}