/* Hallmark · genre: modern-minimal · macrostructure: Workbench · theme: 1990-light · designed-as-app */
:root {
  --color-accent: #EC2024;
  --color-accent-dark: #B8171B;
  --color-accent-soft: #FFF0F0;
  --color-ink: #161616;
  --color-ink-soft: #4C4C4C;
  --color-muted: #737373;
  --color-paper: #F7F7F5;
  --color-surface: #FFFFFF;
  --color-surface-muted: #F1F1EE;
  --color-line: #E6E5E1;
  --color-line-strong: #CAC8C2;
  --color-success: #167A52;
  --color-success-soft: #EAF6F0;
  --color-warning: #A66308;
  --color-warning-soft: #FFF5E6;
  --color-danger: #B42318;
  --color-danger-soft: #FFF0EE;
  --color-focus: rgba(236, 32, 36, .28);
  --font-sans: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --radius-control: 6px;
  --radius-surface: 8px;
  --shadow-soft: 0 6px 20px rgba(22, 22, 22, .06);
  --shadow-modal: 0 24px 72px rgba(22, 22, 22, .18);
  --ease-standard: 160ms ease;
  --sidebar-width: 248px;

  /* compatibility aliases used by the existing app.js */
  --brand-red: var(--color-accent);
  --brand-red-dark: var(--color-accent-dark);
  --brand-red-light: var(--color-accent-soft);
  --brand-red-glow: var(--color-focus);
  --brand-black: var(--color-ink);
  --brand-dark: var(--color-ink);
  --bg-primary: var(--color-paper);
  --bg-secondary: var(--color-surface-muted);
  --bg-card: var(--color-surface);
  --bg-card-hover: #FCFCFB;
  --bg-input: var(--color-surface);
  --border: var(--color-line);
  --border-red: rgba(236, 32, 36, .38);
  --border-focus: var(--color-accent);
  --text-primary: var(--color-ink);
  --text-secondary: var(--color-ink-soft);
  --text-muted: var(--color-muted);
  --accent-green: var(--color-success);
  --accent-orange: var(--color-warning);
  --accent-red: var(--color-danger);
  --transition: all var(--ease-standard);
  --radius-sm: var(--radius-control);
  --radius-md: var(--radius-control);
  --radius-lg: var(--radius-surface);
  --radius-xl: var(--radius-surface);
}