
@media (prefers-color-scheme: light) {
    body:not([theme]) {
        --main-background: hsl(220, 19%, 86%);
        --main-foreground: hsl(0, 0%, 15%);

        --card-background: hsl(197, 25%, 79%);
        --card-foreground: hsl(197, 55%, 7%);
        --card-accent: hsl(197, 46%, 15%);
        --card-progress: hsl(197, 22%, 55%);

        --chip-background: #2A3DA0;
        --chip-foreground: #fafafa;

        --interface-200: #0C1B68;
        --interface-300: #182983;
        --interface-400: #2A3DA0;
        --interface-600: #4555AA;
        --interface-700: #6977C1;
        --loudness-range-stroke: var(--interface-600);

        --momentary-200: #04465F;
        --momentary-300: #0D5A78;
        --momentary-400: #1C7293;
        --momentary-500: #36809C;
        --momentary-600: #5B9DB6;
        --momentary-stroke: var(--momentary-400);

        --short-term-100: #4d2800;
        --short-term-200: #994f00;
        --short-term-300: #bf690d;
        --short-term-400: #EA8B24;
        --short-term-500: #F9A84F;
        --short-term-600: #FFBF79;
        --short-term-700: #ffd3a3;
        --short-term-800: #ffe6cc;
        --short-term-stroke: var(--short-term-100);

        --integrated-100: #59440d;
        --integrated-200: #976C00;
        --integrated-300: #BF8C0D;
        --integrated-400: #EAB124;
        --integrated-500: #F9C84F;
        --integrated-600: #FFD879;
        --integrated-700: #ffe5a3;
        --integrated-800: #ffefc7;
        --integrated-900: #fff8e5;
        --integrated-stroke: var(--integrated-100);

        --true-peak-200: hsl(25, 100%, 30%);
        --true-peak-300: hsl(25, 87%, 40%);
        --true-peak-400: hsl(25, 83%, 53%);
        --true-peak-500: hsl(25, 93%, 64%);
        --true-peak-600: hsl(25, 100%, 71%);
        --true-peak-700: hsl(25, 100%, 82%);
        --true-peak-800: hsl(25, 100%, 90%);
        --true-peak-stroke: var(--true-peak-200);

        --border-radius-section: 0.25rem;
        --border-radius-button: 1000px;

        --button-color-border: var(--interface-100);
        --button-color-outline: var(--interface-300);
        --button-color-background: var(--interface-600);
        --button-color-background-active: var(--interface-300);
        --button-color-text: var(--chip-foreground);

        --opacity-dimmed: 0.75;
    }
}
