// prettier-ignore
.gooey-root {
  --gooey-theme-a: #00bcd4;
  // --gooey-theme-a-rgb: 0, 188, 212;
  --gooey-dark-a: #0B0B11;
  // --gooey-dark-a-rgb: 11, 11, 17;
  --gooey-dark-b: #1b1d29;
  // --gooey-dark-b-rgb: 27, 29, 41;
  --gooey-dark-c: #46465e;
  // --gooey-dark-c-rgb: 70, 70, 94;
  --gooey-dark-d: #55566a;
  // --gooey-dark-d-rgb: 85, 86, 106;
  --gooey-dark-e: #787b89;
  // --gooey-dark-e-rgb: 120, 123, 137;
  --gooey-light-a: #ffffff;
  // --gooey-light-a-rgb: 255, 255, 255;
  --gooey-light-b: #c9ccd7;
  // --gooey-light-b-rgb: 201, 204, 215;
  --gooey-light-c: #a9adba;
  // --gooey-light-c-rgb: 169, 173, 186;
  --gooey-light-d: #777D8F;
  // --gooey-light-d-rgb: 119, 125, 143;
  --gooey-light-e: #5F6377;
  // --gooey-light-e-rgb: 95, 99, 119;
  --gooey-font-family: 'Fredoka', sans-serif;
  --gooey-font-size: clamp(0.75rem, 3vw, 1.1rem);
  --gooey-shadow-lightness: 0%;
  --gooey-shadow-opacity: 0.2;
  --gooey-shadow-color: hsla(250, 10%, var(--gooey-shadow-lightness), var(--gooey-shadow-opacity));
  --gooey-radius-xs: 0.125rem;
  --gooey-radius-sm: 0.1875rem;
  --gooey-radius: 0.3125rem;
  --gooey-radius-md: 0.4375rem;
  --gooey-filter: none;
  --gooey-opacity: 0.95;
  --gooey-transition-duration: 75ms;
  --gooey-backdrop-filter: blur(10px);
  --gooey-root_width: 24rem;
  --gooey-root_min-width: 25rem;
  --gooey-root_max-width: 35rem;
  --gooey-root_max-height: 90vh;
  --gooey-root_opacity: 0.5;
  --gooey-root_backdrop-filter: blur(0.5rem);
  --gooey-root-header_height: 2rem;
  --gooey-root-header_font-size: clamp(0.9rem, 4vw, 1rem);
  --gooey-header_height: 1.75rem;
  --gooey-header_font-size: clamp(0.9rem, 4vw, 1rem);
  --gooey-folder_background: color-mix(in sRGB, color-mix(in sRGB, var(--gooey-bg-a) 50%, var(--gooey-bg-b)) calc(var(--gooey-opacity) * 100%), transparent);
  --gooey-folder-header_padding-left: 0.25rem;
  --gooey-folder-header_color: var(--gooey-fg-c);
  --gooey-folder-header-dim_color: var(--gooey-fg-d);
  --gooey-folder-header_background: var(--gooey-bg-a);
  --gooey-folder-header_outline: none;
  --gooey-folder-header_box-shadow: none;
  --gooey-folder-header_font-size: var(--gooey-font-size);
  --gooey-folder-header_font-weight: 350;
  --gooey-folder-header_letter-spacing: 0.75px;
  --gooey-folder-content_padding-left: 0.33rem;
  --gooey-folder-content_font-weight: 350;
  --gooey-folder-content_letter-spacing: 0.5px;
  --gooey-toolbar-icon_color: var(--gooey-bg-d);
  --gooey-toolbar-icon-dim_color: var(--gooey-bg-c);
  --gooey-controller_font-family: 'Inconsolata', 'Comic Mono', 'Fira Code', monospace;
  --gooey-controller_font-size: clamp(0.75rem, 3vw, 0.9rem);
  --gooey-controller_border-radius: var(--gooey-radius-sm);
  --gooey-controller_box-shadow: -1px 1px 2px hsla(250, 10%, var(--gooey-shadow-lightness), calc(0.7 * var(--gooey-shadow-opacity))), -1px 2px 5px hsla(250, 10%, var(--gooey-shadow-lightness), var(--gooey-shadow-opacity));
  --gooey-controller_background: var(--gooey-bg-c);
  --gooey-controller_outline: 1px solid color-mix(in sRGB, var(--gooey-bg-d) 40%, transparent);
  --gooey-controller_color: var(--gooey-fg-b);
  --gooey-controller-dim_color: var(--gooey-fg-c);
  --gooey-controller-dim_background: color-mix(in sRGB, color-mix(in sRGB, var(--gooey-bg-c) 75%, var(--gooey-bg-b)) calc(var(--gooey-opacity) * 100%), transparent);
  --gooey-input_height: 2rem;
  --gooey-input-section-1_width: clamp(6rem, 30%, 12rem);
  --gooey-input-section-2_width: 4rem;
  --gooey-input-section-3_width: 100%;
  --gooey-input_font-size: 'clamp(0.75rem, 3vw, 0.9rem)';
  --gooey-input-container_color: var(--gooey-fg-d);
  --gooey-input-container_outline: 1px solid color-mix(in sRGB, var(--gooey-bg-a) 20%, transparent);
  --gooey-input-container_box-shadow: -0.15px 0.1px 1px hsla(220, 10%, 2%, calc(0.8 * var(--gooey-shadow-opacity))) inset, -2px 2px 15px hsla(220, 10%, 2%, calc(0.075 * var(--gooey-shadow-opacity))) inset, -3.0px 3px 25px hsla(220, 10%, 2%, calc(0.05 * var(--gooey-shadow-opacity))) inset, -10.0px 10px 50px hsla(220, 10%, 2%, calc(0.025 * var(--gooey-shadow-opacity))) inset;
  --gooey-input-container_background: color-mix(in sRGB, var(--gooey-bg-a) calc(var(--gooey-opacity) * 100%), transparent);
  --gooey-input-number-range_color: var(--gooey-bg-c);
  --gooey-input-number-range_background: var(--gooey-bg-a);
  --gooey-input-number-range_outline: 1px solid color-mix(in sRGB, var(--gooey-bg-c) 0%, transparent);
}

