*, ::before, ::after{
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:  ;
    --tw-pan-y:  ;
    --tw-pinch-zoom:  ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:  ;
    --tw-gradient-via-position:  ;
    --tw-gradient-to-position:  ;
    --tw-ordinal:  ;
    --tw-slashed-zero:  ;
    --tw-numeric-figure:  ;
    --tw-numeric-spacing:  ;
    --tw-numeric-fraction:  ;
    --tw-ring-inset:  ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:  ;
    --tw-brightness:  ;
    --tw-contrast:  ;
    --tw-grayscale:  ;
    --tw-hue-rotate:  ;
    --tw-invert:  ;
    --tw-saturate:  ;
    --tw-sepia:  ;
    --tw-drop-shadow:  ;
    --tw-backdrop-blur:  ;
    --tw-backdrop-brightness:  ;
    --tw-backdrop-contrast:  ;
    --tw-backdrop-grayscale:  ;
    --tw-backdrop-hue-rotate:  ;
    --tw-backdrop-invert:  ;
    --tw-backdrop-opacity:  ;
    --tw-backdrop-saturate:  ;
    --tw-backdrop-sepia:  ;
    --tw-contain-size:  ;
    --tw-contain-layout:  ;
    --tw-contain-paint:  ;
    --tw-contain-style:  ;
}

::backdrop{
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:  ;
    --tw-pan-y:  ;
    --tw-pinch-zoom:  ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:  ;
    --tw-gradient-via-position:  ;
    --tw-gradient-to-position:  ;
    --tw-ordinal:  ;
    --tw-slashed-zero:  ;
    --tw-numeric-figure:  ;
    --tw-numeric-spacing:  ;
    --tw-numeric-fraction:  ;
    --tw-ring-inset:  ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:  ;
    --tw-brightness:  ;
    --tw-contrast:  ;
    --tw-grayscale:  ;
    --tw-hue-rotate:  ;
    --tw-invert:  ;
    --tw-saturate:  ;
    --tw-sepia:  ;
    --tw-drop-shadow:  ;
    --tw-backdrop-blur:  ;
    --tw-backdrop-brightness:  ;
    --tw-backdrop-contrast:  ;
    --tw-backdrop-grayscale:  ;
    --tw-backdrop-hue-rotate:  ;
    --tw-backdrop-invert:  ;
    --tw-backdrop-opacity:  ;
    --tw-backdrop-saturate:  ;
    --tw-backdrop-sepia:  ;
    --tw-contain-size:  ;
    --tw-contain-layout:  ;
    --tw-contain-paint:  ;
    --tw-contain-style:  ;
}

    [class^="btn"]:disabled {
        /* This needs to be important to override any previous fade-in animations */
        opacity: 0.5 !important;
        cursor: not-allowed;
    }

/* 2E8C70 */

/* #FFD38F */

/* #F0F3F9 */

/* #9D8DF7 */

/* #A9A6BD */

/* This line is used as a flag for post-processing */

/* Do not change it!! */

.exercism-delete-before-this {
    color: red;
}

/* @import "./ui-kit/borders"; */

/* @import "./ui-kit/colors"; */

/* @import "./ui-kit/effects"; */

/* @import "./ui-kit/inputs"; */

/* @import "./ui-kit/shapes"; */

/* @import "./ui-kit/label"; */

/* @import "./ui-kit/tracks"; */

/* @import "./ui-kit/filters"; */

/* @import "./ui-kit/scroll"; */

#page-insiders{
    --tw-bg-opacity: 1;
    background-color: rgb(40 35 57 / var(--tw-bg-opacity, 1));
    color: #cbc9d9;
}

#page-insiders h1,
    #page-insiders h2,
    #page-insiders h3,
    #page-insiders h4,
    #page-insiders h5,
    #page-insiders h6 {
        color: #f0f3f9;
    }

#page-insiders .light-green-prompt{
    margin-left: auto;
    margin-right: auto;
    display: block;
    max-width: 610px;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
    border-radius: 8px;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(89 210 174 / var(--tw-border-opacity, 1));
    font-size: 18px;
    font-weight: 500;
    line-height: 150%;
        background-color: rgba(89,210,174, 0.16);
}

.btn-i-filled#page-insiders .get-insiders-link {
            box-shadow: 0px 4px 7px rgba(var(--shadowColorMain), 0.4);
        }

.btn-i-filled#page-insiders .get-insiders-link:hover {
                box-shadow: 0px 4px 7px rgba(var(--shadowColorMain), 0.6);
            }

#page-insiders .get-insiders-link.btn-xs {
            box-shadow: 0px 2px 4px rgba(var(--shadowColorMain), 0.2);
        }

#page-insiders .get-insiders-link.btn-xs:hover {
                box-shadow: 0px 2px 4px rgba(var(--shadowColorMain), 0.4);
            }

#page-insiders .get-insiders-link.btn-s {
            box-shadow: 0px 3px 5px rgba(var(--shadowColorMain), 0.3);
        }

