/* Shared reader behavior; visual tokens and card layout live in styles.css. */
.media-frame-document { display: block; aspect-ratio: auto; background: var(--color-surface); border: 1px solid var(--color-border); }
.media-frame-document img { width: 100%; height: auto; }
.skip-link { position: absolute; left: 16px; top: -100px; padding: 8px; background: var(--color-surface); z-index: 10; }
.skip-link:focus { top: 8px; }
.content-detail .detail-header h1 { font-size: clamp(28px, 4.4vw, var(--font-size-display)); line-height: 1.4; font-weight: var(--font-weight-bold); letter-spacing: -0.025em; text-wrap: pretty; }
.article-body { overflow-wrap: anywhere; color: var(--color-gray-800, var(--color-text)); }
.article-body:empty { display: none; }
.article-body h2 { margin: var(--space-8) 0 var(--space-3); padding-bottom: var(--space-2); border-bottom: 2px solid var(--color-border-strong); font-size: clamp(var(--font-size-xl), 3.2vw, 28px); line-height: 1.5; color: var(--color-text); }
.article-body h2:first-child { margin-top: var(--space-6); }
.article-body h3 { margin: var(--space-5) 0 var(--space-2); padding-left: var(--space-2); border-left: 3px solid var(--color-text-muted); font-size: var(--font-size-lg); line-height: 1.5; color: var(--color-text); }
.article-body h2 + h3 { margin-top: var(--space-3); }
.article-body > p:has(> strong:only-child) { margin-top: var(--space-4); margin-bottom: var(--space-2); }
.article-body > p > strong:only-child { display: block; font-size: var(--font-size-lg); line-height: 1.6; }
@media (max-width: 720px) { .article-body h2 { margin-top: var(--space-6); } .article-body h3 { margin-top: var(--space-4); } }
.article-body ul, .article-body ol { padding-inline-start: 1.25em; }
.article-body p:has(> img:only-child), .article-body p:has(> .article-image-link:only-child) { width: 100%; margin: 24px 0 8px; }
.article-image-link { display: block; cursor: zoom-in; }
.article-image-dialog { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 4vh 2vw; box-sizing: border-box; border: 0; background: transparent; cursor: zoom-out; }
.article-image-dialog[open] { display: flex; align-items: center; justify-content: center; }
.article-image-dialog::backdrop { background: color-mix(in srgb, var(--color-text) 80%, transparent); }
.article-image-dialog > img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; user-select: none; }
.article-image-close { position: absolute; top: max(16px, env(safe-area-inset-top)); right: max(16px, env(safe-area-inset-right)); display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: color-mix(in srgb, var(--color-text) 75%, transparent); color: var(--color-surface); cursor: pointer; }
.article-image-close:hover { background: var(--color-text); }
.article-image-close:focus-visible { outline: 2px solid var(--color-surface); outline-offset: 3px; }
.article-body img { display: block; width: 100%; height: auto; box-sizing: border-box; border: 1px solid var(--color-border); background: var(--color-surface); }
.article-body .schedule-figure { margin: 24px 0 32px; }
.article-body .schedule-image { border: 0; }
.article-body p:has(> img:only-child) + p > em:only-child, .article-body p:has(> .article-image-link:only-child) + p > em:only-child { display: block; margin-bottom: 28px; color: var(--color-text-muted); font-size: 14px; line-height: 1.7; }
.article-body pre { overflow: auto; padding: 16px; background: var(--color-surface-neutral); }
.article-body table { display: block; overflow-x: auto; border-collapse: collapse; }
.article-body th, .article-body td { padding: 8px 12px; border-bottom: 1px solid var(--color-border); }
[data-pdf-status] { color: var(--color-error); font-size: 14px; }
.page-retry { padding: 8px 16px; cursor: pointer; }
.detail-resource { margin-block: 32px; }
.content-detail:has(.media-comparison) { max-width: 1200px; }
.content-detail:has(.media-comparison) .article-body { max-width: 680px; margin-inline: auto; }
.media-comparison { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; margin-block: 24px 40px; }
.media-comparison section { min-width: 0; }
.media-comparison h2 { margin: 0 0 12px; font-size: 17px; line-height: 1.5; }
.media-comparison .media-frame { aspect-ratio: 16 / 9; }
.media-comparison .media-frame-document img { height: 100%; object-fit: contain; }
@media (max-width: 760px) { .media-comparison { grid-template-columns: minmax(0, 1fr); gap: 24px; } }
.slide-stage { position: relative; }
.floating-pagination, .floating-download { border: 1px solid var(--color-border); border-radius: 9999px; background: var(--color-surface); box-shadow: 0 4px 12px color-mix(in srgb, var(--color-text) 16%, transparent); }
.floating-pagination { position: absolute; z-index: 1; left: 12px; bottom: 12px; display: inline-flex; align-items: center; width: auto; gap: 0; padding: 2px; color: var(--color-text); }
.floating-pagination .page-button { border: 0; border-radius: 9999px; background: transparent; }
.floating-pagination .page-button { width: 36px; min-height: 36px; }
.floating-pagination .page-button img { width: 20px; height: 20px; filter: none; }
.floating-pagination .page-button:hover:not(:disabled) { background: var(--color-surface-neutral); }
.floating-pagination .page-button:focus-visible { outline: 2px solid var(--color-key-primary); outline-offset: -3px; }
.floating-pagination output { min-width: 48px; text-align: center; color: var(--color-text); font-size: 13px; }
.floating-download { position: absolute; z-index: 1; right: 12px; bottom: 12px; width: 40px; min-height: 40px; }
.floating-download img { width: 20px; height: 20px; filter: none; }
.page-button.floating-download:hover:not(:disabled) { background: var(--color-surface-neutral); border-color: var(--color-border); }
.floating-download:focus-visible { outline: 2px solid var(--color-key-primary); outline-offset: 2px; }
.pdf-viewer-controls { position: absolute; z-index: 1; left: 50%; bottom: 12px; transform: translateX(-50%); display: inline-flex; align-items: center; width: max-content; padding: 2px; border: 1px solid var(--color-border); border-radius: 9999px; background: var(--color-surface); box-shadow: 0 4px 12px color-mix(in srgb, var(--color-text) 16%, transparent); }
.pdf-viewer-controls .floating-pagination { position: static; padding: 0; border: 0; box-shadow: none; }
.pdf-viewer-controls .floating-download { position: static; border: 0; border-radius: 9999px; background: transparent; box-shadow: none; }
.pdf-viewer-controls .floating-fullscreen { border-left: 1px solid var(--color-border); border-radius: 0; }

