:root { color-scheme:light; }
:root[data-theme="dark"] { color-scheme:dark; }
.theme-toggle {
  width:44px; height:44px; flex:none; display:inline-grid; place-items:center;
  border:1px solid #e3e2ee; border-radius:50%; background:#ffffff90;
  color:#75658e; padding:10px; cursor:pointer;
}
.theme-toggle:hover { background:#ede8fc; border-color:#c9baee; }
.theme-toggle:focus-visible { outline:3px solid #a694ff; outline-offset:4px; }
.theme-toggle svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.theme-toggle .theme-sun { display:none; }
[data-theme="dark"] .theme-toggle { color:#d5c5ff; border-color:#383449; background:#222231; }
[data-theme="dark"] .theme-toggle:hover { background:#302a43; border-color:#7c68a6; }
[data-theme="dark"] .theme-toggle .theme-moon { display:none; }
[data-theme="dark"] .theme-toggle .theme-sun { display:block; }