:root {
  --bg: #f5f7fb; /* soft page background */
  --surface: #ffffff; /* main card surface */
  --surface-2: #f2f4f8; /* subtle raised surface */
  --border: #e6e9ee; /* soft border */
  --text: #0b1320; /* deep neutral for high contrast */
  --text-dim: #666e7a; /* dimmed copy */
  --muted: #9aa4ae; /* subdued labels */
  --primary: #7c3aed; /* memos-like purple accent */
  --primary-ink: #ffffff;
  --accent: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
  --shadow: rgba(2, 6, 23, 0.08);
}
html[data-theme="dark"] {
  --bg: #0a0b0e;
  --surface: #0f1722;
  --surface-2: #0e1630;
  --border: #19222b;
  --text: #e6eef8;
  --text-dim: #a3b0c0;
  --muted: #93a0b0;
  /* Accents derived from the blue palette provided */
  --primary: #557a95; /* mid tone */
  --primary-ink: #ffffff; /* keep input/button text bright for contrast */
  --accent: #829ab1; /* lighter accent for subtle highlights */
  --warning: #3a506b; /* darker accent for emphasis */
  /* Keep danger a warm red so errors remain obvious */
  --danger: #c16659;
  --shadow: rgba(0, 0, 0, 0.4);
}
/* Auto-switch based on system preference when no explicit theme is set */
@media (prefers-color-scheme: dark) {
  html:not([data-theme]) {
    --bg: #0a0b0e;
    --surface: #0f1722;
    --surface-2: #0e1630;
    --border: #19222b;
    --text: #e6eef8;
    --text-dim: #a3b0c0;
    --muted: #93a0b0;
    /* Accents derived from the blue palette provided */
    --primary: #557a95; /* mid tone */
    --primary-ink: #ffffff; /* keep input/button text bright for contrast */
    --accent: #829ab1; /* lighter accent for subtle highlights */
    --warning: #3a506b; /* darker accent for emphasis */
    /* Keep danger a warm red so errors remain obvious */
    --danger: #c16659;
    --shadow: rgba(0, 0, 0, 0.4);
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
    animation: none !important;
  }
}