/* Shared layout resilience: allow text to wrap instead of colliding in flex/grid cells. */
main, section, article, aside, fieldset, form, label, .field-row > *, .button-row > *, .message-card-heading > *, .site-nav > * { min-width: 0; }
fieldset { max-width: 100%; }
input, select, textarea { max-width: 100%; }
textarea, .message-body { overflow-wrap: anywhere; }
.field-row > label, .field-row > .form-field { flex: 1 1 0; }
.button, .text-button, .check-pill, summary { white-space: normal; overflow-wrap: anywhere; }
.button { height: auto; line-height: 1.45; text-align: center; }
.field-help, .fineprint, .notice, .checkbox-line span, .message-card-heading h3 { overflow-wrap: anywhere; }
.checkbox-line { align-items: flex-start; }
.checkbox-line input { flex: 0 0 auto; margin-top: .22em; }
.message-card .message-tags { align-items: center; gap: .5rem; }
.message-tags > span, .message-tags > .message-topic-toggle, .message-subtopic-tags > span { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem .7rem; border-radius: 999px; font-size: .8rem; line-height: 1.4; max-width: 100%; overflow-wrap: anywhere; }
.message-topic-toggle { font: inherit; border: 1px solid currentColor; cursor: pointer; text-align: left; min-height: 44px; }
.message-topic-toggle.message-tone-mild { background: #fff3ce; color: #654b13; }
.message-topic-toggle.message-tone-discussion { background: #ffe6d4; color: #743519; }
.message-topic-toggle.message-tone-explicit { background: #fce1e6; color: #7a243b; }
.message-tags .insult-tag { background: #f8e3d5; color: #733914; }
.message-topic-chevron { flex: 0 0 auto; transition: transform .15s ease; }
.message-topic-toggle[aria-expanded="true"] .message-topic-chevron { transform: rotate(180deg); }
.message-subtopics { border: 1px solid #c9cdbf; border-radius: 12px; padding: 1rem; margin: .5rem 0 1rem; background: #f8f9f4; }
.message-subtopics[hidden] { display: none !important; }
.message-subtopics-title { font-weight: 700; margin: 0 0 .5rem; }
.message-subtopics .field-help { font-size: .85rem; line-height: 1.6; margin: 0 0 .8rem; }
.message-subtopics-hint { margin: 0 0 .5rem; }
.message-subtopic-tags > span { background: #eadced; color: #56365c; }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid #476224; outline-offset: 3px; }
.site-nav form { margin: 0; }
@media (max-width: 700px) {
  .field-row { flex-wrap: wrap; }
  .field-row > label, .field-row > .form-field { flex-basis: 100%; }
  .message-card .button-row > .button, .message-card .button-row > .text-button { min-height: 44px; }
  .page-heading.heading-inline { flex-wrap: wrap; gap: 1rem; }
  .tag-options { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .message-topic-chevron { transition: none; } }

/* Keep bounded desktop dialogs scrollable as text or zoom increases. */
@media (min-width: 1101px) and (min-height: 741px) {
  .workbench-navigation, .reader-sidebar { min-height: 0; overflow-y: auto; }
  .workbench-main, .reader-content { overflow: hidden; }
  .workbench-fields { overflow-y: auto; padding-bottom: .25rem; }
  .reader-panels > section { overflow-y: auto; padding-right: .25rem; }
  .reader-story-text, .reader-category-grid, .reader-trait-grid { flex: 0 0 auto; }
}

/* Profile editing follows content height so template and trait text cannot cover navigation controls. */
.profile-wizard-main #profile-wizard-form {
  height: auto;
  min-height: 0;
  flex: none;
  grid-template-rows: auto auto;
  overflow: visible;
}
.profile-wizard-main .wizard-pages { flex: none; min-height: 0; }
.profile-wizard-main .wizard-page { height: auto; min-height: 0; }
.profile-wizard-main .wizard-navigation nav { flex: none; min-height: 0; }
.profile-wizard-main .wizard-group-button { flex-wrap: wrap; }
.profile-wizard-main .wizard-group-button > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.profile-wizard-main .wizard-group-progress { margin-left: auto; }
.profile-wizard-main .wizard-heading, .profile-wizard-main .wizard-section-heading, .profile-wizard-main .wizard-controls { flex-wrap: wrap; }
.profile-wizard-main .wizard-controls .button-row { flex-shrink: 1; max-width: 100%; }
.profile-wizard-main .wizard-page-count { white-space: normal; }
.profile-wizard-main .editor-trait-label, .profile-wizard-main .template-field-status, .profile-wizard-main .wizard-page-count { overflow-wrap: anywhere; }