.article-body strong { font-weight: var(--font-weight-bold); color: var(--color-text); }
.article-body ins { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
.article-body mark { color: inherit; background: var(--color-article-highlight); padding-inline: 0.12em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }

@media (hover: hover) and (pointer: fine) {
  .slide-stage > .floating-pagination,
  .slide-stage > .floating-download,
  .slide-stage > .pdf-viewer-controls { opacity: 0; pointer-events: none; }
  .slide-stage:hover > .floating-pagination,
  .slide-stage:hover > .floating-download,
  .slide-stage:hover > .pdf-viewer-controls,
  .slide-stage:has(:focus-visible) > .floating-pagination,
  .slide-stage:has(:focus-visible) > .floating-download,
  .slide-stage:has(:focus-visible) > .pdf-viewer-controls { opacity: 1; pointer-events: auto; }
}


.floating-fullscreen { right: 60px; }
.pdf-fullscreen-dialog { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: var(--color-surface); color: var(--color-text); }
.pdf-viewer:fullscreen, .pdf-fullscreen-dialog .pdf-viewer { width: 100%; height: 100%; box-sizing: border-box; display: flex; flex-direction: column; background: var(--color-surface); }
.pdf-viewer:fullscreen .slide-stage, .pdf-fullscreen-dialog .slide-stage { flex: 1; min-height: 0; padding-bottom: 68px; box-sizing: border-box; }
.pdf-viewer:fullscreen .media-frame-document, .pdf-fullscreen-dialog .media-frame-document { width: 100%; height: 100%; aspect-ratio: auto; border: 0; }
.pdf-viewer:fullscreen .media-frame-document img, .pdf-fullscreen-dialog .media-frame-document img { width: 100%; height: 100%; object-fit: contain; }
.pdf-viewer:fullscreen .floating-pagination, .pdf-viewer:fullscreen .floating-download,
.pdf-fullscreen-dialog .floating-pagination, .pdf-fullscreen-dialog .floating-download { opacity: 1; pointer-events: auto; bottom: max(12px, env(safe-area-inset-bottom)); }
.pdf-viewer:fullscreen .pdf-viewer-controls,
.pdf-fullscreen-dialog .pdf-viewer-controls { opacity: 1; pointer-events: auto; bottom: max(12px, env(safe-area-inset-bottom)); }