/* Reader-controlled warm night palette. Photographs and ad creative are never inverted. */
:root {
  color-scheme: light;
  --page: #ffffff;
  --ink: #191c20;
  --muted: #5f6269;
  --line: #d9dadd;
  --red: #971c2e;
  --soft: #f5f6f7;
  --reading-panel: #f7f8f9;
  --ad-paper: #faf9f6;
  --ad-rule: #e0ddd7;
  --ad-label: #756f65;
  --control-rule: #777777;
  --focus-ring: #215ea3;
  --inverse-ink: #ffffff;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --page: #1b1c1b;
  --ink: #ede8de;
  --muted: #bcb7ae;
  --line: #494a45;
  --red: #efaaa6;
  --soft: #292a27;
  --reading-panel: #252623;
  --ad-paper: #232421;
  --ad-rule: #494a45;
  --ad-label: #bcb7ae;
  --control-rule: #85877d;
  --focus-ring: #95c8ff;
  --inverse-ink: #1b1c1b;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --page: #1b1c1b;
    --ink: #ede8de;
    --muted: #bcb7ae;
    --line: #494a45;
    --red: #efaaa6;
    --soft: #292a27;
    --reading-panel: #252623;
    --ad-paper: #232421;
    --ad-rule: #494a45;
    --ad-label: #bcb7ae;
    --control-rule: #85877d;
    --focus-ring: #95c8ff;
    --inverse-ink: #1b1c1b;
  }
}
html, body { background: var(--page); color: var(--ink); }
body { accent-color: var(--red); }
.key-points, .inline-photo img { background: var(--soft); }
.editor-strip { background: var(--reading-panel); }
.edition-list li::before { color: var(--muted); }
.skip:focus { background: var(--page); color: var(--ink); }
.search-form input {
  background: var(--page);
  color: var(--ink);
  border-color: var(--control-rule);
}
.search-form input::placeholder { color: var(--muted); opacity: 1; }
.search-form button { background: var(--ink); color: var(--inverse-ink); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 4px;
}
.advertisement {
  background: var(--ad-paper);
  color: var(--ad-label);
  border-color: var(--ad-rule);
}
/* The publication's surrounding label follows the theme; Google owns its creative. */
.advertisement .adsbygoogle { color-scheme: light; }
.theme-control {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font: 12px/1.4 Arial, Helvetica, sans-serif;
  white-space: nowrap;
}
.theme-control[hidden] { display: none !important; }
.theme-control select {
  max-width: 105px;
  min-height: 44px;
  padding: 8px 6px;
  border: 1px solid var(--control-rule);
  border-radius: 3px;
  background: var(--page);
  color: var(--ink);
  font: inherit;
  cursor: pointer;
}
.utility { align-items: center; flex-wrap: wrap; }
.utility-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-left: auto;
}
.utility-actions > a { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 760px) {
  .utility { flex-wrap: wrap; gap: 8px 14px; }
  .theme-control { margin-left: auto; }
}
@media (max-width: 600px) {
  .theme-control > span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
}
@media (max-width: 400px) {
  .theme-control { margin-left: 0; }
}
@media print {
  :root, :root[data-theme="dark"], :root:not([data-theme]) {
    color-scheme: light;
    --page: #ffffff;
    --ink: #000000;
    --muted: #444444;
    --line: #cccccc;
    --red: #000000;
    --soft: #ffffff;
    --reading-panel: #ffffff;
    --inverse-ink: #ffffff;
  }
  html, body { background: #ffffff !important; color: #000000 !important; }
  .theme-control, .advertisement { display: none !important; }
}