.theme-toggle{--tt-w:3.25rem;--tt-h:1.75rem;--tt-pad:.1875rem;width:var(--tt-w);height:var(--tt-h);border:1px solid var(--color-metal);background:oklch(from var(--color-text) l c h / .06);cursor:pointer;transition:background var(--duration-normal) var(--ease-out-expo), border-color var(--duration-normal) var(--ease-out-expo);border-radius:9999px;flex:none;padding:0;position:relative}.theme-toggle:hover{background:oklch(from var(--color-text) l c h / .1)}.theme-toggle:focus-visible{outline:2px solid var(--color-text);outline-offset:2px}.theme-toggle-knob{top:var(--tt-pad);left:var(--tt-pad);width:calc(var(--tt-h) - var(--tt-pad) * 2);height:calc(var(--tt-h) - var(--tt-pad) * 2);background:var(--color-surface);box-shadow:0 1px 2px oklch(from var(--color-text) l c h / .25);transition:transform var(--duration-normal) var(--ease-out-expo);border-radius:9999px;position:absolute}[data-theme=dark] .theme-toggle-knob{transform:translateX(calc(var(--tt-w) - var(--tt-h)))}.theme-toggle-icon{width:.75rem;height:.75rem;color:var(--color-muted);transition:opacity var(--duration-normal) var(--ease-out-expo);pointer-events:none;margin-top:-.375rem;position:absolute;top:50%}.theme-toggle-icon--sun{opacity:0;left:.3125rem}.theme-toggle-icon--moon{opacity:1;right:.3125rem}[data-theme=dark] .theme-toggle-icon--sun{opacity:1}[data-theme=dark] .theme-toggle-icon--moon{opacity:0}::view-transition-old(root){mix-blend-mode:normal;animation:none}::view-transition-new(root){mix-blend-mode:normal;animation:none}::view-transition-old(root){z-index:1}::view-transition-new(root){z-index:2}