/* Surface-aware smoked glass for the homepage navigation. */
body.home-page :is(#languageToggle, #themeToggle, #menuToggle) {
    --control-fill: rgba(22, 32, 32, .68);
    --control-ink: #eeefea;
    --control-edge: rgba(224, 238, 233, .25);
    --control-hover: rgba(37, 65, 61, .86);
    --control-accent: #98d5c7;
    box-sizing: border-box;
    width: 48px;
    height: 48px;
    top: 28px;
    padding: 0;
    border: 1px solid var(--control-edge);
    border-radius: 50%;
    color: var(--control-ink);
    background: var(--control-fill);
    box-shadow: 0 4px 14px rgba(0, 0, 0, .12), inset 0 1px 0 rgba(255, 255, 255, .045);
    -webkit-backdrop-filter: blur(16px) saturate(115%);
    backdrop-filter: blur(16px) saturate(115%);
    transition: background-color .22s ease, border-color .22s ease, color .22s ease, box-shadow .22s ease;
    transform: none;
}
body.home-page :is(#languageToggle, #themeToggle, #menuToggle)[data-control-surface="light"] {
    --control-fill: rgba(234, 238, 234, .84);
    --control-ink: #253630;
    --control-edge: rgba(37, 54, 48, .18);
    --control-hover: rgba(219, 232, 225, .94);
    --control-accent: #3e7c69;
    box-shadow: 0 3px 12px rgba(26, 43, 35, .07);
}
body.home-page #languageToggle { left: 28px; }
body.home-page #themeToggle { left: 88px; }
body.home-page #menuToggle { right: 28px; gap: 5px; }
body.home-page :is(#languageToggle, #themeToggle, #menuToggle):hover {
    background: var(--control-hover);
    border-color: var(--control-accent);
    box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
    transform: none;
}
body.home-page :is(#languageToggle, #themeToggle, #menuToggle):focus-visible {
    outline: 2px solid var(--control-accent);
    outline-offset: 4px;
}
body.home-page #languageToggle .language-flag {
    color: inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .035em;
    text-shadow: none;
    transform: none;
}
body.home-page #themeToggle .theme-icon {
    color: inherit;
    width: 20px;
    height: 20px;
    stroke-width: 1.6;
}
body.home-page #menuToggle .menu-toggle-bar {
    background: currentColor;
    width: 21px;
    height: 1.5px;
    transition: transform .22s ease, opacity .22s ease, background-color .22s ease;
}
body.home-page #menuToggle.active .menu-toggle-bar:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.home-page #menuToggle.active .menu-toggle-bar:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
@media (max-width: 700px) {
    body.home-page :is(#languageToggle, #themeToggle, #menuToggle) { width: 44px; height: 44px; top: 20px; }
    body.home-page #languageToggle { left: 20px; }
    body.home-page #themeToggle { left: 76px; }
    body.home-page #menuToggle { right: 20px; }
}
@media (prefers-reduced-motion: reduce) {
    body.home-page :is(#languageToggle, #themeToggle, #menuToggle),
    body.home-page #menuToggle .menu-toggle-bar { transition: none; }
}