theme-picker { display: inline-flex; width: 36px; height: 36px; flex-shrink: 0; }
theme-picker:not(:defined) { visibility: hidden; }
.theme-trigger { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--muted); }
.theme-trigger:hover, .theme-trigger[aria-expanded='true'] { background: var(--subtle); color: var(--foreground); }
button:focus:not(:focus-visible) { outline: none; }
[data-theme-icon] { display: none; }
[data-theme='light'] [data-theme-icon='light'], [data-theme='dark'] [data-theme-icon='dark'] { display: inline-flex; }
.theme-menu { position: fixed; inset: auto; margin: 0; width: 176px; max-width: calc(100vw - 16px); padding: 5px; border: 1px solid var(--border); border-radius: 8px; background: var(--background); color: var(--foreground); box-shadow: 0 8px 24px rgb(0 0 0 / 14%); }
.theme-menu button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border: 0; border-radius: 4px; background: transparent; text-align: left; font-size: 13px; line-height: 20px; }
.theme-menu button:hover, .theme-menu button:focus-visible { background: var(--subtle); }
.theme-menu button:focus-visible { outline-offset: -2px; }
.theme-menu button > :first-child { color: var(--muted); }
.theme-check { display: inline-flex; margin-left: auto; visibility: hidden; }
[aria-checked='true'] .theme-check { visibility: visible; }