:root {
    color-scheme: light;
    --sgo-color-brand-950: #083d44;
    --sgo-color-brand-900: #07535d;
    --sgo-color-brand-800: #086b77;
    --sgo-color-brand-700: #087f8c;
    --sgo-color-brand-solid: #087f8c;
    --sgo-color-brand-solid-hover: #07535d;
    --sgo-color-brand-dark-text: #58c4cc;
    --sgo-color-brand-100: color-mix(in srgb, var(--sgo-color-brand-700) 20%, var(--sgo-color-surface));
    --sgo-color-brand-50: color-mix(in srgb, var(--sgo-color-brand-700) 9%, var(--sgo-color-surface));
    --sgo-color-on-brand: #ffffff;
    --sgo-color-on-solid: #ffffff;
    --sgo-color-ink-950: #182329;
    --sgo-color-ink-900: #26343b;
    --sgo-color-ink-800: #34444c;
    --sgo-color-ink-700: #4a5c65;
    --sgo-color-ink-600: #61727a;
    --sgo-color-ink-500: #78878e;
    --sgo-color-line: #dce3e6;
    --sgo-color-line-strong: #c7d1d5;
    --sgo-color-canvas: #f4f7f8;
    --sgo-color-surface: #ffffff;
    --sgo-color-surface-muted: #f8fafb;
    --sgo-color-surface-raised: #ffffff;
    --sgo-color-input: #ffffff;
    --sgo-color-readonly: #f3f6f7;
    --sgo-color-success: #18734f;
    --sgo-color-warning: #9a6700;
    --sgo-color-favorite: #f4b400;
    --sgo-color-danger: #b42318;
    --sgo-color-info: #176b87;
    --sgo-color-success-tint: #f0f8f4;
    --sgo-color-warning-tint: #fff5df;
    --sgo-color-danger-tint: #fbeceb;
    --sgo-color-info-tint: #edf7fa;
    --sgo-color-secondary-solid: #596970;
    --sgo-color-secondary-solid-hover: #405057;
    --sgo-color-success-solid: #18734f;
    --sgo-color-success-solid-hover: #10583b;
    --sgo-color-warning-solid: #8a5a00;
    --sgo-color-warning-solid-hover: #684300;
    --sgo-color-danger-solid: #b42318;
    --sgo-color-danger-solid-hover: #8f1c13;
    --sgo-color-info-solid: #176b87;
    --sgo-color-info-solid-hover: #10536a;
    --sgo-color-on-semantic-solid: #ffffff;
    --sgo-color-overlay: rgba(15, 23, 42, .52);
    --sgo-color-focus-ring: color-mix(in srgb, var(--sgo-color-brand-700) 28%, transparent);
    --sgo-shadow-sm: 0 1px 2px rgba(24, 35, 41, .06);
    --sgo-shadow-md: 0 8px 28px rgba(24, 35, 41, .1);
    --sgo-shadow-lg: 0 20px 60px rgba(24, 35, 41, .18);
    --sgo-color-border: var(--sgo-color-line);
    --sgo-color-text-muted: var(--sgo-color-ink-600);
    --sgo-radius-sm: 4px;
    --sgo-radius-md: 8px;
    --sgo-radius-lg: 12px;
    --sgo-radius-chip: var(--sgo-radius-sm);
    --sgo-space-1: 4px;
    --sgo-space-2: 8px;
    --sgo-space-3: 12px;
    --sgo-space-4: 16px;
    --sgo-space-5: 20px;
    --sgo-space-6: 24px;
    --sgo-space-8: 32px;
    --sgo-space-10: 40px;
    --sgo-density-panel-gap: 16px;
    --sgo-density-panel-padding-y: 16px;
    --sgo-density-row-gap: 14px;
    --sgo-density-label-gap: 5px;
    --sgo-density-modal-padding: 18px;
    --sgo-font-sans: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --sgo-sidebar-width: 288px;
    --sgo-sidebar-collapsed-width: 72px;
    --sgo-topbar-height: 64px;
    --sgo-viewport-height: 100vh;
    --sgo-content-max-width: none;
    --sgo-transition-fast: 160ms ease;
}

