/*
 * Global dark-mode overrides loaded after Tailwind utilities.
 * Scope: user-facing pages when body.dark-mode is present.
 */

body.dark-mode {
  color-scheme: dark;

  --ap-bg: #0a0a0a;
  --ap-surface-0: #111111;
  --ap-surface-1: #171717;
  --ap-surface-2: #1f1f1f;
  --ap-surface-3: #2a2a2a;
  --ap-text: #e7e7e7;
  --ap-text-soft: #c9c9c9;
  --ap-text-muted: #9c9c9c;
  --ap-border: #3a3a3a;
  --ap-border-soft: #2f2f2f;
  --ap-link: #d0d0d0;
  --ap-link-hover: #f1f1f1;
  --ap-focus: #a8a8a8;

  --background: var(--ap-bg);
  --primary: var(--ap-text);
  --footer-area: #101010;
  --footer-text: var(--ap-text-muted);

  /* Variables consumed by component blocks in 06-components-tail.css */
  --surface-color: var(--ap-surface-1);
  --surface-color-alt: var(--ap-surface-2);
  --surface-dark-color: var(--ap-surface-0);
  --text-color: var(--ap-text);
  --text-color-secondary: var(--ap-text-soft);
  --text-color-tertiary: var(--ap-text-muted);
  --primary-color: #d0d0d0;
}

html.dark-mode,
body.dark-mode,
body.dark-mode #page-wrapper,
body.dark-mode #main-content,
body.dark-mode .main-content-inner,
body.dark-mode .ap-shell {
  background-color: var(--ap-bg) !important;
  color: var(--ap-text);
}

body.dark-mode a {
  color: var(--ap-link);
  text-decoration-color: color-mix(in oklab, var(--ap-link) 60%, transparent);
  text-underline-offset: 2px;
}

body.dark-mode a:hover,
body.dark-mode a:focus {
  color: var(--ap-link-hover);
  text-decoration-color: currentColor;
}

body.dark-mode :is(a, button, [role="button"], input, select, textarea, summary):focus-visible {
  outline: 2px solid color-mix(in oklab, var(--ap-focus) 80%, transparent);
  outline-offset: 2px;
}

body.dark-mode hr {
  border-color: var(--ap-border) !important;
}

