/* Secondary-page chrome. The homepage's generated Lumen palette is the
   authority; aliases keep the existing article/legal layouts and copy intact. */
@font-face{font-family:Geist;src:url('/fonts/geist-400-n-latin.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Geist;src:url('/fonts/geist-600-n-latin.woff2') format('woff2');font-weight:600;font-display:swap}

body.ember-page {
  color-scheme: dark;
  --amber: var(--accent);
  --amber-hot: var(--accentHot);
  --amber-deep: var(--accentInk);
  --midnight: var(--bg0);
  --ink: var(--bg1);
  --surface: var(--bg2);
  --surface-up: var(--bg3);
  --paper: var(--text);
  --paper-dim: var(--textSec);
  --paper-ghost: var(--textTer);
  --slate: var(--textMut);
  --line: var(--border);
  --line-hover: var(--borderHov);
  --line-warm: var(--accentStr);
  --glow: color-mix(in srgb, var(--accent) 8%, transparent);
  --glow-strong: color-mix(in srgb, var(--accent) 18%, transparent);
  background: var(--bg0);
  color: var(--text);
}
body.editorial-page {
  --bg: var(--bg0);
  --bg-1: var(--bg1);
  --bg-2: var(--bg2);
  --bg-3: var(--bg3);
  --ink: var(--text);
  --ink-2: var(--textSec);
  --ink-3: var(--textTer);
  --ink-4: var(--textMut);
}
body.ember-page.light-mode {
  color-scheme: light;
  --bg0: var(--light-bg0);
  --bg1: var(--light-bg1);
  --bg2: var(--light-bg2);
  --bg3: var(--light-bg3);
  --text: var(--light-text);
  --textSec: var(--light-textSec);
  --textTer: var(--light-textTer);
  --textMut: var(--light-textMut);
  --border: var(--light-border);
  --borderHov: var(--light-borderHov);
  --accent: var(--light-accent);
  --accentHot: var(--light-accentHot);
  --accentInk: var(--light-accentInk);
}
.ember-page > nav {
  position: sticky;
  top: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 80px;
  height: auto;
  padding: 18px max(24px, calc((100% - 1280px) / 2));
  background: color-mix(in srgb, var(--bg0) 90%, transparent);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(20px);
}
.ember-page > nav .nav-inner { width: 100%; max-width: 1280px; min-width: 0; gap: 20px; }
.ember-page .logo { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; color: var(--text); text-decoration: none; }
.ember-page .logo-text, .ember-page .logo-wm, .ember-page .footer-left {
  font-family: Geist, Arial, sans-serif;
  font-size: 23px;
  font-weight: 600;
  letter-spacing: -.055em;
}
.ember-page img.ember-mark, .campaign-page img.ember-mark { display: block; width: 32px; height: 32px; flex: none; filter: none; }
/* Header lockup (Spark mark + outlined Syne wordmark): 38 px tall (76-unit box) keeps the mark at the old 24 px. */
img.ember-lockup { display: block; width: auto; height: 38px; flex: none; }
@media (max-width: 400px) { img.ember-lockup { height: 33px; } }
/* Mark + "Desklight" lockup: centre the wordmark's cap height on the mark (the
   mark is centred in its 32px image, so .logo's align-items:center does the
   rest). text-box trims the text box to cap top..baseline. Without text-box
   support, line-height:normal still centres it, because Geist's ascent and
   descent sit symmetrically around its cap height; an inherited line-height
   (1.65 on editorial pages) rounded the half-leading and lifted it ~1px. */
.ember-page .logo .logo-text, .ember-page .logo .logo-wm { line-height: normal; text-box: trim-both cap alphabetic; }
.ember-page .nav-links, .ember-page .nav-right { gap: 24px; flex-wrap: wrap; }
.ember-page .nav-link, .ember-page .nav-signin { font-family: Geist, Arial, sans-serif; font-size: 13px; color: var(--textSec); }
.ember-page .nav-cta, .ember-page .nav-btn { background: var(--text); color: var(--bg0); border-radius: 999px; font: 500 13px/1.4 Geist, Arial, sans-serif; padding: 11px 20px; box-shadow: none; }
.ember-page .nav-cta:hover, .ember-page .nav-btn:hover { background: var(--accent); color: var(--onAccent); box-shadow: none; }
.ember-page > footer, .campaign-page > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px 32px;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 40px max(24px, calc((100% - 1280px) / 2));
  border-top: 1px solid var(--border);
  background: var(--bg0);
  color: var(--textSec);
  font: 400 12px/1.7 Geist, Arial, sans-serif;
  text-align: left;
}
.ember-page footer .footer-meta, .ember-page footer .foot-links, .page-footer-links { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; min-width: 0; }
.ember-page footer .footer-meta { flex: 1; }
.ember-page footer .foot-inner { display: flex; flex-wrap: wrap; gap: 20px; padding: 0; margin: 0; min-width: 0; flex: 1; }
.ember-page footer .footer-right { font: inherit; color: var(--textSec); }
.ember-page footer a, .campaign-page footer a { color: var(--textSec); text-decoration: none; }
.ember-page footer a:hover, .campaign-page footer a:hover { color: var(--text); }
.ember-page footer [data-cookie-preferences], .campaign-page footer [data-cookie-preferences] { min-height: 44px; color: var(--textSec); text-align: left; }
.ember-page :focus-visible, .campaign-page footer :focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
/* Allow legal tables and long provider names to wrap at narrow viewports. */
.ember-page .legal-page { overflow-wrap: anywhere; }
.ember-page .legal-page table { table-layout: fixed; }
.ember-page .legal-page th, .ember-page .legal-page td { overflow-wrap: anywhere; }
/* Noon retains its campaign art direction; only Desklight chrome is branded. */
.campaign-page .nav { background: var(--bg0); color: var(--text); border-color: var(--border); }
.campaign-page .nav .nav-link { color: var(--text); }
.campaign-page .nav .nav-center { color: var(--textSec); }
@media (max-width: 600px) {
  .ember-page > nav { min-height: 72px; padding: 16px 20px; gap: 12px; flex-wrap: wrap; }
  .ember-page .nav-links, .ember-page .nav-right { gap: 12px; }
  .ember-page .logo-text, .ember-page .logo-wm { font-size: 21px; }
  .ember-page > footer, .campaign-page > footer { align-items: flex-start; padding: 32px 24px; gap: 20px; }
  .ember-page footer .footer-meta { flex-basis: 100%; }
  .ember-page .legal-page th, .ember-page .legal-page td { padding: .7rem .4rem; }
  .editorial-page .comparison-table, .editorial-page .ss-table { table-layout: fixed; width: 100%; }
  .editorial-page .comparison-table th, .editorial-page .comparison-table td,
  .editorial-page .ss-table th, .editorial-page .ss-table td { overflow-wrap: anywhere; }
}

/* Copy law: no italics anywhere. Emphasis is color and weight, never slant.
   This resets the browser default italic on em, i, cite, dfn, var and address. */
em, i, cite, dfn, var, address { font-style: normal; }
