body.theme-dark {
    --ui-color-scheme: dark;
    --ui-primary: #7657dc;
    --ui-primary-hover: #704fd7;
    --ui-primary-active: #6845cc;
    --ui-primary-soft: #2b2442;
    --ui-primary-border: #5a4a80;
    --ui-on-primary: #ffffff;
    --ui-accent: #27b5bd;
    --ui-accent-soft: #17373d;
    --ui-price: #ff7e8f;
    --ui-ink: #e8edf5;
    --ui-heading: #f8fafc;
    --ui-muted: #b7c0ce;
    --ui-subtle: #8e9aab;
    --ui-line: #313a49;
    --ui-line-strong: #435064;
    --ui-page: #11151d;
    --ui-surface: #191f2a;
    --ui-surface-raised: #1d2430;
    --ui-surface-muted: #222a37;
    --ui-surface-hover: #2a3443;
    --ui-surface-accent: #151b25;
    --ui-overlay: rgba(3, 6, 12, .76);
    --ui-nav-surface: rgba(17, 21, 29, .96);
    --ui-mobile-bar-surface: rgba(17, 21, 29, .97);
    --ui-success: #4ed0a0;
    --ui-success-soft: #15382d;
    --ui-success-border: #286c56;
    --ui-danger: #ff8794;
    --ui-danger-soft: #45212a;
    --ui-danger-border: #7a3a47;
    --ui-warning: #f2aa62;
    --ui-warning-soft: #3d2d1e;
    --ui-warning-border: #725130;
    --ui-image-placeholder: #252e3b;
    --ui-image-sheen: #303b4a;
    --ui-skeleton: #293342;
    --ui-skeleton-highlight: #3a4657;
    --ui-favorite-surface: rgba(25, 31, 42, .90);
    --ui-hero-surface: #0c1119;
    --ui-profile-surface: #0c1119;
    --ui-shadow-xs: 0 2px 8px rgba(0, 0, 0, .18);
    --ui-shadow-sm: 0 5px 16px rgba(0, 0, 0, .22);
    --ui-shadow-md: 0 10px 28px rgba(0, 0, 0, .28);
    --ui-shadow-lg: 0 26px 74px rgba(0, 0, 0, .56);
    --ui-focus: 0 0 0 3px rgba(118, 87, 220, .28);
}