/* Extend the existing dark, glass and high-contrast themes. */
[hidden] { display: none !important; }
body { font-size: 1rem; line-height: 1.55; }
button, input, select, textarea { font: inherit; }
button, select, input:not([type=radio]):not([type=checkbox]) { min-height: 2.75rem; }
label, .btn, .tab-label, .sub-btn, .question-help, .secondary-text { font-size: .875rem; }
:focus-visible { outline: 3px solid var(--teal); outline-offset: 4px; }
.session-card, .custom-evaluation, .evidence-panel, .work-card, .delivery-panel {
  background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px;
  padding: 1.5rem; margin: 1.25rem 0; min-width: 0; overflow-wrap: anywhere;
}
.session-card { border-inline-start: 4px solid var(--teal); }
.session-card h1 { font-size: 1.7rem; line-height: 1.25; margin-bottom: .75rem; }
.session-card p + p { margin-top: .5rem; }
.evaluation-badge { display: inline-block; padding: .3rem .6rem; border: 1px solid var(--border-hi); border-radius: 5px; font-size: .875rem; }
.secondary-text, .question-help { color: var(--text-dim); }
.inline-field { display: flex; align-items: center; gap: 1rem; margin: 1rem 0; flex-wrap: wrap; }
.draft-choice { display: flex; align-items: center; gap: .6rem; margin: .8rem 0; }
.draft-choice input, .answer-choice input { position: static !important; opacity: 1 !important; width: 1.15rem !important; height: 1.15rem !important; appearance: auto; flex: 0 0 auto; }
.recovery-card { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; border-top: 1px solid var(--border); margin-top: 1rem; padding-top: 1rem; }
.question-section { border: 0; padding: 1.2rem 0; min-width: 0; }
.question-section + .question-section { border-top: 1px solid var(--border); }
.question-section legend { font-size: 1.2rem; font-weight: 600; padding-bottom: .7rem; }
.custom-question { margin: 1rem 0 1.8rem; }
.custom-question > label:first-child { display: block; font-weight: 600; margin-bottom: .5rem; font-size: 1rem; }
.custom-question input:not([type=radio]):not([type=checkbox]), .custom-question select, .custom-question textarea,
.work-card input, .work-card select, .work-card textarea, .evidence-entry input, .evidence-entry select, .evidence-entry textarea {
  width: 100%; background: var(--input-bg); color: var(--text); border: 1px solid var(--border-hi);
  border-radius: 6px; padding: .65rem .8rem; margin-top: .3rem;
}
.custom-question textarea, .work-card textarea { min-height: 7rem; resize: vertical; }
.answer-options { display: flex; gap: .65rem; flex-wrap: wrap; margin-top: .65rem; }
.answer-choice { display: flex; align-items: center; gap: .55rem; border: 1px solid var(--border-hi); padding: .65rem .9rem; border-radius: 7px; cursor: pointer; font-size: 1rem; }
.answer-choice:has(input:checked) { border-color: var(--teal); background: var(--surface2); }
.status-label { display: block; color: var(--text-dim); margin-top: .8rem; }
.response-status { display: block; width: min(100%, 20rem) !important; padding: .4rem; background: var(--input-bg); color: var(--text); border: 1px solid var(--border-hi); border-radius: 5px; font-size: .875rem; }
.star-item { flex-wrap: wrap; }
.star-item > .status-label { flex: 1 0 100%; }
.answer-alternative { margin-top: .5rem; font-size: .875rem; color: var(--text-dim); }
.star-item > .answer-alternative { flex: 1 0 100%; }
.answer-alternative summary, .evaluation-details summary, .reading-settings summary, .feedback-review summary { cursor: pointer; padding-block: .55rem; min-height: 2.75rem; }
.answer-alternative[open] { padding-bottom: .5rem; }
.evaluation-details { border-top: 1px solid var(--border); margin-top: 1rem; }
.reading-settings { align-self: flex-start; }
.reading-settings[open] .context-setting { margin-block: .5rem; }
.feedback-review { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 1.5rem; margin-block: 1.25rem; }
.feedback-review h2 { font-size: 1.6rem; margin-bottom: .5rem; }
.feedback-review > p { margin-block: .75rem; }
.review-step { padding-block: 1rem; border-top: 1px solid var(--border); }
.review-step-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.review-step-header h3 { font-size: 1rem; }
.review-answers dt { font-weight: 600; margin-top: .8rem; }
.review-answers dd { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--text-dim); margin-block: .25rem; }
.review-step .is-error { margin-top: .5rem; }
.nav-row { flex-wrap: wrap; }
.skip-step { font-weight: 400; padding-inline: .6rem; }
.sub-panel h2, .custom-question { scroll-margin-top: 1.5rem; }
.evidence-panel summary { cursor: pointer; font-weight: 600; }
.evidence-panel p, .evidence-panel > label { display: block; margin: .8rem 0; }
.evidence-entry { padding: 1rem; margin: 1rem 0; border: 1px solid var(--border); border-radius: 8px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem; }
.evidence-entry legend { padding: 0 .4rem; }
.evidence-entry label { display: block; }
.delivery-panel:has(#submission-alert[hidden]) { display: none; }
.delivery-panel ul { margin: 1rem 0; padding-inline-start: 1.3rem; }
.delivery-panel button { margin: .4rem .6rem .4rem 0; }
.is-error, #submission-alert.is-error { color: var(--red); }
[inert] { opacity: .6; }
.work-page { max-width: 1200px; margin: auto; padding: 2rem; }
.work-header { display: flex; justify-content: space-between; gap: 1rem; align-items: center; flex-wrap: wrap; margin-bottom: 1.5rem; }
.work-header h1 { font-size: 1.8rem; }
.work-header nav { display: flex; gap: 1rem; flex-wrap: wrap; }
a { color: var(--teal); }
.work-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.work-grid .work-card { margin: 0; }
.work-card label { display: block; margin-bottom: .85rem; }
.work-card h2 { font-size: 1.2rem; margin-bottom: 1rem; }
.work-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin: 1rem 0; }
.metric-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; margin: 1rem 0; }
.metric-grid > div { padding: 1rem; border: 1px solid var(--border); border-radius: 8px; background: var(--surface2); }
.metric-grid strong { display: block; font-size: 1.5rem; }
.table-scroll { overflow-x: auto; }
.work-table { border-collapse: collapse; width: 100%; font-size: .9rem; }
.work-table th, .work-table td { padding: .75rem; border-bottom: 1px solid var(--border); text-align: start; vertical-align: top; }
.work-table th { color: var(--text-dim); }
.work-table button { color: var(--teal); background: transparent; border: 0; cursor: pointer; text-align: start; }
.response-detail { padding: 1rem; background: var(--surface2); border-radius: 8px; margin: 1rem 0; }
.response-detail dt { font-weight: 600; margin-top: 1rem; }
.response-detail dd { white-space: pre-wrap; overflow-wrap: anywhere; }
pre, code { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .875rem; }
.json-editor { font-family: ui-monospace, monospace; min-height: 22rem !important; }
.section-editor { border: 1px solid var(--border); padding: 1rem; margin: 1rem 0; }
@media (max-width: 700px) {
  .work-page { padding: 1rem; }
  .work-grid, .evidence-entry, .metric-grid { grid-template-columns: 1fr; }
  .session-card, .custom-evaluation, .work-card { padding: 1rem; }
  .feedback-review { padding: 1rem; }
  .nav-row .btn-primary { margin-inline-start: auto; }
  .inline-field { align-items: stretch; flex-direction: column; gap: .3rem; }
  .tab-nav { overflow-x: auto; justify-content: flex-start; }
  .theme-switcher { position: static; justify-content: flex-end; margin-bottom: 1rem; }
  .btn { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
.locale-controls { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; margin-block: .5rem; width: 100%; }
.locale-controls label { margin: 0; }
.locale-controls select { width: auto; max-width: 100%; min-height: 2.5rem; padding: .4rem .7rem; border: 1px solid var(--border); border-radius: .4rem; background: var(--surface); color: var(--text); font: inherit; }
.locale-status { font-size: .85rem; margin-block: .4rem .8rem; }
.locale-status:empty { display: none; }
.locale-controls button, .locale-controls select { min-height: 44px; }
pre, code, .json-editor { direction: ltr; text-align: left; unicode-bidi: isolate; }
:root[dir="rtl"] .theme-switcher { right: auto; left: 1rem; }
:root[dir="rtl"] .work-table th, :root[dir="rtl"] .work-table td { text-align: right; }
:root[dir="rtl"] .step-overview, :root[dir="rtl"] .tab-nav { direction: rtl; }
