html[data-color-mode="dark"] {
  color-scheme: dark;
  --ink: #edf2ff;
  --muted: #a9b5cc;
  --line: #29364e;
  --soft: #111a2b;
  --white: #111a2b;
  --accent: #83a7ff;
  --accent-dark: #6893ff;
  --accent-soft: #1b2a46;
  color: var(--ink);
  background: #0b1020;
}

html[data-color-mode="dark"] body {
  color: var(--ink);
  background: #0b1020;
}

html[data-color-mode="dark"] .site-header {
  border-color: #25324a;
  background: rgba(11, 16, 32, .94);
}

html[data-color-mode="dark"] .primary-nav a,
html[data-color-mode="dark"] .legal-home {
  color: #bcc8dc;
}

html[data-color-mode="dark"] .theme-toggle {
  color: #e4ebfa;
  background: #172238;
  border-color: #344461;
}

html[data-color-mode="dark"] .theme-toggle:hover {
  color: #a9c2ff;
  border-color: #6988c2;
}

html[data-color-mode="dark"] .hero {
  background:
    radial-gradient(ellipse 38% 78% at 100% 50%, rgba(53, 93, 172, .34), transparent 76%),
    radial-gradient(ellipse 40% 68% at 0% 88%, rgba(22, 92, 132, .26), transparent 82%),
    linear-gradient(108deg, #101a2d 0%, #11192b 48%, #121d34 100%);
}

html[data-color-mode="dark"] .hero h1,
html[data-color-mode="dark"] .section-heading h2,
html[data-color-mode="dark"] .legal-page h1,
html[data-color-mode="dark"] .legal-content h2,
html[data-color-mode="dark"] .tool-page-heading h1,
html[data-color-mode="dark"] .tool-info h2 {
  color: #f0f4ff;
}

html[data-color-mode="dark"] .hero > .hero-content > p,
html[data-color-mode="dark"] .tool-card small,
html[data-color-mode="dark"] .category-link small,
html[data-color-mode="dark"] .footer-main nav a,
html[data-color-mode="dark"] .footer-main > p,
html[data-color-mode="dark"] .legal-page .intro,
html[data-color-mode="dark"] .legal-content p,
html[data-color-mode="dark"] .legal-content li,
html[data-color-mode="dark"] .breadcrumbs,
html[data-color-mode="dark"] .tool-page-heading p,
html[data-color-mode="dark"] .tool-info p,
html[data-color-mode="dark"] .tool-info li,
html[data-color-mode="dark"] .field small,
html[data-color-mode="dark"] .helper,
html[data-color-mode="dark"] .file-meta small,
html[data-color-mode="dark"] .result-stat small,
html[data-color-mode="dark"] .converter-progress,
html[data-color-mode="dark"] .result-panel > p {
  color: #aab7cf;
}

html[data-color-mode="dark"] .search-form,
html[data-color-mode="dark"] .tool-card,
html[data-color-mode="dark"] .category-link,
html[data-color-mode="dark"] .tool-workspace,
html[data-color-mode="dark"] .legal-content,
html[data-color-mode="dark"] .file-item,
html[data-color-mode="dark"] .download-row,
html[data-color-mode="dark"] .result-stat,
html[data-color-mode="dark"] .icon-button {
  color: #e9efff;
  background: #111a2b;
  border-color: #2a3852;
  box-shadow: 0 7px 22px rgba(0, 0, 0, .18);
}

html[data-color-mode="dark"] .search-form:focus-within,
html[data-color-mode="dark"] .tool-card:hover,
html[data-color-mode="dark"] .tool-card:focus-visible,
html[data-color-mode="dark"] .category-link:hover,
html[data-color-mode="dark"] .category-link:focus-visible {
  border-color: #526fa7;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .28);
}

html[data-color-mode="dark"] .search-form input,
html[data-color-mode="dark"] .field input:not([type="checkbox"]):not([type="range"]),
html[data-color-mode="dark"] .field select,
html[data-color-mode="dark"] .field textarea {
  color: #edf2ff;
  background: #0c1424;
  border-color: #35445f;
}

html[data-color-mode="dark"] .search-form input::placeholder,
html[data-color-mode="dark"] .field input::placeholder,
html[data-color-mode="dark"] .field textarea::placeholder {
  color: #8392ac;
}

html[data-color-mode="dark"] .field label {
  color: #dbe4f5;
}

html[data-color-mode="dark"] .empty-state,
html[data-color-mode="dark"] .drop-zone {
  color: #c8d4e8;
  background: #111a2b;
  border-color: #394b68;
}

html[data-color-mode="dark"] .drop-zone.is-over {
  background: #172943;
  border-color: #78a9ff;
}

html[data-color-mode="dark"] .tool-card strong,
html[data-color-mode="dark"] .category-link strong,
html[data-color-mode="dark"] .privacy-inner p strong {
  color: #edf2ff;
}

html[data-color-mode="dark"] .tone-rose,
html[data-color-mode="dark"] .pdf-icon { background: #38222d; color: #ff9da7; }
html[data-color-mode="dark"] .tone-blue,
html[data-color-mode="dark"] .image-icon { background: #1d2f4a; color: #8bb8ff; }
html[data-color-mode="dark"] .tone-purple,
html[data-color-mode="dark"] .calc-icon { background: #302348; color: #c4a1ff; }
html[data-color-mode="dark"] .tone-green,
html[data-color-mode="dark"] .text-icon { background: #18382f; color: #84e0b8; }

html[data-color-mode="dark"] .privacy-note,
html[data-color-mode="dark"] .privacy-inline,
html[data-color-mode="dark"] .result-panel {
  color: #dce6f7;
  background: linear-gradient(110deg, #142137, #172a46);
  border-color: #2a3e5c;
}

html[data-color-mode="dark"] .privacy-inner p,
html[data-color-mode="dark"] .privacy-inner p small,
html[data-color-mode="dark"] .privacy-inline b {
  color: #b9c8df;
}

html[data-color-mode="dark"] .result-panel h2,
html[data-color-mode="dark"] .result-stat strong {
  color: #eaf1ff;
}

html[data-color-mode="dark"] .result-stat {
  background: #101a2d;
}

html[data-color-mode="dark"] .button.secondary {
  color: #dbe6fb;
  background: #1a2940;
  border-color: #354662;
}

html[data-color-mode="dark"] .status {
  color: #b3c1d8;
}

html[data-color-mode="dark"] .status.error { color: #ff9c9c; }
html[data-color-mode="dark"] .status.success { color: #82dfb1; }

html[data-color-mode="dark"] .file-badge {
  color: #a8c5ff;
  background: #1e3150;
}

html[data-color-mode="dark"] .legal-page .contact-pending {
  color: #f3d898;
  background: #332a19;
  border-color: #665126;
}

html[data-color-mode="dark"] .diff-added {
  color: #a7f0c8;
  background: #17372b;
}

html[data-color-mode="dark"] .diff-removed {
  color: #ffb2b2;
  background: #3a2027;
}

html[data-color-mode="dark"] .primary-nav {
  background: #0d1525;
  border-color: #25324a;
}

html[data-color-mode="dark"] .menu-toggle span:not(.sr-only) {
  background: #dce6fa;
}

html[data-color-mode="dark"] .categories,
html[data-color-mode="dark"] .popular {
  background: #0b1020;
}

html[data-color-mode="dark"] .site-footer {
  color: #c8d4e8;
  border-color: #25324a;
  background: #0b1020;
}

@media (prefers-reduced-motion: reduce) {
  html[data-color-mode="dark"] *,
  html[data-color-mode="dark"] *::before,
  html[data-color-mode="dark"] *::after {
    animation-duration: .01ms !important;
  }
}