:root {
    /*
    Fonction affine :
        f(x) = y_0 + (x - x_0) * m

        x: Taille
        y_0: Taille minimale
        x_0: Taille de référence
        m: Taux de variation


    Taux de variation :
            y_2 - y_1
        m = ---------
            x_2 - x_1

        x_1: Plus petite valeur de départ
        x_2: Plus grande valeur de départ
        y_1: Plus petite valeur souhaitée
        y_2: Plus grande valeur souhaitée
    */

    --base-min: 10;
    --base: 16;
    --base-max: 64;

    --low-ratio: calc((var(--scale-base, var(--base)) - var(--scale-base-min, var(--base-min))) / (var(--base) - var(--base-min)));
    --default-ratio: calc((var(--scale-base-max, var(--base-max)) - var(--scale-base, var(--base))) / (var(--base-max) - var(--base)));

    --low-ref: calc(var(--base-min) * 1px);
    --ref: calc(var(--base) * 1px);

    --low-offset: calc(var(--scale-base-min, var(--base-min)) * 1px);
    --offset: calc(var(--scale-base, var(--base)) * 1px);

    --10px: calc(var(--low-offset) + (10px - var(--low-ref)) * var(--low-ratio));
    --11px: calc(var(--low-offset) + (11px - var(--low-ref)) * var(--low-ratio));
    --12px: calc(var(--low-offset) + (12px - var(--low-ref)) * var(--low-ratio));
    --13px: calc(var(--low-offset) + (13px - var(--low-ref)) * var(--low-ratio));
    --14px: calc(var(--low-offset) + (14px - var(--low-ref)) * var(--low-ratio));
    --15px: calc(var(--low-offset) + (15px - var(--low-ref)) * var(--low-ratio));
    --16px: calc(var(--offset) + (16px - var(--ref)) * var(--default-ratio));
    --17px: calc(var(--offset) + (17px - var(--ref)) * var(--default-ratio));
    --18px: calc(var(--offset) + (18px - var(--ref)) * var(--default-ratio));
    --19px: calc(var(--offset) + (19px - var(--ref)) * var(--default-ratio));
    --20px: calc(var(--offset) + (20px - var(--ref)) * var(--default-ratio));
    --21px: calc(var(--offset) + (21px - var(--ref)) * var(--default-ratio));
    --22px: calc(var(--offset) + (22px - var(--ref)) * var(--default-ratio));
    --23px: calc(var(--offset) + (23px - var(--ref)) * var(--default-ratio));
    --24px: calc(var(--offset) + (24px - var(--ref)) * var(--default-ratio));
    --25px: calc(var(--offset) + (25px - var(--ref)) * var(--default-ratio));
    --26px: calc(var(--offset) + (26px - var(--ref)) * var(--default-ratio));
    --27px: calc(var(--offset) + (27px - var(--ref)) * var(--default-ratio));
    --28px: calc(var(--offset) + (28px - var(--ref)) * var(--default-ratio));
    --29px: calc(var(--offset) + (29px - var(--ref)) * var(--default-ratio));
    --30px: calc(var(--offset) + (30px - var(--ref)) * var(--default-ratio));
    --31px: calc(var(--offset) + (31px - var(--ref)) * var(--default-ratio));
    --32px: calc(var(--offset) + (32px - var(--ref)) * var(--default-ratio));
    --33px: calc(var(--offset) + (33px - var(--ref)) * var(--default-ratio));
    --34px: calc(var(--offset) + (34px - var(--ref)) * var(--default-ratio));
    --35px: calc(var(--offset) + (35px - var(--ref)) * var(--default-ratio));
    --36px: calc(var(--offset) + (36px - var(--ref)) * var(--default-ratio));
    --37px: calc(var(--offset) + (37px - var(--ref)) * var(--default-ratio));
    --38px: calc(var(--offset) + (38px - var(--ref)) * var(--default-ratio));
    --39px: calc(var(--offset) + (39px - var(--ref)) * var(--default-ratio));
    --40px: calc(var(--offset) + (40px - var(--ref)) * var(--default-ratio));
    --41px: calc(var(--offset) + (41px - var(--ref)) * var(--default-ratio));
    --42px: calc(var(--offset) + (42px - var(--ref)) * var(--default-ratio));
    --43px: calc(var(--offset) + (43px - var(--ref)) * var(--default-ratio));
    --44px: calc(var(--offset) + (44px - var(--ref)) * var(--default-ratio));
    --45px: calc(var(--offset) + (45px - var(--ref)) * var(--default-ratio));
    --46px: calc(var(--offset) + (46px - var(--ref)) * var(--default-ratio));
    --47px: calc(var(--offset) + (47px - var(--ref)) * var(--default-ratio));
    --48px: calc(var(--offset) + (48px - var(--ref)) * var(--default-ratio));
    --49px: calc(var(--offset) + (49px - var(--ref)) * var(--default-ratio));
    --50px: calc(var(--offset) + (50px - var(--ref)) * var(--default-ratio));
    --51px: calc(var(--offset) + (51px - var(--ref)) * var(--default-ratio));
    --52px: calc(var(--offset) + (52px - var(--ref)) * var(--default-ratio));
    --53px: calc(var(--offset) + (53px - var(--ref)) * var(--default-ratio));
    --54px: calc(var(--offset) + (54px - var(--ref)) * var(--default-ratio));
    --55px: calc(var(--offset) + (55px - var(--ref)) * var(--default-ratio));
    --56px: calc(var(--offset) + (56px - var(--ref)) * var(--default-ratio));
    --57px: calc(var(--offset) + (57px - var(--ref)) * var(--default-ratio));
    --58px: calc(var(--offset) + (58px - var(--ref)) * var(--default-ratio));
    --59px: calc(var(--offset) + (59px - var(--ref)) * var(--default-ratio));
    --60px: calc(var(--offset) + (60px - var(--ref)) * var(--default-ratio));
    --61px: calc(var(--offset) + (61px - var(--ref)) * var(--default-ratio));
    --62px: calc(var(--offset) + (62px - var(--ref)) * var(--default-ratio));
    --63px: calc(var(--offset) + (63px - var(--ref)) * var(--default-ratio));
    --64px: calc(var(--offset) + (64px - var(--ref)) * var(--default-ratio));

    --normalize: calc(var(--scale-base, var(--base)) / 16);
}

@media screen and (max-width: 1199px) {
    :root {
        --scale-base-min: 10;
        --scale-base: 15;
        --scale-base-max: 54;
    }
}

@media screen and (max-width: 575px) {
    :root {
        --scale-base-min: 9;
        --scale-base: 14;
        --scale-base-max: 42;
    }
}

html {
    font-size: var(--16px);
}