:root {

    /* Colours */

    --mdlr-color-primary-main: light-dark(#f1eded, #1e1b1b);
    --mdlr-color-primary-main-text: light-dark(#000, #fff);
    --mdlr-color-primary-intense: light-dark(#fff, #000);
    --mdlr-color-primary-intense-text: light-dark(#6b5f5f, #a29f9f);
    --mdlr-color-primary-more: light-dark(#f7f5f5, #100d0d);
    --mdlr-color-primary-less: light-dark(#d4d1d1, #3f3c3c);
    --mdlr-color-primary-translucent: light-dark(rgba(255,255,255,0.75), rgba(0,0,0,0.65));
    --mdlr-color-primary-translucent-filter: blur(0.65rem) saturate(250%);
    --mdlr-color-primary-backdrop: light-dark(rgba(0,0,0,0.75), rgba(0,0,0,0.65));
    --mdlr-color-primary-backdrop-filter: blur(0.65rem);
    --mdlr-color-primary-backdrop-text: #fff;

    --mdlr-color-highlight-main: light-dark(#81d835, #5ac918);
    --mdlr-color-highlight-main-text: #000;
    --mdlr-color-highlight-intense: light-dark(#207c00, #81d835);
    --mdlr-color-highlight-light: light-dark(#ccf1b1, #294511);
    --mdlr-color-highlight-light-ultra: light-dark(#e6f8d8, #152309);
    --mdlr-color-highlight-light-text: light-dark(#000, #fff);
    --mdlr-color-highlight-dark: light-dark(#294511, #ccf1b1);
    --mdlr-color-highlight-dark-ultra: light-dark(#152309, #e6f8d8);
    --mdlr-color-highlight-dark-text: light-dark(#fff, #000);

    --mdlr-color-accent-main: light-dark(#fe259d, #e5007d);
    --mdlr-color-accent-main-text: #000;
    --mdlr-color-accent-intense: light-dark(#e5007d, #fe259d);
    --mdlr-color-accent-light: light-dark(#ffb3dc, #450427);
    --mdlr-color-accent-light-text: light-dark(#000, #fff);
    --mdlr-color-accent-dark: light-dark(#450427, #ffb3dc);
    --mdlr-color-accent-dark-text: light-dark(#fff, #000);

    --mdlr-color-attention-error: light-dark(#ff112f, #ff0041);

    /* Fonts */

    --mdlr-font-main: 'Source Sans Variable', system-ui, sans-serif;
    --mdlr-font-main-features: 'liga' 1, 'zero' 1;
    --mdlr-font-main-size: 1.0625rem;
    --mdlr-font-main-smaller: 0.875em;
    --mdlr-font-main-larger: 1.1875rem;

    --mdlr-font-heading-size: 3.5rem;
    --mdlr-font-heading-size-below-900: 2.5rem;
    --mdlr-font-heading-size-below-600: 2rem;
    --mdlr-font-heading-weight: 700;
    --mdlr-font-heading-color: var(--mdlr-color-primary-main-text);

    --mdlr-font-sectionheading-size: 2rem;
    --mdlr-font-sectionheading-size-below-600: 1.75rem;
    --mdlr-font-sectionheading-weight: 650;
    --mdlr-font-sectionheading-color: var(--mdlr-color-primary-main-text);

    --mdlr-font-subheading-size: 1.5rem;
    --mdlr-font-subheading-weight: 600;
    --mdlr-font-subheading-color: var(--mdlr-color-primary-main-text);

    /* Shadows */

    --mdlr-shadow-flat: 0 0 4px light-dark(rgba(0,0,0,0.1), rgba(255,255,255,0.1)),
        0 4px 8px light-dark(rgba(0,0,0,0.05), rgba(255,255,255,0.075));
    --mdlr-shadow-regular: 0 0 4px light-dark(rgba(0,0,0,0.125), rgba(255,255,255,0.125)),
        0 6px 10px light-dark(rgba(0,0,0,0.075), rgba(255,255,255,0.075));
    --mdlr-shadow-elevated: 0 0 4px light-dark(rgba(0,0,0,0.15), rgba(255,255,255,0.15)),
        0 12px 20px light-dark(rgba(0,0,0,0.125), rgba(255,255,255,0.125));
}

/* Font files */

@font-face {
    font-family: 'Source Sans Variable';
    font-style: normal;
    font-display: swap;
    font-stretch: normal;
    font-weight: 200 900;
    src: url("../Fonts/source-sans-variable.woff2") format("woff2");
}

@font-face {
    font-family: 'Source Sans Variable';
    font-style: italic;
    font-display: swap;
    font-stretch: normal;
    font-weight: 200 900;
    src: url("../Fonts/source-sans-variable-italic.woff2") format("woff2");
}