.theme-toggle {
  padding: 9px 13px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: transparent;
  color: var(--green);
  font: inherit;
  font-size: .78rem;
  font-weight: 750;
  cursor: pointer;
}

.theme-toggle:hover {
  border-color: var(--accent);
  color: var(--accent);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #101816;
  --paper: #17231f;
  --ink: #eef3f0;
  --muted: #b0bdb8;
  --line: #34453f;
  --green: #21483f;
  --mint: #7caa9c;
  --lime: #b9ce7e;
  --accent: #ed8a61;
}

html[data-theme="dark"] .site-header {
  background: rgba(16, 24, 22, .92);
}

html[data-theme="dark"] .site-header nav a {
  color: #d5dfdc;
}

html[data-theme="dark"] .site-header .nav-contact,
html[data-theme="dark"] .theme-toggle {
  color: #e7efec;
  border-color: #60736d;
}

html[data-theme="dark"] .button.secondary,
html[data-theme="dark"] .skill-card {
  background: rgba(255, 255, 255, .035);
}

html[data-theme="dark"] .skill-card.featured {
  background: #234a41;
}

html[data-theme="dark"] .language-note {
  background: #1b2925;
}

html[data-theme="dark"] .contact-section {
  background: #1c3933;
}

html[data-theme="dark"] .contact-actions a {
  border-color: rgba(255, 255, 255, .2);
}

html[data-theme="dark"] .menu-toggle {
  color: var(--ink);
  border-color: var(--line);
}

@media (max-width: 900px) {
  html[data-theme="dark"] .site-header nav {
    background: var(--paper);
  }
}