/* Dark palette. Append after the shared site styles. */
html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #f2efe6;
  --muted: #b8c4cb;
  --paper: #101a23;
  --line: #394b56;
  --orange: #efb47f;
  --white: #ffffff;
  --surface: #182832;
  --surface-raised: #20323e;
  --control-border: #71838e;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .header,
html[data-theme="dark"] footer {
  background: var(--paper);
  color: var(--ink);
}
html[data-theme="dark"] ::selection { background: #efb47f; color: #142330; }
html[data-theme="dark"] :is(a, button, input, textarea, select, summary):focus-visible {
  outline-color: #efb47f;
}
html[data-theme="dark"] .wordmark span,
html[data-theme="dark"] .event-types i,
html[data-theme="dark"] .steps article > span,
html[data-theme="dark"] .service-symbol { color: var(--orange); }
html[data-theme="dark"] :is(.dot, .group-dot) { background: var(--orange); }
html[data-theme="dark"] :is(.menu-toggle, .theme-toggle) {
  background: transparent;
  color: var(--ink);
  border-color: var(--control-border);
}
html[data-theme="dark"] :is(.menu-toggle, .theme-toggle):hover { background: var(--surface-raised); }
html[data-theme="dark"] .header nav { background: var(--paper); color: var(--ink); }
html[data-theme="dark"] .header nav > a[aria-current] { text-decoration-color: var(--orange); }
html[data-theme="dark"] .button {
  background: var(--orange);
  border-color: var(--orange);
  color: #142330;
}
html[data-theme="dark"] .button:hover { background: #f5c69c; border-color: #f5c69c; }
html[data-theme="dark"] .button.secondary {
  background: transparent;
  color: var(--ink);
  border-color: var(--control-border);
}
html[data-theme="dark"] .button.secondary:hover { background: var(--surface-raised); }
html[data-theme="dark"] .skip { background: var(--orange); color: #142330; }

/* Keep the stage and monogram artwork in the established navy palette. */
html[data-theme="dark"] .stage { background: #142330; color: #f9ead6; }
html[data-theme="dark"] :is(.brand-art, .mini-orbit) { background: #1b2e3c; color: var(--orange); }
html[data-theme="dark"] .group-card { background: var(--surface); border-color: var(--line); }
html[data-theme="dark"] .group-card:hover { background: var(--surface-raised); }
html[data-theme="dark"] :is(.statement, .contact-note) { background: #1c2e33; color: var(--ink); }
html[data-theme="dark"] .cta { background: #1b2d3b; color: var(--ink); border-top: 1px solid var(--line); }
html[data-theme="dark"] .cta .button { color: #142330; }
html[data-theme="dark"] .pending-contact { background: var(--surface); }
html[data-theme="dark"] .review-note { border-color: var(--line); }
html[data-theme="dark"] .footer-bottom { color: var(--muted); }
html[data-theme="dark"] .group-emblem { background: #3b3029; }
html[data-theme="dark"] .service-shortcuts a { background: var(--surface); }
html[data-theme="dark"] .service-shortcuts a:hover { background: var(--surface-raised); }

/* Native controls, including browser autofill, stay legible. */
html[data-theme="dark"] :is(input, select, textarea),
html[data-theme="dark"] .journey-step :is(input, select, textarea) {
  background: #13242f;
  color: var(--ink);
  border-color: var(--control-border);
  caret-color: var(--orange);
}
html[data-theme="dark"] :is(input, textarea)::placeholder { color: #a8b7c1; opacity: 1; }
html[data-theme="dark"] select option { background: #13242f; color: var(--ink); }
html[data-theme="dark"] :is(input[type="radio"], input[type="checkbox"]) { accent-color: var(--orange); }
html[data-theme="dark"] input:-webkit-autofill {
  -webkit-text-fill-color: var(--ink);
  -webkit-box-shadow: 0 0 0 1000px #13242f inset;
  caret-color: var(--orange);
}
html[data-theme="dark"] :is(.journey-pills span, .need-tag) { background: #283b3c; color: #edf0e7; }
html[data-theme="dark"] .journey-card {
  background: var(--surface);
  border-color: var(--line);
  box-shadow: 0 18px 48px #00000030;
}
html[data-theme="dark"] .journey-progress { background: #20313a; }
html[data-theme="dark"] .journey-progress button { color: var(--muted); }
html[data-theme="dark"] .journey-progress button > span { border-color: #71838e; }
html[data-theme="dark"] .journey-progress button[aria-current] { color: var(--ink); }
html[data-theme="dark"] .journey-progress button[aria-current] > span {
  background: var(--orange);
  color: #142330;
  border-color: var(--orange);
}
html[data-theme="dark"] .journey-progress button:disabled { opacity: 1; color: #a8b8c2; }
html[data-theme="dark"] .journey-progress button:disabled > span { border-color: #647884; }
html[data-theme="dark"] .progress-track { background: #485b64; }
html[data-theme="dark"] .progress-track span { background: var(--orange); }
html[data-theme="dark"] :is(.choice-card, .need-card) { background: #162630; border-color: #627581; }
html[data-theme="dark"] .choice-card:has(input:checked) {
  background: #3e3028;
  border-color: #d39c70;
  color: #fff2e8;
}
html[data-theme="dark"] .choice-card:has(input:checked) small { color: #e1cbb9; }
html[data-theme="dark"] .choice-tick { color: var(--orange); }
html[data-theme="dark"] .need-card:has(input:checked) {
  background: #263e36;
  border-color: #9cbead;
  color: #eef7ef;
}
html[data-theme="dark"] .choice-card:has(input:focus-visible),
html[data-theme="dark"] .need-card:has(input:focus-visible) { outline-color: var(--orange); }
html[data-theme="dark"] .scope-note { background: #253a35; color: #edf1e8; }
html[data-theme="dark"] .field-error { color: #ffb0a1; }
html[data-theme="dark"] [aria-invalid="true"] { border-color: #ffb0a1 !important; }
html[data-theme="dark"] .journey-actions .button:disabled {
  background: #465963;
  color: #edf1f2;
  border-color: #71838e;
  opacity: 1;
}
html[data-theme="dark"] #form-status { color: var(--ink); }
html[data-theme="dark"] .review-footer { background: #20343c; color: var(--ink); }
html[data-theme="dark"] :is(.review-footer button, .edit-step) { color: var(--ink); }