/* Sirah (KAFA Darjah 2) — tema subjek: pasir Makkah + hijau kurma + emas.
   Gaya asas dari _core/css/style.css. KAFA: ilustrasi = emoji loket sahaja
   (tiada wajah/tubuh baginda ﷺ, sahabat atau malaikat). */
:root {
  --blue: #2f7d4f;          /* hijau kurma — aksen utama */
  --sky: #fdf6e6;           /* pasir cerah (latar lembut) */
}
body {
  background: var(--sky) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120"><circle cx="24" cy="28" r="4" fill="%23f3e2b8"/><circle cx="88" cy="66" r="5" fill="%23e6f2e3"/><circle cx="56" cy="98" r="3" fill="%23ffeec2"/></svg>');
}
.homehead h1 { color: var(--blue); letter-spacing: .06em; }
.namecard h1, .celcard h2 { color: var(--blue); }
.btn.primary { background: #a97c1e; border-color: #8a6318; } /* emas pekat — teks putih kekal kontras */
.opt { border-color: #f0e3c2; }
.opt:hover:not(.good):not(.bad):not(.picked):not(.tested) { background: #f7eed8; } /* jangan tutup feedback teras semasa hover */
.listenbtn { background: #fff; border-color: var(--blue); box-shadow: 0 6px 18px rgba(47, 125, 79, .22); }
.stage { border-top: 6px solid #c8a15a; }          /* aksen emas */
.gnum { background: #f3ead2; }
.trophy { background: #ffd84d; }

/* garis masa zaman sirah — potongan emas putus-putus; petunjuk kosong dari teras */
.answerrow {
  border-color: #c8a15a;
}

/* kad sirah berloket — imej loket besar dalam qsub */
.qsub { font-size: clamp(2.4rem, 9vw, 3.6rem); }

/* tong sort tinggi & slot di bawah — pusat tong kekal kosong (elak klik ditelan chip disabled) */
.bin { min-height: 220px; }
.bin .bslot { margin-top: auto; }