html[data-theme="dark"] { background: #101015; }
html[data-theme="dark"] body { background: #101015; color: #e8e7ee; }
html[data-theme="dark"] a { color: #a9a3f7; }
html[data-theme="dark"] a:hover { color: #c7c4f2; }
html[data-theme="dark"] ::placeholder { color: #7e7c8b; }
html[data-theme="dark"] ::selection { background: #4f46e5; color: #fff; }

.ab-theme-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 9px; cursor: pointer;
  border: 1px solid #e2e0d9; background: #fff; color: #55545f;
  transition: background .18s, border-color .18s, color .18s, transform .18s;
}
.ab-theme-btn:hover { color: #4f46e5; border-color: #dedcf7; transform: translateY(-1px); }
html[data-theme="dark"] .ab-theme-btn { border-color: #30303a; background: #1b1b23; color: #e3b95f; }
html[data-theme="dark"] .ab-theme-btn:hover { border-color: #4b4459; color: #f4d287; }
.ab-theme-btn svg { width: 18px; height: 18px; display: block; }
html[data-theme="dark"] .ab-sun { display: none; }
html:not([data-theme="dark"]) .ab-moon { display: none; }