/* System theme. Cobalt brand panels keep their own foreground/background pair. */
:root {
  color-scheme: light dark;
  --brand-fill: #3430c9;
  --on-brand: #efeee8;
  --analysis-paper: #efeee8;
  --analysis-ink: #29273e;
  --analysis-muted: #676472;
  --analysis-signal: #b9422e;
}

@media screen and (prefers-color-scheme: dark) {
  :root {
    --paper: #17181c;
    --ink: #efeee8;
    --muted: #b5b4bd;
    --line: #41424e;
    --orange: #aaa7ff;
    --dark: #17181c;
    --brand-surface: #282932;
    --surface: #22232b;
    --surface-raised: #282932;
    --control-line: #747684;
    --analysis-paper: #17181c;
    --analysis-ink: #efeee8;
    --analysis-muted: #b5b4bd;
    --analysis-signal: #f29178;
  }

  ::selection { background: #58519d; color: #fff; }
  .skip-link { background: var(--ink); color: var(--paper); }

  /* Keep filled brand elements cobalt, even when text accents become lighter. */
  .manifesto-strip,
  .site-footer,
  .detail-cta,
  .experience-feature {
    background: var(--brand-fill);
    color: var(--on-brand);
  }
  .back-top,
  .footer-bottom,
  .experience-feature .text-link { color: var(--on-brand); }
  .site-footer a:focus-visible,
  .site-footer button:focus-visible,
  .experience-feature a:focus-visible,
  .detail-cta a:focus-visible { outline-color: var(--on-brand); }

  .header-contact:hover,
  .button.dark:hover,
  .boundary-switch .art-pin.active,
  .boundary-switch .art-pin:hover,
  .contact-options input:checked + span,
  .report-download-link {
    background: var(--brand-fill);
    border-color: var(--orange);
    color: var(--on-brand);
  }
  .contact-submit:hover {
    background: var(--brand-fill) !important;
    color: var(--on-brand) !important;
  }
  .detail-cta .button {
    background: var(--on-brand);
    color: #22221f;
  }
  .detail-cta .button:hover {
    background: #22221f;
    color: var(--on-brand);
  }
  .report-download-link:hover {
    background: var(--ink);
    color: var(--paper);
  }
  .toast {
    background: var(--brand-fill);
    color: var(--on-brand);
    border-color: var(--orange);
  }

  /* Mineral panels and the anonymised case evidence. */
  .detail-art,
  .company-object,
  .company-ending,
  .case-teaser,
  .approach-section,
  .identity-panel { background: var(--surface-raised); }
  .company-object,
  .identity-top,
  .identity-bottom { border-color: var(--line); }
  .experience-home-grid > a:hover,
  .case-index > a:hover,
  .scenario-picker button[aria-selected="true"] {
    background: var(--surface-raised);
  }
  .case-evidence,
  .case-retest { background: var(--surface); }
  .case-evidence,
  .case-evidence-head,
  .case-evidence dl > div,
  .case-evidence pre,
  .process-list li,
  .process-list li:last-child { border-color: var(--line); }
  .case-evidence pre {
    background: var(--paper);
    color: var(--ink);
  }
  .approach-seal,
  .report-file-meta { color: var(--muted); }
  .risk-label { background: #353347; color: var(--ink); }
  .report-label,
  .faq-list details[open] summary span,
  .about-links a:hover { color: var(--orange); }

  /* The scenario diagram was already dark; give it an explicit readable palette. */
  .scenario-panel {
    background: var(--surface);
    color: var(--ink);
    box-shadow: inset 0 0 0 1px var(--line);
  }
  .panel-toolbar,
  .panel-foot,
  .scenario-flow { color: var(--muted); border-color: var(--line); }
  .scenario-flow span:not([aria-hidden]) { border-color: var(--control-line); }
  .scenario-body > p { color: var(--muted); }
  .scenario-result p { color: var(--ink); }
  .signal-tag,
  .scenario-result .mono { color: var(--orange); }
  .scenario-result { border-color: var(--orange); }
  .scenario-flow .flow-risk {
    border-color: var(--orange) !important;
    color: #d0cbff;
  }
  .button.light {
    color: var(--ink);
    border-color: var(--control-line);
  }
  .button.light:hover { background: var(--ink); color: var(--paper); }

  /* Visible input boundaries, overlays, and file metadata. */
  .contact-options label > span,
  .boundary-switch .art-pin,
  .contact-form input[type="text"],
  .contact-form textarea { border-color: var(--control-line); }
  .contact-options input:checked + span,
  .boundary-switch .art-pin.active,
  .boundary-switch .art-pin:hover { border-color: var(--orange); }
  .contact-form input[type="text"],
  .contact-form textarea { caret-color: var(--ink); }
  dialog { border: 1px solid var(--line); }
  dialog::backdrop { background: #07080bcc; }
  #mobile-nav:not([hidden]) { box-shadow: 0 12px 22px #0005; }
  .report-cover-link { box-shadow: 0 8px 24px #0005; }
  .report-cover-link img { border-color: var(--line); }
}

@media print {
  :root { color-scheme: light; }
}