/* Canonical shell styling shared by standalone Reader and ReaderHost.vue. */
.reader-shell {
  --reader-paper: #ffffff;
  --reader-ink: #242424;
  --reader-muted: #5d5a55;
  --reader-border: #eae7e1;
  --reader-link: #235c9f;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  color: var(--reader-ink);
  background: var(--reader-paper);
  font: 15px/1.6 'Avenir Next', 'Noto Sans SC', 'PingFang SC', 'Hiragino Sans GB', sans-serif;
  overflow-anchor: none;
}
.reader-shell[data-reader-theme="dark"] {
  --reader-paper: #1b1d1e;
  --reader-ink: #f2eee8;
  --reader-muted: #c9c3b9;
  --reader-border: #393d3e;
  --reader-link: #a9c7ff;
  color-scheme: dark;
}
.reader-shell[data-reader-theme="light"] { color-scheme: light; }
.reader-shell[data-reader-embedded] { height: 100%; overflow-y: auto; scrollbar-gutter: stable; }
.reader-shell[data-reader-standalone] { min-height: 100dvh; }
html:has(.reader-shell[data-reader-standalone]) { scrollbar-gutter: stable; }
html:has(.reader-shell[data-reader-standalone]:not([data-reader-mode="native"])) { overflow-anchor: none; }
html[data-reader-shell-theme="dark"] { color-scheme: dark; background: #1b1d1e; }
html[data-reader-shell-theme="light"] { color-scheme: light; background: #fff; }
.reader-shell[data-reader-mode="native"] { overflow-anchor: auto; }
body:has(.reader-shell[data-reader-standalone]) { margin: 0; background: var(--reader-paper, #fff); }
.reader-shell * { box-sizing: border-box; }
.reader-shell .reader-intro { width: min(100%, 76ch); margin: 0 auto; padding: 28px var(--ht-reader-gutter) 24px; }
.reader-shell .reader-intro h1 { margin: 0 0 12px; font-size: 24px; font-weight: 500; line-height: 1.4; text-align: center; overflow-wrap: anywhere; }
.reader-shell .reader-intro h2 { margin: 0 0 20px; font-size: 15px; font-weight: normal; line-height: 1.6; text-align: center; overflow-wrap: anywhere; }
.reader-shell .reader-intro a { color: inherit; text-decoration: none; }
.reader-shell .reader-intro a:hover { text-decoration: underline; text-underline-offset: .15em; }
.reader-shell .reader-intro a:focus-visible { outline: 2px solid var(--reader-link); outline-offset: 4px; }
.reader-shell .reader-summary { margin: 20px 0 0; padding: 16px; border: 1px solid var(--reader-border); border-radius: 6px; white-space: pre-line; overflow-wrap: anywhere; }
.reader-shell .reader-summary-label { display: block; font-weight: 700; }
.reader-shell .reader-article-frame { display: block; width: min(100%, var(--reader-article-max-width)); margin-inline: auto; height: 0; min-height: 0; border: 0; background: var(--reader-paper); }
.reader-shell .reader-status { margin: 0; padding: 24px; text-align: center; color: var(--reader-muted); }
.reader-shell .reader-native-body { width: min(100%, 76ch); margin: auto; padding: 0 var(--ht-reader-gutter) 48px; }
.reader-shell .reader-native-body p { margin: 0; padding: 4px 0 16px; }
.reader-shell .reader-native-body h2 { margin: 24px 0 12px; font-size: 18px; font-weight: 500; line-height: 1.5; }
.reader-shell .reader-native-body h3 { font-size: 16.5px; font-weight: normal; line-height: 1.5; }
.reader-shell .reader-native-body a { color: var(--reader-link); }
.reader-shell .reader-native-body img, .reader-shell .reader-native-body video { max-width: 100%; height: auto; }
.reader-shell .reader-native-body table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.reader-shell .reader-native-body td, .reader-shell .reader-native-body th { padding: 8px; border-bottom: 1px solid var(--reader-border); }
.reader-shell .reader-native-body pre { overflow-x: auto; }
.reader-shell [hidden] { display: none; }
@media (max-width: 600px) { .reader-shell .reader-intro { padding-block: 20px; } }
@media print { .reader-shell .reader-status { display: none; } }