body.dark-mode #site-header,
body.dark-mode .sidebar-left,
body.dark-mode .ap-mobile-nav {
  background: var(--ap-surface-0) !important;
  color: var(--ap-text) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .ap-mobile-nav .ap-mobile-brand,
body.dark-mode .ap-mobile-nav .tw-text-slate-900,
body.dark-mode .ap-mobile-nav .tw-text-slate-700 {
  color: var(--ap-text) !important;
}

body.dark-mode .ap-nav-link,
body.dark-mode .ap-nav-link .tw-text-slate-700,
body.dark-mode .ap-nav-link .tw-text-slate-600,
body.dark-mode .logo-text,
body.dark-mode .sidebar-footer,
body.dark-mode .ap-page-rail,
body.dark-mode .ap-page-rail a {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .ap-nav-link:hover,
body.dark-mode .ap-nav-link:focus,
body.dark-mode .ap-nav-link.is-active,
body.dark-mode .ap-page-rail a:hover,
body.dark-mode .ap-page-rail a:focus,
body.dark-mode .ap-page-rail a[aria-current="page"] {
  color: var(--ap-text) !important;
}

/* Bootstrap-like primitives */
body.dark-mode .card,
body.dark-mode .modal-content,
body.dark-mode .offcanvas,
body.dark-mode .dropdown-menu,
body.dark-mode .list-group,
body.dark-mode .list-group-item,
body.dark-mode .table,
body.dark-mode .table th,
body.dark-mode .table td,
body.dark-mode .popover,
body.dark-mode .toast,
body.dark-mode dialog {
  background: var(--ap-surface-1) !important;
  color: var(--ap-text) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .card-header,
body.dark-mode .card-footer,
body.dark-mode .modal-header,
body.dark-mode .modal-footer,
body.dark-mode .dropdown-divider,
body.dark-mode .table thead th,
body.dark-mode .table tbody tr,
body.dark-mode .list-group-item {
  border-color: var(--ap-border) !important;
}

body.dark-mode .dropdown-item,
body.dark-mode .btn-close,
body.dark-mode .text-dark,
body.dark-mode .card-title,
body.dark-mode .modal-title {
  color: var(--ap-text) !important;
}

body.dark-mode .dropdown-item:hover,
body.dark-mode .dropdown-item:focus,
body.dark-mode .dropdown-item.active {
  background: var(--ap-surface-2) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .table-striped tbody tr:nth-child(odd),
body.dark-mode tr.odd\:tw-bg-slate-50:nth-child(odd) {
  background: color-mix(in oklab, var(--ap-surface-2) 72%, transparent) !important;
}

body.dark-mode table.tw-border-collapse,
body.dark-mode table.tw-border-collapse th,
body.dark-mode table.tw-border-collapse td {
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode table.tw-border-collapse thead tr,
body.dark-mode table.tw-border-collapse tbody tr:nth-child(odd) {
  background: color-mix(in oklab, var(--ap-surface-2) 70%, transparent);
}

/* Forms */
body.dark-mode .form-control,
body.dark-mode .form-select,
body.dark-mode .form-check-input,
body.dark-mode input[type="text"],
body.dark-mode input[type="email"],
body.dark-mode input[type="number"],
body.dark-mode input[type="tel"],
body.dark-mode input[type="password"],
body.dark-mode input[type="search"],
body.dark-mode input[type="url"],
body.dark-mode input[type="date"],
body.dark-mode input[type="datetime-local"],
body.dark-mode input[type="file"],
body.dark-mode textarea,
body.dark-mode select {
  background-color: var(--ap-surface-2) !important;
  color: var(--ap-text) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder,
body.dark-mode .placeholder\:tw-text-slate-400::placeholder {
  color: var(--ap-text-muted) !important;
  opacity: 1;
}

body.dark-mode .form-control:focus,
body.dark-mode .form-select:focus,
body.dark-mode input:focus,
body.dark-mode select:focus,
body.dark-mode textarea:focus {
  border-color: var(--ap-focus) !important;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ap-focus) 25%, transparent) !important;
  outline: none;
}

body.dark-mode .focus\:tw-border-blue-500:focus,
body.dark-mode .focus\:tw-ring-blue-200:focus,
body.dark-mode .focus\:tw-ring-blue-500:focus,
body.dark-mode .focus-visible\:tw-ring-blue-500\/30:focus-visible {
  border-color: var(--ap-focus) !important;
  --tw-ring-color: color-mix(in oklab, var(--ap-focus) 35%, transparent) !important;
}

body.dark-mode input[type="checkbox"],
body.dark-mode input[type="radio"],
body.dark-mode .form-check-input {
  accent-color: #9a9a9a;
}

body.dark-mode input[type="file"]::file-selector-button,
body.dark-mode .file\:tw-bg-white::file-selector-button,
body.dark-mode .file\:tw-text-slate-700::file-selector-button,
body.dark-mode .file\:tw-border-slate-300::file-selector-button {
  background: var(--ap-surface-3) !important;
  color: var(--ap-text) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .hover\:file\:tw-bg-slate-50:hover::file-selector-button {
  background: #333333 !important;
}

body.dark-mode input:-webkit-autofill,
body.dark-mode input:-webkit-autofill:hover,
body.dark-mode input:-webkit-autofill:focus,
body.dark-mode textarea:-webkit-autofill,
body.dark-mode select:-webkit-autofill {
  -webkit-text-fill-color: var(--ap-text);
  -webkit-box-shadow: 0 0 0 1000px var(--ap-surface-2) inset;
  caret-color: var(--ap-text);
}

/* Quill editor surfaces */
body.dark-mode .ql-toolbar.ql-snow,
body.dark-mode .ql-container.ql-snow,
body.dark-mode .ql-snow .ql-picker-options,
body.dark-mode .ql-snow .ql-tooltip {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .ql-editor {
  background: var(--ap-surface-2) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .ql-editor.ql-blank::before {
  color: var(--ap-text-muted) !important;
}

body.dark-mode .ql-snow .ql-stroke,
body.dark-mode .ql-snow .ql-fill,
body.dark-mode .ql-snow .ql-picker,
body.dark-mode .ql-snow .ql-picker-label,
body.dark-mode .ql-snow .ql-picker-item,
body.dark-mode .ql-snow .ql-tooltip input,
body.dark-mode .ql-snow .ql-tooltip a.ql-action,
body.dark-mode .ql-snow .ql-tooltip a.ql-remove {
  color: var(--ap-text) !important;
  stroke: currentColor !important;
}

body.dark-mode .ql-snow .ql-picker-options {
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.64) !important;
}

body.dark-mode .ql-snow.ql-toolbar button:hover,
body.dark-mode .ql-snow .ql-toolbar button:hover,
body.dark-mode .ql-snow.ql-toolbar button.ql-active,
body.dark-mode .ql-snow .ql-toolbar button.ql-active,
body.dark-mode .ql-snow .ql-picker-label:hover,
body.dark-mode .ql-snow .ql-picker-label.ql-active,
body.dark-mode .ql-snow .ql-picker-item:hover,
body.dark-mode .ql-snow .ql-picker-item.ql-selected {
  color: #ececec !important;
}

/* Utility class remap for Tailwind-heavy templates */
body.dark-mode .tw-bg-white,
body.dark-mode .tw-bg-white\/60,
body.dark-mode .tw-bg-white\/80,
body.dark-mode .bg-white {
  background-color: var(--ap-surface-1) !important;
}

body.dark-mode .tw-bg-slate-50,
body.dark-mode .tw-bg-slate-100,
body.dark-mode .tw-bg-slate-200,
body.dark-mode .tw-bg-slate-200\/60,
body.dark-mode .tw-bg-slate-300,
body.dark-mode .bg-light {
  background-color: var(--ap-surface-2) !important;
}

/* Neutralize Tailwind blue/sky surfaces in dark mode */
body.dark-mode .tw-bg-blue-50,
body.dark-mode .tw-bg-blue-100,
body.dark-mode .tw-bg-blue-500,
body.dark-mode .tw-bg-blue-600,
body.dark-mode .tw-bg-blue-700,
body.dark-mode .tw-bg-blue-800,
body.dark-mode .tw-bg-sky-50,
body.dark-mode .tw-bg-sky-100,
body.dark-mode .tw-bg-sky-500,
body.dark-mode .tw-bg-sky-600,
body.dark-mode .tw-bg-sky-700 {
  background-color: var(--ap-surface-3) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .tw-text-slate-900,
body.dark-mode .tw-text-slate-800,
body.dark-mode .tw-text-slate-700,
body.dark-mode .tw-text-slate-600,
body.dark-mode .text-dark {
  color: var(--ap-text) !important;
}

body.dark-mode .tw-text-slate-500,
body.dark-mode .tw-text-slate-400,
body.dark-mode .text-muted {
  color: var(--ap-text-muted) !important;
}

body.dark-mode .tw-border-slate-100,
body.dark-mode .tw-border-slate-200,
body.dark-mode .tw-border-slate-300,
body.dark-mode .tw-border-slate-400,
body.dark-mode .tw-border-slate-500,
body.dark-mode .border,
body.dark-mode .md\:tw-border-slate-200 {
  border-color: var(--ap-border) !important;
}

body.dark-mode .border-top,
body.dark-mode .border-bottom,
body.dark-mode .border-start,
body.dark-mode .border-end,
body.dark-mode .border-secondary,
body.dark-mode .border-light {
  border-color: var(--ap-border) !important;
}

body.dark-mode .tw-divide-slate-100 > *,
body.dark-mode .tw-divide-slate-200 > * {
  border-color: var(--ap-border) !important;
}

body.dark-mode .tw-shadow-sm,
body.dark-mode .tw-shadow,
body.dark-mode .tw-shadow-lg,
body.dark-mode .shadow-sm,
body.dark-mode .shadow {
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.55) !important;
}

body.dark-mode .hover\:tw-bg-white:hover,
body.dark-mode .hover\:tw-bg-slate-50:hover,
body.dark-mode .hover\:tw-bg-slate-100:hover,
body.dark-mode .hover\:tw-bg-slate-200:hover,
body.dark-mode .hover\:tw-bg-slate-300:hover,
body.dark-mode .hover\:tw-bg-white\/60:hover {
  background-color: var(--ap-surface-3) !important;
}

body.dark-mode .hover\:tw-bg-blue-50:hover,
body.dark-mode .hover\:tw-bg-blue-700:hover,
body.dark-mode .hover\:tw-bg-blue-800:hover,
body.dark-mode .hover\:tw-bg-sky-100:hover,
body.dark-mode .hover\:tw-bg-sky-700:hover {
  background-color: #353535 !important;
  color: var(--ap-text) !important;
}

body.dark-mode .hover\:tw-text-slate-900:hover,
body.dark-mode .hover\:tw-text-slate-700:hover,
body.dark-mode .hover\:tw-text-slate-600:hover {
  color: #fafafa !important;
}

/* Alerts and status pills */
body.dark-mode .alert-warning,
body.dark-mode .tw-bg-amber-50 {
  background: var(--ap-surface-3) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-soft) !important;
}

body.dark-mode .alert-danger,
body.dark-mode .tw-bg-rose-50 {
  background: var(--ap-surface-3) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-soft) !important;
}

body.dark-mode .alert-success,
body.dark-mode .tw-bg-emerald-50 {
  background: var(--ap-surface-3) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-soft) !important;
}

body.dark-mode .tw-bg-blue-50,
body.dark-mode .tw-bg-blue-100 {
  background: var(--ap-surface-3) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .tw-bg-amber-200,
body.dark-mode .tw-bg-emerald-100,
body.dark-mode .tw-bg-sky-100,
body.dark-mode .tw-bg-rose-100,
body.dark-mode .tw-bg-slate-100.tw-text-slate-700 {
  background: var(--ap-surface-3) !important;
}

body.dark-mode .tw-text-amber-900,
body.dark-mode .tw-text-amber-800,
body.dark-mode .tw-text-amber-700,
body.dark-mode .tw-text-amber-600 {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .tw-text-rose-900,
body.dark-mode .tw-text-rose-700,
body.dark-mode .tw-text-rose-600,
body.dark-mode .tw-text-rose-500 {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .tw-text-emerald-900,
body.dark-mode .tw-text-emerald-800,
body.dark-mode .tw-text-emerald-700,
body.dark-mode .tw-text-emerald-600 {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .tw-text-blue-900,
body.dark-mode .tw-text-blue-800,
body.dark-mode .tw-text-blue-700,
body.dark-mode .tw-text-blue-600,
body.dark-mode .tw-text-blue-100 {
  color: #d0d0d0 !important;
}

body.dark-mode .tw-text-sky-900,
body.dark-mode .tw-text-sky-700,
body.dark-mode .tw-text-sky-600 {
  color: #d0d0d0 !important;
}

body.dark-mode .tw-border-rose-200,
body.dark-mode .tw-border-rose-300,
body.dark-mode .tw-border-rose-600 {
  border-color: var(--ap-border) !important;
}

body.dark-mode .tw-border-amber-200,
body.dark-mode .tw-border-amber-300 {
  border-color: var(--ap-border) !important;
}

body.dark-mode .tw-border-emerald-200,
body.dark-mode .tw-border-emerald-300,
body.dark-mode .tw-border-emerald-400 {
  border-color: var(--ap-border) !important;
}

body.dark-mode .tw-border-blue-300,
body.dark-mode .tw-border-blue-500,
body.dark-mode .tw-border-blue-600 {
  border-color: rgba(160, 160, 160, 0.55) !important;
}

/* Button variants */
body.dark-mode .btn-secondary {
  background: #3c3c3c;
  border-color: #5a5a5a;
  color: #e9e9e9;
}

body.dark-mode .btn-secondary:hover {
  background: #4b4b4b;
  border-color: #7a7a7a;
  color: #f8fafc;
}

body.dark-mode .btn-outline-primary,
body.dark-mode .btn-outline-secondary,
body.dark-mode .btn-outline-dark,
body.dark-mode .btn-outline-danger,
body.dark-mode .tw-inline-flex.tw-border {
  background: var(--ap-surface-2) !important;
}

body.dark-mode .btn-link {
  color: var(--ap-link);
}

body.dark-mode .btn-link:hover {
  color: var(--ap-link-hover);
}

/* Dialog backdrop */
body.dark-mode dialog::backdrop {
  background: rgba(0, 0, 0, 0.68);
}

/* AI orb + panel hotspots */
body.dark-mode .ai-panel-launcher {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.65);
}

body.dark-mode .ai-panel-launcher.ap-orb-nudge {
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.65), 0 0 0 0 rgba(160, 160, 160, 0.5) !important;
  animation: apOrbPulseDark 1.8s ease-in-out infinite !important;
}

@keyframes apOrbPulseDark {
  0% { box-shadow: 0 12px 28px rgba(0, 0, 0, 0.65), 0 0 0 0 rgba(160, 160, 160, 0.44); }
  70% { box-shadow: 0 12px 28px rgba(0, 0, 0, 0.65), 0 0 0 14px rgba(160, 160, 160, 0); }
  100% { box-shadow: 0 12px 28px rgba(0, 0, 0, 0.65), 0 0 0 0 rgba(160, 160, 160, 0); }
}

body.dark-mode .ap-orb-bubble {
  background: color-mix(in oklab, var(--ap-surface-2) 92%, transparent) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .ap-orb-bubble-body {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .ai-panel-launcher.ap-orb-page-turn::after {
  background:
    linear-gradient(
      120deg,
      rgba(185, 185, 185, 0) 0%,
      rgba(185, 185, 185, 0) 28%,
      rgba(185, 185, 185, 0.34) 45%,
      rgba(185, 185, 185, 0) 68%,
      rgba(185, 185, 185, 0) 100%
    ),
    radial-gradient(circle at 85% 30%, rgba(160, 160, 160, 0.2), rgba(160, 160, 160, 0) 55%) !important;
}

body.dark-mode .ai-panel.ap-elle-responding::before {
  background: linear-gradient(
    110deg,
    rgba(110, 110, 110, 0) 0%,
    rgba(110, 110, 110, 0.16) 35%,
    rgba(185, 185, 185, 0.26) 50%,
    rgba(110, 110, 110, 0.12) 65%,
    rgba(110, 110, 110, 0) 100%
  ) !important;
}

body.dark-mode .ai-panel.ap-elle-page-turn::after {
  background:
    linear-gradient(
      120deg,
      rgba(185, 185, 185, 0) 0%,
      rgba(185, 185, 185, 0) 22%,
      rgba(185, 185, 185, 0.36) 46%,
      rgba(185, 185, 185, 0) 70%,
      rgba(185, 185, 185, 0) 100%
    ),
    radial-gradient(circle at 85% 20%, rgba(160, 160, 160, 0.22), rgba(160, 160, 160, 0) 55%) !important;
}

body.dark-mode .home-feed-loader .home-feed-shimmer {
  background: linear-gradient(
    90deg,
    rgba(130, 130, 130, 0.28) 18%,
    rgba(160, 160, 160, 0.5) 48%,
    rgba(130, 130, 130, 0.28) 78%
  ) !important;
  box-shadow: inset 0 0 0 1px rgba(160, 160, 160, 0.24) !important;
}

body.dark-mode .ai-panel.ai-panel-float,
body.dark-mode .ai-panel-header,
body.dark-mode .ai-panel-float .console-input {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .ai-panel-name,
body.dark-mode .ai-panel-status,
body.dark-mode .ai-panel-close,
body.dark-mode .ai-panel-float .ai-response-content,
body.dark-mode .ai-panel-float .ai-response-content *,
body.dark-mode .ai-panel-float .user-message,
body.dark-mode .ai-panel-float .system-message,
body.dark-mode .ai-response-content,
body.dark-mode .user-message,
body.dark-mode .ai-message {
  color: var(--ap-text) !important;
}

body.dark-mode .ai-panel-avatar,
body.dark-mode .ai-panel-float .console-input textarea,
body.dark-mode .ai-panel-float .ai-response-block,
body.dark-mode .ai-panel-float .user-message,
body.dark-mode .ai-panel-float .system-message,
body.dark-mode .ai-response-block {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .ai-panel-close:hover {
  background: var(--ap-surface-3) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

/* Story/profile card hover states that forced white */
body.dark-mode .story-card:hover,
body.dark-mode .profile-card:hover {
  background-color: var(--ap-surface-2) !important;
}

/* Runtime overlay cards */ 
body.dark-mode #ap-journal-overlay,
body.dark-mode #ap-cookie-overlay,
body.dark-mode #ap-ad-overlay {
  background: color-mix(in oklab, var(--ap-bg) 72%, transparent) !important;
}

body.dark-mode #ap-journal-overlay .ap-overlay-card,
body.dark-mode #ap-cookie-overlay .ap-cookie-box,
body.dark-mode #ap-ad-overlay .ap-ad-card {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode #ap-journal-overlay h3,
body.dark-mode #ap-cookie-overlay h3,
body.dark-mode #ap-journal-overlay .body,
body.dark-mode #ap-cookie-overlay p {
  color: var(--ap-text) !important;
}

body.dark-mode #ap-journal-overlay h4,
body.dark-mode #ap-cookie-overlay .ap-overlay-close,
body.dark-mode #ap-journal-overlay .ap-overlay-close {
  color: var(--ap-text-muted) !important;
}

body.dark-mode #ap-journal-overlay .badge-pill,
body.dark-mode .ai-inline-consent,
body.dark-mode .ai-starter-btn {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-soft) !important;
}

body.dark-mode .ai-starter-btn:hover,
body.dark-mode .ai-starter-btn:focus {
  border-color: var(--ap-border) !important;
  background: var(--ap-surface-3) !important;
  color: var(--ap-text) !important;
}

/* Template-level hardcoded light surfaces (home feed + cards + banners) */
body.dark-mode .home-day-card,
body.dark-mode .home-ad-card,
body.dark-mode .home-day-link,
body.dark-mode .home-day-content,
body.dark-mode .home-shell .home-day-card,
body.dark-mode [data-home-day-card="1"] {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5) !important;
}

body.dark-mode .home-day-card:hover,
body.dark-mode .home-day-card:focus-within,
body.dark-mode [data-home-day-card="1"]:hover,
body.dark-mode [data-home-day-card="1"]:focus-within {
  background: var(--ap-surface-2) !important;
  border-color: #4b4b4b !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.6) !important;
}

body.dark-mode .home-day-media,
body.dark-mode .home-day-media.is-placeholder,
body.dark-mode .home-day-media.ap-solid-fallback {
  background: var(--ap-surface-2) !important;
}

body.dark-mode .home-ad-label,
body.dark-mode .home-title,
body.dark-mode .home-shell h1,
body.dark-mode .home-shell h2 {
  color: var(--ap-text) !important;
}

body.dark-mode .home-date,
body.dark-mode .home-summary,
body.dark-mode .home-hook,
body.dark-mode .home-locked-label {
  color: var(--ap-text-muted) !important;
}

body.dark-mode .home-day-indicator__bar.is-active {
  background: rgba(176, 176, 176, 0.5) !important;
}

body.dark-mode .pill-light {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-soft) !important;
}

body.dark-mode .ap-year-toolbar {
  background: var(--ap-bg) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .ap-year-btn {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-muted) !important;
}

body.dark-mode .ap-year-btn:hover,
body.dark-mode .ap-year-btn:focus {
  background: var(--ap-surface-3) !important;
  border-color: #4b4b4b !important;
  color: var(--ap-text) !important;
}

body.dark-mode .ap-year-btn.is-active {
  background: #3a3a3a !important;
  border-color: #5d5d5d !important;
  color: #ececec !important;
}

/* Page cards / panels */
body.dark-mode .page-title,
body.dark-mode .page-section-title,
body.dark-mode .page-panel h2,
body.dark-mode .page-panel h3,
body.dark-mode .page-panel h4 {
  color: var(--ap-text) !important;
}

body.dark-mode .page-panel,
body.dark-mode .job-card,
body.dark-mode .job-panel,
body.dark-mode .island-card,
body.dark-mode .uptime-island {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.56) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .page-panel:hover,
body.dark-mode .job-card:hover,
body.dark-mode .job-panel:hover,
body.dark-mode .island-card:hover {
  background: var(--ap-surface-2) !important;
  border-color: #4b4b4b !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.65) !important;
}

body.dark-mode .page-point + .page-point {
  border-color: var(--ap-border) !important;
}

body.dark-mode .page-point .page-icon,
body.dark-mode .investors-icon {
  color: var(--ap-text-muted) !important;
}

body.dark-mode .page-point .page-subtitle,
body.dark-mode .page-point .page-body li strong {
  color: var(--ap-text) !important;
}

body.dark-mode .page-point .page-body li .page-names {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .page-point .page-body ul.is-collapsed::after {
  background: linear-gradient(180deg, rgba(23, 23, 23, 0) 0%, rgba(23, 23, 23, 1) 70%) !important;
}

/* Terms page readability (page_detail template uses hardcoded light-theme colors) */
body.dark-mode .terms-segment {
  border-bottom-color: var(--ap-border) !important;
}

body.dark-mode .terms-segment-icon {
  color: var(--ap-text-muted) !important;
}

body.dark-mode .terms-segment-text {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .terms-segment-text strong,
body.dark-mode .terms-segment-text b {
  color: var(--ap-text) !important;
}

body.dark-mode .terms-segment-text a {
  color: var(--ap-link) !important;
  border-bottom-color: rgba(170, 170, 170, 0.45) !important;
}

body.dark-mode .terms-segment-text a:hover,
body.dark-mode .terms-segment-text a:focus {
  color: var(--ap-link-hover) !important;
  border-bottom-color: rgba(205, 205, 205, 0.7) !important;
}

/* Guardrail for page-detail text blocks that may not use Tailwind text classes */
body.dark-mode .page-panel .page-text,
body.dark-mode .page-panel .page-body,
body.dark-mode .page-panel .page-body p,
body.dark-mode .page-panel .page-body li {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .uptime-chart-wrap {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .uptime-bar.is-before-start {
  background: #5a5a5a !important;
}

body.dark-mode .uptime-bar.is-future {
  background: #454545 !important;
}

/* Language + country selectors */
body.dark-mode .language-btn {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-soft) !important;
}

body.dark-mode .language-btn:hover,
body.dark-mode .language-btn:focus {
  background: var(--ap-surface-3) !important;
  border-color: #4b4b4b !important;
  color: var(--ap-text) !important;
}

body.dark-mode .language-btn.is-active {
  background: #3a3a3a !important;
  border-color: #5d5d5d !important;
  color: #f2f2f2 !important;
}

body.dark-mode .country-box {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .country-box .country-icon,
body.dark-mode .country-box .country-name,
body.dark-mode .country-note,
body.dark-mode .country-shell .page-title,
body.dark-mode .language-shell .page-title {
  color: var(--ap-text) !important;
}

/* Jobs apply page */
body.dark-mode .job-apply-shell {
  --ap-ink: var(--ap-text);
  --ap-muted: var(--ap-text-muted);
  --ap-sky: var(--ap-surface-2);
  --ap-primary: var(--ap-link);
  --ap-accent: #d0d0d0;
}

body.dark-mode .job-details,
body.dark-mode .job-apply-form label,
body.dark-mode .section-title,
body.dark-mode details.job-optional summary {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .job-details-panel,
body.dark-mode .job-apply-panel,
body.dark-mode details.job-optional {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .form-section,
body.dark-mode .cta-bar {
  border-color: var(--ap-border) !important;
}

body.dark-mode #pay-tokens-btn,
body.dark-mode #pay-tokens-btn:hover,
body.dark-mode #pay-tokens-btn:focus {
  color: var(--ap-text) !important;
  background-color: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode #pay-tokens-btn.is-active {
  background-color: var(--ap-surface-3) !important;
}

/* Dropdown triggers + menu hovers */
body.dark-mode #actionDropdown.btn,
body.dark-mode #actionDropdown.btn:hover,
body.dark-mode #actionDropdown.btn:focus {
  color: var(--ap-text-soft) !important;
  background: transparent !important;
}

body.dark-mode [data-ap-dropdown-toggle="1"] {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-soft) !important;
}

body.dark-mode [data-ap-dropdown-toggle="1"]:hover,
body.dark-mode [data-ap-dropdown-toggle="1"]:focus {
  background: var(--ap-surface-3) !important;
  border-color: #4b4b4b !important;
  color: var(--ap-text) !important;
}

body.dark-mode .hover\:tw-bg-blue-50:hover {
  background: #353535 !important;
}

body.dark-mode .hover\:tw-bg-rose-50:hover {
  background: #353535 !important;
}

body.dark-mode .hover\:tw-bg-emerald-50:hover {
  background: #353535 !important;
}

body.dark-mode .hover\:tw-bg-slate-100:hover {
  background: var(--ap-surface-3) !important;
}

body.dark-mode .hover\:tw-text-rose-700:hover {
  color: var(--ap-text) !important;
}

/* Native select/dropdown list colors */
body.dark-mode select,
body.dark-mode select option,
body.dark-mode select optgroup {
  background: var(--ap-surface-2) !important;
  color: var(--ap-text) !important;
}

body.dark-mode select option:checked {
  background: #3a3a3a !important;
  color: #f2f2f2 !important;
}

/* Icon contrast */
body.dark-mode .bi,
body.dark-mode .ap-bi-svg {
  color: currentColor !important;
  fill: currentColor !important;
}

body.dark-mode .token-nav-icon--light {
  display: none !important;
}

body.dark-mode .token-nav-icon--dark {
  display: inline-block !important;
  opacity: 1 !important;
}

body:not(.dark-mode) .token-nav-icon--dark {
  display: none !important;
}

/* Contrast guardrails: prevent dark text on gray surfaces in dark mode */
body.dark-mode .sidebar-left .ap-nav-link,
body.dark-mode .sidebar-left .ap-nav-link i,
body.dark-mode .sidebar-left .ap-nav-link .link-text,
body.dark-mode .sidebar-left .ap-nav-link .link-text-short,
body.dark-mode .sidebar-footer-links a,
body.dark-mode .sidebar-footer .ap-copyright,
body.dark-mode .sidebar-footer .ap-copyright * {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .sidebar-left .ap-nav-link:hover,
body.dark-mode .sidebar-left .ap-nav-link:focus,
body.dark-mode .sidebar-left .ap-nav-link:focus-visible,
body.dark-mode .sidebar-left .ap-nav-link.is-active,
body.dark-mode .sidebar-left .ap-nav-link.is-open {
  background: var(--ap-surface-3) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .sidebar-left .ap-nav-link:hover i,
body.dark-mode .sidebar-left .ap-nav-link:focus i,
body.dark-mode .sidebar-left .ap-nav-link:focus-visible i,
body.dark-mode .sidebar-left .ap-nav-link.is-active i,
body.dark-mode .sidebar-left .ap-nav-link.is-open i {
  background: transparent !important;
  color: var(--ap-text) !important;
}

body.dark-mode .sidebar-footer-links a:hover,
body.dark-mode .sidebar-footer-links a:focus,
body.dark-mode .sidebar-footer .ap-copyright:hover {
  color: var(--ap-text) !important;
}

body.dark-mode .paging-link,
body.dark-mode .pages-rail .pages-rail-item,
body.dark-mode .cat-card {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-soft) !important;
}

body.dark-mode .paging-link:hover,
body.dark-mode .paging-link:focus,
body.dark-mode .pages-rail .pages-rail-item:hover,
body.dark-mode .pages-rail .pages-rail-item:focus,
body.dark-mode .pages-rail .pages-rail-item.is-active,
body.dark-mode .cat-card:hover,
body.dark-mode .cat-card:focus {
  background: var(--ap-surface-3) !important;
  border-color: #4b4b4b !important;
  color: var(--ap-text) !important;
}

body.dark-mode .market-card:hover i,
body.dark-mode .market-card:hover .card-body .card-title,
body.dark-mode .market-card:hover .card-body a {
  color: var(--ap-text) !important;
}

body.dark-mode .notification-item:hover,
body.dark-mode .notification-item.notification-hover {
  background: var(--ap-surface-3) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .notification-item:hover *,
body.dark-mode .notification-item.notification-hover * {
  color: var(--ap-text) !important;
}

body.dark-mode .ai-panel-toggle:hover,
body.dark-mode .user-message:hover,
body.dark-mode .ai-message:hover {
  color: var(--ap-text) !important;
}

body.dark-mode .user-message:hover,
body.dark-mode .ai-message:hover {
  background: var(--ap-surface-3) !important;
}

body.dark-mode .btn-outline-primary:hover,
body.dark-mode .btn-outline-secondary:hover,
body.dark-mode .btn-outline-dark:hover,
body.dark-mode .btn-outline-danger:hover,
body.dark-mode .btn-link:hover {
  color: var(--ap-text) !important;
}

body.dark-mode .btn-secondary,
body.dark-mode .btn-secondary:hover,
body.dark-mode .btn-outline-secondary,
body.dark-mode .btn-outline-secondary:hover,
body.dark-mode .btn-outline-dark,
body.dark-mode .btn-outline-dark:hover {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .price-button,
body.dark-mode .price-button:hover,
body.dark-mode .price-button.plan-plus:hover,
body.dark-mode .price-button.plan-pro:hover,
body.dark-mode .price-button.plan-max:hover {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .hover\:tw-text-slate-900:hover,
body.dark-mode .hover\:tw-text-slate-800:hover,
body.dark-mode .hover\:tw-text-slate-700:hover,
body.dark-mode .hover\:tw-text-slate-600:hover,
body.dark-mode .hover\:tw-text-slate-500:hover {
  color: var(--ap-text) !important;
}

/* Full sweep: search + journal + neutral controls */
body.dark-mode .search-input,
body.dark-mode .search-card,
body.dark-mode .author-chip,
body.dark-mode .search-page-link,
body.dark-mode .search-page-disabled,
body.dark-mode .motif-panel,
body.dark-mode .journal-month-card,
body.dark-mode .day-card,
body.dark-mode .journal-chip.subtle {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .search-card__media,
body.dark-mode .search-card__media.is-placeholder,
body.dark-mode .search-input {
  background: var(--ap-surface-2) !important;
}

body.dark-mode .search-card__snippet,
body.dark-mode .search-card__time,
body.dark-mode .author-chip__bio,
body.dark-mode .author-chip__meta {
  color: var(--ap-text-muted) !important;
}

body.dark-mode .author-chip__name,
body.dark-mode .search-page-link,
body.dark-mode .search-page-current,
body.dark-mode .motif-card,
body.dark-mode .motif-card:visited {
  color: var(--ap-text) !important;
}

body.dark-mode .motif-card {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .motif-card:hover,
body.dark-mode .motif-card:focus-visible {
  background: var(--ap-surface-3) !important;
  border-color: #4b4b4b !important;
}

body.dark-mode .motif-card.is-active {
  background: #3a3a3a !important;
  border-color: #5d5d5d !important;
  color: #f2f2f2 !important;
}

body.dark-mode .motif-card__count {
  background: rgba(170, 170, 170, 0.2) !important;
  color: #ececec !important;
}

body.dark-mode .search-input input {
  color: var(--ap-text) !important;
}

body.dark-mode .search-input input::placeholder {
  color: var(--ap-text-muted) !important;
}

body.dark-mode .search-input button,
body.dark-mode .search-submit {
  background: var(--ap-surface-2) !important;
  color: var(--ap-text-soft) !important;
}

body.dark-mode .search-input button:hover,
body.dark-mode .search-input button:focus,
body.dark-mode .search-submit:hover,
body.dark-mode .search-submit:focus {
  background: var(--ap-surface-3) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .search-page-link:hover,
body.dark-mode .search-page-link:focus-visible {
  background: var(--ap-surface-3) !important;
  border-color: #4b4b4b !important;
  color: var(--ap-text) !important;
}

body.dark-mode .search-page-current {
  background: #3a3a3a !important;
  border-color: #5d5d5d !important;
  color: #f2f2f2 !important;
}

body.dark-mode .rail-chip,
body.dark-mode .rail-year-link,
body.dark-mode .rail-month-item,
body.dark-mode .rail-day-item,
body.dark-mode .journal-toggle .journal-toggle-btn,
body.dark-mode .originals-author {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .rail-chip:hover,
body.dark-mode .rail-chip:focus-visible,
body.dark-mode .rail-year-link:hover,
body.dark-mode .rail-year-link:focus-visible,
body.dark-mode .rail-month-item:hover,
body.dark-mode .rail-month-item:focus-visible,
body.dark-mode .rail-day-item:hover,
body.dark-mode .rail-day-item:focus-visible,
body.dark-mode .journal-toggle .journal-toggle-btn:hover,
body.dark-mode .journal-toggle .journal-toggle-btn:focus,
body.dark-mode .originals-author:hover,
body.dark-mode .originals-author:focus-visible {
  color: var(--ap-text) !important;
}

body.dark-mode .rail-select select {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

/* Full sweep: neutral button/search variants */
body.dark-mode button,
body.dark-mode .btn,
body.dark-mode [role="button"],
body.dark-mode input[type="button"],
body.dark-mode input[type="submit"] {
  border-color: var(--ap-border);
}

body.dark-mode .btn-light,
body.dark-mode .btn-outline-light,
body.dark-mode .tw-bg-slate-200,
body.dark-mode .tw-bg-slate-100 {
  background: var(--ap-surface-2) !important;
  color: var(--ap-text) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .btn-light:hover,
body.dark-mode .btn-outline-light:hover,
body.dark-mode .tw-bg-slate-200:hover,
body.dark-mode .tw-bg-slate-100:hover {
  background: var(--ap-surface-3) !important;
  color: var(--ap-text) !important;
  border-color: #4b4b4b !important;
}

/* Force primary/blue utility variants to grayscale in dark mode */
body.dark-mode .btn-primary,
body.dark-mode .btn.btn-primary,
body.dark-mode .ap-btn-primary,
body.dark-mode .bg-primary,
body.dark-mode .tw-bg-blue-600,
body.dark-mode .tw-bg-blue-700,
body.dark-mode .tw-bg-blue-800 {
  background: var(--ap-surface-3) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .btn-primary:hover,
body.dark-mode .btn.btn-primary:hover,
body.dark-mode .ap-btn-primary:hover,
body.dark-mode .hover\:tw-bg-blue-700:hover,
body.dark-mode .hover\:tw-bg-blue-800:hover {
  background: #3b3b3b !important;
  border-color: #555555 !important;
  color: var(--ap-text) !important;
}

body.dark-mode .text-primary,
body.dark-mode .tw-text-blue-600,
body.dark-mode .tw-text-blue-700,
body.dark-mode .tw-text-blue-800,
body.dark-mode .tw-text-sky-600,
body.dark-mode .tw-text-sky-700 {
  color: var(--ap-text-soft) !important;
}

body.dark-mode .border-primary,
body.dark-mode .tw-border-blue-300,
body.dark-mode .tw-border-blue-500,
body.dark-mode .tw-border-blue-600 {
  border-color: var(--ap-border) !important;
}

body.dark-mode .ai-message,
body.dark-mode .user-message {
  border-left-color: var(--ap-border) !important;
}

/* Inline-style fallback: hardcoded light surfaces/text in templates */
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background:#fff" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background: #fff" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background:#ffffff" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background: #ffffff" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color:#fff" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color: #fff" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color:#ffffff" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color: #ffffff" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background:#f8fafc" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color:#f8fafc" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color: #f8fafc" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background:#f9f9f9" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color:#f9f9f9" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color: #f9f9f9" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background:#f5f5f5" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color:#f5f5f5" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color: #f5f5f5" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color:#f8f9fa" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background-color: #f8f9fa" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li)[style*="background:#f6f8fa" i] {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color:#000" i],
body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color: #000" i],
body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color:#111" i],
body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color: #111" i],
body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color:#0f172a" i],
body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color: #0f172a" i],
body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color:#111827" i],
body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color: #111827" i],
body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color:#212529" i],
body.dark-mode :is(h1, h2, h3, h4, h5, h6, p, a, button, label, small, strong, em, td, th, li, span, div)[style*="color: #212529" i] {
  color: var(--ap-text) !important;
}

body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li, input, textarea, select, button)[style*="border:1px solid #ddd" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li, input, textarea, select, button)[style*="border: 1px solid #ddd" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li, input, textarea, select, button)[style*="border:1px solid #e5e7eb" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li, input, textarea, select, button)[style*="border: 1px solid #e5e7eb" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li, input, textarea, select, button)[style*="border-color:#ddd" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li, input, textarea, select, button)[style*="border-color: #ddd" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li, input, textarea, select, button)[style*="border-color:#e5e7eb" i],
body.dark-mode :is(div, section, article, aside, main, form, details, dialog, table, thead, tbody, tr, td, th, ul, li, input, textarea, select, button)[style*="border-color: #e5e7eb" i] {
  border-color: var(--ap-border) !important;
}

/* Keep text dark on intentional pastel inline pills. */
body.dark-mode :is(span, a, div)[style*="background-color: #9FF28F" i],
body.dark-mode :is(span, a, div)[style*="background-color:#9FF28F" i],
body.dark-mode :is(span, a, div)[style*="background-color: #E6C2FF" i],
body.dark-mode :is(span, a, div)[style*="background-color:#E6C2FF" i],
body.dark-mode :is(span, a, div)[style*="background-color: #FFF3B0" i],
body.dark-mode :is(span, a, div)[style*="background-color:#FFF3B0" i] {
  color: #111111 !important;
}

/* Game page (`game/play`) explicit dark theme */
body.dark-mode .apx-wrap {
  color: var(--ap-text) !important;
}

body.dark-mode .apx-title {
  color: var(--ap-text) !important;
}

body.dark-mode .apx-shell {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.6), inset 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
}

body.dark-mode .apx-commandbar {
  background: color-mix(in oklab, var(--ap-surface-2) 92%, transparent) !important;
  border-color: var(--ap-border) !important;
}

body.dark-mode .apx-commandbar .apx-label,
body.dark-mode .apx-commandbar .apx-stat span,
body.dark-mode .apx-commandbar .apx-upgrade-title,
body.dark-mode .apx-commandbar .apx-upgrade-stat span,
body.dark-mode .apx-commandbar .apx-hero-title,
body.dark-mode .apx-commandbar .apx-hero-title-small,
body.dark-mode .apx-commandbar .apx-hero-stat span,
body.dark-mode .apx-commandbar .apx-enemy-title,
body.dark-mode .apx-commandbar .apx-enemy-stat span,
body.dark-mode .apx-wave-preview {
  color: var(--ap-text-muted) !important;
}

body.dark-mode .apx-commandbar .apx-stat strong,
body.dark-mode .apx-commandbar .apx-upgrade-kind,
body.dark-mode .apx-commandbar .apx-upgrade-stat strong,
body.dark-mode .apx-commandbar .apx-hero-stat strong,
body.dark-mode .apx-commandbar .apx-enemy-stat strong {
  color: var(--ap-text) !important;
}

body.dark-mode .apx-hud-controls .apx-btn {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .apx-hud-controls .apx-btn:hover,
body.dark-mode .apx-hud-controls .apx-btn:focus {
  background: var(--ap-surface-3) !important;
  border-color: #4b4b4b !important;
  color: var(--ap-text) !important;
}

body.dark-mode .apx-hud-controls .apx-btn.is-active {
  background: #3a3a3a !important;
  border-color: #5d5d5d !important;
  color: #f2f2f2 !important;
}

body.dark-mode .apx-hud-controls .apx-btn:disabled {
  background: #151515 !important;
  border-color: #303030 !important;
  color: #7a7a7a !important;
}

body.dark-mode .apx-hud-controls .apx-btn.apx-btn-ghost,
body.dark-mode .apx-hud-controls .apx-btn.apx-btn-start {
  background: var(--ap-surface-2) !important;
}

body.dark-mode .apx-shop-btn {
  background: var(--ap-surface-2) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .apx-shop-btn:hover,
body.dark-mode .apx-shop-btn:focus {
  background: var(--ap-surface-3) !important;
  border-color: #4b4b4b !important;
  color: var(--ap-text) !important;
}

body.dark-mode .apx-shop-btn.is-active,
body.dark-mode .apx-shop-kind.is-active {
  background: #3a3a3a !important;
  border-color: #5d5d5d !important;
  color: #f2f2f2 !important;
}

body.dark-mode .apx-price {
  color: var(--ap-text-muted) !important;
}

body.dark-mode .apx-menu {
  background: rgba(0, 0, 0, 0.72) !important;
}

body.dark-mode .apx-menu-card {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .apx-menu-title {
  color: var(--ap-text) !important;
}

/* Analytics uplink screen */
body.dark-mode .ap-wrap {
  background: var(--ap-surface-1) !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text) !important;
}

body.dark-mode .ap-title {
  color: var(--ap-text) !important;
}

body.dark-mode .ap-muted,
body.dark-mode .ap-note {
  color: var(--ap-text-soft) !important;
}