/* AI Mỗi Ngày — tokens web, phong cách "đài quan sát lúc nửa đêm":
   nền than đen nhiều lớp, chữ trắng băng, viền sáng như nét wireframe,
   một màu xanh coban tô từ nhấn trong tiêu đề, một màu cam cho nút hành động.
   Khung chat trong ảnh minh hoạ giữ hệ tối của app thật: nhóm --app-*. */
:root {
  /* Bề mặt — xếp lớp, không đổ bóng */
  --void: #000000;      /* nền trang */
  --carbon: #0D0D0F;    /* thẻ, khối nổi */
  --graphite: #232529;  /* dải giữa, chân trang */
  --slate: #2B2F33;     /* bảng, ô nổi nhất */

  /* Chữ — tương phản đo trên #000 */
  --ice: #D8EAFF;                         /* chữ chính + viền chủ đạo, 17:1 */
  --text-2: rgba(216, 234, 255, 0.72);    /* chữ thân phụ, ~9:1 */
  --text-3: rgba(216, 234, 255, 0.56);    /* nhãn, chú thích, ~5.5:1 */
  --fog: #6C757F;                         /* chỉ cho chữ ≥ 24px hoặc trang trí (4.2:1) */

  /* Viền sáng */
  --line: rgba(216, 234, 255, 0.2);       /* viền thẻ, đường phân cách */
  --line-strong: rgba(216, 234, 255, 0.45);
  --line-full: #D8EAFF;                   /* khung "ống ngắm", focus */

  /* Hai màu nhấn — đúng hai, mỗi màu một việc */
  --cobalt: #1F58F2;    /* tô TỪ nhấn trong tiêu đề lớn, chấm góc khung, hạt — không dùng cho chữ nhỏ (3.9:1) */
  --orange: #FF4105;    /* chỉ nút hành động dạng viền + mục điều hướng đang chọn (6.1:1) */
  --orange-wash: rgba(255, 65, 5, 0.12);

  /* Chữ */
  --font: "Monument", "Be Vietnam Pro", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;
  --font-mono: "JetBrains Mono", Consolas, "Cascadia Mono", ui-monospace, monospace;
  --fs-display: clamp(44px, 6.7vw, 96px);
  --fs-heading: clamp(36px, 4.4vw, 64px);
  --fs-heading-sm: 24px;
  --fs-lead: clamp(18px, 1.6vw, 22px);
  --fs-body: 16px;
  --fs-small: 15px;
  --fs-label: 12px;
  --fs-code: 14px;
  --track-display: -0.03em;
  --track-heading: -0.01em;
  --track-label: 0.16em;
  --track-ui: 0.06em;
  --lh-body: 1.6;

  /* Khoảng — rộng, nhịp tạp chí */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 80px;
  --sp-9: 100px;

  /* Bo góc */
  --r-tag: 8px;
  --r-btn: 8px;
  --r-card: 16px;
  --r-lg: 24px;

  /* Bố cục */
  --wrap: 1280px;
  --doc: 780px;
  --topbar-h: 64px;

  /* Ảnh minh hoạ khung chat — hệ tối của app thật, không đổi */
  --app-bg: #2B2B2B;
  --app-bg-deep: #232323;
  --app-surface: #333333;
  --app-surface-hover: #3D3D3D;
  --app-surface-press: #454545;
  --app-bubble: #2C3A2E;
  --app-border: #474747;
  --app-border-strong: #5C5C5C;
  --app-divider: #3A3A3A;
  --app-input-border: #4A4A4A;
  --app-text: #EDEDED;
  --app-text-2: #B8B8B8;
  --app-text-3: #A3A3A3;
  --app-accent: #5FAE6E;
  --app-accent-press: #8ACD96;
  --app-on-accent: #201E1D;
  --app-success: #AEBF92;
  --app-success-tint: #2E3526;
  --app-warning: #E3B55B;
  --app-warning-tint: #3A3222;
  --app-warning-text: #D8CDB8;
  --app-error: #EF7F7F;
  --app-error-tint: #3E2A2A;
  --ai-claude: #E0936A;
  --ai-gpt: #74C7A5;
  --ai-gemini: #86A8F0;

  /* Chỉ trong hình minh hoạ màn SmartScreen */
  --illus-win-blue: #1F4064;
  --illus-win-text-2: rgba(237, 237, 237, 0.8);
}