// prettier-ignore
.gooey-root[mode='dark'] {
  --gooey-theme-a: #00bcd4;
  // --gooey-theme-a-rgb: 0, 188, 212;
  --gooey-dark-a: #0B0B11;
  // --gooey-dark-a-rgb: 11, 11, 17;
  --gooey-dark-b: #1b1d29;
  // --gooey-dark-b-rgb: 27, 29, 41;
  --gooey-dark-c: #46465e;
  // --gooey-dark-c-rgb: 70, 70, 94;
  --gooey-dark-d: #55566a;
  // --gooey-dark-d-rgb: 85, 86, 106;
  --gooey-dark-e: #787b89;
  // --gooey-dark-e-rgb: 120, 123, 137;
  --gooey-light-a: #ffffff;
  // --gooey-light-a-rgb: 255, 255, 255;
  --gooey-light-b: #c9ccd7;
  // --gooey-light-b-rgb: 201, 204, 215;
  --gooey-light-c: #a9adba;
  // --gooey-light-c-rgb: 169, 173, 186;
  --gooey-light-d: #777D8F;
  // --gooey-light-d-rgb: 119, 125, 143;
  --gooey-light-e: #5F6377;
  // --gooey-light-e-rgb: 95, 99, 119;
  --gooey-bg-a: #0B0B11;
  // --gooey-bg-a-rgb: 11, 11, 17;
  --gooey-bg-b: #1b1d29;
  // --gooey-bg-b-rgb: 27, 29, 41;
  --gooey-bg-c: #46465e;
  // --gooey-bg-c-rgb: 70, 70, 94;
  --gooey-bg-d: #55566a;
  // --gooey-bg-d-rgb: 85, 86, 106;
  --gooey-bg-e: #787b89;
  // --gooey-bg-e-rgb: 120, 123, 137;
  --gooey-fg-a: #ffffff;
  // --gooey-fg-a-rgb: 255, 255, 255;
  --gooey-fg-b: #c9ccd7;
  // --gooey-fg-b-rgb: 201, 204, 215;
  --gooey-fg-c: #a9adba;
  // --gooey-fg-c-rgb: 169, 173, 186;
  --gooey-fg-d: #777D8F;
  // --gooey-fg-d-rgb: 119, 125, 143;
  --gooey-fg-e: #5F6377;
  // --gooey-fg-e-rgb: 95, 99, 119;
  --gooey-font-family: 'Fredoka', sans-serif;
  --gooey-font-size: clamp(0.75rem, 3vw, 1.1rem);
  --gooey-shadow-lightness: 0%;
  --gooey-shadow-opacity: 0.2;
  --gooey-shadow-color: hsla(250, 10%, var(--gooey-shadow-lightness), var(--gooey-shadow-opacity));
  --gooey-radius-xs: 0.125rem;
  --gooey-radius-sm: 0.1875rem;
  --gooey-radius: 0.3125rem;
  --gooey-radius-md: 0.4375rem;
  --gooey-filter: none;
  --gooey-opacity: 0.95;
  --gooey-transition-duration: 75ms;
  --gooey-backdrop-filter: blur(10px);
  --gooey-root_width: 30rem;
  --gooey-root_min-width: 25rem;
  --gooey-root_max-width: 35rem;
  --gooey-root_max-height: 90vh;
  --gooey-root_opacity: 0.5;
  --gooey-root_backdrop-filter: blur(0.5rem);
  --gooey-root-header_height: 2rem;
  --gooey-root-header_font-size: clamp(0.9rem, 4vw, 1rem);
  --gooey-header_height: 1.75rem;
  --gooey-header_font-size: clamp(0.9rem, 4vw, 1rem);
  --gooey-folder_background: color-mix(in sRGB, color-mix(in sRGB, var(--gooey-bg-a) 50%, var(--gooey-bg-b)) calc(var(--gooey-opacity) * 100%), transparent);
  --gooey-folder-header_padding-left: 0.25rem;
  --gooey-folder-header_color: var(--gooey-fg-c);
  --gooey-folder-header-dim_color: var(--gooey-fg-d);
  --gooey-folder-header_background: var(--gooey-bg-a);
  --gooey-folder-header_outline: none;
  --gooey-folder-header_box-shadow: none;
  --gooey-folder-header_font-size: var(--gooey-font-size);
  --gooey-folder-header_font-weight: 350;
  --gooey-folder-header_letter-spacing: 0.75px;
  --gooey-folder-content_padding-left: 0.33rem;
  --gooey-folder-content_font-weight: 350;
  --gooey-folder-content_letter-spacing: 0.5px;
  --gooey-toolbar-icon_color: var(--gooey-bg-d);
  --gooey-toolbar-icon-dim_color: var(--gooey-bg-c);
  --gooey-controller_font-family: 'Inconsolata', 'Comic Mono', 'Fira Code', monospace;
  --gooey-controller_font-size: clamp(0.75rem, 3vw, 0.9rem);
  --gooey-controller_border-radius: var(--gooey-radius-sm);
  --gooey-controller_box-shadow: -1px 1px 2px hsla(250, 10%, var(--gooey-shadow-lightness), calc(0.7 * var(--gooey-shadow-opacity))), -1px 2px 5px hsla(250, 10%, var(--gooey-shadow-lightness), var(--gooey-shadow-opacity));
  --gooey-controller_background: var(--gooey-bg-c);
  --gooey-controller_outline: 1px solid color-mix(in sRGB, var(--gooey-bg-d) 40%, transparent);
  --gooey-controller_color: var(--gooey-fg-b);
  --gooey-controller-dim_color: var(--gooey-fg-c);
  --gooey-controller-dim_background: color-mix(in sRGB, color-mix(in sRGB, var(--gooey-bg-c) 75%, var(--gooey-bg-b)) calc(var(--gooey-opacity) * 100%), transparent);
  --gooey-input_height: 2rem;
  --gooey-input-section-1_width: clamp(6rem, 30%, 12rem);
  --gooey-input-section-2_width: 4rem;
  --gooey-input-section-3_width: 100%;
  --gooey-input_font-size: 'clamp(0.75rem, 3vw, 0.9rem)';
  --gooey-input-container_color: var(--gooey-fg-d);
  --gooey-input-container_outline: 1px solid color-mix(in sRGB, var(--gooey-bg-a) 20%, transparent);
  --gooey-input-container_box-shadow: -0.15px 0.1px 1px hsla(220, 10%, 2%, calc(0.8 * var(--gooey-shadow-opacity))) inset, -2px 2px 15px hsla(220, 10%, 2%, calc(0.075 * var(--gooey-shadow-opacity))) inset, -3.0px 3px 25px hsla(220, 10%, 2%, calc(0.05 * var(--gooey-shadow-opacity))) inset, -10.0px 10px 50px hsla(220, 10%, 2%, calc(0.025 * var(--gooey-shadow-opacity))) inset;
  --gooey-input-container_background: color-mix(in sRGB, var(--gooey-bg-a) calc(var(--gooey-opacity) * 100%), transparent);
  --gooey-input-number-range_color: var(--gooey-bg-c);
  --gooey-input-number-range_background: var(--gooey-bg-a);
  --gooey-input-number-range_outline: 1px solid color-mix(in sRGB, var(--gooey-bg-c) 0%, transparent);
}

