html[data-ui="classic"] .v2-only {
  display: none !important;
}

html[data-ui="v2"] .classic-only {
  display: none !important;
}

html[data-ui="v2"] {
  color-scheme: dark;
  --v2-color-background: #111315;
  --v2-color-background-subtle: #15181B;
  --v2-color-surface: #181B1E;
  --v2-color-surface-secondary: #202428;
  --v2-color-surface-hover: #282D32;
  --v2-color-surface-elevated: #282D32;
  --v2-color-surface-inset: #15181B;
  --v2-color-foreground: #ECEEED;
  --v2-color-foreground-secondary: #B4B9BC;
  --v2-color-muted-foreground: #8B9297;
  --v2-color-primary: #8297A6;
  --v2-color-primary-hover: #93A7B5;
  --v2-color-primary-active: #A3B4C0;
  --v2-color-primary-soft: #253039;
  --v2-color-primary-subtle: #1E272E;
  --v2-color-on-primary: #111315;
  --v2-color-gold: #C0A261;
  --v2-color-gold-strong: #D0B572;
  --v2-color-gold-soft: #30291D;
  --v2-color-warm: #BC8B73;
  --v2-color-warm-soft: #352820;
  --v2-color-success: #8AA08E;
  --v2-color-success-soft: #202B23;
  --v2-color-warning: #C39A58;
  --v2-color-warning-soft: #31281B;
  --v2-color-danger: #C77971;
  --v2-color-danger-soft: #352321;
  --v2-color-info: #8297A6;
  --v2-color-info-soft: #253039;
  --v2-color-border: #343A3F;
  --v2-color-border-subtle: #282D31;
  --v2-color-border-strong: #485057;
  --v2-color-focus: #93A7B5;
  --v2-action-primary-text: #F3E9D0;
  --v2-action-primary-bg: rgba(142, 116, 62, .30);
  --v2-action-primary-hover: rgba(156, 128, 70, .40);
  --v2-action-primary-border: rgba(186, 155, 91, .52);
  --v2-action-primary-shadow: 0 2px 8px rgba(0, 0, 0, .22);
  --v2-action-primary-shadow-pressed: 0 1px 4px rgba(0, 0, 0, .18);

  --v2-font-interface: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --v2-font-editorial: "Playfair Display", Georgia, serif;

  --v2-space-0: 0;
  --v2-space-1: 4px;
  --v2-space-1-5: 6px;
  --v2-space-2: 8px;
  --v2-space-3: 12px;
  --v2-space-4: 16px;
  --v2-space-5: 20px;
  --v2-space-6: 24px;
  --v2-space-8: 32px;
  --v2-space-10: 40px;
  --v2-space-12: 48px;
  --v2-space-16: 64px;

  --v2-radius-sm: 6px;
  --v2-radius-md: 10px;
  --v2-radius-lg: 14px;
  --v2-radius-xl: 18px;
  --v2-radius-round: 999px;

  --v2-shadow-xs: 0 1px 2px rgba(0, 0, 0, .22);
  --v2-shadow-subtle: 0 1px 0 rgba(255, 255, 255, .025), 0 8px 22px -20px rgba(0, 0, 0, .66);
  --v2-shadow-card: 0 1px 0 rgba(255, 255, 255, .02), 0 14px 32px -27px rgba(0, 0, 0, .74);
  --v2-shadow-elevated: 0 1px 0 rgba(255, 255, 255, .035), 0 22px 56px -28px rgba(0, 0, 0, .84);
  --v2-shadow-overlay: 0 24px 64px -30px rgba(0, 0, 0, .88);
  --v2-shadow-slate: 0 20px 54px -34px rgba(72, 94, 110, .68);
  --v2-shadow-warm: 0 20px 48px -36px rgba(151, 118, 68, .44);
  --v2-grain-opacity: .013;

  --v2-duration-instant: 100ms;
  --v2-duration-fast: 150ms;
  --v2-duration-base: 200ms;
  --v2-duration-slow: 280ms;
  --v2-duration-max: 340ms;
  --v2-ease-standard: cubic-bezier(.2, 0, 0, 1);
  --v2-ease-emphasized: cubic-bezier(.2, .8, .2, 1);
  --v2-ease-exit: cubic-bezier(.4, 0, 1, 1);

  --v2-z-base: 0;
  --v2-z-sticky: 20;
  --v2-z-navigation: 40;
  --v2-z-popover: 60;
  --v2-z-overlay: 80;
  --v2-z-toast: 100;

  --v2-sidebar-width: 240px;
  --v2-sidebar-collapsed-width: 70px;
}

html[data-ui="v2"][data-theme="light"] {
  color-scheme: light;
  --v2-color-background: #F3F4F2;
  --v2-color-background-subtle: #ECEEEB;
  --v2-color-surface: #FAFAF8;
  --v2-color-surface-secondary: #EEF0EF;
  --v2-color-surface-hover: #E7EAEB;
  --v2-color-surface-elevated: #FFFFFF;
  --v2-color-surface-inset: #E7E9E7;
  --v2-color-foreground: #252A2E;
  --v2-color-foreground-secondary: #555D63;
  --v2-color-muted-foreground: #737B80;
  --v2-color-primary: #596C7A;
  --v2-color-primary-hover: #4C5E6B;
  --v2-color-primary-active: #40515D;
  --v2-color-primary-soft: #DCE4E8;
  --v2-color-primary-subtle: #E9EEF1;
  --v2-color-on-primary: #FFFFFF;
  --v2-color-gold: #A7894D;
  --v2-color-gold-strong: #927640;
  --v2-color-gold-soft: #EEE6D5;
  --v2-color-warm: #A6755C;
  --v2-color-warm-soft: #EFE0D7;
  --v2-color-success: #627866;
  --v2-color-success-soft: #E2E9E3;
  --v2-color-warning: #9B6B31;
  --v2-color-warning-soft: #F1E5D1;
  --v2-color-danger: #A4544C;
  --v2-color-danger-soft: #F2E0DE;
  --v2-color-info: #596C7A;
  --v2-color-info-soft: #E1E8EC;
  --v2-color-border: #D2D6D5;
  --v2-color-border-subtle: #E2E5E3;
  --v2-color-border-strong: #B8C0C2;
  --v2-color-focus: #4C5E6B;
  --v2-action-primary-text: #2A4554;
  --v2-action-primary-bg: rgba(194, 220, 234, .62);
  --v2-action-primary-hover: rgba(184, 214, 230, .76);
  --v2-action-primary-border: rgba(128, 172, 196, .50);
  --v2-action-primary-shadow: 0 2px 8px rgba(58, 95, 116, .12);
  --v2-action-primary-shadow-pressed: 0 1px 4px rgba(58, 95, 116, .10);
  --v2-shadow-xs: 0 1px 2px rgba(45, 52, 56, .08);
  --v2-shadow-subtle: 0 1px 3px rgba(45, 52, 56, .055);
  --v2-shadow-card: 0 10px 26px -20px rgba(45, 52, 56, .18);
  --v2-shadow-elevated: 0 20px 48px -26px rgba(45, 52, 56, .26);
  --v2-shadow-overlay: 0 24px 60px -28px rgba(45, 52, 56, .32);
  --v2-shadow-slate: 0 14px 36px -22px rgba(77, 96, 109, .28);
  --v2-shadow-warm: 0 14px 34px -24px rgba(151, 118, 68, .22);
  --v2-grain-opacity: .022;
}