#page-insiders .get-insiders-link.btn-s:hover {
                box-shadow: 0px 3px 5px rgba(var(--shadowColorMain), 0.5);
            }

#page-insiders .get-insiders-link.btn-m {
            box-shadow: 0px 4px 6px rgba(var(--shadowColorMain), 0.4);
        }

#page-insiders .get-insiders-link.btn-m:hover {
                box-shadow: 0px 4px 6px rgba(var(--shadowColorMain), 0.6);
            }

#page-insiders .get-insiders-link.btn-l {
            box-shadow: 0px 4px 7px rgba(var(--shadowColorMain), 0.4);
        }

#page-insiders .get-insiders-link.btn-l:hover {
                box-shadow: 0px 4px 7px rgba(var(--shadowColorMain), 0.6);
            }

#page-insiders .get-insiders-link{
    --tw-bg-opacity: 1;
    background-color: rgb(96 79 205 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(19 11 67 / var(--tw-border-opacity, 1));
}

#page-insiders .get-insiders-link .c-icon {
            filter: var(--white-filter);
        }

#page-insiders .get-insiders-link:not(:disabled):not(.--disabled):hover{
    --tw-bg-opacity: 1;
    background-color: rgb(59 42 147 / var(--tw-bg-opacity, 1));
}

.btn-enhanced:not(:disabled):not(.--disabled):hover#page-insiders .get-insiders-link {
                background: rgb(96, 79, 205, 0.05);
                box-shadow: 0px 4px 8px rgba(var(--shadowColorMain), 0.6);
            }

.btn-slightly-enhanced:not(:disabled):not(.--disabled):hover#page-insiders .get-insiders-link {
                background: rgb(96, 79, 205, 0.05);
                box-shadow: 0px 4px 8px rgba(var(--shadowColorMain), 0.3);
            }

#page-insiders .get-insiders-link{
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    white-space: nowrap;

        transition: background-color 0.1s ease-in;
}

#page-insiders .get-insiders-link > .c-icon:first-child{
    margin-right: 12px;
}

#page-insiders .get-insiders-link > .c-icon:last-child{
    margin-left: 12px;
}

#page-insiders .get-insiders-link > .kb-shortcut{
    font-family: Source Code Pro, monospace;
    font-weight: 700;
    margin-left: 8px;
            line-height: 1;
}

#page-insiders .get-insiders-link {
        height: 56px;
        border-radius: 8px;
        padding-left: 24px;
        padding-right: 24px;
        font-size: 18px;
    }

#page-insiders .get-insiders-link > .c-icon {
            height: 20px;
            width: 20px;
        }

#page-insiders .get-insiders-link > .kb-shortcut{
    font-size: 15px;
}

#page-insiders .get-insiders-link{
    cursor: pointer;
        box-shadow: 0px 2px 4px rgba(var(--shadowColorMain), 0.4);
}

#page-insiders .launching{
    font-size: 18px;
    font-weight: 600;
    line-height: 150%;
    color: var(--textColor1);
    margin-right: auto;
    margin-bottom: 24px;
    display: inline-block;
    --tw-bg-opacity: 1;
    background-color: rgb(247 176 0 / var(--tw-bg-opacity, 1));
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 16px;
    padding-right: 16px;
    --tw-text-opacity: 1;
    color: rgb(19 11 67 / var(--tw-text-opacity, 1));
    --tw-shadow: 8px 8px 0px #211E28;
    --tw-shadow-colored: 8px 8px 0px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#page-insiders .features{
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 24px;
    padding-bottom: 20px;
}

@media (min-width: 1024px){

    #page-insiders .features{
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

#page-insiders .features .feature .c-icon {
                height: 45px;
                width: 45px;
                position: relative;
                margin-bottom: 12px;
            }

#page-insiders .features .feature{
            box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.15);
            border-radius: 16px;
            --tw-bg-opacity: 1;
            background-color: rgb(48 43 66 / var(--tw-bg-opacity, 1));
            padding-top: 20px;
            padding-bottom: 20px;
            padding-left: 24px;
            padding-right: 24px;
            display: flex;
            flex-direction: column;
}

#page-insiders .features .feature h4{
    font-size: 20px;
    font-weight: 600;
    line-height: 140%;
    color: var(--textColor1);
    margin-bottom: 8px;
    --tw-text-opacity: 1;
    color: rgb(240 243 249 / var(--tw-text-opacity, 1));
}

#page-insiders .features .feature p{
    line-height: 160%;
}

#page-insiders .features .feature p a:not(.btn-primary) {
            color: var(--c-prominent-link-color);
            font-weight: 500;
        }

#page-insiders .features .feature p strong{
    font-weight: 500;
    color: var(--textColor2);
}

#page-insiders .features .feature p{
    font-size: 16px;
    text-align: left;
}

#page-insiders .features .feature p a{
    --tw-text-opacity: 1;
    color: rgb(255 211 143 / var(--tw-text-opacity, 1));
}

