/* ============================================================
   DEKTHAI design tokens — สเกลกลาง (ขนาดตัวอักษร · มุมโค้ง · ระยะ · เงา)
   ⚠️ ชื่อตัวแปรทุกตัวขึ้นต้น --dt- (กันชนกับ --r- / --sp- / --sh- / --fs- (นำหน้า) ที่ money.css · dashboard.css · checkshopee.css ประกาศเอง) — ห้ามประกาศสี (--accent/--ink/--bg/--border) ซ้ำที่นี่
      เพราะบางหน้าโหลดไฟล์นี้หลัง CSS ของหน้า และบางหน้าตั้งสีเองตั้งใจ (เช่น Shopee ส้ม #EE4D2D)
   ค่ามาจากการนับการใช้งานจริงใน CSS ทั้งระบบ (2026-10-29) — แผน: tasks/uiux-tokens-plan.md
   ============================================================ */
:root {
  /* ขนาดตัวอักษร (px) — เดิมใช้ 67 ขนาด ให้ค่อย ๆ ย้ายมาใช้ 9 ขั้นนี้ */
  --dt-fs-2xs: 11px;
  --dt-fs-xs: 12px;
  --dt-fs-sm: 13px;
  --dt-fs-md: 14px;
  --dt-fs-base: 16px;
  --dt-fs-lg: 18px;
  --dt-fs-xl: 20px;
  --dt-fs-2xl: 24px;
  --dt-fs-3xl: 32px;

  /* มุมโค้ง — เดิม 34 ขนาด */
  --dt-r-xs: 6px;
  --dt-r-sm: 8px;      /* ปุ่ม */
  --dt-r-md: 12px;     /* การ์ดเล็ก */
  --dt-r-lg: 18px;     /* การ์ดหลัก (Theme v3) */
  --dt-r-xl: 24px;     /* กล่องใหญ่ */
  --dt-r-pill: 100px;  /* pill / ปุ่มแคปซูล */

  /* ระยะห่าง สเกล 4px */
  --dt-sp-1: 4px;
  --dt-sp-2: 8px;
  --dt-sp-3: 12px;
  --dt-sp-4: 16px;
  --dt-sp-5: 20px;
  --dt-sp-6: 24px;
  --dt-sp-8: 32px;
  --dt-sp-10: 40px;
  --dt-sp-12: 48px;

  /* เงานุ่ม */
  --dt-sh-1: 0 1px 2px rgba(10, 10, 11, .06), 0 1px 3px rgba(10, 10, 11, .05);
  --dt-sh-2: 0 6px 18px rgba(10, 10, 11, .08);
  --dt-sh-3: 0 14px 36px rgba(10, 10, 11, .12);

  /* ขนาดแตะขั้นต่ำบนมือถือ */
  --dt-tap-min: 44px;
}

/* ปุ่มแตะบนมือถือ/แท็บเล็ต ≥44px — เฉพาะจอสัมผัส (desktop ไม่เปลี่ยน) · :not(#dt) ดัน specificity ให้ชนะ .btn.btn-sm / ธีมหน้าอื่น โดยไม่ต้องบังคับด้วยคำสั่งบังคับ */
@media (pointer: coarse) {
  html .btn:not(#dt), html .btn-icon:not(#dt), html .hm-chip:not(#dt), html .hm-logo:not(#dt) {
    min-height: var(--dt-tap-min);
  }
  html .btn-icon:not(#dt) { min-width: var(--dt-tap-min); }
  html .btn:not(#dt), html .hm-chip:not(#dt) { justify-content: center; }
}