/* MAN liquid surface — shared by the authenticated/guest language picker
   and the immersive MD exit sheet. Based on the bottom navigation's layered
   glass, edge highlights and moderate backdrop blur, not on a new UI theme.
   Set only painting/elevation here: each modal owns its layout and behavior. */
.man-liquid-surface {
    --man-liquid-fill: rgba(242, 237, 228, .52);
    --man-liquid-fallback: #f4f0e7;
    --man-liquid-edge: rgba(255, 255, 255, .89);
    --man-liquid-shadow: rgba(70, 57, 38, .09);
    --man-liquid-glint: rgba(255, 255, 255, .23);
    --man-liquid-lowlight: rgba(110, 90, 62, .035);
    --man-liquid-topline: rgba(255, 255, 255, .75);
    --man-liquid-bottomline: rgba(78, 65, 45, .08);
    --man-liquid-background:
        radial-gradient(ellipse at 12% 0%, var(--man-liquid-glint), transparent 58%),
        linear-gradient(155deg, rgba(255,255,255,.13), var(--man-liquid-lowlight)),
        var(--man-liquid-fill);
    --man-liquid-elevation:
        0 16px 42px var(--man-liquid-shadow),
        inset 0 1px 0 var(--man-liquid-topline),
        inset 0 -1px 0 var(--man-liquid-bottomline);

    background: var(--man-liquid-fallback);
    background: var(--man-liquid-background);
    border: 1px solid var(--man-liquid-edge);
    box-shadow: var(--man-liquid-elevation);
    -webkit-backdrop-filter: blur(5px) saturate(125%);
    backdrop-filter: blur(5px) saturate(125%);
    isolation: isolate;
}

body.theme-dark .man-liquid-surface {
    --man-liquid-fill: rgba(24, 23, 22, .66);
    --man-liquid-fallback: #1b1917;
    --man-liquid-edge: rgba(246, 241, 230, .24);
    --man-liquid-shadow: rgba(0, 0, 0, .35);
    --man-liquid-glint: rgba(255, 255, 255, .075);
    --man-liquid-lowlight: rgba(0, 0, 0, .10);
    --man-liquid-topline: rgba(255, 255, 255, .19);
    --man-liquid-bottomline: rgba(0, 0, 0, .22);
}

/* A preference to reduce transparency must yield a solid, predictable
   surface; supported and unsupported blur implementations remain usable. */
@media (prefers-reduced-transparency: reduce) {
    .man-liquid-surface {
        --man-liquid-fill: #f4f0e7;
        --man-liquid-background: var(--man-liquid-fallback);
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }
    body.theme-dark .man-liquid-surface {
        --man-liquid-fill: #1b1917;
    }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .man-liquid-surface {
        --man-liquid-fill: #f4f0e7;
        --man-liquid-background: var(--man-liquid-fallback);
    }
    body.theme-dark .man-liquid-surface {
        --man-liquid-fill: #1b1917;
    }
}

@keyframes manLiquidDialogEnter {
    from { opacity: 0; transform: translateY(9px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
.man-guest-language-dialog[open] {
    animation: manLiquidDialogEnter 240ms cubic-bezier(.22, 1, .36, 1) both;
}

@media (prefers-reduced-motion: reduce) {
    .man-guest-language-dialog[open] {
        animation: none !important;
    }
}
