html.ins-dark-style {
    --ins-color: hsl(140, 4%, 14%);
}

.ins-dark-style {
    --ins-color-h: 240;
    --ins-color-s: 4%;
    --ins-color-l: 14%;
    --ins-color: hsl(140, 4%, 14%);
    --bgcolor: hsl(140, 4%, 14%);
    --primary-h: 159;
    --primary-s: 85%;
    --primary-l: 43%;
    --primary: hsl(159, 85%, 43%);
    --secondary-h: 222;
    --secondary-s: 82%;
    --secondary-l: 56%;
    --secondary: hsl(222, 82%, 56%);
    --link: hsl(232deg 22% 60%);
    --active-link: hsl(153, 48%, 49%);
    --blue: hsl(226, 34%, 24%);
    --fade-grey: hsl(0, 0%, 93%);
    --text-h: 232;
    --text-s: 14%;
    --text-l: 68%;
    --text: hsl(0deg 0% 100% / 71%);
    --gradient-c1: #000000d9;
    --gradient-c2: #00000094;
    --gradient-c3: #00000000;
}

.ins-dark-style {
    --dark-text: var(--ins-color-50);
    --ant-text: var(--ins-color-80);
    --light-text: var(--ins-color-10);
    --background-grey: var(--ins-color-6);
    --border: var(--ins-color-12);
    --primary-grey: var(--ins-color-4);
    --blockquote-bg: var(--ins-color-10);
    --strong-color: var(--white);
    --blockquote-color: var(--ins-color-2);
    --card-bg: var(--ins-color-6);
    --card-border-color: var(--ins-color-12);
    --input-bg: var(--ins-color-2);
    --button-bg: var(--ins-color-2);
    --input-border-color: var(--ins-color-4);
    --input-color: var(--text);
    --widget-grey-light: var(--ins-color-4);
    --wrapper-bg: var(--ins-color-10);
    --wallpaper-bg: var(--background-grey);
}


/** bgcolors */

.ins-dark-style {
    --opacity-bg: hsl( var(--ins-color-h) var(--ins-color-s) var(--ins-color-l) / 80%);
    --ins-color-2: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 2%));
    --ins-color-4: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 4%));
    --ins-color-5: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 5%));
    --ins-color-6: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 6%));
    --ins-color-10: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 10%));
    --ins-color-12: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 12%));
    --ins-color-15: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 15%));
    --ins-color-20: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 20%));
    --ins-color-25: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 25%));
    --ins-color-30: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 30%));
    --ins-color-40: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 40%));
    --ins-color-50: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 30%));
    --ins-color-60: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 60%));
    --ins-color-70: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 70%));
    --ins-color-80: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 80%));
    --ins-color-90: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 90%));
    --ins-color-100: hsl( var(--ins-color-h), var(--ins-color-s), calc(var(--ins-color-l) + 100%));
}


/**text*/

:root {
    --ins-dark-style-color: hsl(140, 4%, 14%);
    --ins-blue-style-color: hsl(225, 25%, 6%);
    --ins-red-style-color: hsl(0, 25%, 8%);
}

.ins-dark-style {
    --text-dark-20: hsl(var(--text-h), var(--text-s), calc(var(--text-l) - 22%));
}

:root {
    --ins-red-style-color: hsl(0, 25%, 8%);
}

.ins-red-style {
    --ins-color-h: 0;
    --ins-color-s: 25%;
    --ins-color-l: 6%;
    --ins-color: hsl(0, 25%, 8%);
}

:root {
    --ins-orange-style-color: hsl(50, 25%, 8%);
}

.ins-orange-style {
    --ins-color-h: 50;
    --ins-color-s: 25%;
    --ins-color-l: 6%;
    --ins-color: hsl(50, 25%, 8%);
}

:root {
    --ins-green-style-color: hsl(150, 25%, 8%);
}

.ins-green-style {
    --ins-color-h: 150;
    --ins-color-s: 25%;
    --ins-color-l: 6%;
    --ins-color: hsl(150, 25%, 8%);
}

:root {
    --ins-blue-style-color: hsl(225, 25%, 6%);
}

.ins-blue-style {
    --ins-color-h: 225;
    --ins-color-s: 25%;
    --ins-color-l: 6%;
    --ins-color: hsl(225, 25%, 6%);
}

:root {
    --ins-pink-style-color: hsl(300, 25%, 8%);
}

.ins-pink-style {
    --ins-color-h: 300;
    --ins-color-s: 25%;
    --ins-color-l: 6%;
    --ins-color: hsl(300, 25%, 8%);
}