:root[data-sgo-density="compact"],
:root[data-sgo-density="super-compact"] {
    --sgo-space-1: 3px;
    --sgo-space-2: 6px;
    --sgo-space-3: 8px;
    --sgo-space-4: 12px;
    --sgo-space-5: 14px;
    --sgo-space-6: 18px;
    --sgo-space-8: 24px;
    --sgo-space-10: 32px;
    --sgo-density-panel-gap: 10px;
    --sgo-density-panel-padding-y: 11px;
    --sgo-density-row-gap: 9px;
    --sgo-density-label-gap: 3px;
    --sgo-density-modal-padding: 12px;
}

:root[data-sgo-accent="cyan"] {
    --sgo-color-brand-950: #103942;
    --sgo-color-brand-900: #0b4e5d;
    --sgo-color-brand-800: #096477;
    --sgo-color-brand-700: #0b7189;
    --sgo-color-brand-solid: #0b7189;
    --sgo-color-brand-solid-hover: #0b4e5d;
    --sgo-color-brand-dark-text: #68bfd2;
}

:root[data-sgo-accent="blue"] {
    --sgo-color-brand-950: #172f55;
    --sgo-color-brand-900: #174276;
    --sgo-color-brand-800: #175a9d;
    --sgo-color-brand-700: #176fc1;
    --sgo-color-brand-solid: #176fc1;
    --sgo-color-brand-solid-hover: #174276;
    --sgo-color-brand-dark-text: #72afea;
}

:root[data-sgo-accent="indigo"] {
    --sgo-color-brand-950: #292553;
    --sgo-color-brand-900: #373276;
    --sgo-color-brand-800: #4742a0;
    --sgo-color-brand-700: #5753bd;
    --sgo-color-brand-solid: #5753bd;
    --sgo-color-brand-solid-hover: #373276;
    --sgo-color-brand-dark-text: #a09cf0;
}

:root[data-sgo-accent="violet"] {
    --sgo-color-brand-950: #40204f;
    --sgo-color-brand-900: #592d70;
    --sgo-color-brand-800: #753d91;
    --sgo-color-brand-700: #8b4cad;
    --sgo-color-brand-solid: #8b4cad;
    --sgo-color-brand-solid-hover: #592d70;
    --sgo-color-brand-dark-text: #c691df;
}

:root[data-sgo-accent="rose"] {
    --sgo-color-brand-950: #481d31;
    --sgo-color-brand-900: #672642;
    --sgo-color-brand-800: #873155;
    --sgo-color-brand-700: #a23d6f;
    --sgo-color-brand-solid: #a23d6f;
    --sgo-color-brand-solid-hover: #672642;
    --sgo-color-brand-dark-text: #e48eb2;
}

:root[data-sgo-accent="red"] {
    --sgo-color-brand-950: #4c1d19;
    --sgo-color-brand-900: #702821;
    --sgo-color-brand-800: #94342c;
    --sgo-color-brand-700: #b13a32;
    --sgo-color-brand-solid: #b13a32;
    --sgo-color-brand-solid-hover: #702821;
    --sgo-color-brand-dark-text: #ef8d85;
}

:root[data-sgo-accent="orange"] {
    --sgo-color-brand-950: #512b16;
    --sgo-color-brand-900: #733c1c;
    --sgo-color-brand-800: #995022;
    --sgo-color-brand-700: #a95120;
    --sgo-color-brand-solid: #a95120;
    --sgo-color-brand-solid-hover: #733c1c;
    --sgo-color-brand-dark-text: #e9a06d;
}

:root[data-sgo-accent="amber"] {
    --sgo-color-brand-950: #442d08;
    --sgo-color-brand-900: #614008;
    --sgo-color-brand-800: #7b5105;
    --sgo-color-brand-700: #8a5a00;
    --sgo-color-brand-solid: #8a5a00;
    --sgo-color-brand-solid-hover: #614008;
    --sgo-color-brand-dark-text: #e2b762;
}

:root[data-sgo-accent="earth"] {
    --sgo-color-brand-950: #39271d;
    --sgo-color-brand-900: #503728;
    --sgo-color-brand-800: #654734;
    --sgo-color-brand-700: #76513a;
    --sgo-color-brand-solid: #76513a;
    --sgo-color-brand-solid-hover: #503728;
    --sgo-color-brand-dark-text: #c9a086;
}

