/* OAPA Press content design system — v1.0
   Upload as the OMP press stylesheet alongside the OAPA Bookstore theme.
   Wrap custom page HTML in <div class="oapa-content">...</div>.
   The earlier .oapa-publish wrapper is also supported.
   Uses Newsreader and Archivo supplied by the theme; no remote imports.
   This supplements the theme; it does not replace its navigation styles. */

/* 01 — Tokens and foundation */
:is(.oapa-content, .oapa-publish) {
  --op-ink: #000; --op-paper: #fff;
  --op-serif: "Newsreader", Georgia, serif;
  --op-sans: "Archivo", Arial, sans-serif;
  --op-mono: ui-monospace, SFMono-Regular, Consolas, monospace;
  --op-space-1: .25rem; --op-space-2: .5rem; --op-space-3: .75rem;
  --op-space-4: 1rem; --op-space-5: 1.5rem; --op-space-6: 2rem;
  --op-space-7: 3rem; --op-space-8: 4rem;
  --op-reading: 68ch; --op-width: 70rem;
  --op-gap: 2.5rem; --op-section: clamp(1.75rem, 4vw, 3rem);
  --op-border: 1px solid var(--op-ink); --op-control: 2.875rem;
  width: 100%; max-width: var(--op-width); color: var(--op-ink);
  font-family: var(--op-sans); font-size: 1rem; line-height: 1.7;
  overflow-wrap: break-word;
}
:is(.oapa-content, .oapa-publish), :is(.oapa-content, .oapa-publish) *, :is(.oapa-content, .oapa-publish) *::before, :is(.oapa-content, .oapa-publish) *::after { box-sizing: border-box; }
:is(.oapa-content, .oapa-publish) [hidden] { display: none !important; }
:is(.oapa-content, .oapa-publish) ::selection { color: #fff; background: #000; }

/* 02 — Editorial typography */
:is(.oapa-content, .oapa-publish) :is(h1,h2,h3,h4,h5,h6) { color: inherit; font-family: var(--op-serif); font-weight: 450; line-height: 1.15; letter-spacing: -.025em; text-wrap: balance; margin: 1.5em 0 .6em; }
:is(.oapa-content, .oapa-publish) h1 { font-size: clamp(2.5rem, 5vw, 4rem); }
:is(.oapa-content, .oapa-publish) h2 { font-size: clamp(1.875rem, 3.5vw, 2.75rem); }
:is(.oapa-content, .oapa-publish) h3 { font-size: clamp(1.5rem, 2.5vw, 2rem); }
:is(.oapa-content, .oapa-publish) h4 { font-size: 1.375rem; }
:is(.oapa-content, .oapa-publish) h5 { font-size: 1.125rem; }
:is(.oapa-content, .oapa-publish) h6 { font-size: 1rem; }
:is(.oapa-content, .oapa-publish) p { margin: 0 0 1.25rem; font: inherit; }
:is(.oapa-content, .oapa-publish) strong { font-weight: 650; }
:is(.oapa-content, .oapa-publish) em { font-style: italic; }
:is(.oapa-content, .oapa-publish) :is(sup,sub) { font-size: .75em; line-height: 0; }
:is(.oapa-content, .oapa-publish) abbr[title] { text-decoration: underline dotted; text-underline-offset: .2em; cursor: help; }
:is(.oapa-content, .oapa-publish) address { font-style: normal; }
:is(.oapa-content, .oapa-publish) .op-lead { max-width: 25ch; font-family: var(--op-serif); font-size: clamp(2rem, 4vw, 3rem); line-height: 1.15; letter-spacing: -.025em; text-wrap: balance; }
:is(.oapa-content, .oapa-publish) .op-standfirst { font-size: 1.125rem; max-width: var(--op-reading); }
:is(.oapa-content, .oapa-publish) :is(small,.op-small,.op-meta,.op-caption) { font-size: .875rem; line-height: 1.6; }
:is(.oapa-content, .oapa-publish) .op-label { font-size: .75rem; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; }

/* 03 — Links and keyboard focus */
:is(.oapa-content, .oapa-publish) a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
:is(.oapa-content, .oapa-publish) a:visited { color: inherit; }
:is(.oapa-content, .oapa-publish) a:hover { text-decoration-thickness: 2px; }
:is(.oapa-content, .oapa-publish) :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
:is(.oapa-content, .oapa-publish) [id] { scroll-margin-top: 2rem; }
:is(.oapa-content, .oapa-publish) .op-text-link { font-weight: 650; }
:is(.oapa-content, .oapa-publish) .op-link-list { list-style: none; padding: 0; }
:is(.oapa-content, .oapa-publish) .op-link-list li + li { margin-top: .75rem; }

/* 04 — Actions */
:is(.oapa-content, .oapa-publish) .op-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-top: 1.5rem; }
:is(.oapa-content, .oapa-publish) .op-button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: var(--op-control); max-width: 100%; padding: .75rem 1.25rem; border: 1px solid #000; border-radius: 0; color: #fff; background: #000; font: 600 .9375rem/1.35 var(--op-sans); text-align: center; text-decoration: none; cursor: pointer; }
:is(.oapa-content, .oapa-publish) .op-button:visited { color: #fff; }
:is(.oapa-content, .oapa-publish) .op-button:hover { color: #000; background: #fff; text-decoration: none; }
:is(.oapa-content, .oapa-publish) .op-button:focus-visible { outline-color: var(--op-ink); }
:is(.oapa-content, .oapa-publish) .op-button-secondary { color: #000; background: #fff; }
:is(.oapa-content, .oapa-publish) .op-button-secondary:visited { color: #000; }
:is(.oapa-content, .oapa-publish) .op-button-secondary:hover { color: #fff; background: #000; }
:is(.oapa-content, .oapa-publish) .op-button-small { padding: .5rem .875rem; }
:is(.oapa-content, .oapa-publish) .op-button-wide { width: 100%; }
:is(.oapa-content, .oapa-publish) .op-button:disabled { cursor: not-allowed; background: #fff; color: #000; border-style: dashed; }

/* 05 — Sections and reading measure */
:is(.oapa-content, .oapa-publish) .op-introduction { max-width: 50rem; }
:is(.oapa-content, .oapa-publish) .op-section { margin-top: var(--op-section); padding-top: var(--op-section); border-top: var(--op-border); }
:is(.oapa-content, .oapa-publish) .op-section-plain { border-top: 0; }
:is(.oapa-content, .oapa-publish) .op-section-compact { margin-top: 1.5rem; padding-top: 1.5rem; }
:is(.oapa-content, .oapa-publish) :is(.op-section-heading,.op-prose) { max-width: var(--op-reading); }
:is(.oapa-content, .oapa-publish) .op-prose-center { margin-inline: auto; }
:is(.oapa-content, .oapa-publish) .op-stack > * + * { margin-top: 1.5rem; }
:is(.oapa-content, .oapa-publish) :is(.op-section,.op-introduction,.op-panel,.op-notice,.op-prose) > :first-child { margin-top: 0; }
:is(.oapa-content, .oapa-publish) :is(.op-section,.op-introduction,.op-panel,.op-notice,.op-prose) > :last-child { margin-bottom: 0; }
:is(.oapa-content, .oapa-publish) hr { border: 0; border-top: var(--op-border); margin: var(--op-section) 0; }

/* 06 — Responsive grids */
:is(.oapa-content, .oapa-publish) :is(.op-two-columns,.op-three-columns,.op-split,.op-with-sidebar) { display: grid; gap: var(--op-gap); align-items: start; }
:is(.oapa-content, .oapa-publish) .op-two-columns { grid-template-columns: repeat(2,minmax(0,1fr)); }
:is(.oapa-content, .oapa-publish) .op-three-columns { grid-template-columns: repeat(3,minmax(0,1fr)); }
:is(.oapa-content, .oapa-publish) .op-split { grid-template-columns: minmax(0,1fr) minmax(0,1.25fr); }
:is(.oapa-content, .oapa-publish) .op-with-sidebar { grid-template-columns: minmax(0,2fr) minmax(0,1fr); }
:is(.oapa-content, .oapa-publish) :is(.op-two-columns,.op-three-columns,.op-split,.op-with-sidebar) > * { min-width: 0; }
:is(.oapa-content, .oapa-publish) :is(.op-two-columns,.op-three-columns,.op-split) > * > :first-child { margin-top: 0; }
:is(.oapa-content, .oapa-publish) .op-sidebar { padding-left: 1.5rem; border-left: var(--op-border); }

/* 07 — Lists */
:is(.oapa-content, .oapa-publish) :is(ul,ol) { padding-left: 1.5rem; margin: 0 0 1.5rem; }
:is(.oapa-content, .oapa-publish) li { padding-left: .25rem; margin-bottom: .65rem; }
:is(.oapa-content, .oapa-publish) li > :is(ul,ol) { margin: .75rem 0; }
:is(.oapa-content, .oapa-publish) .op-checklist strong { display: block; }
:is(.oapa-content, .oapa-publish) .op-list-plain { list-style: none; padding: 0; }
:is(.oapa-content, .oapa-publish) .op-list-plain > li { padding-left: 0; }
:is(.oapa-content, .oapa-publish) .op-list-compact > li { margin-bottom: .25rem; }

/* 08 — Publication process */
:is(.oapa-content, .oapa-publish) .op-process { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2rem 3rem; padding-left: 1.75rem; }
:is(.oapa-content, .oapa-publish) .op-process > li { padding-left: .5rem; margin-bottom: 0; }
:is(.oapa-content, .oapa-publish) .op-process > li::marker { font-weight: 650; }
:is(.oapa-content, .oapa-publish) .op-process h3 { margin-top: 0; }
:is(.oapa-content, .oapa-publish) .op-process-linear { grid-template-columns: minmax(0,1fr); }

/* 09 — Policies and contents */
:is(.oapa-content, .oapa-publish) .op-contents { border-block: var(--op-border); padding-block: 1.5rem; margin-bottom: 2.5rem; }
:is(.oapa-content, .oapa-publish) .op-contents > :first-child { margin-top: 0; }
:is(.oapa-content, .oapa-publish) .op-contents > :last-child { margin-bottom: 0; }
:is(.oapa-content, .oapa-publish) .op-policy-section + .op-policy-section { margin-top: 2.5rem; }
:is(.oapa-content, .oapa-publish) .op-policy-meta { font-size: .875rem; margin-bottom: 2rem; }
:is(.oapa-content, .oapa-publish) .op-footnotes { border-top: var(--op-border); padding-top: 1.5rem; font-size: .875rem; }

/* 10 — Metadata */
:is(.oapa-content, .oapa-publish) dl { margin: 0 0 1.5rem; }
:is(.oapa-content, .oapa-publish) dt { font-weight: 650; }
:is(.oapa-content, .oapa-publish) dd { margin: .25rem 0 1rem; }
:is(.oapa-content, .oapa-publish) .op-facts { display: grid; grid-template-columns: minmax(8rem,1fr) minmax(0,3fr); gap: .75rem 1.5rem; }
:is(.oapa-content, .oapa-publish) .op-facts dd { margin: 0; }

/* 11 — Tables. Give scroll wrappers tabindex=0 and an accessible label. */
:is(.oapa-content, .oapa-publish) .op-table-scroll { max-width: 100%; overflow-x: auto; margin-block: 1.5rem; }
:is(.oapa-content, .oapa-publish) table { width: 100%; border-collapse: collapse; font-size: .9375rem; text-align: left; }
:is(.oapa-content, .oapa-publish) caption { text-align: left; font-weight: 650; padding-bottom: .75rem; }
:is(.oapa-content, .oapa-publish) :is(th,td) { padding: .875rem 1rem; border-bottom: var(--op-border); vertical-align: top; }
:is(.oapa-content, .oapa-publish) th { font-weight: 650; }
:is(.oapa-content, .oapa-publish) thead th { border-top: var(--op-border); border-bottom: 2px solid currentColor; }
:is(.oapa-content, .oapa-publish) .op-table-wide { min-width: 42rem; }
:is(.oapa-content, .oapa-publish) .op-numeric { text-align: right; font-variant-numeric: tabular-nums; }

/* 12 — Notices and panels */
:is(.oapa-content, .oapa-publish) .op-notice { margin-block: 1.5rem; padding: .5rem 0 .5rem 1.5rem; border-left: 3px solid currentColor; }
:is(.oapa-content, .oapa-publish) .op-panel { padding: clamp(1.25rem,3vw,2rem); border: var(--op-border); }
:is(.oapa-content, .oapa-publish) .op-panel-inverse { --op-ink: #fff; --op-paper: #000; color: #fff; background: #000; }
:is(.oapa-content, .oapa-publish) .op-panel-inverse .op-button { color: #000; background: #fff; border-color: #fff; }
:is(.oapa-content, .oapa-publish) .op-panel-inverse .op-button:hover { color: #fff; background: #000; }

/* 13 — Quotations */
:is(.oapa-content, .oapa-publish) blockquote { margin: 2rem 0; padding-left: 1.5rem; border-left: 2px solid currentColor; font: 450 clamp(1.5rem,2.5vw,2rem)/1.4 var(--op-serif); }
:is(.oapa-content, .oapa-publish) blockquote cite { display: block; font: normal .875rem/1.6 var(--op-sans); }

/* 14 — People */
:is(.oapa-content, .oapa-publish) .op-person { display: grid; grid-template-columns: 6rem minmax(0,1fr); gap: 1.5rem; }
:is(.oapa-content, .oapa-publish) .op-person-photo { width: 6rem; height: 6rem; object-fit: cover; }
:is(.oapa-content, .oapa-publish) .op-person h3 { margin-top: 0; }
:is(.oapa-content, .oapa-publish) .op-person-text { grid-template-columns: minmax(0,1fr); }
:is(.oapa-content, .oapa-publish) :is(.op-person-role,.op-person-affiliation,.op-person-contact) { font-size: .875rem; margin-bottom: .5rem; }

/* 15 — Resources and downloads */
:is(.oapa-content, .oapa-publish) .op-resources { list-style: none; padding: 0; }
:is(.oapa-content, .oapa-publish) .op-resource { display: flex; justify-content: space-between; align-items: start; gap: 1.5rem; border-top: var(--op-border); padding: 1.25rem 0; margin: 0; }
:is(.oapa-content, .oapa-publish) .op-resource > * { min-width: 0; }
:is(.oapa-content, .oapa-publish) .op-resource-title { font-weight: 650; }
:is(.oapa-content, .oapa-publish) .op-resource-meta { font-size: .875rem; margin: .25rem 0 0; }

/* 16 — FAQ; native details retains keyboard support */
:is(.oapa-content, .oapa-publish) details { border-bottom: var(--op-border); padding-block: 1.25rem; }
:is(.oapa-content, .oapa-publish) summary { cursor: pointer; font-weight: 650; padding-right: .5rem; }
:is(.oapa-content, .oapa-publish) summary::marker { color: inherit; }
:is(.oapa-content, .oapa-publish) details[open] summary { margin-bottom: 1rem; }
:is(.oapa-content, .oapa-publish) .op-faq { border-top: var(--op-border); }
:is(.oapa-content, .oapa-publish) .op-answer { max-width: var(--op-reading); }
:is(.oapa-content, .oapa-publish) .op-answer > :last-child { margin-bottom: 0; }

/* 17 — Media */
:is(.oapa-content, .oapa-publish) :is(img,video,svg) { max-width: 100%; height: auto; }
:is(.oapa-content, .oapa-publish) figure { margin: 2rem 0; }
:is(.oapa-content, .oapa-publish) figure img { display: block; }
:is(.oapa-content, .oapa-publish) figcaption { font-size: .875rem; line-height: 1.6; margin-top: .75rem; }
:is(.oapa-content, .oapa-publish) .op-media { aspect-ratio: 16/9; width: 100%; }
:is(.oapa-content, .oapa-publish) .op-media iframe { width: 100%; height: 100%; border: 0; }

/* 18 — Forms: presentation only; validation and submission need application code */
:is(.oapa-content, .oapa-publish) .op-field { margin-bottom: 1.5rem; }
:is(.oapa-content, .oapa-publish) label { display: block; margin-bottom: .5rem; font-weight: 650; }
:is(.oapa-content, .oapa-publish) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),select,textarea) { width: 100%; min-height: var(--op-control); padding: .75rem; border: var(--op-border); border-radius: 0; color: var(--op-ink); background: var(--op-paper); font: inherit; }
:is(.oapa-content, .oapa-publish) textarea { min-height: 10rem; resize: vertical; }
:is(.oapa-content, .oapa-publish) :is(input[type="checkbox"],input[type="radio"]) { width: 1.125rem; height: 1.125rem; accent-color: #000; }
:is(.oapa-content, .oapa-publish) .op-check-label { display: flex; align-items: baseline; gap: .75rem; font-weight: 400; }
:is(.oapa-content, .oapa-publish) fieldset { min-width: 0; border: var(--op-border); padding: 1.5rem; margin: 0 0 1.5rem; }
:is(.oapa-content, .oapa-publish) legend { padding-inline: .5rem; font-weight: 650; }
:is(.oapa-content, .oapa-publish) :is(.op-field-help,.op-field-error) { font-size: .875rem; margin: .5rem 0 0; }
:is(.oapa-content, .oapa-publish) .op-field-error { font-weight: 650; }
:is(.oapa-content, .oapa-publish) [aria-invalid="true"] { border-width: 2px; }
:is(.oapa-content, .oapa-publish) :is(input,select,textarea):disabled { border-style: dashed; cursor: not-allowed; }
:is(.oapa-content, .oapa-publish) :is(input,textarea)[readonly] { border-style: dotted; }

/* 19 — Technical text */
:is(.oapa-content, .oapa-publish) :is(code,pre,kbd,samp) { font-family: var(--op-mono); font-size: .875em; }
:is(.oapa-content, .oapa-publish) pre { padding: 1.25rem; border: var(--op-border); overflow-x: auto; white-space: pre; }
:is(.oapa-content, .oapa-publish) pre code { font-size: inherit; }
:is(.oapa-content, .oapa-publish) kbd { border: var(--op-border); padding: .1em .3em; }

/* 20 — Closing invitation */
:is(.oapa-content, .oapa-publish) .op-closing { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
:is(.oapa-content, .oapa-publish) .op-closing > * { min-width: 0; }
:is(.oapa-content, .oapa-publish) .op-closing h2 { margin-top: 0; }
:is(.oapa-content, .oapa-publish) .op-closing .op-actions { flex-shrink: 0; margin-top: 0; }

/* 21 — Utilities */
:is(.oapa-content, .oapa-publish) .op-text-center { text-align: center; }
:is(.oapa-content, .oapa-publish) .op-text-left { text-align: left; }
:is(.oapa-content, .oapa-publish) .op-no-margin { margin: 0; }
:is(.oapa-content, .oapa-publish) .op-break-anywhere { overflow-wrap: anywhere; }
:is(.oapa-content, .oapa-publish) .op-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* 22 — Small screens */
@media (max-width: 960px) {
  :is(.oapa-content, .oapa-publish) { --op-gap: 1.75rem; }
  :is(.oapa-content, .oapa-publish) .op-three-columns { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 760px) {
  :is(.oapa-content, .oapa-publish) :is(.op-two-columns,.op-split,.op-with-sidebar,.op-process) { grid-template-columns: minmax(0,1fr); }
  :is(.oapa-content, .oapa-publish) .op-sidebar { border-left: 0; border-top: var(--op-border); padding: 1.5rem 0 0; }
  :is(.oapa-content, .oapa-publish) .op-closing { flex-direction: column; align-items: start; }
  :is(.oapa-content, .oapa-publish) .op-resource { flex-wrap: wrap; }
  :is(.oapa-content, .oapa-publish) :is(th,td) { padding: .75rem; }
}
@media (max-width: 480px) {
  :is(.oapa-content, .oapa-publish) .op-person { grid-template-columns: 4rem minmax(0,1fr); gap: 1rem; }
  :is(.oapa-content, .oapa-publish) .op-person-photo { width: 4rem; height: 4rem; }
  :is(.oapa-content, .oapa-publish) .op-person-text { grid-template-columns: minmax(0,1fr); }
  :is(.oapa-content, .oapa-publish) .op-facts { grid-template-columns: minmax(0,1fr); gap: .25rem; }
  :is(.oapa-content, .oapa-publish) .op-facts dd { margin-bottom: 1rem; }
  :is(.oapa-content, .oapa-publish) .op-actions { align-items: stretch; }
  :is(.oapa-content, .oapa-publish) .op-actions .op-button { width: 100%; }
}

/* 23 — User accessibility preferences */
@media (prefers-reduced-motion: reduce) {
  :is(.oapa-content, .oapa-publish), :is(.oapa-content, .oapa-publish) *, :is(.oapa-content, .oapa-publish) *::before, :is(.oapa-content, .oapa-publish) *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
@media (forced-colors: active) {
  :is(.oapa-content, .oapa-publish) { --op-ink: CanvasText; --op-paper: Canvas; }
  :is(.oapa-content, .oapa-publish) .op-button { color: ButtonText; background: ButtonFace; border-color: ButtonText; }
  :is(.oapa-content, .oapa-publish) a { color: LinkText; }
  :is(.oapa-content, .oapa-publish) :focus-visible { outline-color: Highlight; }
}

/* 24 — Print. Open FAQ answers before printing if needed. */
@media print {
  :is(.oapa-content, .oapa-publish) { color: #000; background: #fff; max-width: none; font-size: 10.5pt; --op-section: 1.5rem; }
  :is(.oapa-content, .oapa-publish) :is(.op-two-columns,.op-three-columns,.op-split,.op-with-sidebar,.op-process,.op-closing) { display: block; }
  :is(.oapa-content, .oapa-publish) :is(.op-two-columns,.op-three-columns,.op-split,.op-process) > * { margin-bottom: 1rem; }
  :is(.oapa-content, .oapa-publish) :is(h1,h2,h3,h4,h5,h6,summary) { break-after: avoid; }
  :is(.oapa-content, .oapa-publish) :is(p,li) { orphans: 3; widows: 3; }
  :is(.oapa-content, .oapa-publish) :is(figure,.op-person,.op-notice,tr) { break-inside: avoid; }
  :is(.oapa-content, .oapa-publish) .op-panel-inverse { --op-ink: #000; --op-paper: #fff; color: #000; background: #fff; }
  :is(.oapa-content, .oapa-publish) .op-button { color: #000; background: #fff; border-color: #000; }
  :is(.oapa-content, .oapa-publish) .op-table-scroll { overflow: visible; }
  :is(.oapa-content, .oapa-publish) .op-table-wide { min-width: 0; }
  :is(.oapa-content, .oapa-publish) .op-no-print { display: none !important; }
}
