:root {
    --colors-primary-base: 65;
    --colors-primary-saturation: 100%;
    --colors-primary-lightness: 50%;
    --colors-primary-120: hsl(
        var(--colors-primary-base),
        calc(var(--colors-primary-saturation) - 1%),
        calc(var(--colors-primary-lightness) - 21%)
    );
    --colors-primary-100: hsl(
        var(--colors-primary-base),
        var(--colors-primary-saturation),
        var(--colors-primary-lightness)
    );
    --colors-primary-80: hsl(
        var(--colors-primary-base),
        var(--colors-primary-saturation),
        calc(var(--colors-primary-lightness) + 11%)
    );
    --colors-primary-60: hsl(
        var(--colors-primary-base),
        var(--colors-primary-saturation),
        calc(var(--colors-primary-lightness) + 20%)
    );
    --colors-primary-40: hsl(
        var(--colors-primary-base),
        var(--colors-primary-saturation),
        calc(var(--colors-primary-lightness) + 31%)
    );
    --colors-primary-20: hsl(
        var(--colors-primary-base),
        var(--colors-primary-saturation),
        calc(var(--colors-primary-lightness) + 42%)
    );
    --colors-primary-10: hsl(
        var(--colors-primary-base),
        calc(var(--colors-primary-saturation) - 15%),
        calc(var(--colors-primary-lightness) + 47%)
    );
    --colors-on-primary-base: 267;
    --colors-on-primary-saturation: 64%;
    --colors-on-primary-lightness: 22%;
    --colors-on-primary-100: hsl(
        var(--colors-on-primary-base),
        var(--colors-on-primary-saturation),
        var(--colors-on-primary-lightness)
    );
    --colors-secondary-base: 267;
    --colors-secondary-saturation: 64%;
    --colors-secondary-lightness: 22%;
    --colors-secondary-120: hsl(
        var(--colors-secondary-base),
        var(--colors-secondary-saturation),
        calc(var(--colors-secondary-lightness) - 4%)
    );
    --colors-secondary-100: hsl(
        var(--colors-secondary-base),
        var(--colors-secondary-saturation),
        var(--colors-secondary-lightness)
    );
    --colors-secondary-80: hsl(
        var(--colors-secondary-base),
        var(--colors-secondary-saturation),
        calc(var(--colors-secondary-lightness) + 1%)
    );
    --colors-on-secondary-base: 65;
    --colors-on-secondary-saturation: 100%;
    --colors-on-secondary-lightness: 50%;
    --colors-on-secondary-100: hsl(
        var(--colors-on-secondary-base),
        var(--colors-on-secondary-saturation),
        var(--colors-on-secondary-lightness)
    );
    --colors-accent-base: 65;
    --colors-accent-saturation: 100%;
    --colors-accent-lightness: 50%;
    --colors-accent-100: hsl(
        var(--colors-accent-base),
        var(--colors-accent-saturation),
        var(--colors-accent-lightness)
    );
    --colors-accent-60: hsl(
        var(--colors-accent-base),
        var(--colors-accent-saturation),
        calc(var(--colors-accent-lightness) + 20%)
    );
    --colors-accent-10: hsl(
        var(--colors-accent-base),
        var(--colors-accent-saturation),
        calc(var(--colors-accent-lightness) + 45%)
    );
    --colors-on-accent-base: 267;
    --colors-on-accent-saturation: 64%;
    --colors-on-accent-lightness: 22%;
    --colors-on-accent-100: hsl(
        var(--colors-on-accent-base),
        var(--colors-on-accent-saturation),
        var(--colors-on-accent-lightness)
    );
    --colors-surface-base: 0;
    --colors-surface-saturation: 0%;
    --colors-surface-lightness: 100%;
    --colors-surface-120: hsl(
        var(--colors-surface-base),
        var(--colors-surface-saturation),
        calc(var(--colors-surface-lightness) - 8%)
    );
    --colors-surface-100: hsl(
        var(--colors-surface-base),
        var(--colors-surface-saturation),
        var(--colors-surface-lightness)
    );
    --colors-on-surface-base: 267;
    --colors-on-surface-saturation: 64%;
    --colors-on-surface-lightness: 22%;
    --colors-on-surface-100: hsl(
        var(--colors-on-surface-base),
        var(--colors-on-surface-saturation),
        var(--colors-on-surface-lightness)
    );
    --colors-on-surface-80: hsl(
        var(--colors-on-surface-base),
        calc(var(--colors-on-surface-saturation) - 68%),
        calc(var(--colors-on-surface-lightness) + 17%)
    );
    --colors-on-surface-60: hsl(
        var(--colors-on-surface-base),
        calc(var(--colors-on-surface-saturation) - 85%),
        calc(var(--colors-on-surface-lightness) + 35%)
    );
    --colors-on-surface-40: hsl(
        var(--colors-on-surface-base),
        calc(var(--colors-on-surface-saturation) - 87%),
        calc(var(--colors-on-surface-lightness) + 53%)
    );
    --colors-on-surface-20: hsl(
        var(--colors-on-surface-base),
        calc(var(--colors-on-surface-saturation) - 87%),
        calc(var(--colors-on-surface-lightness) + 70%)
    );
    --colors-on-surface-10: hsl(
        var(--colors-on-surface-base),
        calc(var(--colors-on-surface-saturation) - 87%),
        calc(var(--colors-on-surface-lightness) + 77%)
    );
    --colors-background-base: 0;
    --colors-background-saturation: 0%;
    --colors-background-lightness: 96%;
    --colors-background-120: hsl(
        var(--colors-background-base),
        var(--colors-background-saturation),
        calc(var(--colors-background-lightness) - 4%)
    );
    --colors-background-100: hsl(
        var(--colors-background-base),
        var(--colors-background-saturation),
        var(--colors-background-lightness)
    );
    --colors-background-80: hsl(
        var(--colors-background-base),
        var(--colors-background-saturation),
        calc(var(--colors-background-lightness) + 1%)
    );
    --colors-on-background-base: 267;
    --colors-on-background-saturation: 64%;
    --colors-on-background-lightness: 22%;
    --colors-on-background-100: hsl(
        var(--colors-on-background-base),
        var(--colors-on-background-saturation),
        var(--colors-on-background-lightness)
    );
    --colors-on-background-80: hsl(
        var(--colors-on-background-base),
        calc(var(--colors-on-background-saturation) - 68%),
        calc(var(--colors-on-background-lightness) + 17%)
    );
    --colors-on-background-60: hsl(
        var(--colors-on-background-base),
        calc(var(--colors-on-background-saturation) - 85%),
        calc(var(--colors-on-background-lightness) + 35%)
    );
    --colors-on-background-40: hsl(
        var(--colors-on-background-base),
        calc(var(--colors-on-background-saturation) - 87%),
        calc(var(--colors-on-background-lightness) + 53%)
    );
    --colors-on-background-20: hsl(
        var(--colors-on-background-base),
        calc(var(--colors-on-background-saturation) - 87%),
        calc(var(--colors-on-background-lightness) + 70%)
    );
    --colors-on-background-10: hsl(
        var(--colors-on-background-base),
        calc(var(--colors-on-background-saturation) - 87%),
        calc(var(--colors-on-background-lightness) + 77%)
    );
    --colors-inactive-base: 240;
    --colors-inactive-saturation: 5%;
    --colors-inactive-lightness: 90%;
    --colors-inactive-120: hsl(
        var(--colors-inactive-base),
        var(--colors-inactive-saturation),
        calc(var(--colors-inactive-lightness) - 5%)
    );
    --colors-inactive-100: hsl(
        var(--colors-inactive-base),
        var(--colors-inactive-saturation),
        var(--colors-inactive-lightness)
    );
    --colors-inactive-80: hsl(
        var(--colors-inactive-base),
        calc(var(--colors-inactive-saturation) + 1%),
        calc(var(--colors-inactive-lightness) + 6%)
    );
    --colors-on-inactive-base: 0;
    --colors-on-inactive-saturation: 0%;
    --colors-on-inactive-lightness: 68%;
    --colors-on-inactive-100: hsl(
        var(--colors-on-inactive-base),
        var(--colors-on-inactive-saturation),
        var(--colors-on-inactive-lightness)
    );
    --colors-success-base: 137;
    --colors-success-saturation: 73%;
    --colors-success-lightness: 41%;
    --colors-success-120: hsl(
        var(--colors-success-base),
        calc(var(--colors-success-saturation) + 2%),
        calc(var(--colors-success-lightness) - 3%)
    );
    --colors-success-100: hsl(
        var(--colors-success-base),
        var(--colors-success-saturation),
        var(--colors-success-lightness)
    );
    --colors-success-80: hsl(
        var(--colors-success-base),
        calc(var(--colors-success-saturation) - 20%),
        calc(var(--colors-success-lightness) + 10%)
    );
    --colors-success-60: hsl(
        var(--colors-success-base),
        calc(var(--colors-success-saturation) - 23%),
        calc(var(--colors-success-lightness) + 24%)
    );
    --colors-success-40: hsl(
        var(--colors-success-base),
        calc(var(--colors-success-saturation) - 23%),
        calc(var(--colors-success-lightness) + 35%)
    );
    --colors-success-20: hsl(
        var(--colors-success-base),
        calc(var(--colors-success-saturation) - 23%),
        calc(var(--colors-success-lightness) + 47%)
    );
    --colors-success-10: hsl(
        var(--colors-success-base),
        calc(var(--colors-success-saturation) - 25%),
        calc(var(--colors-success-lightness) + 53%)
    );
    --colors-on-success-base: 0;
    --colors-on-success-saturation: 0%;
    --colors-on-success-lightness: 100%;
    --colors-on-success-100: hsl(
        var(--colors-on-success-base),
        var(--colors-on-success-saturation),
        var(--colors-on-success-lightness)
    );
    --colors-error-base: 0;
    --colors-error-saturation: 0%;
    --colors-error-lightness: 86%;
    --colors-error-120: hsl(
        var(--colors-error-base),
        var(--colors-error-saturation),
        calc(var(--colors-error-lightness) - 5%)
    );
    --colors-error-100: hsl(
        var(--colors-error-base),
        var(--colors-error-saturation),
        var(--colors-error-lightness)
    );
    --colors-error-80: hsl(
        var(--colors-error-base),
        calc(var(--colors-error-saturation) - 42%),
        calc(var(--colors-error-lightness) + 13%)
    );
    --colors-error-60: hsl(
        var(--colors-error-base),
        calc(var(--colors-error-saturation) - 46%),
        calc(var(--colors-error-lightness) + 26%)
    );
    --colors-error-40: hsl(
        var(--colors-error-base),
        calc(var(--colors-error-saturation) - 45%),
        calc(var(--colors-error-lightness) + 39%)
    );
    --colors-error-20: hsl(
        var(--colors-error-base),
        calc(var(--colors-error-saturation) - 45%),
        calc(var(--colors-error-lightness) + 52%)
    );
    --colors-error-10: hsl(
        var(--colors-error-base),
        calc(var(--colors-error-saturation) - 47%),
        calc(var(--colors-error-lightness) + 58%)
    );
    --colors-on-error-base: 270;
    --colors-on-error-saturation: 18%;
    --colors-on-error-lightness: 51%;
    --colors-on-error-100: hsl(
        var(--colors-on-error-base),
        var(--colors-on-error-saturation),
        var(--colors-on-error-lightness)
    );
    --colors-warning-base: 29;
    --colors-warning-saturation: 100%;
    --colors-warning-lightness: 50%;
    --colors-warning-120: hsl(
        var(--colors-warning-base),
        calc(var(--colors-warning-saturation) - 2%),
        calc(var(--colors-warning-lightness) - 2%)
    );
    --colors-warning-100: hsl(
        var(--colors-warning-base),
        var(--colors-warning-saturation),
        var(--colors-warning-lightness)
    );
    --colors-warning-80: hsl(
        var(--colors-warning-base),
        var(--colors-warning-saturation),
        calc(var(--colors-warning-lightness) + 10%)
    );
    --colors-warning-60: hsl(
        var(--colors-warning-base),
        var(--colors-warning-saturation),
        calc(var(--colors-warning-lightness) + 20%)
    );
    --colors-warning-40: hsl(
        var(--colors-warning-base),
        var(--colors-warning-saturation),
        calc(var(--colors-warning-lightness) + 30%)
    );
    --colors-warning-20: hsl(
        var(--colors-warning-base),
        var(--colors-warning-saturation),
        calc(var(--colors-warning-lightness) + 40%)
    );
    --colors-warning-10: hsl(
        var(--colors-warning-base),
        var(--colors-warning-saturation),
        calc(var(--colors-warning-lightness) + 45%)
    );
    --colors-on-warning-base: 0;
    --colors-on-warning-saturation: 0%;
    --colors-on-warning-lightness: 100%;
    --colors-on-warning-100: hsl(
        var(--colors-on-warning-base),
        var(--colors-on-warning-saturation),
        var(--colors-on-warning-lightness)
    );
}