/* Design tokens HijaiyahKu. Ubah warna/ukuran di sini saja. */
@font-face {
  font-family: 'Baloo 2';
  src: url('../fonts/baloo-2-latin-600-normal.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Baloo 2';
  src: url('../fonts/baloo-2-latin-800-normal.woff2') format('woff2');
  font-weight: 800;
  font-display: swap;
}
@font-face {
  font-family: 'Noto Naskh Arabic';
  src: url('../fonts/noto-naskh-arabic-arabic-500-normal.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'Noto Naskh Arabic';
  src: url('../fonts/noto-naskh-arabic-arabic-700-normal.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
}

:root {
  /* Netral: putih bersih dengan abu dingin tipis. Warna datang dari pulau, bukan dari latar. */
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-2: #f4f6fa;   /* panel cekung: field, jalur peta, track */
  --ink: #232a3d;
  --ink-soft: #586079;    /* 6.4:1 di atas putih */
  --line: #e4e8ef;        /* border tipis */
  --line-strong: #cdd4df; /* bayangan tombol 3D netral */
  --mute: #8a92a6;        /* ikon terkunci, placeholder */

  --teal: #13a89e;  --teal-soft: #d5f3ef;  --teal-ink: #0a6c65;
  --sun: #ffb62e;   --sun-soft: #fff0b3;   --sun-ink: #8f5300;
  --coral: #ff6f61; --coral-soft: #ffe1dd; --coral-ink: #a8352a;
  --sky: #3ea6ff;   --sky-soft: #dcefff;   --sky-ink: #135e9f;
  --grape: #9b6dff; --grape-soft: #ece3ff; --grape-ink: #5631ad;
  --leaf: #4fb85f;  --leaf-soft: #ddf5e0;  --leaf-ink: #2b7236;

  --ok: #2fb463;
  --bad: #ff6f61;

  --r-sm: 14px;
  --r-md: 22px;
  --r-lg: 32px;
  --press: 0 6px 0;
  --tap: 64px;
  --gap: 16px;

  --font-ui: 'Baloo 2', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-ar: 'Noto Naskh Arabic', 'Geeza Pro', 'Arabic Typesetting', serif;
}