/* Akidah (KAFA Darjah 5) — tema: biru malam → ungu lembut + emas; kad krim.
   Kafa §4: TIADA audio bacaan/doa bersuara (visual sahaja) — tiada medan f:/play: dalam kandungan. */

:root {
  --ink: #2a2340;
  --paper: #fffaf0;          /* kad krim */
  --blue: #5b4b9e;           /* ungu lembut — tajuk & aksen */
  --sky: #f1eefb;            /* latar ungu lembut */
  --gold: #d9a441;
  --red: #d1655c;
  --green: #2f9e6f;
  --green-d: #257a56;
}

body {
  background: var(--sky) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120"><circle cx="20" cy="30" r="4" fill="%23e4dffa"/><circle cx="90" cy="70" r="5" fill="%23f7edc9"/><circle cx="55" cy="100" r="3" fill="%23e8f6ee"/></svg>');
}

.homehead h1 { color: var(--blue); letter-spacing: .06em; }
.namecard h1, .celcard h2 { color: var(--blue); }
.btn.primary { background: var(--blue); border-color: #463a7d; }
.trophy { background: #ffd88a; color: #6b4b00; }

.opt { border-color: #ddd6f3; }
.opt:hover { background: #e9e4fa; }
.chip, .slot, .blank { border-color: #cfc7ec; }
.slot, .blank { background: #f7f5fe; }
.clozeline { background: var(--paper); }

/* panel petikan: kad krim bertepi emas (§5) */
.passage { background: var(--paper); border-color: var(--gold); }

/* kod warna konsep: tauhid 🔵 · syirik 🔴 · taubat 🟢 · amal soleh 🟡 (§5)
   `cls` pada opsyen beri warna; pemilih :not(...) pastikan maklum balas teras menang. */
.opt.tauhid:not(.good):not(.bad):not(.picked) { background: #e6eefc; border-color: #2f7fe8; }
.opt.syirik:not(.good):not(.bad):not(.picked) { background: #fdeaea; border-color: #e4574c; }
.opt.taubat:not(.good):not(.bad):not(.picked) { background: #e3f6ea; border-color: #2fb457; }
.opt.amal:not(.good):not(.bad):not(.picked)   { background: #fff6dc; border-color: #e8a900; }

.arab { font-size: 1.15em; }