/* Design tokens — SPEC.md mục 13. Mọi màu, font, khoảng cách lấy từ đây. */

:root {
  /* Màu nền và chữ giao diện */
  --bg: #120D24;
  --surface: #1E1736;
  --surface-raised: #2A2148;
  --border: #3A2F5C;
  --text: #FFFFFF;
  --text-muted: #B3A9CF;

  /* Màu từng bộ thẻ — SPEC.md mục 13.1 (đổi 16/10/2026: Bạn bè tím, Cặp đôi hồng).
     Tương phản chữ --card-ink #1A1030 trên nền, đo theo WCAG 2.1:
     ban-be 5.77:1 · gia-dinh 10.30:1 · cap-doi 6.16:1 · tiec-khuya 10.24:1 · quoc-gia 11.06:1
     Nhãn hình phạt (chữ màu bộ trên nền mực) có cùng tỉ lệ. */
  --deck-ban-be: #9F7AFF;
  --deck-gia-dinh: #FFB547;
  --deck-cap-doi: #FF5C8A;
  --deck-tiec-khuya: #3DDC97;
  --deck-quoc-gia: #8AD3FF;

  /* Màu bộ thẻ đang dùng — modifier .deck--* trong components.css ghi đè */
  --deck-color: var(--deck-ban-be);

  /* Chữ trên mặt thẻ màu */
  --ink-dark: #1A1030;
  --card-ink: var(--ink-dark);

  /* Mặt thẻ — SPEC.md mục 13.5 */
  --highlight-light: rgba(255, 255, 255, 0.7);
  --highlight: var(--highlight-light); /* vệt bút dạ quang sau tên người */
  --stamp: #8A2A12; /* con dấu "LUẬT" */
  --foil: #FFE066; /* viền ánh kim thẻ cay 3 */
  /* Nửa "Thách" của thẻ Thật hay thách phủ mực. Bản mẫu 22% làm chữ mực trên Bạn bè
     còn 4.01:1, Cặp đôi 4.19:1 (< 4.5). 14% giữ ≥ 4.5: ban-be 4.58 · cap-doi 4.83 ·
     gia-dinh 7.85 · tiec-khuya 7.74 · quoc-gia 8.43. */
  --split-shade: 0.14;
  /* Chất liệu thẻ: bóng hai lớp, viền trong mực 16%, gradient sáng góc trên trái,
     mép chồng bài tối dần, dải sáng ánh kim. */
  --card-shadow: 0 2px 4px rgba(0, 0, 0, 0.35), 0 22px 44px rgba(0, 0, 0, 0.5);
  --card-line: rgba(26, 16, 48, 0.16);
  --card-gloss: rgba(255, 255, 255, 0.22);
  --stack-shade-1: rgba(0, 0, 0, 0.22);
  --stack-shade-2: rgba(0, 0, 0, 0.4);
  --foil-shine: rgba(255, 255, 255, 0.55);

  /* Hiệu ứng nền theo dịp lễ và mùa — SPEC.md mục 13.3a. Hạt mờ (--bd-opacity) và lớp nền
     nhạt (alpha ≤ 0.2) để chữ, nút giữ nguyên độ tương phản như trên --bg. */
  --bd-opacity: 0.55;
  --bd-opacity-near: 0.42; /* hạt ở lớp trước nội dung — mờ hơn để không che chữ */
  --bd-gold: #FFD166;
  --bd-pink: #FF9EC4;
  --bd-red: #FF5A5F;
  --bd-white: #F4F1FF;
  --bd-orange: #FF9F45;
  --bd-mint: #7DEBC0;
  --bd-violet: #B79CFF;
  --bd-moon: #FFF2C2;
  --bd-tint-red: rgba(255, 90, 95, 0.16);
  --bd-tint-gold: rgba(255, 209, 102, 0.14);
  --bd-tint-pink: rgba(255, 158, 196, 0.16);
  --bd-tint-blue: rgba(110, 140, 255, 0.18);
  --bd-tint-mint: rgba(125, 235, 192, 0.12);
  --bd-tint-orange: rgba(255, 159, 69, 0.16);
  --bd-tint-white: rgba(244, 241, 255, 0.1);

  /* Trạng thái */
  --danger: #FF6B6B;
  --focus: #FFE066;
  /* Đố vui: ô đúng — nền/viền xanh đậm; chữ trắng trên nền đạt 5.0:1, viền trên
     --deck-quoc-gia đạt 3.1:1 (WCAG 1.4.11). Chữ "Chính xác!" trên nền tối dùng xanh sáng. */
  --quiz-correct: #1A7F4E;
  --quiz-correct-ink: #FFFFFF;
  --quiz-right-text: #3DDC97;

  /* Font */
  --font-card: "Baloo 2", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-ui: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Cỡ chữ */
  --text-sm: 14px;
  --text-md: 16px;
  --text-lg: 20px;
  --text-xl: 24px;
  --text-card-min: 28px;
  --text-card-md: 32px;
  --text-card: 36px;
  /* Chế độ "Đặt giữa bàn": thẻ chỉ còn nửa màn hình, tối thiểu 22px (SPEC.md mục 7.3).
     Phải khớp CARD_FONT_PX trong js/core/card-text.js — có test. */
  --text-table-min: 22px;
  --text-table-md: 24px;
  --text-table: 28px;

  /* Khoảng cách */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* Bo góc */
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  /* Vùng chạm tối thiểu */
  --tap-min: 48px;

  /* Chuyển động */
  --duration-fast: 150ms;
  --duration-flip: 300ms;
  --duration-draw: 380ms; /* rút thẻ: trượt + lật + nảy (SPEC.md mục 13.3) */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);

  /* Lớp phủ */
  --backdrop: rgba(0, 0, 0, 0.6);
}

/* Nhật, Hàn, Trung dùng phông hệ thống — không đóng gói phông CJK
   (I18N.md mục 6). js/lib/i18n.js đặt <html lang> khi khởi động. */
:root:lang(ja) {
  --font-card: "Hiragino Maru Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Yu Gothic", sans-serif;
  --font-ui:   "Hiragino Sans", "Noto Sans JP", "Yu Gothic", sans-serif;
}

:root:lang(ko) {
  --font-card: "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
  --font-ui:   "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
}

:root:lang(zh-Hans) {
  --font-card: "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  --font-ui:   "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
}