/* ===== Babak · gaya pakej enjin Bab 10, kumpulan 10a (js/pakej-bab-10-10a.js): sangkar, mentol, upacara.
   Awalan kelas, keyframes dan pemboleh ubah CSS: b10a-. Susun atur diskop dengan .b2-j-<jenis> / .b2-p-<jenis>,
   body.mod-lebar / body.mod-telefon, telefon pendek @media (max-height:700px). Palet Babak. ===== */

/* ---------- Bersama ---------- */
.b10a-goncang{animation:goncang .4s}
.b10a-klon-seret{position:absolute;z-index:40;margin:0;pointer-events:none;transition:none!important;animation:none!important;box-shadow:0 16px 28px rgba(27,42,92,.32)!important}
.b10a-terbang{position:absolute;z-index:40;margin:0;pointer-events:none;transition:none!important}
.b2-main .b10a-sangkar[data-sibuk],.b2-main .b10a-mentol[data-sibuk],.b2-main .b10a-upacara[data-sibuk]{cursor:progress}
.b2-j-sangkar .b2-kad-no,.b2-j-mentol .b2-kad-no,.b2-j-upacara .b2-kad-no{font-size:.875rem;letter-spacing:.04em}
.b2-j-sangkar .b2-kad-isi,.b2-j-mentol .b2-kad-isi,.b2-j-upacara .b2-kad-isi{font-size:1.0625rem;overflow-wrap:break-word}
.b2-j-sangkar .b2-rujuk-btn,.b2-j-mentol .b2-rujuk-btn,.b2-j-upacara .b2-rujuk-btn{font-size:.875rem;min-height:44px}
.b2-j-sangkar .b2-rumus-tokoh li,.b2-j-mentol .b2-rumus-tokoh li,.b2-j-upacara .b2-rumus-tokoh li{font-size:.875rem;line-height:1.35;align-content:start}
.b2-j-sangkar .b2-rumus-label,.b2-j-mentol .b2-rumus-label,.b2-j-upacara .b2-rumus-label{font-size:.875rem}
.b2-j-sangkar .op,.b2-j-mentol .op,.b2-j-upacara .op{min-height:50px;font-size:.9375rem;overflow-wrap:break-word}
.b10a-rumus li.b10a-rumus-penuh{grid-column:1/-1}
.b10a-rumus-baris{display:grid;gap:3px}
.b10a-rumus-baris > span{position:relative;padding-left:12px}
.b10a-rumus-baris > span::before{content:"";position:absolute;left:1px;top:.5em;width:6px;height:6px;border-radius:50%;background:var(--teal)}
.b10a-mt-rumus > li{box-shadow:inset 4px 0 0 var(--b10a-w,var(--teal))}
.b10a-mt-rumus .b10a-rumus-baris > span::before{background:#FFD54F;box-shadow:0 0 0 2px var(--b10a-w,var(--teal))}
@keyframes b10a-masuk-atas{from{transform:translateY(-14px);opacity:0}to{transform:none;opacity:1}}
@keyframes b10a-masuk-bawah{from{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}
@keyframes b10a-pop{0%{transform:scale(.5);opacity:0}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}

/* =====================================================================================
   10.1 SANGKAR · SANGKAR MERDEKA
   ===================================================================================== */
.b10a-sangkar{display:grid;gap:10px;min-width:0}
.b10a-sk-taman{display:grid;gap:10px;min-width:0}
.b10a-sk-adegan{position:relative;min-width:0;border-radius:22px;overflow:hidden;border:3px solid #fff;background:#CFEFFC;box-shadow:var(--bayang)}
.b10a-sk-svg{display:block;width:100%;height:auto}
.b10a-sk-kanan{display:grid;gap:10px;min-width:0;align-content:start}
.b10a-sk-kanan > [hidden]{display:none}
/* kad takrif: kertas dengan pin */
.b10a-sk-takrif{position:relative;display:grid;gap:6px;min-width:0;padding:13px 14px 12px;border-radius:16px;background:#FFFDF6;box-shadow:var(--lip),inset 0 0 0 2px #EADFC4}
.b10a-sk-takrif::before{content:"";position:absolute;top:-6px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:#F94F55;box-shadow:0 2px 0 #C9323F}
.b10a-sk-takrif.masuk{animation:b10a-masuk-atas .42s ease-out both}
.b10a-sk-tokoh{display:flex;align-items:center;gap:6px;font-size:1rem;font-weight:900;line-height:1.25;color:var(--ink)}
.b10a-sk-tokoh-ikon{width:18px;height:18px;flex:none;color:var(--ungu)}
.b10a-sk-ket{font-size:.875rem;font-weight:700;line-height:1.3;color:var(--ink2)}
.b10a-sk-petikan{margin:0;padding:4px 0 4px 12px;border-left:4px solid var(--emas);font-size:.9375rem;font-weight:800;line-height:1.45;color:var(--ink);overflow-wrap:break-word}
.b10a-sk-sumber{font-size:.875rem;font-weight:700;font-style:italic;line-height:1.3;color:#8A7A5C}
.b10a-sk-petunjuk{display:flex;align-items:flex-start;gap:6px;padding:6px 10px;border-radius:12px;background:#E7F7F4;font-size:.875rem;font-weight:800;line-height:1.35;color:var(--teal-teks)}
.b10a-sk-petunjuk .ikon{width:17px;height:17px;flex:none;margin-top:1px}
/* cip pautan rantai */
.b10a-sk-rantai{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 8px;min-width:0;padding-top:4px}
.b10a-sk-rantai.masuk{animation:b10a-masuk-bawah .4s ease-out both}
.b10a-sk-pautan{position:relative;display:flex;align-items:center;justify-content:center;width:100%;min-height:46px;padding:5px 14px;border-radius:999px;
  background:linear-gradient(#FBFCFE,#E6EAF3);color:var(--ink);font-size:.9375rem;font-weight:900;line-height:1.2;text-align:center;
  border:4px solid #8D96AC;box-shadow:inset 0 0 0 2px #fff,0 3px 0 rgba(27,42,92,.22);transition:background-color .2s ease,border-color .2s ease,transform .18s ease,opacity .3s ease}
.b10a-sk-pautan-teks{min-width:0;overflow-wrap:break-word;word-break:normal;hyphens:manual}
.b10a-sk-gunting{position:absolute;right:-8px;top:-10px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--emas);color:var(--ink);
  box-shadow:0 2px 0 var(--emas-d);opacity:0;transform:scale(.4) rotate(-40deg);transition:opacity .2s ease,transform .2s ease;pointer-events:none}
.b10a-sk-gunting svg{width:17px;height:17px}
.b10a-sk-pautan:active:not([disabled]){transform:translateY(2px)}
.b10a-sk-pautan.tanda{background:#FFF1BF;border-color:#E8971A;box-shadow:inset 0 0 0 2px #fff,0 0 0 4px rgba(255,201,51,.5),0 3px 0 var(--emas-d)}
.b10a-sk-pautan.tanda .b10a-sk-gunting{opacity:1;transform:none}
.b10a-sk-pautan.salah{background:var(--salah-bg);border-color:#E0555D;color:var(--salah-teks);box-shadow:inset 0 0 0 2px #fff,0 3px 0 var(--merah-d)}
.b10a-sk-pautan.salah .b10a-sk-gunting{background:#F94F55;color:#fff;box-shadow:0 2px 0 #C9323F}
.b10a-sk-pautan.kelip{animation:b10a-kelip-pautan .45s ease-in-out 3}
@keyframes b10a-kelip-pautan{50%{border-color:#1A9A5C;background:#D3F3E1}}
.b10a-sk-pautan.kilat{background:var(--betul-bg);border-color:var(--hijau);color:var(--betul-teks)}
.b10a-sk-pautan.putus{background:#F4F6FA;border-style:dashed;border-color:#AEB6C8;color:#6074A8;text-decoration:line-through;text-decoration-thickness:2px;transform:translateY(4px) rotate(-3deg);opacity:.85}
.b10a-sk-pautan.putus.dibantu{border-color:#C9323F}
.b10a-sk-pautan.tetap{opacity:.6}
.b10a-sk-pautan[disabled]{cursor:default}
/* aksi: kiraan dan butang Putus */
.b10a-sk-aksi{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px}
.b10a-sk-kira{display:grid;gap:1px;font-size:.9375rem;font-weight:700;line-height:1.3;color:var(--ink2)}
.b10a-sk-kira b{color:var(--ink);font-weight:900}
.b10a-sk-putus{min-width:150px}
.b10a-sk-putus[disabled]{opacity:.55;cursor:default}
.b10a-sk-putus-ikon{width:22px;height:22px}
/* kad soalan: buka mangga */
.b10a-sk-soal{display:grid;gap:8px;padding:12px;border-radius:18px;background:#fff;box-shadow:var(--lip)}
.b10a-sk-soal.masuk{animation:b10a-masuk-atas .4s ease-out both}
.b10a-sk-soal-label{display:flex;align-items:center;gap:6px;font-size:.875rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:#8A4B00}
.b10a-sk-soal-ikon{width:19px;height:19px;flex:none;color:var(--emas-d)}
.b10a-sk-soal-ops{grid-template-columns:minmax(0,1fr);gap:8px}
/* plak r.akhir */
.b10a-sk-plak{position:relative;display:grid;gap:4px;padding:12px 16px 13px;border-radius:14px;background:linear-gradient(#C98B4F,#B37037);
  color:#FFF6E0;text-align:center;box-shadow:0 4px 0 #8A5226,0 10px 18px rgba(27,42,92,.25)}
.b10a-sk-plak::before,.b10a-sk-plak::after{content:"";position:absolute;top:9px;width:8px;height:8px;border-radius:50%;background:#FFE08A;box-shadow:inset 0 -2px 0 #C2560F}
.b10a-sk-plak::before{left:9px}
.b10a-sk-plak::after{right:9px}
.b10a-sk-plak b{font-size:1.0625rem;font-weight:900;line-height:1.25}
.b10a-sk-plak span{font-size:.9375rem;font-weight:700;line-height:1.4}
.b10a-sk-plak.masuk{animation:b10a-masuk-bawah .5s ease-out both}
/* SVG sangkar */
.b10a-sk-jeriji{fill:none;stroke:#E8971A;stroke-linecap:round}
.b10a-sk-jeriji-belakang{fill:none;stroke:#E8C58A;opacity:.75}
.b10a-sk-sambung path{fill:none;stroke:#6E7890;stroke-linecap:round}
.b10a-sk-mata-luar{fill:none;stroke:#8D96AC;transition:stroke .2s ease}
.b10a-sk-mata-kilau{fill:none;stroke:#EEF1F7;stroke-width:1.3;stroke-linecap:round}
.b10a-sk-mata-cahaya{fill:none;stroke:#FFC933;stroke-width:5;opacity:0;transition:opacity .2s ease}
.b10a-sk-baris{transition:opacity .3s ease}
.b10a-sk-baris:not(.aktif){opacity:.5}
.b10a-sk-mata.tanda .b10a-sk-mata-luar{stroke:#E8971A}
.b10a-sk-mata.tanda .b10a-sk-mata-cahaya{opacity:.75}
.b10a-sk-mata.salah .b10a-sk-mata-luar{stroke:#F94F55}
.b10a-sk-mata.salah .b10a-sk-mata-cahaya{stroke:#F94F55;opacity:.55}
.b10a-sk-mata.kilat .b10a-sk-mata-luar{stroke:#1A9A5C}
.b10a-sk-mata.kilat .b10a-sk-mata-cahaya{stroke:#1A9A5C;opacity:.6}
.b10a-sk-mata.kelip .b10a-sk-mata-cahaya{stroke:#1A9A5C;animation:b10a-kelip-mata .45s ease-in-out 3}
@keyframes b10a-kelip-mata{50%{opacity:.8}}
.b10a-sk-separuh path{fill:none;stroke:#8D96AC;stroke-linecap:round}
.b10a-sk-separuh.dibantu path{stroke:#C9323F}
.b10a-sk-mangga-cahaya{fill:#FFE57F;opacity:0;transition:opacity .25s ease}
.b10a-sk-mangga.aktif .b10a-sk-mangga-cahaya{opacity:.7}
.b10a-sk-mangga.dibantu rect{stroke:#C9323F}
.b10a-sk-burung-dalam{transform-box:fill-box;transform-origin:50% 100%;animation:b10a-bernafas 2.8s ease-in-out infinite}
@keyframes b10a-bernafas{50%{transform:translateY(-1.4px)}}
.b10a-sk-sayap{transform-box:fill-box;transform-origin:30% 70%}
.b10a-sk-burung.terbang .b10a-sk-burung-dalam{animation:none}
.b10a-sk-burung.terbang .b10a-sk-sayap{animation:b10a-kepak .34s ease-in-out infinite alternate}
@keyframes b10a-kepak{from{transform:rotate(16deg)}to{transform:rotate(-36deg)}}

/* =====================================================================================
   10.2 MENTOL · LAMPU HIASAN
   ===================================================================================== */
.b10a-mentol{display:grid;gap:10px;min-width:0}
.b10a-mt-bilik{position:relative;display:grid;gap:8px;min-width:0;padding:10px 10px 12px;border-radius:22px;
  background:repeating-linear-gradient(90deg,#FDF3DC 0 22px,#F7E8C6 22px 24px);box-shadow:var(--bayang),inset 0 0 0 3px #fff}
.b10a-mt-papan{justify-self:center;display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:4px 14px;border-radius:10px;background:#1B2A5C;color:#fff;
  font-size:.875rem;font-weight:900;letter-spacing:.04em;line-height:1.2;text-align:center;box-shadow:0 3px 0 #0E1840}
.b10a-mt-papan b{flex:none;padding:1px 8px;border-radius:7px;background:var(--emas);color:var(--ink)}
.b10a-mt-baris{display:grid;grid-template-columns:repeat(var(--b10a-n,2),minmax(0,1fr));gap:10px;min-width:0}
/* lajur jawatankuasa: papan nama, (ket), tali lampu, senarai tugas yang menyala, butang Pasang. Baris lajur dikongsi
   (subgrid) supaya tali lampu dan butang Pasang sejajar walaupun panjang nama atau ket berbeza. */
.b10a-mt-kol{--b10a-w:#12998A;--b10a-wd:#0C776B;position:relative;display:grid;grid-template-rows:subgrid;grid-row:span 4;row-gap:6px;align-content:start;min-width:0;padding:9px 8px 9px;border-radius:16px;background:#FFFDF6;cursor:pointer;
  box-shadow:inset 0 5px 0 var(--b10a-w),inset 0 0 0 2px #EADFC4,0 4px 0 rgba(110,63,27,.22);transition:background-color .25s ease,box-shadow .25s ease}
.b10a-mt-kepala{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:4px 6px;min-width:0;padding-top:3px}
.b10a-mt-nama{display:block;flex:1 1 0;font-size:.9375rem;font-weight:900;line-height:1.22;color:var(--b10a-wd);overflow-wrap:normal;word-break:normal;hyphens:manual}
.b10a-mt-kira{flex:none;padding:0 7px;border-radius:9px;background:rgba(27,42,92,.1);font-size:.875rem;font-weight:900;line-height:1.5;color:var(--ink);transition:background-color .3s ease,color .3s ease}
.b10a-mt-kol.penuh .b10a-mt-kira{background:var(--betul-bg);color:var(--betul-teks);box-shadow:inset 0 0 0 1.5px #9FE0BF}
.b10a-mentol.ada-ket .b10a-mt-kol{grid-row:span 5}
.b10a-mt-ket{font-size:.875rem;font-weight:700;line-height:1.3;color:var(--ink2)}
/* tali lampu: panel senja, kawat melendut antara dua cangkuk, soket di sepanjang lengkung */
.b10a-mt-tali{position:relative;min-width:0;border-radius:12px;overflow:hidden;background:linear-gradient(#1F3270,#3B5BA6);box-shadow:inset 0 0 0 2px rgba(255,255,255,.14),0 2px 0 rgba(27,42,92,.22)}
.b10a-mt-svg{display:block;width:100%;height:auto}
.b10a-mt-bintang{fill:#fff;opacity:.5}
.b10a-mt-kawat{fill:none;stroke:#E6EBF6;stroke-width:2.2;stroke-linecap:round}
.b10a-mt-kawat-sinar{fill:none;stroke:#FFE08A;stroke-width:8;stroke-linecap:round;opacity:calc(var(--b10a-sinar,0) * .5)}
.b10a-mt-cangkuk path{fill:none;stroke:#E8971A;stroke-width:2;stroke-linecap:round}
.b10a-mt-cangkuk circle{fill:#FFC933;stroke:#C2560F;stroke-width:1.2}
.b10a-mt-tutup{fill:var(--b10a-w,#12998A);stroke:rgba(14,24,64,.55);stroke-width:1.2}
.b10a-mt-tutup-kilau{fill:none;stroke:rgba(255,255,255,.6);stroke-width:1.4;stroke-linecap:round}
.b10a-mt-hint{fill:rgba(255,255,255,.08);stroke:rgba(255,255,255,.66);stroke-width:1.6;stroke-dasharray:3.2 2.6}
.b10a-mt-soket.ada .b10a-mt-hint,.b10a-mt-soket:not(.ada) .b10a-mt-badan,.b10a-mt-soket:not(.ada) .b10a-mt-halo,.b10a-mt-soket:not(.ada) .b10a-mt-halo2{display:none}
.b10a-mt-kaca{fill:#E8EFFA;stroke:#8C99B8;stroke-width:1.2}
.b10a-mt-kaca-nyala{fill:#FFD54F;stroke:#E8971A;stroke-width:1.2;opacity:var(--n,0)}
.b10a-mt-filamen{fill:none;stroke:#8D96AC;stroke-width:1;stroke-linecap:round}
.b10a-mt-soket.nyala .b10a-mt-filamen{stroke:#C2560F}
.b10a-mt-kilau{fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;opacity:.85}
.b10a-mt-ulir{fill:#C9D1E3;stroke:#6E7890;stroke-width:1}
.b10a-mt-ulir-garis{fill:none;stroke:#8D96AC;stroke-width:1.1}
.b10a-mt-halo{fill:#FFE57F;opacity:calc(var(--n,0) * .45 + var(--b10a-sinar,0) * .3)}
.b10a-mt-halo2{fill:#FFC933;opacity:calc(var(--n,0) * .16 + var(--b10a-sinar,0) * .3)}
.b10a-mt-merah{fill:#F94F55;opacity:calc(var(--m,0) * .6)}
.b10a-mt-cincin{display:none;fill:none;stroke:#FF6B72;stroke-width:2.6;stroke-dasharray:4 3}
.b10a-mt-soket.dibantu .b10a-mt-cincin{display:inline}
.b10a-mt-sasar{fill:none;stroke:none}
.b10a-mt-soket.salah .b10a-mt-hint{stroke:#FFB3B7}
.b10a-mentol.habis .b10a-mt-soket:not(.ada){opacity:.3;transition:opacity .6s ease}
/* senarai tugas yang menyala */
.b10a-mt-senarai{display:grid;gap:4px;align-content:start;min-height:40px;max-height:124px;overflow-y:auto;overscroll-behavior:contain;padding:6px 7px;border-radius:10px;
  background:#fff;box-shadow:inset 0 0 0 1.5px #E3D3AE}
.b10a-mt-kosong{font-size:.875rem;font-weight:700;font-style:italic;color:#9C8660}
.b10a-mt-item{display:flex;align-items:flex-start;gap:5px;font-size:.875rem;font-weight:800;line-height:1.25;color:var(--ink)}
.b10a-mt-tik{flex:none;display:grid;place-items:center;width:17px;height:17px;margin-top:1px;border-radius:5px;background:var(--hijau);color:#fff}
.b10a-mt-tik svg{width:13px;height:13px}
.b10a-mt-item-teks{min-width:0;overflow-wrap:break-word}
.b10a-mt-item.baru{animation:b10a-pop .45s ease-out both}
.b10a-mt-item.dibantu{padding:1px 3px;border-radius:6px;outline:2px dashed #C9323F;outline-offset:0}
.b10a-mt-item.dibantu .b10a-mt-tik{background:#C9323F}
/* butang Pasang */
.b10a-mt-pasang{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;min-height:46px;margin-top:auto;padding:6px 10px;border-radius:14px;
  background:linear-gradient(#FFE08A,#FFC933);color:var(--ink);font-size:.9375rem;font-weight:900;box-shadow:0 4px 0 var(--emas-d);transition:transform .15s ease,box-shadow .2s ease,background-color .2s ease}
.b10a-mt-pasang:active:not([disabled]){transform:translateY(2px)}
.b10a-mt-pasang[disabled]{opacity:.55;cursor:default}
.b10a-mt-pasang-no{display:grid;place-items:center;min-width:24px;height:24px;padding:0 5px;border-radius:12px;background:var(--b10a-wd);color:#fff;font-size:.875rem}
.b10a-mt-pasang-ikon{width:18px;height:18px;flex:none}
.b10a-mentol.ada-pilih .b10a-mt-pasang:not([disabled]){box-shadow:0 4px 0 var(--emas-d),0 0 0 3px #fff,0 0 0 6px var(--emas);animation:b10a-mt-seru 1.4s ease-in-out 2}
@keyframes b10a-mt-seru{50%{box-shadow:0 4px 0 var(--emas-d),0 0 0 3px #fff,0 0 0 9px rgba(255,201,51,.5)}}
.b10a-mentol.ada-pilih .b10a-mt-tali{box-shadow:inset 0 0 0 2px rgba(255,255,255,.14),0 0 0 3px var(--emas),0 2px 0 rgba(27,42,92,.22)}
.b10a-mt-kol.b10a-dekat{background:#FFF6D8}
.b10a-mt-kol.b10a-dekat .b10a-mt-pasang{transform:translateY(-3px)}
.b10a-mt-kol.salah .b10a-mt-tali{box-shadow:inset 0 0 0 3px #F94F55,0 2px 0 rgba(27,42,92,.22)}
.b10a-mt-kol.salah .b10a-mt-pasang{background:linear-gradient(#FFD4D6,#F94F55);color:#fff;box-shadow:0 4px 0 #C9323F}
.b10a-mt-kol.salah .b10a-mt-pasang-no{background:#A3222E}
.b10a-mt-kol.kilat{box-shadow:inset 0 5px 0 var(--b10a-w),inset 0 0 0 2px #EADFC4,0 4px 0 rgba(110,63,27,.22),0 0 0 4px var(--hijau)}
.b10a-mt-kol.kilat .b10a-mt-pasang{background:linear-gradient(#D3F3E1,#2FA05C);color:#fff;box-shadow:0 4px 0 #217F49}
.b10a-mt-kol.kilat .b10a-mt-pasang-no{background:#0F6B40}
/* kotak mentol dan butang mentol (lukisan kaca + ulir di kiri, teks tugas di kanan) */
.b10a-mt-kotak{position:relative;display:grid;gap:6px;min-width:0;padding:8px 10px 10px;border-radius:16px;background:linear-gradient(#C98B4F,#B37037);box-shadow:inset 0 4px 0 #D9A06A,0 4px 0 #8A5226}
.b10a-mt-kotak-label{display:flex;align-items:center;gap:6px;min-width:0;font-size:.875rem;font-weight:900;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;color:#FFF6E0}
.b10a-mt-kotak-ikon{width:19px;height:19px;flex:none;color:#FFE08A}
.b10a-mt-kotak-kira{flex:none;margin-left:auto;padding:1px 8px;border-radius:9px;background:#6E3F1B;color:#FFF6E0;font-size:.875rem;letter-spacing:0;text-transform:none}
.b10a-mt-kotak-isi{display:grid;grid-template-columns:repeat(var(--b10a-s,3),minmax(0,1fr));gap:10px;min-width:0;padding:14px 8px 8px;border-radius:12px;background:#FDF3DC;box-shadow:inset 0 2px 0 rgba(110,63,27,.2)}
.b10a-mt-slot{display:grid;min-width:0}
.b10a-mt-slot.kosong{visibility:hidden}
.b10a-mt-mentol{position:relative;display:flex;align-items:center;gap:7px;width:100%;min-height:58px;padding:5px 10px 5px 6px;border-radius:16px;background:#fff;color:var(--ink);text-align:left;
  box-shadow:0 4px 0 rgba(27,42,92,.2),inset 0 0 0 2px #E3D3AE;touch-action:none;user-select:none;-webkit-user-select:none;transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease}
.b10a-mt-lukis{flex:none;width:26px;height:37px}
.b10a-mt-teks{flex:1 1 auto;align-self:center;min-width:0;font-size:.875rem;font-weight:800;line-height:1.25;overflow-wrap:break-word}
.b10a-mt-dipilih{position:absolute;left:50%;top:-12px;padding:1px 9px;border-radius:9px;background:var(--emas);color:var(--ink);font-size:.875rem;font-weight:900;line-height:1.4;white-space:nowrap;
  box-shadow:0 2px 0 var(--emas-d);opacity:0;transform:translateX(-50%) scale(.6);transition:opacity .2s ease,transform .2s ease;pointer-events:none}
.b10a-mt-mentol:active{transform:translateY(2px)}
.b10a-mt-mentol.pilih{transform:translateY(-4px);background:#FFF6D8;box-shadow:0 8px 0 var(--emas-d),inset 0 0 0 3px var(--emas),0 0 0 4px rgba(255,201,51,.35)}
.b10a-mt-mentol.pilih .b10a-mt-dipilih{opacity:1;transform:translateX(-50%) scale(1)}
.b10a-mt-mentol.pilih .b10a-mt-kaca,.b10a-mt-klon.pilih .b10a-mt-kaca{fill:#FFF3B8;stroke:#E8971A}
.b10a-mt-mentol.pilih .b10a-mt-halo,.b10a-mt-klon.pilih .b10a-mt-halo{opacity:.75}
.b10a-mt-mentol.salah{background:var(--salah-bg);box-shadow:0 4px 0 var(--merah-d),inset 0 0 0 3px #E0555D;animation:goncang .4s}
.b10a-mt-mentol.salah .b10a-mt-teks{color:var(--salah-teks)}
.b10a-mt-mentol.salah .b10a-mt-kaca,.b10a-mt-klon.salah .b10a-mt-kaca{fill:#FFD4D6;stroke:#C9323F}
.b10a-mt-mentol.masuk{animation:lompat .38s ease-out both}
.b10a-mt-mentol.b10a-diseret{opacity:.35}
.b10a-mt-mentol[disabled]{cursor:default}
/* mentol kecil yang terbang ke soket */
.b10a-mt-klon{z-index:41}
.b10a-mt-klon > svg{display:block;width:100%;height:100%;overflow:visible}
/* telegram */
.b10a-mt-telegram{position:relative;display:grid;gap:8px;padding:16px 14px 10px;border-radius:6px;background:#FFFDF2;box-shadow:0 8px 20px rgba(27,42,92,.28),inset 0 0 0 1.5px #EADFC4}
.b10a-mt-telegram::before{content:"";position:absolute;left:0;right:0;top:0;height:7px;border-radius:6px 6px 0 0;background:repeating-linear-gradient(90deg,#C9323F 0 14px,#FFFDF2 14px 20px,#2563C4 20px 34px,#FFFDF2 34px 40px)}
.b10a-mt-telegram.masuk{animation:b10a-masuk-bawah .45s ease-out both}
.b10a-mt-tg-kepala{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding-bottom:4px;border-bottom:2px dashed #E3D3AE}
.b10a-mt-tg-kepala b{font-size:1rem;font-weight:900;letter-spacing:.32em;color:var(--ink)}
.b10a-mt-tg-no{font-size:.875rem;font-weight:900;color:var(--ink2)}
.b10a-mt-tg-soalan{font-size:1.0625rem;font-weight:900;line-height:1.35;color:var(--ink);overflow-wrap:break-word}
.b10a-mt-tg-ops{grid-template-columns:minmax(0,1fr);gap:8px}
.b10a-mt-tg-kaki{font-size:.875rem;font-weight:700;font-style:italic;line-height:1.3;color:#8A7A5C;text-align:right}

/* =====================================================================================
   10.3 UPACARA · UPACARA MERDEKA
   ===================================================================================== */
.b10a-upacara{display:grid;gap:10px;min-width:0}
.b10a-up-adegan{position:relative;min-width:0;border-radius:20px;overflow:hidden;border:3px solid #fff;background:#23397A;box-shadow:var(--bayang)}
.b10a-upacara.adegan-stadium .b10a-up-adegan{background:#A8DDF6}
.b10a-up-bingkai{position:relative;min-width:0}
.b10a-up-svg{display:block;width:100%;height:auto;aspect-ratio:720/310}
.b10a-up-lapis{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none}
.b10a-up-tajuk{position:absolute;z-index:3;left:8px;top:8px;max-width:76%;padding:3px 10px;border-radius:10px;background:rgba(16,26,66,.74);color:#fff;font-size:.875rem;font-weight:900;line-height:1.25;pointer-events:none}
.b10a-upacara.adegan-stadium .b10a-up-tajuk{background:rgba(255,255,255,.88);color:var(--ink)}
.b10a-up-kapsyen{position:absolute;z-index:3;left:0;right:0;bottom:0;padding:6px 12px 7px;background:rgba(16,26,66,.82);color:#fff;font-size:.9375rem;font-weight:800;line-height:1.3;pointer-events:none}
.b10a-up-kapsyen.masuk{animation:b10a-masuk-bawah .45s ease-out both}
/* lapisan: sauh tengah bawah pada titik adegan */
.b10a-up-cip,.b10a-up-tag,.b10a-up-gelembung,.b10a-up-sepanduk,.b10a-up-gulung{position:absolute;transform:translate(-50%,-100%);white-space:nowrap;transition:opacity .4s ease}
.b10a-up-cip.keluar,.b10a-up-tag.keluar,.b10a-up-gelembung.keluar,.b10a-up-sepanduk.keluar,.b10a-up-gulung.keluar{opacity:0}
.b10a-up-cip{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:12px;background:#fff;color:var(--ink);font-size:.875rem;font-weight:900;line-height:1.3;box-shadow:0 3px 0 rgba(27,42,92,.28);animation:b10a-muncul .42s ease-out both}
@keyframes b10a-muncul{from{opacity:0;margin-top:8px}to{opacity:1;margin-top:0}}
.b10a-up-cip-ikon{width:16px;height:16px;flex:none}
.b10a-up-cip.lagu,.b10a-up-cip.azan{background:#EDE6FB;color:var(--ungu-d)}
.b10a-up-cip.nafiri{background:#FFF1BF;color:#8A4B00}
.b10a-up-cip.das{background:#1B2A5C;color:#fff}
.b10a-up-cip.kiraan{background:#C9323F;color:#fff}
.b10a-up-cip.jam{background:#FFFDF2;color:var(--ink)}
.b10a-up-cip.ramai{background:#E7F7F4;color:var(--teal-teks)}
.b10a-up-cip.skrol{max-width:60%;white-space:normal;text-align:center;background:#FFF6E0;color:#6E3F1B;transform:translate(-50%,0)}
.b10a-up-cip.umum{max-width:80%;white-space:normal;text-align:center}
.b10a-up-tag{padding:2px 8px;border-radius:8px;background:rgba(255,255,255,.95);color:var(--ink);font-size:.875rem;font-weight:900;line-height:1.3;box-shadow:0 2px 0 rgba(27,42,92,.28)}
.b10a-up-tag::after{content:"";position:absolute;left:50%;bottom:-5px;margin-left:-5px;border:5px solid transparent;border-bottom:0;border-top-color:rgba(255,255,255,.95)}
.b10a-up-tag.jalan{padding:1px 7px;border-radius:4px;background:#1B2A5C;color:#fff;box-shadow:0 2px 0 rgba(0,0,0,.3);transform:translate(-50%,0)}
.b10a-up-tag.jalan::after{display:none}
.b10a-up-tag.doa{background:#FFF1BF;color:#8A4B00}
.b10a-up-tag.doa::after{border-top-color:#FFF1BF}
.b10a-up-tag.das{background:#1B2A5C;color:#fff}
.b10a-up-tag.das::after{border-top-color:#1B2A5C}
.b10a-up-gelembung{padding:3px 10px;border-radius:14px;background:#fff;color:#C9323F;font-size:.9375rem;font-weight:900;line-height:1.3;box-shadow:0 3px 0 rgba(27,42,92,.28);animation:b10a-gelembung .45s ease-out both}
.b10a-up-gelembung::after{content:"";position:absolute;left:40%;bottom:-6px;border:6px solid transparent;border-bottom:0;border-left:0;border-top-color:#fff}
@keyframes b10a-gelembung{0%{opacity:0;margin-top:10px}70%{opacity:1;margin-top:-2px}100%{opacity:1;margin-top:0}}
.b10a-up-sepanduk{padding:5px 16px;border-radius:6px;background:linear-gradient(#FFD34D,#E8971A);color:#5A3312;font-size:1rem;font-weight:900;line-height:1.3;box-shadow:0 4px 0 #C2560F;animation:b10a-muncul .5s ease-out both}
.b10a-up-gulung{display:grid;justify-items:center;gap:2px;padding:10px 20px;border-radius:5px;background:#FFF6E0;color:#6E3F1B;white-space:normal;text-align:center;
  box-shadow:0 6px 14px rgba(27,42,92,.3),inset 0 0 0 2px #E9D9B4;transform-origin:50% 100%;animation:b10a-gulung .8s ease-out both}
.b10a-up-gulung::before,.b10a-up-gulung::after{content:"";position:absolute;left:-6px;right:-6px;height:9px;border-radius:5px;background:linear-gradient(#E9D9B4,#C9B48A)}
.b10a-up-gulung::before{top:-5px}
.b10a-up-gulung::after{bottom:-5px}
.b10a-up-gulung b{font-size:1.0625rem;font-weight:900;line-height:1.25}
.b10a-up-gulung small{font-size:.875rem;font-weight:700;line-height:1.25}
@keyframes b10a-gulung{from{opacity:0;clip-path:inset(46% -10px 46% -10px)}to{opacity:1;clip-path:inset(-10px -10px -10px -10px)}}
.b10a-up-lapis.ada-panel .b10a-up-tag:not(.das){opacity:0}
.b10a-up-panel{position:absolute;left:8px;top:44px;width:40%;display:grid;gap:3px;padding:5px 5px 6px;border-radius:12px;background:#fff;box-shadow:0 5px 14px rgba(27,42,92,.3)}
.b10a-up-panel.masuk{animation:b10a-panel .5s ease-out both}
@keyframes b10a-panel{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}
.b10a-up-panel-svg{display:block;width:100%;height:auto;border-radius:8px}
.b10a-up-panel b{font-size:.875rem;font-weight:900;line-height:1.2;text-align:center;color:var(--ink)}
.b10a-up-kapal{transition:transform 1.2s cubic-bezier(.45,0,.55,1)}
.b10a-up-panel.terbang .b10a-up-kapal{transform:translate(96px,-30px) rotate(-10deg)}
/* SVG: lampu, tingkap, awan, hujan, penonton */
.b10a-up-tingkap{fill:#FFE57F;transition:fill .8s ease}
.b10a-up-adegan.gelap .b10a-up-tingkap{fill:#2A3766}
.b10a-up-mentol{fill:var(--b10a-w);transition:fill .8s ease}
.b10a-up-cahaya{opacity:.33;transition:opacity .8s ease}
.b10a-up-adegan.gelap .b10a-up-mentol{fill:#3A4A7A}
.b10a-up-adegan.gelap .b10a-up-cahaya{opacity:0}
.b10a-up-awan{fill:#B7C1DB;transition:fill 1s ease,transform 1.6s ease}
.b10a-up-adegan.hadir .b10a-up-awan{fill:#FFFFFF;transform:translateX(28px)}
.b10a-up-titis{fill:none;stroke:#7D8FC0;stroke-width:1.6;stroke-linecap:round;stroke-dasharray:7 17;animation:b10a-hujan 1.1s linear infinite}
@keyframes b10a-hujan{to{stroke-dashoffset:-24}}
.b10a-up-lewat{opacity:0;transition:opacity .6s ease;transition-delay:inherit}
.b10a-up-deret{transition-delay:0s}
.b10a-up-adegan.hadir .b10a-up-lewat{opacity:1}
.b10a-up-kk,.b10a-up-kn{transform-box:fill-box;transform-origin:50% 0}
.b10a-up-tunku.jalan .b10a-up-kk,.b10a-up-tokoh.jalan .b10a-up-kk,.b10a-up-pb.jalan .b10a-up-kk{animation:b10a-langkah .36s ease-in-out infinite alternate}
.b10a-up-tunku.jalan .b10a-up-kn,.b10a-up-tokoh.jalan .b10a-up-kn,.b10a-up-pb.jalan .b10a-up-kn{animation:b10a-langkah .36s ease-in-out infinite alternate-reverse}
@keyframes b10a-langkah{from{transform:rotate(14deg)}to{transform:rotate(-14deg)}}
.b10a-up-kain{transform-box:fill-box;transform-origin:0 50%;animation:b10a-kibar 2.4s ease-in-out infinite}
@keyframes b10a-kibar{0%,100%{transform:skewY(0)}50%{transform:skewY(-3deg)}}
/* kad atur cara */
.b10a-up-kepala{display:flex;align-items:center;flex-wrap:wrap;gap:3px 8px;min-width:0}
.b10a-up-masa{flex:none;display:inline-flex;align-items:center;gap:5px;padding:2px 10px 2px 6px;border-radius:12px;background:var(--ink);color:#fff;font-size:.875rem;font-weight:900;line-height:1.35}
.b10a-up-masa-ikon{width:16px;height:16px;flex:none}
.b10a-up-petunjuk{display:flex;align-items:flex-start;gap:6px;margin-top:3px;font-size:.875rem;font-weight:800;line-height:1.3;color:var(--teal-teks)}
.b10a-up-petunjuk .ikon{width:16px;height:16px;flex:none;margin-top:1px}
.b10a-up-atas{display:grid;gap:10px;min-width:0}
.b10a-up-pilih{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.b10a-up-pilih .op{justify-content:center;text-align:center;padding:8px 10px}
.b10a-up-pilih .op:last-child:nth-child(odd){grid-column:1/-1}
/* garis masa */
.b10a-up-garis{display:flex;align-items:center;gap:8px;min-width:0;padding:6px 8px;border-radius:14px;background:#fff;box-shadow:var(--lip)}
.b10a-up-garis-label{flex:none;font-size:.875rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:var(--teal-teks)}
.b10a-up-garis-ol{display:flex;flex:1 1 auto;gap:6px;min-width:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-behavior:smooth;padding:2px 2px 4px 10px;scrollbar-width:thin;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12px);mask-image:linear-gradient(90deg,transparent 0,#000 12px)}
.b10a-up-garis-ol:empty::before{content:"Belum ada acara.";font-size:.875rem;font-weight:700;white-space:nowrap;color:var(--ink2)}
.b10a-up-nod{flex:none;display:flex;align-items:center;gap:5px;padding:3px 10px 3px 4px;border-radius:13px;background:#F3F6FD;font-size:.875rem;font-weight:800;line-height:1.3;white-space:nowrap;color:var(--ink);box-shadow:inset 0 0 0 1.5px #D7DEEF}
.b10a-up-nod b{display:grid;place-items:center;min-width:24px;height:24px;padding:0 7px;border-radius:12px;background:var(--ink);color:#fff;font-size:.875rem;font-weight:900}
.b10a-up-nod.baru{animation:b10a-pop .45s ease-out both}
.b10a-up-nod.dibantu{box-shadow:none;outline:2px dashed #C9323F;outline-offset:-2px}
.b10a-up-nod.dibantu b{background:#C9323F}
.b10a-rumus.b10a-up-rumus li b{color:var(--ink)}

/* =====================================================================================
   MOD LEBAR (pentas 1280 x 720; .main-badan: left 300, width 720, top 90, bottom 10)
   ===================================================================================== */
body.mod-lebar .b2-main.b2-j-sangkar .main-badan,body.mod-lebar .b2-main.b2-j-mentol .main-badan,body.mod-lebar .b2-main.b2-j-upacara .main-badan{left:300px;width:720px;top:90px;bottom:10px;
  display:flex;flex-direction:column;align-content:stretch;overflow-y:auto;overflow-x:hidden}
body.mod-lebar .b2-p-sangkar,body.mod-lebar .b2-p-mentol,body.mod-lebar .b2-p-upacara{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:10px}
body.mod-lebar .b10a-sangkar,body.mod-lebar .b10a-mentol,body.mod-lebar .b10a-upacara{flex:1 1 auto;min-height:0}
body.mod-lebar .b2-j-sangkar .b2-kad-isi,body.mod-lebar .b2-j-mentol .b2-kad-isi,body.mod-lebar .b2-j-upacara .b2-kad-isi{font-size:1.1875rem}
body.mod-lebar .b2-j-sangkar .b2-kad,body.mod-lebar .b2-j-mentol .b2-kad,body.mod-lebar .b2-j-upacara .b2-kad{padding:9px 20px 10px}
body.mod-lebar .b2-j-sangkar .bisik,body.mod-lebar .b2-j-mentol .bisik,body.mod-lebar .b2-j-upacara .bisik{min-height:48px;padding:7px 14px;font-size:.9375rem;line-height:1.32}
body.mod-lebar .b2-p-sangkar > .b2-rumus,body.mod-lebar .b2-p-mentol > .b2-rumus,body.mod-lebar .b2-p-upacara > .b2-rumus{flex:0 1 auto;min-height:0;display:flex;flex-direction:column;gap:10px}
body.mod-lebar .b2-p-sangkar > .b2-rumus > *,body.mod-lebar .b2-p-mentol > .b2-rumus > *,body.mod-lebar .b2-p-upacara > .b2-rumus > *{flex:none}
body.mod-lebar .b2-p-sangkar > .b2-rumus > .b2-rumus-tokoh,body.mod-lebar .b2-p-mentol > .b2-rumus > .b2-rumus-tokoh,body.mod-lebar .b2-p-upacara > .b2-rumus > .b2-rumus-tokoh{flex:0 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:4px}
/* sangkar: adegan di kiri, kad takrif dan pautan di kanan */
body.mod-lebar .b10a-sangkar{display:flex;flex-direction:column;gap:10px}
body.mod-lebar .b10a-sk-atas{flex:none}
body.mod-lebar .b10a-sk-taman{flex:1 1 auto;min-height:0;grid-template-columns:262px minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:14px}
body.mod-lebar .b2-j-sangkar .b2-kad-isi{font-size:1.0625rem}
body.mod-lebar .b10a-sk-adegan{min-height:0;height:100%}
body.mod-lebar .b10a-sk-svg{width:100%;height:100%}
body.mod-lebar .b10a-sk-kanan{min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding:8px 6px 4px 2px}
body.mod-lebar .b10a-sk-petikan{font-size:.9375rem;line-height:1.45}
body.mod-lebar .b10a-sk-tokoh{font-size:1.0625rem}
body.mod-lebar .b10a-sk-soal-ops .op{min-height:54px}
body.mod-lebar .b10a-sk-pautan{min-height:48px;font-size:.9375rem}
body.mod-lebar .b2-p-sangkar > .b2-rumus > .b2-rumus-tokoh{grid-template-columns:1fr 1fr}
/* mentol: kad atas dan bisik sebaris; lajur tali lampu merentas atas, kotak mentol di bawah */
body.mod-lebar .b10a-mentol{display:flex;flex-direction:column;gap:10px}
body.mod-lebar .b10a-mentol{gap:14px}
body.mod-lebar .b10a-mt-atas{flex:none;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:stretch}
body.mod-lebar .b2-j-mentol .b2-kad-isi{font-size:1rem;line-height:1.28}
body.mod-lebar .b2-j-mentol .b2-kad{padding:8px 16px 9px}
body.mod-lebar .b2-j-mentol .bisik{padding:6px 12px;font-size:.875rem;line-height:1.3}
body.mod-lebar .b10a-mt-bilik{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:8px;padding-top:18px}
body.mod-lebar .b10a-mt-papan{position:absolute;left:50%;top:-12px;z-index:2;transform:translateX(-50%);white-space:nowrap}
body.mod-lebar .b10a-mt-baris{position:relative;z-index:1;flex:1 1 0;min-height:250px;grid-template-rows:auto auto minmax(52px,1fr) auto}
body.mod-lebar .b10a-mentol.ada-ket .b10a-mt-baris{grid-template-rows:auto auto auto minmax(52px,1fr) auto}
body.mod-lebar .b10a-mt-kol{min-height:0}
body.mod-lebar .b10a-mt-n3 .b10a-mt-nama,body.mod-lebar .b10a-mt-n4 .b10a-mt-nama{font-size:.875rem}
body.mod-lebar .b10a-mt-n4 .b10a-mt-kol{padding-left:7px;padding-right:7px}
body.mod-lebar .b10a-mt-n4 .b10a-mt-kepala{gap:4px}
body.mod-lebar .b10a-mt-senarai{min-height:36px;max-height:none}
body.mod-lebar .b10a-mt-kotak{flex:none;padding:6px 10px 8px}
body.mod-lebar .b10a-mt-kotak-isi{padding:12px 8px 6px}
body.mod-lebar .b10a-mt-mentol{min-height:62px}
body.mod-lebar .b10a-mt-telegram{position:absolute;left:12px;right:12px;bottom:12px;z-index:5}
body.mod-lebar .b10a-mt-tg-ops{grid-template-columns:1fr 1fr}
body.mod-lebar .b10a-mt-tg-ops .op{min-height:52px}
body.mod-lebar .b10a-mentol.mod-soal .b10a-mt-kotak{visibility:hidden}
body.mod-lebar .b2-p-mentol > .b2-rumus > .b2-rumus-tokoh{grid-template-columns:1fr 1fr}
/* upacara: adegan 720 × 330 di atas, kad atur cara dan bisik sebaris, kad acara, garis masa */
body.mod-lebar .b10a-upacara{display:flex;flex-direction:column;gap:8px}
body.mod-lebar .b10a-upacara > *{flex:none}
body.mod-lebar .b10a-up-atas{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:stretch}
body.mod-lebar .b10a-up-pilih{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
body.mod-lebar .b10a-up-pilih.b10a-up-n2,body.mod-lebar .b10a-up-pilih.b10a-up-n4{grid-template-columns:repeat(2,minmax(0,1fr))}
body.mod-lebar .b10a-up-pilih.b10a-up-n1{grid-template-columns:minmax(0,1fr)}
body.mod-lebar .b2-j-upacara .b2-kad-isi{font-size:1.0625rem}
body.mod-lebar .b2-j-upacara .b2-kad{padding:8px 18px 9px}
body.mod-lebar .b10a-up-pilih .op:last-child:nth-child(odd){grid-column:auto}
body.mod-lebar .b10a-up-pilih .op{min-height:50px;padding:5px 10px;font-size:.9375rem;line-height:1.22}
body.mod-lebar .b10a-up-kapsyen{font-size:1rem;padding:7px 16px 8px}
body.mod-lebar .b2-j-upacara .bisik{font-size:.875rem;line-height:1.3;padding:6px 12px}
body.mod-lebar .b10a-up-tajuk{max-width:78%;font-size:.9375rem;top:10px;left:10px}
body.mod-lebar .b10a-up-panel{width:34%;top:46px;left:10px}
body.mod-lebar .b10a-up-cip,body.mod-lebar .b10a-up-tag{font-size:.9375rem}
body.mod-lebar .b10a-up-gelembung{font-size:1rem}
body.mod-lebar .b10a-up-sepanduk{font-size:1.125rem}
body.mod-lebar .b2-p-upacara > .b2-rumus > .b2-rumus-tokoh{grid-template-columns:1fr 1fr}

/* =====================================================================================
   TELEFON (390 x 844) dan TELEFON PENDEK (375 x 667)
   ===================================================================================== */
body.mod-telefon .b2-j-sangkar .bisik,body.mod-telefon .b2-j-mentol .bisik,body.mod-telefon .b2-j-upacara .bisik{min-height:2.9em;padding:8px 12px}
/* sangkar: kad takrif di atas, sangkar di tengah, cip pautan dan Putus di bawah */
body.mod-telefon .b10a-sk-taman{display:flex;flex-direction:column}
body.mod-telefon .b10a-sk-kanan{display:contents}
body.mod-telefon .b10a-sk-takrif,body.mod-telefon .b10a-sk-soal{order:1}
body.mod-telefon .b10a-sk-adegan{order:2}
body.mod-telefon .b10a-sk-rantai,body.mod-telefon .b10a-sk-plak{order:3}
body.mod-telefon .b10a-sk-aksi{order:4}
body.mod-telefon .b10a-taman-bisik,body.mod-telefon .b10a-sk-kanan > .bisik{order:5}
body.mod-telefon .b10a-sk-aksi{flex-wrap:nowrap}
body.mod-telefon .b10a-sk-putus{flex:0 1 190px;min-width:130px}
body.mod-telefon .b10a-sk-pautan{padding:5px 10px}
/* mentol: lajur 2 sebaris (4 tali → 2×2); kotak mentol tetap di bawah skrin, halaman ditatal supaya lajur terakhir kelihatan */
body.mod-telefon .b10a-mentol{padding-bottom:calc(var(--b10a-kotak-h,132px) + 14px)}
body.mod-telefon .b10a-mentol.habis,body.mod-telefon .b10a-mentol.mod-soal,body.mod-telefon .b10a-mentol.mod-tamat{padding-bottom:0}
body.mod-telefon .b10a-mt-baris{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 8px}
body.mod-telefon .b10a-mt-n1 .b10a-mt-baris{grid-template-columns:minmax(0,1fr)}
body.mod-telefon .b10a-mt-n3 .b10a-mt-kol:last-child{grid-column:1/-1}
body.mod-telefon .b10a-mt-kol{padding:8px 7px 8px}
body.mod-telefon .b10a-mt-nama{font-size:.875rem}
body.mod-telefon .b10a-mt-pasang{padding:6px 8px}
/* Telefon: butang Pasang terus di bawah tali lampu supaya kedudukannya tetap walaupun senarai tugas memanjang. */
body.mod-telefon .b10a-mt-pasang{order:1}
body.mod-telefon .b10a-mt-senarai{order:2}
body.mod-telefon .b10a-mt-kotak{position:fixed;left:0;right:0;bottom:0;z-index:20;max-width:560px;margin:0 auto;padding:6px 10px max(10px,env(safe-area-inset-bottom));border-radius:18px 18px 0 0;
  box-shadow:0 -6px 18px rgba(27,42,92,.25),inset 0 3px 0 #D9A06A}
body.mod-telefon .b10a-mt-kotak-isi{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:6px;padding:14px 6px 6px;scrollbar-width:thin}
body.mod-telefon .b10a-mt-slot{flex:0 0 min(64vw,236px);scroll-snap-align:start}
body.mod-telefon .b10a-mt-slot.kosong{display:none}
body.mod-telefon .b10a-mt-mentol{touch-action:pan-x}
body.mod-telefon .b10a-mentol.habis .b10a-mt-kotak,body.mod-telefon .b10a-mentol.mod-soal .b10a-mt-kotak,body.mod-telefon .b10a-mentol.mod-tamat .b10a-mt-kotak{display:none}
body.mod-telefon .b10a-mt-telegram{order:-1}
body.mod-telefon .b10a-mt-tg-ops .op{min-height:48px}
/* upacara */
body.mod-telefon .b10a-up-adegan{display:flex;flex-direction:column}
body.mod-telefon .b10a-up-tajuk{position:static;order:0;max-width:none;border-radius:0;padding:5px 12px}
body.mod-telefon .b10a-up-bingkai{order:1}
body.mod-telefon .b10a-up-kapsyen{position:static;order:2;font-size:.875rem;padding:6px 12px 7px}
body.mod-telefon .b10a-up-kapsyen.masuk{animation:none}
body.mod-telefon .b10a-up-panel{width:48%;top:6px;left:6px}
body.mod-telefon .b10a-up-pilih .op{min-height:52px}
body.mod-telefon .b10a-up-gulung{padding:8px 14px}
body.mod-telefon .b10a-up-sepanduk{padding:4px 12px;font-size:.9375rem}
@media (max-height:700px){
  body.mod-telefon .b2-j-sangkar .bisik,body.mod-telefon .b2-j-mentol .bisik,body.mod-telefon .b2-j-upacara .bisik{min-height:2.6em;padding:6px 12px;font-size:.875rem;line-height:1.32}
  body.mod-telefon .b2-j-sangkar .b2-kad-isi,body.mod-telefon .b2-j-mentol .b2-kad-isi,body.mod-telefon .b2-j-upacara .b2-kad-isi{font-size:1rem}
  body.mod-telefon .b10a-sk-takrif{padding:11px 12px 10px;gap:5px}
  body.mod-telefon .b10a-sk-petikan{font-size:.875rem;line-height:1.4}
  body.mod-telefon .b10a-sk-pautan{min-height:44px;padding:5px 9px}
  body.mod-telefon .b10a-mt-slot{flex-basis:min(62vw,226px)}
  body.mod-telefon .b10a-mt-mentol{min-height:52px}
  body.mod-telefon .b10a-mt-senarai{max-height:92px}
  body.mod-telefon .b10a-up-pilih .op{min-height:48px;padding:6px 8px}
}
@media (max-width:370px){
  body.mod-telefon .b10a-mt-pasang-ikon{display:none}
}
@media (prefers-reduced-motion:reduce){
  .b10a-sk-burung-dalam,.b10a-sk-sayap,.b10a-up-titis,.b10a-up-kain,.b10a-up-kk,.b10a-up-kn,.b10a-sk-pautan.kelip,.b10a-sk-mata.kelip .b10a-sk-mata-cahaya,
  .b10a-mentol.ada-pilih .b10a-mt-pasang,.b10a-mt-mentol.salah,.b10a-mt-item.baru,.b10a-up-nod.baru,.b10a-up-cip,.b10a-up-gelembung,.b10a-up-sepanduk,.b10a-up-gulung,
  .b10a-up-panel.masuk,.b10a-up-kapsyen.masuk,.b10a-sk-plak.masuk,.b10a-sk-takrif.masuk,.b10a-sk-soal.masuk,.b10a-sk-rantai.masuk,.b10a-mt-telegram.masuk,.b10a-mt-mentol.masuk{animation:none}
  .b10a-up-kapal,.b10a-up-awan,.b10a-up-lewat,.b10a-mt-kira,.b10a-sk-pautan,.b10a-mt-mentol,.b10a-mt-dipilih,.b10a-mt-pasang{transition:none}
  .b10a-sk-mata.kelip .b10a-sk-mata-cahaya{opacity:.8}
  .b10a-sk-pautan.kelip{border-color:#1A9A5C;background:#D3F3E1}
}
