:root {
  color: #111827;
  background: #f7f8fa;
}

body { background: #f7f8fa; color: #111827; }
.top { min-height: 72px; background: rgba(255,255,255,.97); color: #111827; border-bottom: 1px solid #e3e7ed; }
.brand { display: inline-flex; align-items: center; gap: 10px; letter-spacing: -.02em; }
.brand img { width: 36px; height: 36px; border-radius: 10px; }
.top nav a { color: #344054; font-weight: 650; }
.top nav a:hover { color: #155eef; }
.session-state { border-left-color: #d9e0ea; color: #64748b; }
.session-state.verified { color: #067647; }
.session-state.signed-out { color: #64748b; }
.breadcrumb { color: #667085; }
.breadcrumb a, .flow-footer a, .result-grid a { color: #155eef; }
.eyebrow, .intro .eyebrow { color: #155eef; letter-spacing: .12em; }
.intro h1 { color: #111827; }
.intro p, .form small, .note, .result > p, .status p { color: #5b6472; }
.step { background: #e9eef6; color: #475467; }
.step.active { background: #155eef; color: #fff; }
.panel { border-color: #e3e7ed; box-shadow: 0 12px 36px rgba(16,24,40,.055); }
.form input[type=url], .form input[type=text] { border-color: #cbd5e1; }
.form input:focus { border-color: #155eef; box-shadow: 0 0 0 3px rgba(21,94,239,.14); }
.identity summary, .form .text-button { color: #155eef; }
.confirmation input { accent-color: #155eef; }
.form button, .next, .plan-grid button { background: #155eef; color: #fff; }
.form button:hover, .next:hover, .plan-grid button:hover { background: #004eeb; }
.secondary-button { border-color: #cbd5e1; color: #344054; }
.secondary-button:hover { border-color: #84adff; color: #155eef; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid #84adff; outline-offset: 3px; }
.result-grid > div { background: #f8faff; border-color: #e1e8f5; }
.difference { color: #111827 !important; }
.monitoring-note { border-left-color: #155eef; background: #eff4ff; color: #1849a9 !important; }
.plan-grid .panel:first-child { border-color: #b2ccff; }
.plan-price { color: #155eef; }

@media (max-width: 650px) {
  .top { padding: 10px 16px; }
  .brand img { width: 32px; height: 32px; }
  .top nav { gap: 12px; }
  .session-state { width: 100%; border-left: 0; border-top: 1px solid #e3e7ed; padding: 8px 0 0; }
  .intro h1 { font-size: 34px; }
}
