/* Owner's-manual pages (pages/OM24-*.html, OM23-*.html): the printed pages as images.
   Loaded after page.css or classic/page.css, so it only uses variables both define (with fallbacks). */
.om-h { font: 700 32px/1.08 var(--f-cond, inherit); letter-spacing: .005em; margin: 4px 0 8px; }
.om-meta { font: 12px/1.5 var(--f-mono, inherit); color: var(--muted); margin: 0 0 18px; max-width: 760px; }
.om-meta a { color: var(--link, var(--accent)); text-underline-offset: 3px; }

.om-pg { margin: 0 0 22px; max-width: 760px; }
.om-pg img {
  display: block; width: 100%; height: auto; background: #fff; cursor: zoom-in;
  border: 1px solid var(--hair, var(--line, #d5dde2)); box-sizing: border-box;
}
.om-pg figcaption {
  font: 11px/1.3 var(--f-mono, inherit); color: var(--muted); text-transform: uppercase; letter-spacing: .08em;
  margin-top: 5px; text-align: right;
}

.om-text { max-width: 760px; margin: 30px 0 0; border-top: 1.5px solid var(--ink); }
.om-text summary {
  cursor: pointer; padding: 10px 0 6px; list-style: none;
  font: 700 15px/1.2 var(--f-cond, inherit); text-transform: uppercase; letter-spacing: .1em;
}
.om-text summary::-webkit-details-marker { display: none; }
.om-text summary::before { content: "+ "; font-family: var(--f-mono, monospace); }
.om-text[open] summary::before { content: "− "; }
.om-tx { font-size: 15px; line-height: 1.5; }
.om-tx section { margin: 6px 0 18px; }
.om-tx h4 {
  font: 11px/1.3 var(--f-mono, inherit); color: var(--muted); text-transform: uppercase; letter-spacing: .08em;
  border-bottom: 1px solid var(--hair, var(--line, #d5dde2)); padding-bottom: 3px; margin: 14px 0 8px;
}
.om-tx h3 { font: 700 19px/1.2 var(--f-cond, inherit); margin: 12px 0 4px; }
.om-tx p { margin: 3px 0 7px; }

/* tap a page: shown at full resolution, scroll / pinch to read the small print */
.om-zoom {
  position: fixed; inset: 0; z-index: 50; overflow: auto; background: rgba(15, 17, 19, .94);
  -webkit-overflow-scrolling: touch; padding: 12px;
}
.om-zoom img { display: block; width: 1001px; max-width: none; height: auto; margin: 0 auto; background: #fff; }
.om-close {
  position: fixed; top: 10px; right: 10px; width: 44px; height: 44px; border: 0; cursor: pointer;
  background: var(--ink); color: #fff; font: 28px/44px var(--f-mono, monospace);
}
@media (max-width: 640px) {
  .om-h { font-size: 26px; }
}

/* notes quoting the 2024 RHD edition where it says something different that matters */
.om-extra { max-width: 760px; box-sizing: border-box; margin: 0 0 18px; border: 1.5px solid var(--ink); background: #fff; }
.om-extra-h { display: flex; align-items: baseline; gap: 10px; padding: 5px 12px 4px; background: var(--ink); color: #fff;
  font: 700 14px/1.3 var(--f-cond, inherit); letter-spacing: .1em; text-transform: uppercase; }
.om-extra-h small { font: 500 12px/1.3 var(--f-mono, monospace); letter-spacing: .04em; text-transform: none; opacity: .85; }
.om-extra-b { padding: 9px 12px 8px; font-size: 15px; }
.om-extra-b p { margin: 0 0 7px; }
.om-extra-b q { quotes: "“" "”"; }
.om-row span { color: var(--muted); }
.om-row b { font-weight: 600; }
.om-extra-src { font: 12px/1.4 var(--f-mono, monospace); color: var(--muted); margin: 8px 0 0 !important; }
.om-extra-src a { color: var(--link, var(--accent)); text-underline-offset: 3px; }
