/* =====================================================================
   IRON VALHALLA — Design tokens (ไฟล์เดียว: สี / มุมโค้ง / ระยะห่าง / ตัวอักษร / เงา)
   ใช้โดย css/theme.css (UI วาดด้วยโค้ดทั้งหมด — ไม่มีภาพกรอบ/ปุ่ม)
   โทน: กระดาษครีมอบอุ่น ขอบทอง/บรอนซ์บาง ไม้เข้มเป็นแผ่นรอง ตัวหนังสือน้ำตาลเข้ม
   ===================================================================== */
:root {
  /* ---------- ระยะห่าง (ใช้แค่ 5 ค่านี้) ---------- */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px;

  /* ---------- มุม (เจ้าของ 2026-10-03: "ไม่ชอบทรงแคปซูลยาเลย") ----------
     ทรงนอร์ส/RO: สี่เหลี่ยมมุมเล็ก ๆ / ตัดมุม (chamfer) • ห้ามทรงแคปซูล — --rad-pill เหลือ 4px (ชื่อคงไว้ให้กฎเก่าใช้ต่อได้)
     ตัดมุมด้วย clip-path: --cham (ปุ่ม/การ์ด) • ป้ายแท็บปลายแหลม: --plaque (ดู css/theme4.css) */
  --rad-xs: 3px; --rad-s: 4px; --rad-m: 6px; --rad-l: 8px; --rad-xl: 10px; --rad-pill: 4px;
  --cham-s: 4px; --cham: 7px; --cham-l: 12px;

  /* ---------- ตัวอักษร ---------- */
  --f-body: "Kanit", "Noto Sans Thai", "IBM Plex Sans Thai", Tahoma, sans-serif;
  --f-thai: "Noto Sans Thai", "Kanit", Tahoma, sans-serif;
  --f-title: "Cinzel", "Kanit", serif;   /* หัวข้อภาษาอังกฤษ (ตัวไทยตกไปใช้ Kanit เอง) */
  --f-num: "Kanit", "IBM Plex Mono", sans-serif;
  --fs-2xs: 10px; --fs-xs: 11px; --fs-s: 12.5px; --fs-m: 14px; --fs-l: 16px; --fs-xl: 20px; --fs-2xl: 26px;

  /* ---------- กระดาษ (หน้าต่าง) ---------- */
  --c-paper: #fbf4e4;     /* พื้นหน้าต่าง */
  --c-paper-2: #f3e6c9;   /* พื้นไล่ล่าง / แท็บไม่เลือก */
  --c-paper-3: #e8d6ae;   /* เส้นกั้น/จาน */
  --c-card: #fffbf2;      /* การ์ด/แถวในหน้าต่าง */
  --c-card-hi: #fff4d6;   /* แถวที่เลือก */

  /* ---------- ตัวหนังสือบนกระดาษ ---------- */
  --c-ink: #3b2614; --c-ink-2: #6a4e33; --c-ink-3: #957a5c;

  /* ---------- ทอง / บรอนซ์ ---------- */
  --c-gold: #d4a347; --c-gold-hi: #f6d98a; --c-gold-lo: #9a6d24; --c-gold-ink: #7a4e0e;
  --c-line: rgba(140, 100, 45, 0.22); --c-line-2: rgba(140, 100, 45, 0.38);

  /* ---------- ไม้ (แผ่นรอง HUD / ปกสมุด / ป้ายหัวหน้าต่าง) ---------- */
  --c-wood: #5b3a1f; --c-wood-2: #432913; --c-wood-3: #2e1c0d;
  --c-hud: rgba(44, 28, 14, 0.84);      /* การ์ด HUD บนฉาก */
  --c-hud-2: rgba(30, 19, 9, 0.9);
  --c-hud-line: rgba(232, 196, 120, 0.5);
  --c-hud-ink: #fbefd2; --c-hud-ink-2: #d8c39b; --c-hud-ink-3: #a99171;

  /* ---------- สถานะ ---------- */
  --c-ok: #2e7d3a; --c-bad: #b3321f; --c-warn: #b06a00; --c-info: #2c6aa8;
  --c-hp: #e0473e; --c-hp-2: #ff8a6a; --c-sp: #3d8fe0; --c-sp-2: #8cc8ff; --c-exp: #e8b03a; --c-jexp: #9a6ce0;

  /* ---------- ความหายาก: สีตัวหนังสือบนกระดาษ / สีขอบจาน ---------- */
  --r-common: #5d4630;   --r-common-ring: #cdb68a;
  --r-uncommon: #2f8a3e; --r-uncommon-ring: #7cc98a;
  --r-rare: #2a69b8;     --r-rare-ring: #79aee8;
  --r-epic: #8a3fc4;     --r-epic-ring: #bb8ae6;
  --r-legend: #b86a00;   --r-legend-ring: #f2b84a;

  /* ---------- เงา ---------- */
  --sh-1: 0 1px 2px rgba(80, 50, 15, 0.12);
  --sh-2: 0 4px 12px -4px rgba(70, 40, 10, 0.3);
  --sh-win: 0 24px 48px -18px rgba(25, 12, 2, 0.7), 0 6px 14px -6px rgba(25, 12, 2, 0.45);
  --sh-hud: 0 8px 20px -8px rgba(0, 0, 0, 0.7);
  --glow-gold: 0 0 0 3px rgba(242, 190, 80, 0.28), 0 0 18px -4px rgba(242, 170, 60, 0.7);
}