/* Follow the device setting, including changes while the page is open. */
:root { color-scheme: light dark; }
input, button { color: inherit; }
input { accent-color: var(--green); }
.cta, .compare-tray .cta, .searchbox button { color: #18221c; }
@media (prefers-color-scheme: dark) {
  :root {
    --ink: #e7eee7;
    --muted: #afbdaf;
    --line: #3d4b40;
    --green: #93d6a0;
    --soft: #24372a;
    --lime: #d8ee9c;
    --paper: #131b16;
    --white: #1d2820;
  }
  header, select, .skip, .quick-start select, .quick-start input, .feature, .chip, .countries span, .price-panel,
  .quick-start, .vpn-card, .plain-button, .filter-panel,
  .filter-field select, .filter-field input, .searchbox input,
  .empty, .pager button, .wide-table { background: var(--white); color: var(--ink); }
  .lead, .assessment p, .description-text, .wide-table td { color: var(--muted); }
  .assessment, .spec { border-color: var(--line); }
  .card-facts span, .label, .filter-tag, .source-box, .periods,
  .wide-table th:first-child, .wide-table thead th { background: var(--soft); color: var(--ink); }
  .label.pending, .status-inactive, .archive-warning { background: #3d301a; color: #f2d193; border-color: #76603a; }
  .archived-card { background: #19231c; }
  .periods button[aria-pressed=true] { background: var(--white); }
  .pager button[aria-current=page] { background: var(--green); color: #18221c; }
  .empty, .data-note { border-color: var(--line); }
  a:focus-visible, button:focus-visible, select:focus-visible,
  summary:focus-visible, input:focus-visible { outline-color: var(--green); }
  /* Brand artwork keeps its original light backing; never invert logos. */
  img.service-icon, .logo { background: #fff; }
  .service-icon.initials { background: var(--soft); color: var(--green); }
}