/**
 * Cynote design tokens – modern, sleek, mobile/desktop friendly
 */
:root {
  /* Colors – warm neutral base */
  --cn-bg: #f8f7f4;
  --cn-bg-elevated: #ffffff;
  --cn-surface: #ffffff;
  --cn-border: #e8e6e1;
  --cn-border-focus: #c4b8a8;
  --cn-text: #2d2a26;
  --cn-text-muted: #6b6560;
  --cn-accent: #4a7c59;
  --cn-accent-hover: #3d6b4a;
  --cn-accent-subtle: #e8f0eb;
  --cn-danger: #c45c4a;
  --cn-danger-hover: #a84d3d;
  --cn-danger-subtle: #fcece9;
  --cn-header-bg: #2d2a26;
  --cn-header-text: #f8f7f4;
  --cn-header-link: rgba(248, 247, 244, 0.85);
  --cn-header-link-hover: #ffffff;
  --cn-shadow-sm: 0 1px 3px rgba(45, 42, 38, 0.08);
  --cn-shadow-md: 0 4px 12px rgba(45, 42, 38, 0.1);
  --cn-shadow-lg: 0 8px 24px rgba(45, 42, 38, 0.12);
  --cn-radius-sm: 6px;
  --cn-radius-md: 10px;
  --cn-radius-lg: 14px;
  --cn-radius-full: 9999px;
  /* Typography */
  --cn-font-sans: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --cn-font-mono: "DM Mono", ui-monospace, monospace;
  --cn-text-xs: 0.75rem;
  --cn-text-sm: 0.875rem;
  --cn-text-base: 1rem;
  --cn-text-lg: 1.125rem;
  --cn-text-xl: 1.25rem;
  --cn-text-2xl: 1.5rem;
  --cn-text-3xl: 2rem;
  --cn-leading-tight: 1.25;
  --cn-leading-normal: 1.5;
  --cn-leading-relaxed: 1.65;
  /* Spacing */
  --cn-space-1: 0.25rem;
  --cn-space-2: 0.5rem;
  --cn-space-3: 0.75rem;
  --cn-space-4: 1rem;
  --cn-space-5: 1.25rem;
  --cn-space-6: 1.5rem;
  --cn-space-8: 2rem;
  --cn-space-10: 2.5rem;
  --cn-space-12: 3rem;
  --cn-space-16: 4rem;
  /* Transitions */
  --cn-transition: 0.2s ease;
  --cn-transition-slow: 0.35s ease;
}

/* User preference overrides (from menu) – applied to .custombg / .customcolor / .customtext by existing JS */
.custombg { background-color: var(--cn-bg); }
.customcolor { background-color: var(--cn-accent-subtle); }
.customtext { font-family: var(--cn-font-sans); }
