/* =============================================
   THEME — clean, modern Democratic-campaign look (Activated site only)
   White space, one confident blue, red kept for the single primary action. Loaded last; re-points the shared
   colour tokens, so the main ringwoodwatch.com stylesheets are untouched.
   ============================================= */
:root {
  --blue: #1a4bd6;            /* ActBlue-style action blue */
  --blue-dark: #12338f;
  --navy: #0e1b4d;            /* DNC-style deep navy, used for text and the footer */
  --blue-50: #f1f5ff;
  --blue-100: #e1eaff;
  --red: #d8203a;

  --paper: #ffffff;
  --ink: #1b2440;
  --slate-950: #0e1b4d;
  --slate-900: #16224f;
  --slate-800: #26335f;
  --slate-700: #3e4a73;
  --slate-600: #565f80;
  --slate-500: #6f7894;
  --slate-400: #98a0b8;
  --slate-300: #cfd5e3;
  --slate-200: #e3e7f0;
  --slate-100: #eef1f7;
  --slate-50: #f7f9fc;
  --red-700: #b3142d;
  --red-600: var(--red);
}

body { background: #fff; font-family: var(--sans); }

/* header: white, light, a single blue rule - like a campaign site rather than a banner */
.site-header { background: #fff; border-bottom: 1px solid var(--slate-200); padding: 1rem 0 1.1rem; text-align: left; position: static; }
.site-header .container { max-width: 1400px; }
.header-top { margin-bottom: .2rem; }
.site-header .eyebrow { color: var(--slate-500); font-size: .68rem; letter-spacing: .12em; }
.site-header .eyebrow .stars { display: none; }
.site-nav a { color: var(--blue); font-weight: 600; }
.site-nav a:hover { background: var(--blue-50); color: var(--blue-dark); }
.site-header h1 { font-size: clamp(1.5rem, 3.4vw, 2.1rem); color: var(--navy); text-shadow: none; margin: 0; letter-spacing: -.01em; }
.site-header h1::before { content: ""; display: inline-block; width: .6em; height: .6em; border-radius: 50%; background: var(--blue); margin-right: .45em; vertical-align: .05em; }

.tv-title { color: var(--navy); border: 0; padding: 0; font-size: 1.35rem; }

/* controls */
.tv select, .tv input[type="search"], .tv-review input[type="text"], .tv-review select { border: 1px solid var(--slate-300); border-radius: 8px; }
.tv select:focus-visible, .tv input:focus-visible, .tv-review input:focus-visible, .tv-review select:focus-visible,
.tv button:focus-visible, .tv-review button:focus-visible, .tv-row:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.tv-speed button { border-color: var(--slate-300); color: var(--slate-700); }
.tv-speed button.on { background: var(--blue); border-color: var(--blue); color: #fff; }
.tv-btn { color: var(--blue); border: 1.5px solid var(--blue); border-radius: 999px; background: #fff; }
.tv-btn:hover { background: var(--blue-50); }
.tv-primary { background: var(--blue); border-color: var(--blue); color: #fff; }
.tv-primary:hover { background: var(--blue-dark); }
.tv-check input { accent-color: var(--blue); }

/* disclaimer: calm panel, not an alarm */
.tv-notice { color: var(--slate-800); background: var(--blue-50); border: 1px solid var(--blue-100); border-radius: 10px; box-shadow: none; }
.tv-notice strong { color: var(--navy); }

/* the transcript box */
.tv-pane { border: 1px solid var(--slate-200); border-radius: 12px; box-shadow: 0 2px 14px rgba(14,27,77,.07); }
.tv-pane-head { background: #fff; color: var(--navy); border-bottom: 1px solid var(--slate-200); }
.tv-key { color: var(--slate-500); }
.tv-row { border-bottom-color: var(--slate-100); }
.tv-row:hover { background: var(--slate-50); }
.tv-row.active { background: var(--blue-50); }
.tv-row.sel { background: var(--blue-100); box-shadow: inset 0 0 0 1px var(--blue); }
.tv-review-on .tv-row.sel::before { background: var(--blue); border-color: var(--blue); }
.tv-ts { color: var(--blue); }
.tv-ts:hover { color: var(--blue-dark); }
.tv-who { color: var(--navy); }
.tv-text mark { background: #fff0b3; }
.tv-review { border: 1.5px solid var(--blue); border-radius: 12px; }
.tv-toast { background: var(--navy); }
.tv-flag { background: var(--slate-100); color: var(--slate-600); }
.tv-conf.lo { background: #fde8eb; color: var(--red-700); }

/* footer */
.site-footer { background: var(--navy); color: #c9d3f0; border: 0; }
.site-footer strong { color: #fff; }
