/* Shared reading controls and robust focus/reflow across workspace and pitch. */
:root { --reading-text: #17253b; --reading-paper: #fffdf8; }
html { scroll-behavior: auto; }
body { overflow-wrap: anywhere; }
/* Color interpolation can briefly violate contrast when changing reading modes. */
body * { transition: none !important; }
p, li, dd { max-width: 80ch; }
button, input, select, textarea, summary { min-height: 44px; min-width: 44px; }
button { white-space: normal; }
.brand, .skip-link, .detail-content > a, .footer > a { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
input, select, textarea, fieldset { min-width: 0; max-width: 100%; }
input, select { min-height: 44px; }
input[type="checkbox"] { width: 44px; height: 44px; min-width: 44px; flex-shrink: 0; }
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible {
  outline: 3px solid #101f39 !important; outline-offset: 4px !important;
  box-shadow: 0 0 0 4px #fffdf8 !important;
}
:where(button,a,input,select,textarea,summary,[tabindex]) { scroll-margin: 1rem; }
.reading-controls, .help-panel { margin: 1rem auto; width: min(calc(100% - 2rem), 1180px); padding: 1rem; border: 1px solid #65758c; border-radius: 12px; background: #fffdf8; color: #17253b; }
.reading-controls summary { cursor: pointer; font-weight: 700; padding: .5rem; }
.reading-controls label { display: inline-flex; gap: .75rem; align-items: center; flex-wrap: wrap; margin: .5rem; }
.reading-controls select, .reading-controls input { color: #17253b; background: #fffdf8; border: 1px solid #65758c; padding: .5rem; font: inherit; }
.reading-controls a, .help-panel a { color: #17458c; text-decoration: underline; }
.site-links { display: flex; flex-wrap: wrap; gap: .75rem; }
.site-links a { display: inline-flex; align-items: center; min-height: 44px; padding: .25rem .5rem; }
.topbar, .header-actions, .hero-actions, .download-actions, .form-actions, .dialog-actions, .section-heading--row, .status-row { flex-wrap: wrap; }
.hero-copy, .hero-actions, .workspace-header > *, .section-heading--row > * { min-width: 0; }
.hero-actions { flex-shrink: 1; }
.download-actions { flex-shrink: 1; }
.commitment-card { display: grid; text-align: left; gap: .35rem; padding: 1rem; color: #17253b; background: #fffdf8; border: 1px solid #65758c; border-radius: 12px; font: inherit; }
.stat { display: grid; gap: .5rem; }
.detail-content, .timeline li { overflow-wrap: anywhere; }
.detail-content p, .timeline p, .help-panel p, .help-panel dd { line-height: 1.5; margin-bottom: 1.5em; }
.notification { width: 100%; }
.notification:empty { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); }
.review-content { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; line-height: 1.5; }
.review-dialog { padding: 1.5rem; }
.review-dialog h2:focus { outline-offset: 3px; }
.dialog-error { color: #742522; background: #fff0ed; padding: .75rem; }
.dialog-error:empty { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); }
.help-panel dt { font-weight: bold; margin-top: 1rem; }
.help-panel h1 { color: #17253b; font-size: 2.5rem; }
.help-panel h2 { margin: 1.5rem 0 1rem; }
.help-panel dd { margin-left: 0; }
.help-panel table { width: 100%; border-collapse: collapse; }
.help-panel th, .help-panel td { padding: .5rem; border: 1px solid #65758c; text-align: left; }
html[data-reading="dark"] { --reading-text: #fffdf8; --reading-paper: #101f39; }
html[data-reading="light"] { --reading-text: #17253b; --reading-paper: #fffdf8; }
html[data-reading="yellow"] { --reading-text: #ffec99; --reading-paper: #101010; }
html[data-reading] body, html[data-reading] body :where(main,section,article,header,footer,aside,dialog,details,div,p,span,em,strong,b,h1,h2,h3,label,legend,fieldset,dt,dd,li,pre,a,button,input,select,textarea,summary) {
  color: var(--reading-text) !important; background: var(--reading-paper) !important; box-shadow: none;
}
html[data-reading] p, html[data-reading] li, html[data-reading] dd { line-height: 1.5 !important; margin-bottom: 1.5em !important; max-width: 80ch; }
html[data-reading] :where(button,input,select,textarea) { border: 1px solid currentColor !important; }
html[data-reading] .hero::before, html[data-reading] .hero-orbit, html[data-reading] .cover-mark { display: none; }
html[data-reading] .slide { height: auto; min-height: 0; }
@media (max-width: 760px) {
  .identity { display: inline; max-width: 100%; }
  .topbar { gap: .75rem; padding-block: .75rem; }
  .stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .hero-actions { display: flex; }
  .hero-actions .button { width: auto; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  :where(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline-color: Highlight !important; }
  button, input, select, textarea { border: 1px solid ButtonText !important; }
}