#page-insiders .c-progress{
    position: relative;
}

#page-insiders .c-progress .target-icon {
            right: 0px;
        }

#page-insiders .c-progress .current-icon{
    --tw-bg-opacity: 1;
    background-color: rgb(158 0 255 / var(--tw-bg-opacity, 1));
    position: absolute;
            height: 34px;
            width: 34px;
            box-shadow: 0px 4px 24px 0px #9c822666;
            display: grid;
            place-items: center;
            border-radius: 100%;
}

#page-insiders .c-progress .target-icon{
    position: absolute;
            height: 48px;
            width: 48px;
            background: linear-gradient(
                    180deg,
                    rgba(255, 255, 255, 0.5) 0%,
                    rgba(255, 255, 255, 0) 100%
                ),
                linear-gradient(0deg, #fff4e3, #fff4e3);
            box-shadow: 0px 4px 24px 0px #9c822666;
            display: grid;
            place-items: center;
            border-radius: 100%;
}

#page-insiders .c-progress .target-icon .c-icon {
                height: 40px;
                width: 40px;
                padding-left: 7px;
            }

#page-insiders .c-progress .actual-number {
            position: absolute;
            bottom: -65px;
            border-radius: 8px;
            --tw-bg-opacity: 1;
            background-color: rgb(158 0 255 / var(--tw-bg-opacity, 1));
            padding-top: 6px;
            padding-bottom: 6px;
            padding-left: 12px;
            padding-right: 12px;
            font-size: 16px;
            font-weight: 500;
            line-height: 150%;
            --tw-text-opacity: 1;
            color: rgb(255 255 255 / var(--tw-text-opacity, 1));
        }

#page-insiders .c-progress .actual-number:before {
                content: "";
                background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDIyIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMS4zMzY5IDBMMjEuOTAwNCA3LjVIMC43NzMzNDdMMTEuMzM2OSAwWiIgZmlsbD0iIzlFMDBGRiIvPgo8L3N2Zz4K");
                background-repeat: no-repeat;
                background-size: contain;
                position: absolute;
                top: -8px;
                right: 58px;
                height: 10px;
                width: 25px;
            }

#page-insiders .c-progress .goal {
            position: absolute;
            bottom: -65px;
            right: -15px;
            border-radius: 8px;
            --tw-bg-opacity: 1;
            background-color: rgb(255 211 143 / var(--tw-bg-opacity, 1));
            padding-top: 6px;
            padding-bottom: 6px;
            padding-left: 12px;
            padding-right: 12px;
            font-size: 16px;
            font-weight: 500;
            line-height: 150%;
            color: var(--textColor1-no-dark);
        }

#page-insiders .c-progress .goal:before {
                content: "";
                background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDIyIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMS4zMzY5IDBMMjEuOTAwNCA3LjVIMC43NzMzNDdMMTEuMzM2OSAwWiIgZmlsbD0iI0ZGRDM4RiIvPgo8L3N2Zz4K");
                background-repeat: no-repeat;
                background-size: contain;
                position: absolute;
                top: -8px;
                right: 30px;
                height: 10px;
                width: 25px;
            }

#page-insiders .faqs a{
    font-weight: 600;
    --tw-text-opacity: 1;
    color: rgb(225 235 255 / var(--tw-text-opacity, 1));
    text-decoration-line: underline;
}

#page-insiders .faqs p,
        #page-insiders .faqs ul{
    text-align: left !important;
}

#page-insiders .faqs ul{
    margin-left: 20px;
    list-style-type: disc;
}

#page-insiders details{
    cursor: pointer;
}

#page-insiders details[open] summary{
    margin-bottom: 8px;
}

#page-insiders details[open] summary::after {
                    transform: rotate(-180deg);
                }

#page-insiders details{
    border-radius: 16px;
    --tw-bg-opacity: 1;
    background-color: rgb(48 43 66 / var(--tw-bg-opacity, 1));
    padding-top: 16px;
    padding-bottom: 16px;
    padding-left: 32px;
    padding-right: 32px;
    font-size: 18px;
    font-weight: 400;
    line-height: 150%;
}

#page-insiders details summary{
    display: flex;
    align-items: center;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
            outline: none;
            list-style: none;
            font-size: 24px;
            font-weight: 600;
            line-height: 130%;
            color: var(--textColor1);
}

#page-insiders details summary::-webkit-details-marker {
                display: none;
            }

#page-insiders details summary::after {
                content: url("/assets/icons/chevron-down-circle-f020c2ec8e21346a5c7d9041a3db979a72da3c37.svg");
                height: 32px;
                width: 32px;
                margin-left: auto;
                transform: rotate(0deg);
                transition: transform 0.2s ease-in-out;
            }

#page-insiders details summary + *{
    padding-top: 10px;
}

#page-insiders .gradient-container {
        background: linear-gradient(
            180deg,
            #221e31 0%,
            rgba(34, 30, 49, 0) 100%
        );
    }
