:root {
  --nm-black: #080706;
  --nm-brown: #2e241d;
  --nm-gray: #534d44;
  --nm-beige: #e1dbcf;
  --nm-gold: #a9763d;
  --nm-white: #ffffff;

  --canvas: #e1dbcf;
  --surface: #f7f3ec;
  --surface-liquid: rgba(255, 255, 255, 0.74);
  --text-primary: #343231;
  --text-secondary: #66635f;
  --border: rgba(83, 77, 68, 0.24);
  --accent: #a9763d;

  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --blur-liquid: 20px;
  --control-height: 48px;
  --focus-ring: 0 0 0 3px rgba(169, 118, 61, 0.42);
  --shadow-liquid: 0 12px 32px rgba(46, 36, 29, 0.14);
}

[data-theme="executive"] {
  --canvas: #080706;
  --surface: #151210;
  --surface-raised: #211a15;
  --surface-liquid: rgba(33, 26, 21, 0.78);
  --text-primary: #f3ede4;
  --text-secondary: #b9b0a7;
  --border: rgba(169, 118, 61, 0.32);
  --accent: #a9763d;
  --shadow-liquid: 0 18px 48px rgba(0, 0, 0, 0.36);
}

.liquid-surface {
  background: var(--surface-liquid);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-liquid);
  -webkit-backdrop-filter: blur(var(--blur-liquid)) saturate(1.08);
  backdrop-filter: blur(var(--blur-liquid)) saturate(1.08);
}

@media (prefers-reduced-transparency: reduce) {
  .liquid-surface {
    background: var(--surface);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}