/* ============================================================
   DESIGN TOKENS — đổi palette của couple ở đúng một chỗ này
   ============================================================ */

:root {
  /* ---- Color ------------------------------------------------ */
  --paper: #F7F3ED;
  --paper-deep: #EFE8DE;
  --ink: #24211F;
  --ink-soft: #5B534D;
  --ink-faint: #9A9089;
  --accent: #8B6F5A;
  --soft: #D8C7B8;
  --night: #191817;

  /* ---- Type scale (fluid) ----------------------------------- */
  --text-micro: 0.6875rem;
  --text-label: 0.75rem;
  --text-body: clamp(1rem, 0.95rem + 0.2vw, 1.0625rem);
  --text-chapter: clamp(2rem, 1.2rem + 3.4vw, 4.25rem);
  --text-display: clamp(3.25rem, 1rem + 9vw, 9rem);
  --text-mega: clamp(4rem, 0.5rem + 13vw, 13rem);

  /* ---- Rhythm ----------------------------------------------- */
  --space-section: clamp(5rem, 3rem + 8vw, 11rem);
  --gutter: clamp(1.25rem, 0.5rem + 3vw, 4.5rem);

  /* ---- Motion ----------------------------------------------- */
  --dur-fast: 180ms;
  --dur-normal: 420ms;
  --dur-slow: 900ms;
  --dur-cinematic: 1600ms;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out-soft: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ---- Surface ---------------------------------------------- */
  --hairline: 1px solid rgba(36, 33, 31, 0.14);
  --shadow-lift: 0 24px 60px -28px rgba(36, 33, 31, 0.4);
  --shadow-float: 0 12px 30px -14px rgba(36, 33, 31, 0.28);

  /* ---- Chibi (đọc bởi chibi.js qua CSS var) ------------------ */
  --skin: #F0D2BC;
  --hair-a: #2E2724;
  --hair-b: #4A3527;
  --outfit-a: #3C4A54;
  --outfit-b: #C9A08A;

  color-scheme: light;
}

/* Section tối dùng chung một bộ token đảo ngược */
.on-night {
  --paper: #191817;
  --paper-deep: #211F1D;
  --ink: #F2EBE1;
  --ink-soft: #B6ABA0;
  --ink-faint: #9A9089;
  --hairline: 1px solid rgba(247, 243, 237, 0.16);
}