.theme-switch{--switch-w:64px;position:relative!important;display:inline-flex!important;align-items:center!important;justify-content:space-between!important;width:var(--switch-w)!important;min-width:var(--switch-w)!important;height:34px!important;padding:0 8px!important;border:1px solid var(--line)!important;border-radius:999px!important;background:color-mix(in srgb,var(--paper) 90%,transparent)!important;color:var(--ink)!important;box-shadow:none!important;overflow:hidden;cursor:pointer;isolation:isolate}
.theme-switch svg{position:relative;z-index:2;width:16px!important;height:16px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round;stroke-linejoin:round;transition:color .3s ease,transform .35s cubic-bezier(.22,1,.36,1),opacity .3s ease}
.theme-switch .theme-sun{color:#d99513}.theme-switch .theme-moon{color:#7965cf}
.theme-switch::before{content:"";position:absolute;z-index:1;top:3px;right:3px;width:26px;height:26px;border-radius:50%;background:var(--paper);border:1px solid var(--line);box-shadow:0 3px 9px rgba(31,24,22,.15);transform:translateX(0);transition:transform .38s cubic-bezier(.22,1,.36,1),background-color .3s ease,border-color .3s ease}
html[data-color-mode="dark"] .theme-switch::before,html[data-theme="dark"] .theme-switch::before{transform:translateX(-30px)}
html:not([data-color-mode="dark"]):not([data-theme="dark"]) .theme-switch .theme-moon{opacity:.45;transform:rotate(-18deg) scale(.82)}
html[data-color-mode="dark"] .theme-switch .theme-sun,html[data-theme="dark"] .theme-switch .theme-sun{opacity:.45;transform:rotate(45deg) scale(.82)}
html.theme-transitioning *,html.theme-transitioning *::before,html.theme-transitioning *::after{transition-property:background-color,border-color,color,box-shadow,fill,stroke!important;transition-duration:.35s!important}
::view-transition-old(root),::view-transition-new(root){animation-duration:.38s;animation-timing-function:cubic-bezier(.22,1,.36,1)}
::view-transition-old(root){animation-name:theme-fade-out}::view-transition-new(root){animation-name:theme-fade-in}
@keyframes theme-fade-out{to{opacity:.15;filter:blur(2px)}}@keyframes theme-fade-in{from{opacity:.15;filter:blur(2px)}}
@media(prefers-reduced-motion:reduce){.theme-switch,.theme-switch::before,.theme-switch svg{transition:none!important}::view-transition-old(root),::view-transition-new(root){animation:none!important}}
