:root {
  /* Brand and surface tokens. Adjust these first when changing visual style. */
  --bg: #f6f7f4;
  --panel: #ffffff;
  --panel-soft: #eef3ef;
  --line: #d7ddd7;
  --text: #172018;
  --muted: #687568;
  --accent: #256c5a;
  --accent-strong: #164e42;
  --accent-soft: #d9ebe3;
  --warning: #9b5b14;
  --danger: #a43434;
  --shadow: 0 14px 30px rgba(28, 43, 34, 0.08);

  /* Layout tokens. Keep these stable to preserve workflow density. */
  --topbar-height: 56px;
  --sidebar-width: 260px;
  --list-min-width: 330px;
  --detail-min-width: 430px;
  --detail-max-width: 560px;
  --page-max-width: 1240px;
  --radius-sm: 7px;
  --radius-md: 8px;
  --space-page: 14px;
  --focus-ring: 0 0 0 3px var(--accent-soft);
}