:root[data-sgo-accent="green"] {
    --sgo-color-brand-950: #123b29;
    --sgo-color-brand-900: #185337;
    --sgo-color-brand-800: #206a45;
    --sgo-color-brand-700: #287a50;
    --sgo-color-brand-solid: #287a50;
    --sgo-color-brand-solid-hover: #185337;
    --sgo-color-brand-dark-text: #72cc9d;
}

:root[data-sgo-accent="slate"] {
    --sgo-color-brand-950: #243139;
    --sgo-color-brand-900: #34464f;
    --sgo-color-brand-800: #455861;
    --sgo-color-brand-700: #52646d;
    --sgo-color-brand-solid: #52646d;
    --sgo-color-brand-solid-hover: #34464f;
    --sgo-color-brand-dark-text: #9fb2bc;
}

:root[data-sgo-theme="dark"] {
    color-scheme: dark;
    --sgo-color-ink-950: #f2f6f7;
    --sgo-color-ink-900: #e5ecee;
    --sgo-color-ink-800: #d5dfe2;
    --sgo-color-ink-700: #c0ccd1;
    --sgo-color-ink-600: #aab9bf;
    --sgo-color-ink-500: #82939a;
    --sgo-color-line: #2d3c43;
    --sgo-color-line-strong: #43545c;
    --sgo-color-canvas: #0f161a;
    --sgo-color-surface: #182126;
    --sgo-color-surface-muted: #202b31;
    --sgo-color-surface-raised: #222e34;
    --sgo-color-input: #11191d;
    --sgo-color-readonly: #202a2f;
    --sgo-color-success: #66c79b;
    --sgo-color-warning: #e8b44f;
    --sgo-color-favorite: #f7c948;
    --sgo-color-danger: #f38b82;
    --sgo-color-info: #71bdd6;
    --sgo-color-success-tint: #17372b;
    --sgo-color-warning-tint: #3a2d16;
    --sgo-color-danger-tint: #3c211f;
    --sgo-color-info-tint: #18323c;
    --sgo-color-overlay: rgba(0, 0, 0, .66);
    --sgo-color-brand-700: var(--sgo-color-brand-dark-text);
    --sgo-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
    --sgo-shadow-md: 0 8px 28px rgba(0, 0, 0, .38);
    --sgo-shadow-lg: 0 20px 60px rgba(0, 0, 0, .48);
}

@media (prefers-color-scheme: dark) {
    :root[data-sgo-theme="system"] {
        color-scheme: dark;
        --sgo-color-ink-950: #f2f6f7;
        --sgo-color-ink-900: #e5ecee;
        --sgo-color-ink-800: #d5dfe2;
        --sgo-color-ink-700: #c0ccd1;
        --sgo-color-ink-600: #aab9bf;
        --sgo-color-ink-500: #82939a;
        --sgo-color-line: #2d3c43;
        --sgo-color-line-strong: #43545c;
        --sgo-color-canvas: #0f161a;
        --sgo-color-surface: #182126;
        --sgo-color-surface-muted: #202b31;
        --sgo-color-surface-raised: #222e34;
        --sgo-color-input: #11191d;
        --sgo-color-readonly: #202a2f;
        --sgo-color-success: #66c79b;
        --sgo-color-warning: #e8b44f;
        --sgo-color-favorite: #f7c948;
        --sgo-color-danger: #f38b82;
        --sgo-color-info: #71bdd6;
        --sgo-color-success-tint: #17372b;
        --sgo-color-warning-tint: #3a2d16;
        --sgo-color-danger-tint: #3c211f;
        --sgo-color-info-tint: #18323c;
        --sgo-color-overlay: rgba(0, 0, 0, .66);
        --sgo-color-brand-700: var(--sgo-color-brand-dark-text);
        --sgo-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
        --sgo-shadow-md: 0 8px 28px rgba(0, 0, 0, .38);
        --sgo-shadow-lg: 0 20px 60px rgba(0, 0, 0, .48);
    }
}

/* Keep touch devices and print at their normal compact scale. */
@media screen and (min-width: 1024px) and (hover: hover) and (pointer: fine) {
    @supports (zoom: 0.9) {
        :root[data-sgo-density="super-compact"] {
            zoom: 0.9;
            --sgo-viewport-height: 111.111111vh;
        }
    }
}