:root { color-scheme: light; }
#theme-toggle {
  position: fixed; bottom: 20px; right: 20px; z-index: 10050;
  display: inline-flex; gap: 3px; align-items: center;
  padding: 5px; border: 1px solid #ddd; border-radius: 999px;
  background: #fff; color: #666; box-shadow: 0 4px 20px #0002;
  cursor: pointer; touch-action: manipulation;
}
#theme-toggle span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; }
#theme-toggle svg { width: 20px; height: 20px; }
#theme-toggle .theme-sun { background: #242424; color: white; }
#theme-toggle:focus-visible { outline: 3px solid #668cff; outline-offset: 4px; }
html[data-theme="dark"] { color-scheme: dark; background: #090909; }
html[data-theme="dark"] body { background: #090909; color: #f5f5f5; }
html[data-theme="dark"] [class*="bg-[#f6f6f6]"],
html[data-theme="dark"] [class*="bg-[#f0f1f4]"] { background-color: #090909; }
html[data-theme="dark"] [class*="bg-white"],
html[data-theme="dark"] [class*="bg-[#f8f8f8]"],
html[data-theme="dark"] [class*="bg-black/5"] { background-color: #191919; }
html[data-theme="dark"] [class*="text-[#2b2b2b"],
html[data-theme="dark"] [class*="text-black"],
html[data-theme="dark"] input,
html[data-theme="dark"] textarea { color: #f5f5f5; }
html[data-theme="dark"] [class*="text-black/30"],
html[data-theme="dark"] [class*="text-black/40"],
html[data-theme="dark"] [class*="text-black/50"] { color: #a3a3a3; }
html[data-theme="dark"] [class*="border-black"] { border-color: #ffffff26; }
html[data-theme="dark"] input,
html[data-theme="dark"] textarea { background-color: #121212; border-color: #ffffff30; }
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #858585; }
html[data-theme="dark"] [class*="bg-[#2b2b2b]"] { background-color: #f5f5f5; color: #111; }
html[data-theme="dark"] [class*="bg-[#2b2b2b]"] [class*="text-white"] { color: #111; }
html[data-theme="dark"] img[src*="/cuanstyle/logo"] { filter: invert(1); }
html[data-theme="dark"] .canvas-size-options > button { background: #191919; color: #f5f5f5; border-color: #ffffff30; }
html[data-theme="dark"] .canvas-size-options > button > span { color: inherit; }
html[data-theme="dark"] .canvas-size-options > button > span:nth-child(2) { color: #b5b5b5; }
html[data-theme="dark"] .canvas-size-options > button[aria-pressed="true"] { background: #f5f5f5; border-color: #f5f5f5; color: #111; }
html[data-theme="dark"] .canvas-size-options > button[aria-pressed="true"] > span { color: #111; }
html[data-theme="dark"] #theme-toggle { background: #1b1b1b; border-color: #444; color: #aaa; }
html[data-theme="dark"] #theme-toggle .theme-sun { background: transparent; color: #aaa; }
html[data-theme="dark"] #theme-toggle .theme-moon { background: #f5f5f5; color: #111; }
@media (max-width: 639px) { #theme-toggle { bottom: 16px; right: 16px; } }