/* GENERATED by pd proto sync from design-system/tokens.css — do not edit */
/*
 * Design tokens — hướng "Xám nhóm" (vòng 5 phương án B, chủ app chọn 2026-11-04; xem directions/round-5/B.md).
 * PHẲNG HOÀN TOÀN: nền xám #F2F2F7, nhóm trắng lồi vào, MỘT nhấn xanh ngọc xám #3A6470, không bóng, không viền ngoài.
 * Thay "Giấy-Dòng" (vòng 4, chàm + dòng thời gian màu). Chỉ đổi GIÁ TRỊ và thêm token; không đổi tên. Danh mục theme 60 giữ nguyên (D-54).
 *
 * Mọi mockup và mọi component chỉ đọc màu, giãn cách, bo góc, đổ bóng và cỡ chữ qua các
 * custom property ở đây. Sửa GIÁ TRỊ ở file này; không bao giờ viết màu hay kích thước
 * cứng ở nơi khác.
 *
 * BỐN QUY TẮC CẤU TRÚC:
 *
 * 1. FONT: phông hệ thống (SF Pro / Roboto, dự phòng Hàn/Nhật hệ thống) vẫn là nền
 *    (--font-family-base). Thêm đúng ba webfont OFL cho các mẫu catalog (D-68, catalog.md):
 *    Cormorant Garamond (--font-family-serif-display), Dancing Script (--font-family-script),
 *    Be Vietnam Pro (--font-family-sans-vi), nạp bằng @font-face ngay dưới đây (Google Fonts, có
 *    tập con tiếng Việt, display=swap; @import ngoài bị build của prototype bỏ nên không dùng). Webfont mới thì phải nạp ngay tại đây.
 *
 * 2. CHẾ ĐỘ TỐI CHỈ KHI ĐƯỢC ÉP, không theo hệ điều hành — PRD 1.0 không có chế độ tối.
 *
 * 3. MÀU TƯƠI LÀM NỀN, MÀU ĐẬM LÀM CHỮ. --color-accent (nền, chữ đè lên dùng
 *    --color-on-accent) và --color-accent-ink (khi màu nhấn là chữ).
 *
 * 4. TÊN TOKEN LÀ HỢP ĐỒNG. Thêm token mới thì được; đổi tên hoặc xoá một token đang dùng
 *    sẽ đổi diện mạo mọi màn đã vẽ mà không có lỗi nào báo ra. Hướng mới đổi GIÁ TRỊ:
 *    --shadow-* thành none, viền thành hairline, bo góc nhỏ lại, phông hệ thống.
 */

/* Webfont OFL cho catalog mẫu (D-68). @font-face thay cho @import vì build Next/Turbopack của prototype bỏ @import ngoài; nguồn: Google Fonts, tập con latin + latin-ext + vietnamese, display=swap. */

