/* Design tokens — derived from the official ระบบเยี่ยมออนไลน์ manual palette */
:root {
  /* brand */
  --oxblood: #7d0a22;
  --red: #a8102b;
  --red-bright: #c8102e;
  --red-deep: #5c0716;
  --gold: #b88a3e;
  --gold-soft: #e3c79a;

  /* surfaces */
  --bg: #eef1f6;
  --bg-tint: #f6f8fc;
  --paper: #faf6f0;
  --card: #ffffff;
  --pink: #fbeef1;
  --pink-line: #f0d4dc;

  /* ink */
  --ink: #241d1a;
  --ink-soft: #5d544d;
  --muted: #8a8079;
  --line: #e7ddcf;
  --line-cool: #dfe3ec;
  --line-strong: #d8ccb8;

  /* status */
  --ok: #1f7a4d;
  --ok-bg: #e9f5ee;
  --warn: #9a5b00;
  --warn-bg: #fbf1de;

  /* type */
  --font: 'Sarabun', 'Loma', 'Leelawadee UI', 'Tahoma', sans-serif;
  --text-sm: 0.86rem;
  --text-base: 1rem;
  --text-lg: 1.15rem;

  /* spacing rhythm */
  --space-1: 0.4rem;
  --space-2: 0.75rem;
  --space-3: 1.1rem;
  --space-4: 1.6rem;
  --space-5: 2.4rem;

  /* shape */
  --radius: 12px;
  --radius-lg: 18px;
  --radius-pill: 999px;

  /* depth */
  --shadow-sm: 0 1px 2px rgba(60, 30, 20, 0.06), 0 4px 12px rgba(80, 20, 30, 0.06);
  --shadow: 0 2px 6px rgba(60, 30, 20, 0.08), 0 18px 44px rgba(80, 20, 30, 0.14);
  --shadow-lift: 0 10px 24px rgba(124, 10, 34, 0.28);

  /* motion */
  --dur-fast: 140ms;
  --dur: 260ms;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}