@media(prefers-color-scheme: dark) {
  :root {
    /*────────── Color Palette ──────────*/
    color-scheme: dark;
    /* Grayscale */
    --color-d-gray-10: hsla(32, 48%, 85%, 1);
    --color-d-gray-20: hsla(34, 39%, 74%, 1);
    --color-d-gray-30: hsla(34, 31%, 68%, 1);
    --color-d-gray-40: hsla(35, 27%, 55%, 1);
    --color-d-gray-50: hsla(34, 24%, 46%, 1);
    --color-d-gray-60: hsla(33, 27%, 33%, 1);
    --color-d-gray-70: hsla(31, 27%, 25%, 1);
    --color-d-gray-80: hsla(28, 22%, 19%, 1);
    --color-d-gray-90: hsla(33, 20%, 17%, 1);
    --color-d-gray-100: hsla(30, 19%, 15%, 1);
    --color-d-gray-110: hsla(30, 17%, 14%, 1);
    --color-d-gray-120: hsla(29, 16%, 13%, 1);
    --color-d-gray-130: hsla(24, 18%, 11%, 1);
    --color-d-gray-140: hsla(32, 21%, 9%, 1);
    --color-d-alpha-gray: hsla(34, 24%, 40%, 0.2);
    /* Red */
    --color-d-red-10: hsla(5, 94%, 73%, 1);
    --color-d-red-20: hsla(4, 91%, 67%, 1);
    --color-d-red-30: hsla(4, 88%, 61%, 1);
    --color-d-red-40: hsla(2, 75%, 52%, 1);
    --color-d-alpha-red: hsla(350, 84%, 63%, 0.2);
    /* Green */
    --color-d-green-10: hsla(152, 51%, 54%, 1);
    --color-d-green-20: hsla(154, 57%, 42%, 1);
    --color-d-green-30: hsla(155, 78%, 29%, 1);
    --color-d-green-40: hsla(154, 75%, 26%, 1);
    --color-d-alpha-green: hsla(74, 69%, 44%, 0.2);
    /*────────── Window ──────────*/
    /* Scrollbar */
    --scrollbar-bg: transparent;
    --scrollbar-thumb-bg: var(--background-modifier-border);
    --scrollbar-active-thumb-bg: var(--background-modifier-border-hover);
    /*────────── Foundations ──────────*/
    /* Background */
    --background-primary: var(--color-d-gray-100);
    --background-primary-alt: var(--color-d-gray-110);
    --background-secondary: var(--color-d-gray-120);
    --background-secondary-alt: var(--color-d-gray-120);
    --background-modifier-hover: rgba(0, 0, 0, 0.3);
    --background-modifier-active-hover: var(--color-d-gray-70);
    --background-modifier-border: var(--color-d-gray-80);
    --background-modifier-border-hover: color-mix(in srgb, var(--color-d-gray-70) 40%, var(--color-d-gray-80));
    --background-modifier-border-focus: color-mix(in srgb, var(--color-d-gray-70) 40%, var(--color-d-gray-80));
    --background-modifier-box-shadow: rgba(0, 0, 0, 0.3);
    /* Text Color */
    --text-normal: var(--color-d-gray-20);
    --text-muted: var(--color-d-gray-40);
    --text-faint: var(--color-d-gray-50);
    --text-selection: var(--color-d-alpha-gray);
    /* Icon Colors */
    --icon-color: color-mix(in srgb, var(--color-d-gray-60) 30%, var(--color-d-gray-50));
    --icon-opacity: 1;
    --icon-bg: transparent;
    --icon-color-hover: color-mix(in srgb, var(--color-d-gray-50) 70%, var(--color-d-gray-40));
    --icon-opacity-hover: 1;
    --icon-bg-hover: transparent;
    --icon-color-focused: var(--color-d-gray-50);
    --icon-bg-pressed: transparent;
    --icon-color-active: var(--color-d-gray-40);
    --icon-opacity-active: 1;
    --icon-bg-active: var(--color-d-gray-80);
    --icon-bg-active-menu: transparent;
    /*────────── Components ──────────*/
    /* Button */
    --button-inset-shadow-size: 2px;
    --button-shadow: var(--input-shadow);
    --button-shadow-hover: var(--input-shadow-hover);
    --button-shadow-active: var(--input-shadow-active);
    --button-shadow-focus: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.05),
                            inset 0px 0px 0px 1px rgba(0, 0, 0, 0.3),
                            inset 0px calc(-1 * var(--button-inset-shadow-size)) 0px 2px rgba(0, 0, 0, 0.24),
                            inset 0px -2px 4px 0px rgba(0, 0, 0, 0.25),
                            0px 4px 4px -5.6px rgba(0, 0, 0, 0.55),
                            0px 2px 4px -2.7px rgba(0, 0, 0, 0.3),
                            0px 2px 6px -1px rgba(0, 0, 0, 0.25),
                            0px 0px 0px 3px var(--color-d-alpha-gray);
    --button-accent-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.1),
                            inset 0px 0px 0px 1px rgba(0, 0, 0, 0.3),
                            inset 0px calc(-1 * var(--button-inset-shadow-size)) 0px 2px rgba(0, 0, 0, 0.26),
                            inset 0px -2px 4px 0px rgba(0, 0, 0, 0.35),
                            0px 4px 4px -5.6px rgba(0, 0, 0, 0.37),
                            0px 2px 4px -2.7px rgba(0, 0, 0, 0.27),
                            0px 2px 4px -1px rgba(0, 0, 0, 0.14);
    --button-accent-shadow-hover: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.15),
                                    inset 0px 0px 0px 1px rgba(0, 0, 0, 0.34),
                                    inset 0px calc(-1 * var(--button-inset-shadow-size)) 0px 2px rgba(0, 0, 0, 0.26),
                                    inset 0px -2px 4px 0px rgba(0, 0, 0, 0.35),
                                    0px 4px 4px -5.6px rgba(0, 0, 0, 0.37),
                                    0px 2px 4px -2.7px rgba(0, 0, 0, 0.3),
                                    0px 2px 6px -1px rgba(0, 0, 0, 0.19);
    --button-accent-shadow-active: var(--input-shadow-active);
    --button-accent-shadow-focus: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.12),
                                    inset 0px 0px 0px 1px rgba(0, 0, 0, 0.28),
                                    inset 0px calc(-1 * var(--button-inset-shadow-size)) 0px 2px rgba(0, 0, 0, 0.11),
                                    inset 0px -2px 4px 0px rgba(0, 0, 0, 0.2),
                                    0px 4px 4px -5.6px rgba(0, 0, 0, 0.52),
                                    0px 2px 4px -2.7px rgba(0, 0, 0, 0.27),
                                    0px 2px 6px -1px rgba(0, 0, 0, 0.24),
                                    0px 0px 0px 3px var(--color-d-alpha-gray);
    /* Prompt */
    --prompt-input-background: var(--background-primary);
    --prompt-results-background: var(--background-primary);
    --prompt-suggestion-color: var(--color-d-gray-40);
    --prompt-suggestion-highlight-color: color-mix(in srgb, var(--prompt-suggestion-color) 70%, white);
    --prompt-suggestion-color-selected: var(--color-d-gray-20);
    --prompt-suggestion-highlight-color-selected: var(--color-d-gray-20);
    --prompt-suggestion-background-selected: rgba(0, 0, 0, 0.1);
    --prompt-suggestion-shadow-selected: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.14),
    0px 2px 6px 0px rgba(0, 0, 0, 0.12);
    --prompt-instructions-background: color-mix(in hsl, var(--editor-bg-color) 60%, var(--background-secondary));
    --prompt-separator-border: 1px solid var(--color-d-gray-90);
    --prompt-border-color: var(--background-modifier-border-focus);
    /* Text Input */
    --background-modifier-form-field: var(--color-d-gray-130);
    --input-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.02),
                    inset 0px 0px 0px 1px rgba(0, 0, 0, 0.25),
                    inset 0px calc(-1 * var(--button-inset-shadow-size)) 0px 2px rgba(0, 0, 0, 0.2),
                    inset 0px -2px 4px 0px rgba(0, 0, 0, 0.25),
                    0px 4px 4px -5.6px rgba(0, 0, 0, 0.55),
                    0px 2px 4px -2.7px rgba(0, 0, 0, 0.25),
                    0px 2px 4px -1px rgba(0, 0, 0, 0.2);
    --input-shadow-hover: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.06),
                            inset 0px 0px 0px 1px rgba(0, 0, 0, 0.3),
                            inset 0px calc(-1 * var(--button-inset-shadow-size)) 0px 2px rgba(0, 0, 0, 0.2),
                            inset 0px -2px 4px 0px rgba(0, 0, 0, 0.25),
                            0px 4px 4px -5.6px rgba(0, 0, 0, 0.55),
                            0px 2px 4px -2.7px rgba(0, 0, 0, 0.3),
                            0px 2px 6px -1px rgba(0, 0, 0, 0.25);
    --input-shadow-active: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.45),
                            inset 0px 0px 0px calc(1px + var(--button-inset-shadow-size)) rgba(0, 0, 0, 0.15),
                            inset 0px 2px 8px 0px rgba(0, 0, 0, 0.57),
                            0px 0px 0px 1px rgba(255, 255, 255, 0.02);
    --text-input-color: var(--color-d-gray-20);
    --text-input-color-focused: var(--color-d-gray-20);
    --text-input-bg-active: var(--color-d-gray-140);
    --text-input-border-color: var(--color-d-gray-140);
    --text-input-shadow-active: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.03),
                                inset 0px -1px 0px 0px rgba(0, 0, 0, 0.39),
                                0px 1px 6px 0px rgba(0, 0, 0, 0.37);
    /* Emphasis */
    --underline-color: var(--text-normal);
    --underline-decoration-color: color-mix(in srgb, currentColor var(--link-decoration-opacity), transparent);
  }
}