/* TEMP theme toggle - remove later
   Self-contained: delete this file, assets/theme-toggle.js and the two
   "TEMP theme toggle" includes in index.html. */
/* HIDDEN on purpose (the site follows the device theme). Delete this one rule to show the toggle again. */
.theme-toggle{ display: none !important; }

.theme-toggle{
  position: fixed; right: 20px; bottom: 20px; z-index: 70;
  width: 42px; height: 42px; padding: 0; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--surface); color: var(--text);
  border: 1px solid var(--border-strong);
  box-shadow: 0 10px 22px var(--shadow);
  cursor: pointer; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; touch-action: manipulation; transition: transform .15s ease, color .15s ease, border-color .15s ease;
}
.theme-toggle:hover{ border-color: var(--text-subtle); transform: translateY(-2px); }
.theme-toggle:focus-visible{ outline: 2px solid var(--text-subtle); outline-offset: 2px; }
.theme-toggle svg{ width: 19px; height: 19px; }
/* keep clear of the mobile bottom tab bar */
@media (max-width: 900px){ .theme-toggle{ right: 14px; bottom: 92px; } }