/* Appearance controls share the same keyboard and focus treatment as the app. */
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] {
  color-scheme: dark;
  --blue: #8acbff;
  --blue-dark: #b8dfff;
  --ink: #e8f1f8;
  --muted: #a5b5c4;
  --line: #304354;
  --surface: #1c2e3e;
  --theme-background: #101e2b;
  --theme-panel: #152636;
  --theme-raised: #1c3042;
}
#theme-toggle[aria-pressed="true"] { background: var(--surface); color: var(--blue); }
#theme-icon { display: inline-flex; }
/* Keep secondary-button text and background in sync when appearance changes. */
.button-white { transition: border-color .15s; }

html[data-theme="dark"] body,
html[data-theme="dark"] { background: var(--theme-background); }
html[data-theme="dark"] :is(.masthead,.directory-panel,.directory-footer,.search-field,.filter-pill,.profile-panel,.network-card,.connection-list-card,.network-focus-card,.network-neighbour,.network-caption,.guide-card,.answer-entry,.dialog-header,.guide-question-form,dialog,.mobile-view-toggle) {
  background: var(--theme-panel);
  border-color: var(--line);
}
html[data-theme="dark"] :is(.place-label,.map-control,.map-style-control,.leaflet-popup-content-wrapper,.leaflet-popup-tip,.leaflet-tooltip,.leaflet-control-zoom a) {
  background: var(--theme-panel);
  border-color: var(--line);
  color: var(--ink);
}
html[data-theme="dark"] .brand-copy { color: var(--ink); }
html[data-theme="dark"] :is(.primary-nav,.concept-notice,.notice-label) { border-color: var(--line); }
html[data-theme="dark"] .concept-notice { background: #142330; color: var(--muted); }
html[data-theme="dark"] .notice-label { color: var(--muted); }
html[data-theme="dark"] :is(.profile-description,.profile-location,.answer-text,.question-suggestion,.question-form-footer,.question-form-footer select,.profile-footer>span,.profile-source small,.guide-welcome .guide-disclosure,.admin-link,.search-field>span,.profile-source svg) { color: var(--muted); }
html[data-theme="dark"] .search-field input::placeholder { color: #a1b2c2; }
html[data-theme="dark"] .search-field kbd { background: var(--theme-raised); color: var(--muted); }
html[data-theme="dark"] .organisation-card:hover { background: linear-gradient(to right,transparent,#1b3347,transparent); }
html[data-theme="dark"] :is(.button-white,.question-suggestion,.planner-card,.page-callout,.route-confirmation-note) { background: var(--theme-raised); border-color: var(--line); color: var(--ink); }
html[data-theme="dark"] :is(.button-white:hover,.question-suggestion:hover,.map-group-entry:hover,.filter-pill:hover,.role-pill:hover:not(.active)) { background: #25445d; border-color: #668ba9; }
html[data-theme="dark"] :is(.button-blue,.send-button,.filter-pill.active,.role-pill.active,.mobile-view-toggle button.active) { color: #0d2538; }
html[data-theme="dark"] :is(.filter-pill.active,.role-pill.active,.mobile-view-toggle button.active) { background: var(--blue); border-color: var(--blue); }
html[data-theme="dark"] .button-yellow { color: #142638; }
html[data-theme="dark"] .skip-link { color: #142638; }
html[data-theme="dark"] :is(.question-bubble,.small-badge,.planner-intro .planner-symbol,.route-number) { background: #203f57; border-color: #3d6380; color: var(--blue); }
html[data-theme="dark"] .tag { background: #263a4b; color: #bbcbd8; }
html[data-theme="dark"] .tag.category-tag { background: #203f57; color: var(--blue); }
html[data-theme="dark"] :is(.category-tag.cat-investor,.network-historical) { background: #443b21; color: #edcf73; }
html[data-theme="dark"] .category-tag.cat-ecosystem { background: #243e34; color: #a6d6b3; }
html[data-theme="dark"] .evidence-label { color: #a6d6b3; }
html[data-theme="dark"] :is(form input,form textarea,form select,.network-controls select,.map-style-control select) { background: #142637; color: var(--ink); border-color: #456074; }
html[data-theme="dark"] :is(form input::placeholder,form textarea::placeholder) { color: #a1b2c2; }
html[data-theme="dark"] .guide-question-input { background: #142637; border-color: #456074; }
html[data-theme="dark"] .guide-question-input textarea { background: transparent; }
html[data-theme="dark"] .role-pill { border-color: var(--line); }
html[data-theme="dark"] .answer-notice { background: #393322; color: #e5d5aa; }
html[data-theme="dark"] .form-status { background: #214233; color: #b2dfc3; }
html[data-theme="dark"] .form-status.error { background: #482c31; color: #f3bec1; }
html[data-theme="dark"] .toast { background: #dcecf8; color: #102535; }
html[data-theme="dark"] dialog::backdrop { background: #040e19b3; }
html[data-theme="dark"] .map-panel,
html[data-theme="dark"] .leaflet-container { background: #142531; }
html[data-theme="dark"] .leaflet-control-attribution { background: #142637e8!important; color: #a3b5c5; }
html[data-theme="dark"] .leaflet-control-attribution a { color: #b0d5ee; }
html[data-theme="dark"] .leaflet-control-zoom a { color: var(--ink)!important; }
html[data-theme="dark"] .leaflet-tooltip:before { border-top-color: var(--line); border-bottom-color: var(--line); }
html[data-theme="dark"] .map-logo-group { background: #142637ef; border-color: #56718b; }
/* White logo canvases preserve the actual colours and contrast of each brand. */
html[data-theme="dark"] .organisation-avatar { border-color: #597082; background: #eaf2f8; color: #005293; }
html[data-theme="dark"] .organisation-avatar img { background: #fff; }
html[data-theme="dark"] .organisation-avatar.cat-investor { background: #fff6d6; color: #765d00; }
html[data-theme="dark"] .organisation-avatar.cat-ecosystem { background: #e6f3e9; color: #386b4b; }
html[data-theme="dark"] .map-logo-tile.organisation-avatar { background: #fff; }
html[data-theme="dark"] .map-logo-tile.selected { border-color: #8acbff; box-shadow: 0 0 0 4px #8acbff40,0 4px 14px #0006; }
html[data-theme="dark"] .network-visual { background-color: #112331; background-image: radial-gradient(#2d475a 1px,transparent 1px); }
html[data-theme="dark"] .network-focus-card { border-color: var(--blue); }
html[data-theme="dark"] .network-connectors { stroke: #6a95b2!important; }
html[data-theme="dark"] .network-connectors circle { stroke: var(--theme-panel); }
html[data-theme="dark"] .network-neighbour { border-color: #3a5368; }
html[data-theme="dark"] .guide-card-art { background: #dcecf7; color: #005293; }
html[data-theme="dark"] .guide-card-art.tone-yellow { background: #f5eabc; }
html[data-theme="dark"] .guide-card-art.tone-green { background: #dcebdc; }
html[data-theme="dark"] .route-stop:not(:last-child):before { background: #456074; }