/* Headway Tools — token chữ & màu dùng chung toàn hệ thống */
:root {
  --bg: #f4f7fb;
  --bg-nav: #f4f7fb;
  --bg-elevated: #ffffff;
  --bg-panel: #eef2f7;
  --bg-hover: #e4ebf4;
  --surface: #ffffff;
  --border: #d5dee9;
  --border-hover: #c5d0de;
  --text: #1a2433;
  --text-muted: #66788f;
  --accent: #0d9f90;
  --accent-soft: rgba(13, 159, 144, 0.12);
  --accent-strong: #0b8a7d;
  --danger: #d64550;
  --warn: #c4841d;
  --font: 'DM Sans', system-ui, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, monospace;
  --fs-xs: 11px;
  --fs-sm: 12px;
  --fs-base: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --hw-accent: #0d9f90;
  --hw-accent-strong: #0b8a7d;
  --hw-accent-soft: rgba(13, 159, 144, 0.12);
  --hw-border: #d5dee9;
  --hw-font: 'DM Sans', system-ui, sans-serif;
  --hw-mono: 'JetBrains Mono', ui-monospace, monospace;
  --hw-fs-base: 13px;
  --ctrl-h: 34px;
  --ctrl-radius: 8px;
  --ctrl-fw: 600;
  --ctrl-fs: 13px;
  --ctrl-pad-x: 12px;
  /* Thang spacing 4px — chrome / page / card dùng chung */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --header-h: 56px;
  --header-pad-x: 16px;
  --toolbar-gap: 8px;
  --sidebar-pad: 12px;
  --page-pad: 24px;
  --card-pad: 16px;
  --card-radius: 12px;
  --frame-radius: 14px;
  --field-gap: 8px;
}