.header-actions {
  display: flex;
  gap: 6px;
  margin-left: auto;
}

.danger-outline {
  color: var(--danger);
  border-color: #d7aaa7;
}

fieldset {
  border: 1px solid var(--line);
  border-radius: 11px;
  margin: 16px 0;
  padding: 10px 13px;
}

legend {
  padding: 0 6px;
  font-weight: 800;
}

.section-picker {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.section-picker .check { margin: 0; }

.easy-read {
  font-size: 18px;
  line-height: 1.75;
}

.easy-read .layout,
.easy-read .grid,
.easy-read .two-col,
.easy-read .section-picker { grid-template-columns: 1fr; }
.easy-read .wide { grid-column: auto; }
.easy-read .card,
.easy-read .panel { padding: 26px; }
.easy-read button,
.easy-read input,
.easy-read textarea,
.easy-read select {
  min-height: 48px;
  font-size: 18px;
}

@media (max-width: 960px) { nav { display: none; } }
@media (max-width: 820px) {
  .top-inner { flex-wrap: wrap; padding-block: 10px; }
}

/* Version 9.1 bilingual story, approval inbox and editorial review pack */
/*
 * The width belongs on the dialog, not on its child. Previously the 920px
 * child sat inside the default 680px dialog and caused the horizontal cut-off
 * visible on the bilingual story screen.
 */
#languageDialog,
#reportDialog,
#proposalDialog {
  width: min(920px, calc(100vw - 28px));
  max-width: calc(100vw - 28px);
  overflow-x: hidden;
}
.modal-wide {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
#languageDialog fieldset,
#languageDialog label,
#languageDialog .two-col > *,
#languageDialog input,
#languageDialog textarea,
#languageDialog select,
#languageDialog .check span {
  min-width: 0;
  max-width: 100%;
}
#languageDialog .check span,
#languageDialog .warning,
#translationStatus { overflow-wrap: anywhere; }
#translationStatus.translation-error {
  padding: 9px 11px;
  border-radius: 9px;
  background: #fff4df;
  color: #704e17;
  font-weight: 650;
}
.language-entry-summary,
.bilingual-entry-list,
.proposal-inbox { display: grid; gap: 10px; }
.language-summary-item,
.entry-card-header,
.proposal-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.language-summary-item {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8fcfb;
}
.language-summary-item strong,
.language-summary-item small,
.entry-card-header strong,
.proposal-card > header strong,
.proposal-card > header small { display: block; }
.language-summary-item small,
.proposal-card > header small { color: var(--muted); }
.entry-list-heading { color: var(--green-dark); font-weight: 850; }
.bilingual-entry-card {
  padding: 15px;
  border: 1px solid #c8dcd6;
  border-left: 4px solid var(--green);
  border-radius: 12px;
  background: #fbfefd;
}
.bilingual-entry-card blockquote {
  margin: 11px 0;
  padding: 11px 13px;
  border-left: 3px solid #d6b260;
  background: #fff8e9;
  white-space: pre-wrap;
}
.report-setup {
  margin-bottom: 14px;
  padding: 15px;
  border: 1px solid #c8dcd6;
  border-radius: 12px;
  background: #f1f8f6;
}
.report-cover { position: relative; }
.report-cover::after {
  content: "";
  position: absolute;
  right: 25px;
  bottom: 21px;
  width: 52px;
  height: 4px;
  border-radius: 5px;
  background: #e7bd6a;
}
.report-cover-name { margin: 13px 0 0; color: #dcefe9; font-weight: 750; }
.report-meta { grid-template-columns: repeat(2, 1fr); }
.report-section { border-top: 3px solid var(--green); border-radius: 6px; }
.inbox-count {
  display: inline-grid;
  min-width: 23px;
  min-height: 23px;
  margin-left: 6px;
  place-items: center;
  border-radius: 999px;
  background: #fff;
  color: var(--green-dark);
  font-size: 12px;
}
.proposal-card {
  padding: 17px;
  border: 1px solid #bfd8d0;
  border-radius: 14px;
  background: #fbfefd;
  box-shadow: 0 6px 18px #1636300b;
}
.proposal-choices { display: grid; gap: 8px; margin: 14px 0; }
.proposal-choice {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 10px;
  margin: 0;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
}
.proposal-choice:has(input:checked) { border-color: #82b6a7; background: var(--soft); }
.proposal-choice input { width: auto; margin-top: 3px; }
.proposal-choice strong,
.proposal-choice small { display: block; }
.proposal-choice small { margin-top: 3px; color: #415c63; white-space: pre-wrap; }
.proposal-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.inbox-empty { padding: 25px; text-align: center; }
@media (max-width: 590px) {
  #languageDialog,
  #reportDialog,
  #proposalDialog {
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
  }
  .report-meta { grid-template-columns: 1fr; }
  .proposal-actions button { width: 100%; }
}

/* Version 8 first-time writing guidance. Placeholder examples are never saved. */
input::placeholder,
textarea::placeholder {
  color: #7b898e;
  opacity: 1;
  font-style: italic;
  font-weight: 450;
}

input:focus::placeholder,
textarea:focus::placeholder { color: #9aa5a9; }

/* Version 7 polished participant-approved reports */
.classy-report {
  overflow: auto;
  border: 1px solid #c8dcd6;
  border-radius: 16px;
  background: #f8fcfb;
  color: var(--ink);
  box-shadow: inset 0 1px 0 #fff;
}
#reportPreview,#encryptedReportPreview { max-height: 480px; }
.report-cover { padding: 28px; background: linear-gradient(135deg,#0f5144,#176b5a); color: #fff; }
.report-cover .report-kicker { margin: 0 0 8px; font-size: 11px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; opacity: .82; }
.report-cover h3 { margin: 0; font-size: clamp(25px,4vw,36px); line-height: 1.12; color: #fff; }
.report-meta { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; padding: 16px 22px; border-bottom: 1px solid var(--line); background: #fff; }
.report-meta div { min-width: 0; }
.report-meta strong,.report-meta span { display: block; overflow-wrap: anywhere; }
.report-meta strong { margin-bottom: 3px; color: var(--muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.report-meta span { font-weight: 720; }
.report-body { display: grid; gap: 14px; padding: 22px; }
.report-section { break-inside: avoid; padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: #fff; }
.report-section h4 { margin: 0 0 12px; color: var(--green-dark); font-size: 17px; letter-spacing: .01em; }
.report-section p { margin: 7px 0; white-space: pre-wrap; overflow-wrap: anywhere; color: #334b52; }
.report-section p strong { color: var(--ink); }
.report-disclaimer { margin: 0; padding: 0 22px 22px; color: var(--muted); font-size: 11px; }
@media(max-width:590px){.report-meta{grid-template-columns:1fr}.report-cover{padding:22px}.report-body{padding:15px}.report-section{padding:15px}}

/* Version 2 onboarding guidance */
.field-help { margin: 2px 0 10px; color: var(--muted); font-size: 13px; font-weight: 500; }
.format-choice-group { padding: 13px; }
.format-choice {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin: 8px 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #fff;
  font-weight: 500;
  cursor: pointer;
}
.format-choice:has(input:checked) { border-color: var(--green); background: var(--soft); }
.format-choice input { width: auto; margin: 4px 0 0; flex: 0 0 auto; }
.format-choice strong,
.format-choice small { display: block; }
.format-choice small { margin-top: 2px; color: var(--muted); font-weight: 500; }
.passphrase-help { margin: 8px 0; padding: 12px 14px; border-radius: 11px; background: #f1f7f5; color: #315d54; font-size: 13px; }
.passphrase-help ul { margin: 7px 0; padding-left: 20px; }
.passphrase-help p { margin: 7px 0 0; }
.passphrase-strength { min-height: 30px; margin: 5px 0 10px; padding: 6px 9px; border-radius: 8px; background: var(--amber); color: #76531c; font-size: 13px; font-weight: 750; }
.passphrase-strength.accepted { background: var(--soft); color: var(--green-dark); }
.compact-check { margin-top: 8px; padding-block: 8px; }
@media (max-width: 590px) {
  .section-picker { grid-template-columns: 1fr; }
  .header-actions { width: 100%; }
  .header-actions button { flex: 1; }
}

/* Onexa v9.2 brand lockup */
.onexa-logo {
  display: block;
  width: min(230px, 100%);
  height: auto;
  object-fit: contain;
}
.gate-logo { margin: 0 auto 18px; }
.header-logo { width: 190px; max-height: 58px; }
.brand-logo-button {
  display: flex;
  align-items: center;
  flex: 0 1 auto;
  line-height: 0;
}
.billing-logo { width: 235px; margin-bottom: 12px; }
.privacy-logo { width: 240px; margin-bottom: 18px; }
.coordinator-login-logo { margin: 0 auto 18px; }
.report-brand-logo {
  display: block;
  width: 175px;
  max-width: 48%;
  height: auto;
  margin: 0 0 18px;
  padding: 7px 9px;
  border-radius: 9px;
  background: #fff;
}
@media (max-width: 590px) {
  .header-logo { width: 145px; max-height: 48px; }
  .billing-logo,
  .privacy-logo { width: 200px; }
  .report-brand-logo { width: 145px; max-width: 62%; }
}

/* Task-based navigation */
.section-nav {
  position: sticky;
  top: 68px;
  z-index: 8;
  display: block;
  margin: 0;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  background: rgba(244, 250, 248, .96);
  scrollbar-width: thin;
  backdrop-filter: blur(10px);
}

.section-nav-inner {
  display: flex;
  gap: 5px;
  width: 100%;
  min-width: 0;
  max-width: 1160px;
  margin: auto;
  padding: 9px 22px;
}

.section-nav button {
  flex: 0 0 auto;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font-weight: 750;
}

.section-nav button:hover { background: var(--soft); color: var(--green-dark); }
.section-nav button.active {
  border-color: #b7d8ce;
  background: #fff;
  color: var(--green-dark);
  box-shadow: 0 2px 8px #16363010;
}

.section-shell { min-height: calc(100vh - 130px); }
.app-section.hidden { display: none !important; }
.compact-hero { margin-bottom: 16px; }

.safety-details {
  margin-bottom: 16px;
  border: 1px solid #c8dfd8;
  border-radius: 11px;
  background: #edf8f4;
  color: #315d54;
}

.safety-details summary {
  padding: 9px 13px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
}

.safety-details .safety { border: 0; border-top: 1px solid #c8dfd8; border-radius: 0; }

.section-heading {
  max-width: 720px;
  margin: 22px 0 20px;
}

.section-heading h1 { margin: 3px 0; font-size: clamp(28px, 4vw, 38px); }
.section-heading p { margin: 0; color: var(--muted); font-size: 16px; }
.back-home { margin: 0 0 12px; padding: 0; border: 0; background: transparent; color: var(--green-dark); font-weight: 800; }

.section-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.progress-card {
  display: grid;
  grid-template-columns: minmax(220px, .45fr) 1fr;
  align-items: center;
  gap: 22px;
  margin-bottom: 18px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}

.home-purpose {
  margin-bottom: 18px;
  overflow: hidden;
  border: 1px solid #bdd8d0;
  border-radius: 18px;
  background: linear-gradient(135deg, #ffffff 0%, #eef8f5 100%);
  box-shadow: 0 14px 32px rgba(17, 73, 62, .08);
}

.home-purpose-intro {
  padding: 22px 24px 18px;
}

.home-purpose-intro h2 {
  max-width: 760px;
  margin: 4px 0 7px;
  color: var(--ink);
  font-size: clamp(22px, 3vw, 30px);
  line-height: 1.18;
}

.home-purpose-intro > p {
  max-width: 820px;
  margin: 0;
  color: var(--muted);
  font-size: 16px;
}

.home-benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  border-block: 1px solid #d6e7e2;
  background: #d6e7e2;
}

.home-benefits article {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 11px;
  min-width: 0;
  padding: 18px;
  background: rgba(255, 255, 255, .92);
}

.benefit-mark {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 50%;
  background: var(--green-dark);
  color: #fff;
  font-weight: 850;
}

.home-benefits h3 {
  margin: 2px 0 5px;
  color: var(--ink);
  font-size: 17px;
}

.home-benefits p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.home-privacy-note {
  margin: 0;
  padding: 13px 24px;
  color: #355b61;
  font-size: 13px;
}

.billing-purpose {
  margin-top: 18px;
}

.support-contact {
  margin: 20px 0 0;
  padding: 13px 15px;
  border: 1px solid #c9ded8;
  border-radius: 12px;
  background: #f5fbf9;
  color: #355b61;
  font-size: 14px;
}

.support-contact a,
.footer-support a {
  color: var(--green-dark);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.support-contact small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.45;
}

.footer-support {
  display: block;
  margin-top: 7px;
}

.billing-help-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px 16px;
}

.progress-card strong,
.progress-card span { display: block; }
.progress-card span { color: var(--muted); font-size: 13px; }

.task-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  max-width: 900px;
}

.task-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  min-height: 94px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  box-shadow: var(--shadow);
}

.task-card:hover,
.task-card:focus-visible { border-color: #8ab9aa; background: #fbfefd; }
.task-card strong,
.task-card small { display: block; }
.task-card strong { margin-bottom: 2px; font-size: 17px; }
.task-card small { color: var(--muted); font-weight: 500; }
.task-number {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 50%;
  background: var(--soft);
  color: var(--green-dark);
  font-weight: 850;
}

.task-status {
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--amber);
  color: #76531c;
  font-size: 12px;
  font-weight: 800;
}

.task-status.complete { background: var(--soft); color: var(--green-dark); }
.easy-read .section-grid,
.easy-read .task-grid,
.easy-read .progress-card,
.easy-read .home-benefits { grid-template-columns: 1fr; }

@media (max-width: 820px) {
  .section-nav { position: static; }
  .section-nav-inner { padding-inline: 15px; }
  .section-grid,
  .task-grid { grid-template-columns: 1fr; }
  .progress-card { grid-template-columns: 1fr; gap: 10px; }
  .home-benefits { grid-template-columns: 1fr; }
  .home-purpose-intro { padding: 19px 18px 15px; }
  .home-privacy-note { padding: 13px 18px; }
}