// prettier-ignore
.gooey-root[mode='light'] {
  --gooey-theme-a: #00bcd4;
  // --gooey-theme-a-rgb: 0, 188, 212;
  --gooey-dark-a: #0B0B11;
  // --gooey-dark-a-rgb: 11, 11, 17;
  --gooey-dark-b: #1b1d29;
  // --gooey-dark-b-rgb: 27, 29, 41;
  --gooey-dark-c: #46465e;
  // --gooey-dark-c-rgb: 70, 70, 94;
  --gooey-dark-d: #55566a;
  // --gooey-dark-d-rgb: 85, 86, 106;
  --gooey-dark-e: #787b89;
  // --gooey-dark-e-rgb: 120, 123, 137;
  --gooey-light-a: #ffffff;
  // --gooey-light-a-rgb: 255, 255, 255;
  --gooey-light-b: #c9ccd7;
  // --gooey-light-b-rgb: 201, 204, 215;
  --gooey-light-c: #a9adba;
  // --gooey-light-c-rgb: 169, 173, 186;
  --gooey-light-d: #777D8F;
  // --gooey-light-d-rgb: 119, 125, 143;
  --gooey-light-e: #5F6377;
  // --gooey-light-e-rgb: 95, 99, 119;
  --gooey-bg-a: #ffffff;
  // --gooey-bg-a-rgb: 255, 255, 255;
  --gooey-bg-b: #c9ccd7;
  // --gooey-bg-b-rgb: 201, 204, 215;
  --gooey-bg-c: #a9adba;
  // --gooey-bg-c-rgb: 169, 173, 186;
  --gooey-bg-d: #777D8F;
  // --gooey-bg-d-rgb: 119, 125, 143;
  --gooey-bg-e: #5F6377;
  // --gooey-bg-e-rgb: 95, 99, 119;
  --gooey-fg-a: #0B0B11;
  // --gooey-fg-a-rgb: 11, 11, 17;
  --gooey-fg-b: #1b1d29;
  // --gooey-fg-b-rgb: 27, 29, 41;
  --gooey-fg-c: #46465e;
  // --gooey-fg-c-rgb: 70, 70, 94;
  --gooey-fg-d: #55566a;
  // --gooey-fg-d-rgb: 85, 86, 106;
  --gooey-fg-e: #787b89;
  // --gooey-fg-e-rgb: 120, 123, 137;
  --gooey-font-family: 'Fredoka', sans-serif;
  --gooey-font-size: clamp(0.75rem, 3vw, 1.1rem);
  --gooey-shadow-lightness: 50%;
  --gooey-shadow-opacity: 0.1;
  --gooey-shadow-color: hsla(250, 10%, var(--gooey-shadow-lightness), var(--gooey-shadow-opacity));
  --gooey-radius-xs: 0.125rem;
  --gooey-radius-sm: 0.1875rem;
  --gooey-radius: 0.3125rem;
  --gooey-radius-md: 0.4375rem;
  --gooey-filter: none;
  --gooey-opacity: 0.95;
  --gooey-transition-duration: 75ms;
  --gooey-backdrop-filter: blur(10px);
  --gooey-root_width: 30rem;
  --gooey-root_min-width: 25rem;
  --gooey-root_max-width: 35rem;
  --gooey-root_max-height: 90vh;
  --gooey-root_opacity: 0.5;
  --gooey-root_backdrop-filter: blur(0.5rem);
  --gooey-root-header_height: 2rem;
  --gooey-root-header_font-size: clamp(0.9rem, 4vw, 1rem);
  --gooey-header_height: 1.75rem;
  --gooey-header_font-size: clamp(0.9rem, 4vw, 1rem);
  --gooey-folder_background: color-mix(in sRGB, color-mix(in sRGB, var(--gooey-bg-a) 50%, var(--gooey-bg-b)) calc(var(--gooey-opacity) * 100%), transparent);
  --gooey-folder-header_padding-left: 0.25rem;
  --gooey-folder-header_color: var(--gooey-fg-c);
  --gooey-folder-header-dim_color: var(--gooey-fg-d);
  --gooey-folder-header_background: var(--gooey-bg-a);
  --gooey-folder-header_outline: none;
  --gooey-folder-header_box-shadow: none;
  --gooey-folder-header_font-size: var(--gooey-font-size);
  --gooey-folder-header_font-weight: 350;
  --gooey-folder-header_letter-spacing: 0.75px;
  --gooey-folder-content_padding-left: 0.33rem;
  --gooey-folder-content_font-weight: 350;
  --gooey-folder-content_letter-spacing: 0.5px;
  --gooey-toolbar-icon_color: var(--gooey-bg-d);
  --gooey-toolbar-icon-dim_color: var(--gooey-bg-c);
  --gooey-controller_font-family: 'Inconsolata', 'Comic Mono', 'Fira Code', monospace;
  --gooey-controller_font-size: clamp(0.75rem, 3vw, 0.9rem);
  --gooey-controller_border-radius: var(--gooey-radius-sm);
  --gooey-controller_box-shadow: -1px 1px 2px hsla(250, 10%, var(--gooey-shadow-lightness), calc(0.7 * var(--gooey-shadow-opacity))), -1px 2px 5px hsla(250, 10%, var(--gooey-shadow-lightness), var(--gooey-shadow-opacity));
  --gooey-controller_background: color-mix(in sRGB, var(--gooey-bg-a) calc(var(--gooey-opacity) * 100%), transparent);
  --gooey-controller_outline: 1px solid color-mix(in sRGB, var(--gooey-bg-d) 10%, transparent);
  --gooey-controller_color: var(--gooey-fg-a);
  --gooey-controller-dim_color: var(--gooey-fg-c);
  --gooey-controller-dim_background: color-mix(in sRGB, var(--gooey-bg-a) calc(var(--gooey-opacity) * 50%), transparent);
  --gooey-input_height: 2rem;
  --gooey-input-section-1_width: clamp(6rem, 30%, 12rem);
  --gooey-input-section-2_width: 4rem;
  --gooey-input-section-3_width: 100%;
  --gooey-input_font-size: 'clamp(0.75rem, 3vw, 0.9rem)';
  --gooey-input-container_color: var(--gooey-fg-d);
  --gooey-input-container_outline: 1px solid color-mix(in sRGB, var(--gooey-bg-a) 20%, transparent);
  --gooey-input-container_box-shadow: -0.15px 0.1px 1px hsla(220, 10%, 2%, calc(0.8 * var(--gooey-shadow-opacity))) inset, -2px 2px 15px hsla(220, 10%, 2%, calc(0.075 * var(--gooey-shadow-opacity))) inset, -3.0px 3px 25px hsla(220, 10%, 2%, calc(0.05 * var(--gooey-shadow-opacity))) inset, -10.0px 10px 50px hsla(220, 10%, 2%, calc(0.025 * var(--gooey-shadow-opacity))) inset;
  --gooey-input-container_background: color-mix(in sRGB, var(--gooey-bg-a) calc(var(--gooey-opacity) * 100%), transparent);
  --gooey-input-number-range_color: var(--gooey-bg-d);
  --gooey-input-number-range_background: var(--gooey-bg-b);
  --gooey-input-number-range_outline: 1px solid color-mix(in sRGB, var(--gooey-bg-c) 0%, transparent);
  --gooey-input-number-range_box-shadow: -2px 2px 2px hsla(230, 20%, 30%, 0.1), 2px 2px 3px hsla(230, 20%, 30%, 0.1), 2px 2px 7px hsla(230, 20%, 30%, 0.1);
}
