/* Variables */

:root {
    --primary-h: 96;
    --primary-s: 48%;
    --primary-l: 47%;
    --primary: hsl(var(--primary-h), var(--primary-s), var(--primary-l));

    --info-h: 239;
    --info-s: 84%;
    --info-l: 67%;
    --info: hsl(var(--info-h), var(--info-s), var(--info-l));

    --success-h: 142;
    --success-s: 76%;
    --success-l: 36%;
    --success: hsl(var(--success-h), var(--success-s), var(--success-l));

    --warning-h: 45;
    --warning-s: 100%;
    --warning-l: 60%;
    --warning: hsl(var(--warning-h), var(--warning-s), var(--warning-l));

    --error-h: 0;
    --error-s: 84%;
    --error-l: 60%;
    --error: hsl(var(--error-h), var(--error-s), var(--error-l));

    --black-h: 225;
    --black-s: 5%;
    --black-l: 14%;
    --black: hsl(var(--black-h), var(--black-s), var(--black-l));

    --white-h: 0;
    --white-s: 0%;
    --white-l: 98%;
    --white: hsl(var(--white-h), var(--white-s), var(--white-l));

    --layout-sizer: 1rem;
    --layout-sizer-larger: calc(var(--layout-sizer) * 2);
    --layout-sizer-smaller: calc(var(--layout-sizer) / 2);
    
    --nav-sizer: .5rem;
    --nav-sizer-larger: calc(var(--nav-sizer) * 2);
    --nav-sizer-smaller: calc(var(--nav-sizer) / 2);
}