/* Generated by @eggspot/color-core — accent #d97706, gray #808080 */

:root {
  --radius: 8px;

  --background: #ffffff;

  --accent-1: #fefdfb;
  --accent-2: #fff8f0;
  --accent-3: #ffecd5;
  --accent-4: #ffe1c1;
  --accent-5: #ffd5ab;
  --accent-6: #ffc697;
  --accent-7: #f5b583;
  --accent-8: #e89b5c;
  --accent-9: #d97706;
  --accent-10: #cc6b00;
  --accent-11: #b55900;
  --accent-12: #533013;

  --gray-1: #fcfcfc;
  --gray-2: #f9f9f9;
  --gray-3: #efefef;
  --gray-4: #e8e8e8;
  --gray-5: #e0e0e0;
  --gray-6: #d8d8d8;
  --gray-7: #cecece;
  --gray-8: #bbbbbb;
  --gray-9: #8d8d8d;
  --gray-10: #838383;
  --gray-11: #646464;
  --gray-12: #202020;

  --accent-contrast: #ffffff;
  --accent-surface: #fff6eccc;
  --accent-indicator: #d97706;
  --accent-track: #d97706;
  --gray-surface: #ffffffcc;
}

.dark {
  --background: #000000;

  --accent-1: #000000;
  --accent-2: #160f09;
  --accent-3: #2f1804;
  --accent-4: #431e00;
  --accent-5: #532800;
  --accent-6: #643506;
  --accent-7: #7b4616;
  --accent-8: #9f5c1e;
  --accent-9: #d97706;
  --accent-10: #cc6b00;
  --accent-11: #ffa860;
  --accent-12: #f8dbc6;

  --gray-1: #000000;
  --gray-2: #121212;
  --gray-3: #1f1f1f;
  --gray-4: #282828;
  --gray-5: #303030;
  --gray-6: #3a3a3a;
  --gray-7: #484848;
  --gray-8: #606060;
  --gray-9: #6e6e6e;
  --gray-10: #7b7b7b;
  --gray-11: #b4b4b4;
  --gray-12: #eeeeee;

  --accent-contrast: #ffffff;
  --accent-surface: #2c1e1280;
  --accent-indicator: #d97706;
  --accent-track: #d97706;
  --gray-surface: rgba(0, 0, 0, 0.05);
}

/* Nền "đêm công nghiệp": thang xám mặc định lấy đen tuyệt đối (#000) làm nền,
   nhìn gắt trên màn hình điện thoại giữa đêm. Chặn 6 bậc nền/viền về tông zinc
   ấm hơn (#18181B → #3F3F46) — vẫn giữ nguyên bậc chữ 11/12 nên tương phản
   chữ trên nền không đổi (gray-11 8.3:1, gray-12 13.6:1). */
.dark {
  --background: #18181b;
  --gray-1: #18181b;
  --gray-2: #27272a;
  --gray-3: #323238;
  --gray-4: #3a3a41;
  --gray-5: #45454d;
  --gray-6: #3f3f46;
  --gray-surface: rgba(24, 24, 27, 0.6);
}