.theme-toggle {
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    place-items: center;
    border: 1px solid var(--color-border);
    border-radius: 50%;
    background: var(--color-surface);
    color: var(--color-text);
    cursor: pointer;
    font: inherit;
    font-size: 1.2rem;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
    border-color: var(--color-primary);
    color: var(--color-primary);
}