:root {
  /* Colour — nền/mặt */
  --color-bg: #f2f2f7;
  --color-surface: #ffffff;
  --color-surface-sunken: #e9e9ef;
  /* Nền ô segmented / vùng lõm của hướng "Xám nhóm" (mới) */
  --color-fill-segment: #e3e3e8;

  /* Colour — màu của app ("app đang nói"): chàm */
  --color-primary: #3a6470;
  --color-on-primary: #ffffff;
  --color-primary-soft: #e4ecee;

  /* Biểu tượng app (store, hướng A "Vòng đếm", vòng 1): nền teal đặc, mực trắng; lớp đơn sắc Android dùng màu nền làm mực. */
  --color-icon-field: #3a6470;
  --color-icon-ink: #ffffff;
  --color-icon-mono: #3a6470;

  /* Colour — nhấn. Hướng phẳng chỉ còn một màu nhấn (chàm). Quy tắc 3: accent làm nền, accent-ink làm chữ. */
  --color-accent: #3a6470;
  --color-on-accent: #ffffff;
  --color-accent-ink: #3a6470;
  --color-accent-soft: #e4ecee;

  /* Colour — chữ và đường. Chữ chính xám mực (không đen hẳn), chữ phụ 4,69:1 trên nền xám. Viền chỉ là đường kẻ mảnh; ô nhập dùng border-strong (3:1). */
  --color-text: #2e2e3c;
  --color-text-muted: #636366;
  --color-border: #e5e5ea;
  /* Đường kẻ mảnh giữa các dòng của nhóm (mới; cùng giá trị --color-border). */
  --color-separator: #e5e5ea;
  --color-border-strong: #8e8e93;

  /* Colour — trạng thái */
  --color-danger: #c62a1f;
  --color-success: #12794f;
  --color-scrim: rgba(28, 28, 40, 0.4);

  /* Lớp hình ảnh — mảng màu minh hoạ phẳng (không viền) */
  --color-illu-1: #c9f2d9;
  --color-illu-2: #ffe0cc;
  --color-illu-3: #ffd3e6;
  --color-illu-4: #cfe3ff;
  --color-illu-line: #8e8ea0;
  --gradient-hero: linear-gradient(var(--color-primary-soft), var(--color-primary-soft));
  --gradient-accent: linear-gradient(var(--color-accent-soft), var(--color-accent-soft));
  --ease-soft: cubic-bezier(.22, .61, .36, 1);

  /* Dòng thời gian (timeline): cột ngày, trục, chấm mốc */
  --color-rail: #cfcfd8;
  --timeline-date-col: 2rem;
  --timeline-dot-col: 1rem;
  --timeline-dot-size: 0.75rem;
  --timeline-rail-width: 2px;

  /* Lớp phủ trắng/đen trong suốt dùng trên nền theme (ô flip, chip, track, hoạ tiết) */
  --overlay-light: rgba(255, 255, 255, 0.7);
  --overlay-light-soft: rgba(255, 255, 255, 0.14);
  --overlay-dark: rgba(0, 0, 0, 0.26);
  --overlay-dark-soft: rgba(0, 0, 0, 0.1);
  --motif-none: linear-gradient(transparent, transparent);

  /* Typography — phông hệ thống; độ đậm nhẹ một bậc: tiêu đề/số 600, tiêu đề thẻ 500. */
  --font-family-base: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Apple SD Gothic Neo", "Hiragino Sans", "Noto Sans KR", "Noto Sans JP", system-ui, "Segoe UI", Roboto, sans-serif;
  /* Ba webfont của catalog mẫu (nạp ở @import đầu file; mỗi chuỗi có dự phòng hệ thống để widget/offline vẫn đọc được). */
  --font-family-serif-display: "Cormorant Garamond", Georgia, "Times New Roman", "Noto Serif", serif;
  --font-family-script: "Dancing Script", "Snell Roundhand", "Segoe Script", "Bradley Hand", cursive;
  --font-family-sans-vi: "Be Vietnam Pro", -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, "Segoe UI", Roboto, sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.8125rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.75rem;
  /* Hướng "Xám nhóm" (mới): tiêu đề lớn 32px, số trong dòng 20px (= --font-size-lg), cỡ iOS 17px cho nút văn bản. */
  --font-size-title: 2rem;
  --font-size-body-lg: 1.0625rem;
  /* Bậc lớn nhất, dành riêng cho CON SỐ đếm ngược chủ đạo (số lớn, chữ số flip). Đừng dùng cho chữ thường. */
  --font-size-2xl: 3.25rem;
  --font-size-flip: 3.25rem;
  --chart-label-size: 9;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* Spacing (nhịp 4/8) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;

  /* Đường viền, vùng chạm, biểu tượng */
  --border-hairline: 1px;
  --border-focus: 2px;
  --border-thick: 3px;
  --tap-target: 2.75rem;
  --icon-size-sm: 1rem;
  --icon-size-md: 1.25rem;
  --icon-size-lg: 1.5rem;
  --icon-size-xl: 2rem;
  --icon-stroke: 2;

  /* Radii — ba bậc + pill: sm 4 (chấm, thanh), md 8 (ô nhỏ, nút, ô nhập), lg 12 (thẻ, hero, sheet). Lồng nhau thì nhỏ dần (CR-01). */
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-pill: 999px;
  /* Hướng "Xám nhóm" (mới): nhóm 12 (= lg), segmented 9, ô trong segmented 7, thumbnail mẫu 8 (= md). */
  --radius-group: 0.75rem;
  --radius-seg: 0.5625rem;
  --radius-seg-item: 0.4375rem;
  --thumb-size: 2.75rem;
  --row-min-height: 4rem;
  --info-row-height: 3rem;

  /* Elevation — PHẲNG: không bóng. Giữ tên token để màn cũ không vỡ. Sheet dùng scrim + bề mặt phẳng. */
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;

  /* ======================================================================
     THEME SỰ KIỆN — màu của TỪNG đếm ngược, không phải của app. Màn không bao giờ
     viết màu theme cứng: chọn theme id rồi đọc --theme-<id>-*.
       -bg      nền (pastel đặc, hoặc gradient nhiều điểm dừng cho Pro)
       -fg      chữ + vòng/thanh trên nền đó (đã đo >= 4.5:1 trên MỌI điểm dừng)
       -accent  màu nhấn trang trí (vòng, thanh, chấm) — KHÔNG dùng làm chữ
     Theme Pro: -from/-mid/-to (ba điểm dừng), -glow (giờ là transparent, hướng phẳng không còn quầng sáng),
       -motif (hoạ tiết phẳng rất nhạt: chấm, sọc, vòng, mảng tròn).
     Cầu nối --cd-* do class theme (components/themes.module.css) ghi đè.
     ====================================================================== */
  --theme-on-premium: #ffffff;
  --theme-chip: #ffffff;
  --cd-bg: var(--theme-dalat-bg);
  --cd-fg: var(--theme-dalat-fg);
  --cd-accent: var(--theme-dalat-accent);
  --cd-track: var(--color-surface);
  --cd-row-ink: var(--theme-dalat-fg);
  --cd-row-line: var(--color-surface-sunken);
  --cd-glow: 0 0 0 0 transparent;
  /* Cầu nối mới: nền thẻ trong dòng thời gian, nền ô con, chấm mốc, hoạ tiết */
  --cd-tint: color-mix(in srgb, var(--theme-dalat-bg) 45%, var(--color-surface));
  --cd-inner: var(--overlay-light);
  --cd-dot: var(--theme-dalat-accent);
  --cd-motif: var(--motif-none);

  /* 60 theme = 6 nhóm x (4 miễn phí + 6 Pro). Sinh từ danh mục trong design-system/themes.yaml. Mỗi theme: -bg -fg -accent; Pro thêm -from -mid -to -glow -motif. */
  /* ---- Nhóm Pastel ---- */
  --theme-huong-bg: #e8dcff;
  --theme-huong-fg: #6338B8;
  --theme-huong-accent: #7340D8;
  --theme-dao-bg: #ffd8c2;
  --theme-dao-fg: #9d4811;
  --theme-dao-accent: #C2571A;
  --theme-may-bg: #d9e6f5;
  --theme-may-fg: #3A5F8A;
  --theme-may-accent: #4A74A8;
  --theme-bo-bg: #fff0b3;
  --theme-bo-fg: #856600;
  --theme-bo-accent: #A67C00;
  --theme-keobong-from: #FFC8E4;
  --theme-keobong-mid: #E4CCFF;
  --theme-keobong-to: #C4E4FF;
  --theme-keobong-bg: linear-gradient(145deg, var(--theme-keobong-from), var(--theme-keobong-mid), var(--theme-keobong-to));
  --theme-keobong-fg: #5A3A8F;
  --theme-keobong-accent: #851aff;
  --theme-keobong-glow: transparent;
  --theme-keobong-motif: radial-gradient(circle at 88% 12%, var(--overlay-light-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-light-soft) 0 3rem, transparent 3.05rem);
  --theme-macaron-from: #FFD6E0;
  --theme-macaron-mid: #FFF1C9;
  --theme-macaron-to: #C9F2E0;
  --theme-macaron-bg: linear-gradient(145deg, var(--theme-macaron-from), var(--theme-macaron-mid), var(--theme-macaron-to));
  --theme-macaron-fg: #6B3A4A;
  --theme-macaron-accent: #a37500;
  --theme-macaron-glow: transparent;
  --theme-macaron-motif: radial-gradient(circle, var(--overlay-light-soft) 0 0.09rem, transparent 0.1rem) 0 0 / 0.9rem 0.9rem;
  --theme-kemdau-from: #FFB8CC;
  --theme-kemdau-mid: #FFE0E8;
  --theme-kemdau-to: #FFF6F0;
  --theme-kemdau-bg: linear-gradient(145deg, var(--theme-kemdau-from), var(--theme-kemdau-mid), var(--theme-kemdau-to));
  --theme-kemdau-fg: #9d274e;
  --theme-kemdau-accent: #e20039;
  --theme-kemdau-glow: transparent;
  --theme-kemdau-motif: repeating-linear-gradient(135deg, var(--overlay-light-soft) 0 0.5rem, transparent 0.5rem 1.25rem);
  --theme-trasua-from: #E8D2B8;
  --theme-trasua-mid: #F4E4D0;
  --theme-trasua-to: #FBF1E4;
  --theme-trasua-bg: linear-gradient(145deg, var(--theme-trasua-from), var(--theme-trasua-mid), var(--theme-trasua-to));
  --theme-trasua-fg: #6B4A2A;
  --theme-trasua-accent: #a56a26;
  --theme-trasua-glow: transparent;
  --theme-trasua-motif: repeating-radial-gradient(circle at 100% 0, transparent 0 1rem, var(--overlay-light-soft) 1rem 1.15rem);
  --theme-bongbong-from: #BDE8FF;
  --theme-bongbong-mid: #E0D0FF;
  --theme-bongbong-to: #FFD0EC;
  --theme-bongbong-bg: linear-gradient(145deg, var(--theme-bongbong-from), var(--theme-bongbong-mid), var(--theme-bongbong-to));
  --theme-bongbong-fg: #3A4A9A;
  --theme-bongbong-accent: #6a1eff;
  --theme-bongbong-glow: transparent;
  --theme-bongbong-motif: radial-gradient(circle at 12% 8%, var(--overlay-light-soft) 0 3rem, transparent 3.05rem), radial-gradient(circle at 92% 95%, var(--overlay-light-soft) 0 4.5rem, transparent 4.55rem);
  --theme-holo-from: #C9F5E8;
  --theme-holo-mid: #CBD8FF;
  --theme-holo-to: #F0CFFF;
  --theme-holo-bg: linear-gradient(145deg, var(--theme-holo-from), var(--theme-holo-mid), var(--theme-holo-to));
  --theme-holo-fg: #3A4E8A;
  --theme-holo-accent: #1852ff;
  --theme-holo-glow: transparent;
  --theme-holo-motif: radial-gradient(circle at 88% 12%, var(--overlay-light-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-light-soft) 0 3rem, transparent 3.05rem);
  /* ---- Nhóm Tối giản ---- */
  --theme-thi-bg: #c8e1ff;
  --theme-thi-fg: #1F58B8;
  --theme-thi-accent: #1F64D4;
  --theme-giay-bg: #ece9e2;
  --theme-giay-fg: #5A5448;
  --theme-giay-accent: #6B6558;
  --theme-da-bg: #dde0e5;
  --theme-da-fg: #4A515C;
  --theme-da-accent: #5A6370;
  --theme-suong-bg: #e4eeee;
  --theme-suong-fg: #3F6464;
  --theme-suong-accent: #4F7A7A;
  --theme-mucden-from: #3A3A46;
  --theme-mucden-mid: #282830;
  --theme-mucden-to: #15151B;
  --theme-mucden-bg: linear-gradient(145deg, var(--theme-mucden-from), var(--theme-mucden-mid), var(--theme-mucden-to));
  --theme-mucden-fg: var(--theme-on-premium);
  --theme-mucden-accent: #838396;
  --theme-mucden-glow: transparent;
  --theme-mucden-motif: radial-gradient(circle at 88% 12%, var(--overlay-dark-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem);
  --theme-titan-from: #5B6472;
  --theme-titan-mid: #3D4452;
  --theme-titan-to: #272C36;
  --theme-titan-bg: linear-gradient(145deg, var(--theme-titan-from), var(--theme-titan-mid), var(--theme-titan-to));
  --theme-titan-fg: var(--theme-on-premium);
  --theme-titan-accent: #b1bac3;
  --theme-titan-glow: transparent;
  --theme-titan-motif: radial-gradient(circle, var(--overlay-dark-soft) 0 0.09rem, transparent 0.1rem) 0 0 / 0.9rem 0.9rem;
  --theme-bac-from: #F4F5F7;
  --theme-bac-mid: #D9DCE2;
  --theme-bac-to: #B8BDC7;
  --theme-bac-bg: linear-gradient(145deg, var(--theme-bac-from), var(--theme-bac-mid), var(--theme-bac-to));
  --theme-bac-fg: #2E3340;
  --theme-bac-accent: #5c6776;
  --theme-bac-glow: transparent;
  --theme-bac-motif: repeating-linear-gradient(135deg, var(--overlay-light-soft) 0 0.5rem, transparent 0.5rem 1.25rem);
  --theme-vanghong-from: #F8D8CF;
  --theme-vanghong-mid: #EDB8A8;
  --theme-vanghong-to: #D9998C;
  --theme-vanghong-bg: linear-gradient(145deg, var(--theme-vanghong-from), var(--theme-vanghong-mid), var(--theme-vanghong-to));
  --theme-vanghong-fg: #5A2A22;
  --theme-vanghong-accent: #98371e;
  --theme-vanghong-glow: transparent;
  --theme-vanghong-motif: repeating-radial-gradient(circle at 100% 0, transparent 0 1rem, var(--overlay-light-soft) 1rem 1.15rem);
  --theme-dentrang-from: #0E0E12;
  --theme-dentrang-mid: #34343c;
  --theme-dentrang-to: #5A5A66;
  --theme-dentrang-bg: linear-gradient(145deg, var(--theme-dentrang-from), var(--theme-dentrang-mid), var(--theme-dentrang-to));
  --theme-dentrang-fg: var(--theme-on-premium);
  --theme-dentrang-accent: #adadb1;
  --theme-dentrang-glow: transparent;
  --theme-dentrang-motif: radial-gradient(circle at 12% 8%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem), radial-gradient(circle at 92% 95%, var(--overlay-dark-soft) 0 4.5rem, transparent 4.55rem);
  --theme-baoxam-from: #6B7280;
  --theme-baoxam-mid: #4B5563;
  --theme-baoxam-to: #374151;
  --theme-baoxam-bg: linear-gradient(145deg, var(--theme-baoxam-from), var(--theme-baoxam-mid), var(--theme-baoxam-to));
  --theme-baoxam-fg: var(--theme-on-premium);
  --theme-baoxam-accent: #c6cdd1;
  --theme-baoxam-glow: transparent;
  --theme-baoxam-motif: radial-gradient(circle at 88% 12%, var(--overlay-dark-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem);
  /* ---- Nhóm Thiên nhiên ---- */
  --theme-dalat-bg: #c9f2d9;
  --theme-dalat-fg: #1F6B43;
  --theme-dalat-accent: #1A7A47;
  --theme-nang-bg: #ffe79a;
  --theme-nang-fg: #7A5800;
  --theme-nang-accent: #A67700;
  --theme-bien-bg: #b8f0ee;
  --theme-bien-fg: #0E6A6D;
  --theme-bien-accent: #0F7F83;
  --theme-mia-bg: #dcf5a8;
  --theme-mia-fg: #4A6A0A;
  --theme-mia-accent: #5E8A10;
  --theme-aurora-from: #0F766E;
  --theme-aurora-mid: #155E75;
  --theme-aurora-to: #1E3A8A;
  --theme-aurora-bg: linear-gradient(145deg, var(--theme-aurora-from), var(--theme-aurora-mid), var(--theme-aurora-to));
  --theme-aurora-fg: var(--theme-on-premium);
  --theme-aurora-accent: #73cde8;
  --theme-aurora-glow: transparent;
  --theme-aurora-motif: radial-gradient(circle at 88% 12%, var(--overlay-dark-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem);
  --theme-daiduong-from: #1D4ED8;
  --theme-daiduong-mid: #1862B0;
  --theme-daiduong-to: #0E7490;
  --theme-daiduong-bg: linear-gradient(145deg, var(--theme-daiduong-from), var(--theme-daiduong-mid), var(--theme-daiduong-to));
  --theme-daiduong-fg: var(--theme-on-premium);
  --theme-daiduong-accent: #9dc8f3;
  --theme-daiduong-glow: transparent;
  --theme-daiduong-motif: radial-gradient(circle, var(--overlay-dark-soft) 0 0.09rem, transparent 0.1rem) 0 0 / 0.9rem 0.9rem;
  --theme-rungsau-from: #14532D;
  --theme-rungsau-mid: #166534;
  --theme-rungsau-to: #3F6212;
  --theme-rungsau-bg: linear-gradient(145deg, var(--theme-rungsau-from), var(--theme-rungsau-mid), var(--theme-rungsau-to));
  --theme-rungsau-fg: var(--theme-on-premium);
  --theme-rungsau-accent: #54da87;
  --theme-rungsau-glow: transparent;
  --theme-rungsau-motif: repeating-linear-gradient(135deg, var(--overlay-dark-soft) 0 0.5rem, transparent 0.5rem 1.25rem);
  --theme-muathu-from: #B45309;
  --theme-muathu-mid: #9A3412;
  --theme-muathu-to: #7C2D12;
  --theme-muathu-bg: linear-gradient(145deg, var(--theme-muathu-from), var(--theme-muathu-mid), var(--theme-muathu-to));
  --theme-muathu-fg: var(--theme-on-premium);
  --theme-muathu-accent: #f5bca7;
  --theme-muathu-glow: transparent;
  --theme-muathu-motif: repeating-radial-gradient(circle at 100% 0, transparent 0 1rem, var(--overlay-dark-soft) 1rem 1.15rem);
  --theme-samac-from: #FDE7B0;
  --theme-samac-mid: #F7C98B;
  --theme-samac-to: #EBA77A;
  --theme-samac-bg: linear-gradient(145deg, var(--theme-samac-from), var(--theme-samac-mid), var(--theme-samac-to));
  --theme-samac-fg: #6B3A10;
  --theme-samac-accent: #8b540d;
  --theme-samac-glow: transparent;
  --theme-samac-motif: radial-gradient(circle at 12% 8%, var(--overlay-light-soft) 0 3rem, transparent 3.05rem), radial-gradient(circle at 92% 95%, var(--overlay-light-soft) 0 4.5rem, transparent 4.55rem);
  --theme-anhdao-from: #FFE4EC;
  --theme-anhdao-mid: #FFC9DA;
  --theme-anhdao-to: #F5A9C6;
  --theme-anhdao-bg: linear-gradient(145deg, var(--theme-anhdao-from), var(--theme-anhdao-mid), var(--theme-anhdao-to));
  --theme-anhdao-fg: #8A2048;
  --theme-anhdao-accent: #d0003f;
  --theme-anhdao-glow: transparent;
  --theme-anhdao-motif: radial-gradient(circle at 88% 12%, var(--overlay-light-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-light-soft) 0 3rem, transparent 3.05rem);
  /* ---- Nhóm Bầu trời ---- */
  --theme-troiquang-bg: #cfe8ff;
  --theme-troiquang-fg: #1D5E9E;
  --theme-troiquang-accent: #2670BE;
  --theme-binhminh-bg: #ffe0cc;
  --theme-binhminh-fg: #A04A1A;
  --theme-binhminh-accent: #C45A22;
  --theme-rangchieu-bg: #f5d5f0;
  --theme-rangchieu-fg: #8A3A8A;
  --theme-rangchieu-accent: #A545A5;
  --theme-trangnon-bg: #dde3fa;
  --theme-trangnon-fg: #3F4DA6;
  --theme-trangnon-accent: #4F5FC4;
  --theme-hoanghon-from: #BE185D;
  --theme-hoanghon-mid: #AD2A3F;
  --theme-hoanghon-to: #9A3412;
  --theme-hoanghon-bg: linear-gradient(145deg, var(--theme-hoanghon-from), var(--theme-hoanghon-mid), var(--theme-hoanghon-to));
  --theme-hoanghon-fg: var(--theme-on-premium);
  --theme-hoanghon-accent: #e9a5b1;
  --theme-hoanghon-glow: transparent;
  --theme-hoanghon-motif: radial-gradient(circle at 88% 12%, var(--overlay-dark-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem);
  --theme-thienha-from: #6D28D9;
  --theme-thienha-mid: #3B2A9A;
  --theme-thienha-to: #1E1B4B;
  --theme-thienha-bg: linear-gradient(145deg, var(--theme-thienha-from), var(--theme-thienha-mid), var(--theme-thienha-to));
  --theme-thienha-fg: var(--theme-on-premium);
  --theme-thienha-accent: #aca1e5;
  --theme-thienha-glow: transparent;
  --theme-thienha-motif: radial-gradient(circle, var(--overlay-dark-soft) 0 0.09rem, transparent 0.1rem) 0 0 / 0.9rem 0.9rem;
  --theme-demsao-from: #0B1030;
  --theme-demsao-mid: #1B2A6B;
  --theme-demsao-to: #3B2F8F;
  --theme-demsao-bg: linear-gradient(145deg, var(--theme-demsao-from), var(--theme-demsao-mid), var(--theme-demsao-to));
  --theme-demsao-fg: var(--theme-on-premium);
  --theme-demsao-accent: #7185db;
  --theme-demsao-glow: transparent;
  --theme-demsao-motif: repeating-linear-gradient(135deg, var(--overlay-dark-soft) 0 0.5rem, transparent 0.5rem 1.25rem);
  --theme-giovang-from: #FFE9A8;
  --theme-giovang-mid: #FFC98A;
  --theme-giovang-to: #FFA78F;
  --theme-giovang-bg: linear-gradient(145deg, var(--theme-giovang-from), var(--theme-giovang-mid), var(--theme-giovang-to));
  --theme-giovang-fg: #7A3410;
  --theme-giovang-accent: #9f5200;
  --theme-giovang-glow: transparent;
  --theme-giovang-motif: repeating-radial-gradient(circle at 100% 0, transparent 0 1rem, var(--overlay-light-soft) 1rem 1.15rem);
  --theme-chantroi-from: #BFE3FF;
  --theme-chantroi-mid: #E6DDFF;
  --theme-chantroi-to: #FFD9C9;
  --theme-chantroi-bg: linear-gradient(145deg, var(--theme-chantroi-from), var(--theme-chantroi-mid), var(--theme-chantroi-to));
  --theme-chantroi-fg: #2F4A8A;
  --theme-chantroi-accent: #632bff;
  --theme-chantroi-glow: transparent;
  --theme-chantroi-motif: radial-gradient(circle at 12% 8%, var(--overlay-light-soft) 0 3rem, transparent 3.05rem), radial-gradient(circle at 92% 95%, var(--overlay-light-soft) 0 4.5rem, transparent 4.55rem);
  --theme-changvang-from: #3B3A9E;
  --theme-changvang-mid: #7B3FA0;
  --theme-changvang-to: #C0467A;
  --theme-changvang-bg: linear-gradient(145deg, var(--theme-changvang-from), var(--theme-changvang-mid), var(--theme-changvang-to));
  --theme-changvang-fg: var(--theme-on-premium);
  --theme-changvang-accent: #dac9e8;
  --theme-changvang-glow: transparent;
  --theme-changvang-motif: radial-gradient(circle at 88% 12%, var(--overlay-dark-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem);
  /* ---- Nhóm Lễ hội ---- */
  --theme-tet-bg: #ffc6b9;
  --theme-tet-fg: #A5301B;
  --theme-tet-accent: #B8321A;
  --theme-sinhnhat-bg: #ffd3e6;
  --theme-sinhnhat-fg: #A02D63;
  --theme-sinhnhat-accent: #B52A66;
  --theme-concert-bg: #d9ccff;
  --theme-concert-fg: #4B3BB5;
  --theme-concert-accent: #5A3FE0;
  --theme-giangsinh-bg: #cdebd3;
  --theme-giangsinh-fg: #1E6B32;
  --theme-giangsinh-accent: #C0302A;
  --theme-trungthu-from: #FFE08A;
  --theme-trungthu-mid: #FFB84D;
  --theme-trungthu-to: #FF9A5C;
  --theme-trungthu-bg: linear-gradient(145deg, var(--theme-trungthu-from), var(--theme-trungthu-mid), var(--theme-trungthu-to));
  --theme-trungthu-fg: #6B2E00;
  --theme-trungthu-accent: #8b5300;
  --theme-trungthu-glow: transparent;
  --theme-trungthu-motif: radial-gradient(circle at 88% 12%, var(--overlay-light-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-light-soft) 0 3rem, transparent 3.05rem);
  --theme-halloween-from: #2E1065;
  --theme-halloween-mid: #6B21A8;
  --theme-halloween-to: #C2410C;
  --theme-halloween-bg: linear-gradient(145deg, var(--theme-halloween-from), var(--theme-halloween-mid), var(--theme-halloween-to));
  --theme-halloween-fg: var(--theme-on-premium);
  --theme-halloween-accent: #d8baf4;
  --theme-halloween-glow: transparent;
  --theme-halloween-motif: radial-gradient(circle, var(--overlay-dark-soft) 0 0.09rem, transparent 0.1rem) 0 0 / 0.9rem 0.9rem;
  --theme-phaohoa-from: #0B1030;
  --theme-phaohoa-mid: #4C1D95;
  --theme-phaohoa-to: #BE185D;
  --theme-phaohoa-bg: linear-gradient(145deg, var(--theme-phaohoa-from), var(--theme-phaohoa-mid), var(--theme-phaohoa-to));
  --theme-phaohoa-fg: var(--theme-on-premium);
  --theme-phaohoa-accent: #c8abf1;
  --theme-phaohoa-glow: transparent;
  --theme-phaohoa-motif: repeating-linear-gradient(135deg, var(--overlay-dark-soft) 0 0.5rem, transparent 0.5rem 1.25rem);
  --theme-longden-from: #9F1239;
  --theme-longden-mid: #C2410C;
  --theme-longden-to: #B45309;
  --theme-longden-bg: linear-gradient(145deg, var(--theme-longden-from), var(--theme-longden-mid), var(--theme-longden-to));
  --theme-longden-fg: var(--theme-on-premium);
  --theme-longden-accent: #f8bea7;
  --theme-longden-glow: transparent;
  --theme-longden-motif: repeating-radial-gradient(circle at 100% 0, transparent 0 1rem, var(--overlay-dark-soft) 1rem 1.15rem);
  --theme-demnoel-from: #14532D;
  --theme-demnoel-mid: #6B2D2D;
  --theme-demnoel-to: #991B1B;
  --theme-demnoel-bg: linear-gradient(145deg, var(--theme-demnoel-from), var(--theme-demnoel-mid), var(--theme-demnoel-to));
  --theme-demnoel-fg: var(--theme-on-premium);
  --theme-demnoel-accent: #cf8d8d;
  --theme-demnoel-glow: transparent;
  --theme-demnoel-motif: radial-gradient(circle at 12% 8%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem), radial-gradient(circle at 92% 95%, var(--overlay-dark-soft) 0 4.5rem, transparent 4.55rem);
  --theme-tiecdem-from: #6D28D9;
  --theme-tiecdem-mid: #BE185D;
  --theme-tiecdem-to: #C2410C;
  --theme-tiecdem-bg: linear-gradient(145deg, var(--theme-tiecdem-from), var(--theme-tiecdem-mid), var(--theme-tiecdem-to));
  --theme-tiecdem-fg: var(--theme-on-premium);
  --theme-tiecdem-accent: #f7b5cf;
  --theme-tiecdem-glow: transparent;
  --theme-tiecdem-motif: radial-gradient(circle at 88% 12%, var(--overlay-dark-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem);
  /* ---- Nhóm Tình yêu ---- */
  --theme-love-bg: #ffd9df;
  --theme-love-fg: #B02347;
  --theme-love-accent: #C4264A;
  --theme-hoahong-bg: #ffccd5;
  --theme-hoahong-fg: #A31D4A;
  --theme-hoahong-accent: #C0245A;
  --theme-dautay-bg: #ffd1c9;
  --theme-dautay-fg: #A8281C;
  --theme-dautay-accent: #C42E22;
  --theme-thutinh-bg: #f8e1e7;
  --theme-thutinh-fg: #8E3A55;
  --theme-thutinh-accent: #A8456A;
  --theme-hongtim-from: #BE123C;
  --theme-hongtim-mid: #9D1F6E;
  --theme-hongtim-to: #6D28D9;
  --theme-hongtim-bg: linear-gradient(145deg, var(--theme-hongtim-from), var(--theme-hongtim-mid), var(--theme-hongtim-to));
  --theme-hongtim-fg: var(--theme-on-premium);
  --theme-hongtim-accent: #ec9bcd;
  --theme-hongtim-glow: transparent;
  --theme-hongtim-motif: radial-gradient(circle at 88% 12%, var(--overlay-dark-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem);
  --theme-lua-from: #B91C1C;
  --theme-lua-mid: #A8420F;
  --theme-lua-to: #A16207;
  --theme-lua-bg: linear-gradient(145deg, var(--theme-lua-from), var(--theme-lua-mid), var(--theme-lua-to));
  --theme-lua-fg: var(--theme-on-premium);
  --theme-lua-accent: #f6bea9;
  --theme-lua-glow: transparent;
  --theme-lua-motif: radial-gradient(circle, var(--overlay-dark-soft) 0 0.09rem, transparent 0.1rem) 0 0 / 0.9rem 0.9rem;
  --theme-valentine-from: #881337;
  --theme-valentine-mid: #BE123C;
  --theme-valentine-to: #DB2757;
  --theme-valentine-bg: linear-gradient(145deg, var(--theme-valentine-from), var(--theme-valentine-mid), var(--theme-valentine-to));
  --theme-valentine-fg: var(--theme-on-premium);
  --theme-valentine-accent: #f8c0cf;
  --theme-valentine-glow: transparent;
  --theme-valentine-motif: repeating-linear-gradient(135deg, var(--overlay-dark-soft) 0 0.5rem, transparent 0.5rem 1.25rem);
  --theme-tohong-from: #FFD1DC;
  --theme-tohong-mid: #FFB3C8;
  --theme-tohong-to: #F78FB3;
  --theme-tohong-bg: linear-gradient(145deg, var(--theme-tohong-from), var(--theme-tohong-mid), var(--theme-tohong-to));
  --theme-tohong-fg: #7e153a;
  --theme-tohong-accent: #b90036;
  --theme-tohong-glow: transparent;
  --theme-tohong-motif: repeating-radial-gradient(circle at 100% 0, transparent 0 1rem, var(--overlay-light-soft) 1rem 1.15rem);
  --theme-mongmo-from: #FFD9EC;
  --theme-mongmo-mid: #E3D1FF;
  --theme-mongmo-to: #CFE0FF;
  --theme-mongmo-bg: linear-gradient(145deg, var(--theme-mongmo-from), var(--theme-mongmo-mid), var(--theme-mongmo-to));
  --theme-mongmo-fg: #5B3A9A;
  --theme-mongmo-accent: #761fff;
  --theme-mongmo-glow: transparent;
  --theme-mongmo-motif: radial-gradient(circle at 12% 8%, var(--overlay-light-soft) 0 3rem, transparent 3.05rem), radial-gradient(circle at 92% 95%, var(--overlay-light-soft) 0 4.5rem, transparent 4.55rem);
  --theme-traitim-from: #9D174D;
  --theme-traitim-mid: #BE185D;
  --theme-traitim-to: #C81E4A;
  --theme-traitim-bg: linear-gradient(145deg, var(--theme-traitim-from), var(--theme-traitim-mid), var(--theme-traitim-to));
  --theme-traitim-fg: var(--theme-on-premium);
  --theme-traitim-accent: #f6abc9;
  --theme-traitim-glow: transparent;
  --theme-traitim-motif: radial-gradient(circle at 88% 12%, var(--overlay-dark-soft) 0 4rem, transparent 4.05rem), radial-gradient(circle at 6% 100%, var(--overlay-dark-soft) 0 3rem, transparent 3.05rem);
  /* Template surfaces (components/templates): decorative literals and runtime-provided variables. Added, never renamed. */
  --tpl-photo-sky: #7fb6ee;
  --tpl-photo-sand: #f6d9b0;
  --tpl-photo-sun: #ffe9a8;
  --tpl-photo-hill: #2f6b4b;
  --tpl-photo-hill-far: #4a9468;
  --tpl-paper-warm: #fffdf8;
  --tpl-night: #0c0c22;
  --tpl-moon: #f3f1ff;
  --tpl-ink: #000000;
  --tpl-on-image: #ffffff;
  /* Photo scrim: flat --tpl-ink overlay at this opacity on every template photo, so --tpl-on-image text holds >= 4.5:1 even on a pure white photo. */
  --tpl-scrim-a: 0.65;
  /* Set inline by TemplateSurface / Disp; these are only the fallbacks. */
  --tpl-sbg: var(--color-bg);
  --tpl-stint: var(--color-surface-sunken);
  --tpl-fs: 3rem;
  --tpl-al: flex-start;
  --tpl-wl: 0.5;
  --tpl-wr: 0.5;
  --tpl-photo-url: linear-gradient(transparent, transparent);
}

/* Chế độ tối ngoài phạm vi bản 1.0 (PRD §4): không có khối tối. */