/* ==========================================================================
   1. DESIGN TOKENS & CSS VARIABLES (XUÂN SUM VẦY — MAI ĐÀO)
   ========================================================================== */
:root {
  /* Bảng màu: đỏ thắm, vàng mai, hồng đào trên nền kem.
     --vn-red là màu chủ đạo, --vn-gold là màu nhấn (tên token giữ theo theme-core.css) */
  --vn-red: #B3262C;
  --vn-red-deep: #921D22;
  --vn-red-ink: #4A2A1C;
  --vn-red-tint: rgba(179, 38, 44, .08);
  --vn-lotus: #B3262C;
  --vn-gold: #F2C230;
  --vn-gold-light: #FFDB7A;
  --vn-gold-text: #A0701A;
  --vn-gold-tint: rgba(242, 194, 48, .35);
  --vn-pink: #F3A6B6;
  --vn-pink-deep: #C2557A;
  --vn-pistil-mai: #C0392B;
  --vn-pistil-dao: #B5536F;
  --vn-branch: #6B4430;
  --vn-paper: #FFF7EA;
  --vn-paper-light: #FFFFFF;
  --vn-paper-mat: #F1E2D0;
  --vn-band: #FFF0DA;
  --vn-ink: #4A2A1C;
  --vn-ink-muted: #6E5446;
  --vn-line: #EBD3B4;
  --vn-line-dashed: #EBD3B4;
  --vn-input-border: #EBD3B4;
  --vn-outside: #F4E6CF;
  --vn-overlay: rgba(74, 42, 28, .72);
  --vn-overlay-strong: rgba(48, 24, 16, .95);
  --vn-shadow: rgba(74, 42, 28, .18);
  --vn-frame-shadow: 0 8px 20px rgba(179, 38, 44, .12);

  /* Theme mappings for existing components */
  --red-primary: #B3262C;
  --red-dark: #921D22;
  --red-light: #C2557A;
  --red-card: #B3262C;
  --red-card-inner: #921D22;
  --gold: #F2C230;
  --gold-light: #FFDB7A;
  --gold-dark: #A0701A;
  --paper-bg: #FFF7EA;
  --paper-card: #FFFFFF;
  --cream-text: #FFF7EA;
  --cream-sub: rgba(255, 247, 234, 0.85);
  --ink: #4A2A1C;
  --muted: #6E5446;
  --border-red: rgba(179, 38, 44, 0.25);
  --border-gold: #F2C230;
  --shadow-card: none;

  /* Typography */
  --font-display: "Lora", Georgia, "PingFang SC", "Microsoft YaHei", serif;
  --font-serif: "Lora", Georgia, serif;
  --font-title: "Lora", Georgia, serif;
  --font-quote: "Lora", Georgia, serif;
  --font-body: "Be Vietnam Pro", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-sans: "Be Vietnam Pro", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}