export type DialogBrightness = 'dark' | 'medium' | 'medium-light' | 'light' | 'lighter' | 'none';
export declare const overlayStyles: import("@planda/styled-system/types").RecipeRuntimeFn<{
    brightness: {
        dark: {
            backgroundColor: "$overlay5";
        };
        medium: {
            backgroundColor: "$overlay4";
        };
        'medium-light': {
            backgroundColor: "$overlay3";
        };
        light: {
            backgroundColor: "$overlay2";
        };
        lighter: {
            backgroundColor: "$overlay1";
        };
        none: {
            backgroundColor: "transparent";
        };
    };
    dialog: {
        true: {
            position: "fixed";
            top: number;
            right: number;
            bottom: number;
            left: number;
            zIndex: "$2";
            '&[data-state="open"]': {
                animation: "fadeIn 150ms cubic-bezier(0.22, 1, 0.36, 1)";
            };
            '&[data-state="closed"]': {
                animation: "fadeOut 150ms cubic-bezier(0.22, 1, 0.36, 1)";
            };
        };
    };
}>;
export declare const Overlay: import("@planda/styled-system/jsx").StyledComponent<"div", {
    brightness?: "none" | "medium" | "dark" | "light" | "lighter" | "medium-light" | undefined;
    dialog?: boolean | undefined;
}>;