/* Optional appearance layer. Remove this stylesheet's link from index.html
 * to restore the previous controls. Content, geometry and behavior live in
 * their original files; only control fills are adjusted here.
 */
@media screen and (forced-colors: none) {
    body {
        --control-surface-rgb: 252, 247, 239;
        --control-hover-rgb: 238, 227, 212;
        --control-surface-alpha: 0.62;
        --control-hover-alpha: 0.78;
        --control-accent-alpha: 0.94;
        --control-accent-hover-alpha: 0.98;
        --control-floating-alpha: 0.86;
        --control-play-alpha: 0.78;
        --control-play-hover-alpha: 0.92;
    }

    body.dark-mode {
        --control-surface-rgb: 39, 33, 27;
        --control-hover-rgb: 54, 43, 34;
        --control-accent-alpha: 0.88;
    }

    body :is(.abstract-toggle, .bibtex-toggle, .arxiv-tab, .human-checkbox-label, .cv-download-link, .erdos-btn),
    body.dark-mode :is(.abstract-toggle, .bibtex-toggle, .arxiv-tab, .human-checkbox-label, .cv-download-link, .erdos-btn),
    body #page-ai-math :is(.ai-math-tabs, .ai-math-video-description-toggle, select) {
        background-color: rgba(var(--control-surface-rgb), var(--control-surface-alpha));
    }

    body :is(.abstract-toggle, .bibtex-toggle, .arxiv-tab, .human-checkbox-label, .cv-download-link, .erdos-btn):hover,
    body.dark-mode :is(.abstract-toggle, .bibtex-toggle, .arxiv-tab, .human-checkbox-label, .cv-download-link, .erdos-btn):hover,
    body #page-ai-math .ai-math-video-description-toggle:hover,
    body #page-ai-math .ai-math-video-description-toggle[aria-expanded="true"],
    body #page-ai-math select:hover,
    body .name-orbit-close:hover,
    body .name-orbit-close:focus-visible {
        background-color: rgba(var(--control-hover-rgb), var(--control-hover-alpha));
    }

    /* Preserve the name button's existing gradient, with translucent stops.
     * Do not change the palette shared by the gallery panel itself.
     */
    body .orbit-name-trigger:hover,
    body .orbit-name-trigger:focus-visible,
    body .orbit-name-trigger.is-open {
        background-image: linear-gradient(135deg,
            rgba(var(--control-surface-rgb), var(--control-surface-alpha)),
            rgba(var(--control-hover-rgb), var(--control-hover-alpha)));
    }

    /* Accent fills stay stronger to retain contrast with the existing text. */
    body #page-ai-math .ai-math-tabs::before,
    body .copy-btn,
    body.dark-mode .copy-btn {
        background-color: rgba(var(--accent-rgb), var(--control-accent-alpha));
    }

    body .copy-btn:hover,
    body.dark-mode .copy-btn:hover {
        background-color: rgba(var(--accent-rgb), var(--control-accent-hover-alpha));
        /* Replace the old whole-button fade so its text remains readable. */
        opacity: 1;
    }

    body #ai-math-back-to-top {
        background-color: rgba(var(--control-surface-rgb), var(--control-floating-alpha));
    }

    body #ai-math-back-to-top:hover {
        background-color: rgba(var(--control-hover-rgb), var(--control-floating-alpha));
    }

    body #page-ai-math .ai-math-video-play-icon {
        background-color: rgba(28, 22, 18, var(--control-play-alpha));
    }

    body #page-ai-math .ai-math-video-play:hover .ai-math-video-play-icon,
    body #page-ai-math .ai-math-video-play:focus-visible .ai-math-video-play-icon {
        background-color: rgba(135, 80, 56, var(--control-play-hover-alpha));
    }

    /* Existing borderless navigation, filters and icon buttons already have
     * transparent fills. Leave their labels, outlines and hit areas intact.
     * The screen-only scope also preserves the existing print appearance.
     */
    @media (prefers-contrast: more), (prefers-reduced-transparency: reduce) {
        body,
        body.dark-mode {
            --control-surface-alpha: 1;
            --control-hover-alpha: 1;
            --control-accent-alpha: 1;
            --control-accent-hover-alpha: 1;
            --control-floating-alpha: 1;
            --control-play-alpha: 1;
            --control-play-hover-alpha: 1;
        }
    }
}
