/* Bukaan SAMPUL PENUH (batik). Lapisan dalam cover: belakang sampul < salinan Muka < poket depan < kepak < teks + cop.
   --tip hujung kepak (cop di sini), --v hujung V mulut poket (tertutup kepak). Token tema wajib bila guna bukaan ni:
   --sampul (poket), --sampul-dalam (dalam sampul, belakang kepak), --sampul-lipat (lipatan bawah), --sampul-bayang,
   --emas-hi (kilau garis emas kepak). */
.bk--sampul{background:var(--sampul-dalam);perspective:900px;perspective-origin:50% 0;--tip:50%;--v:45%;--tile-kepak:220px}
.sp-belakang{position:absolute;inset:0;z-index:0;background:var(--sampul-dalam)}
.sp-kad{position:absolute;left:0;right:0;top:0;height:100%;z-index:1;overflow:hidden;border-radius:var(--r);box-shadow:var(--sh-frame);background:var(--bg)}
.sp-kad .pn{position:absolute;inset:0;min-height:0;visibility:visible}
.sp-kad .pn__isi{position:absolute;inset:0;padding:0}
.sp-kad .kp{position:absolute;top:var(--pt);bottom:var(--pb);left:var(--px);right:var(--px);margin:0}
/* teks salinan tersorok dalam sampul sampai bukaan mula: fon dimuat semasa halaman dibuka melompatkan teks ni (CLS 0.043)
   walaupun poket menutupnya */
.bk--sampul:not(.is-opening) .sp-kad .kp{visibility:hidden}
.sp-poket{position:absolute;inset:0;z-index:2;background:var(--sampul);clip-path:polygon(0 0,50% var(--v),100% 0,100% 100%,0 100%)}
.sp-poket::before{content:"";position:absolute;inset:0;background:var(--sampul-lipat);clip-path:polygon(0 100%,50% 66%,100% 100%)}
.sp-poket::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--sampul-bayang) 0%,var(--sampul-0) 22%,var(--sampul-0) 100%)}
.sp-kepak{position:absolute;left:0;right:0;top:0;height:var(--tip);z-index:4;transform-origin:50% 0;transform-style:preserve-3d}
.sp-kepak__depan,.sp-kepak__belakang{position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.sp-kepak__depan{filter:drop-shadow(0 12px 16px var(--sampul-bayang))}
.sp-kepak__emas{position:absolute;inset:0;background:linear-gradient(115deg,var(--emas) 0%,var(--emas-hi) 46%,var(--emas) 56%,var(--aksen-deep) 100%);
  clip-path:polygon(0 0,100% 0,50% 100%)}
.sp-kepak__corak{position:absolute;inset:0;background-color:var(--bg);background-size:var(--tile-kepak) auto;background-repeat:repeat;background-position:50% 100%;
  clip-path:polygon(6px 0,calc(100% - 6px) 0,50% calc(100% - 12px))}
.sp-kepak__belakang{transform:rotateX(180deg);background:var(--sampul-dalam);clip-path:polygon(50% 0,100% 100%,0 100%)}
.sp-cop{position:absolute;left:50%;top:var(--tip);z-index:6;width:min(26vw,112px);aspect-ratio:400/403;translate:-50% -50%;padding:0;border:0;border-radius:50%;
  background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.sp-cop .seal{top:50%;width:100%}
.sp-teks{position:absolute;left:0;right:0;top:calc(var(--tip) + 9svh);bottom:0;z-index:5;display:flex;flex-direction:column;align-items:center;gap:.35rem;
  padding:0 var(--gutter) calc(3svh + env(safe-area-inset-bottom))}
.sp-teks .bk__cta{margin-top:auto}
.sp-teks .bk__hint{color:var(--ink-soft)}
.bk--sampul .names--bk{font:400 clamp(2.5rem,2.1rem + 2vw,3.1rem)/1.15 var(--f-script);color:var(--aksen);text-wrap:balance}
/* nama panjang: kepak lebih pendek, nama lebih kecil (sampul-penuh.js anjak --tip lagi kalau teks masih melimpah) */
.bk--sampul.bk--panjang{--tip:42%;--v:37%}
.bk--panjang .names--bk{font-size:clamp(1.95rem,1.7rem + 1.4vw,2.4rem);line-height:1.1}
.bk--panjang .sp-teks{top:calc(var(--tip) + min(13vw,56px) + .8rem)}
/* video: kepak lebih pendek supaya cop + teks dalam zon selamat TikTok (y 22.9-74%), tiada butang */
.mod-video .bk--sampul{--tip:40%;--v:35%;--tile-kepak:190px}
.mod-video .bk--sampul .bk__cta{display:none}
.mod-video .sp-teks{top:calc(var(--tip) + 8svh);bottom:auto;padding:0 var(--vz-x)}
/* ---------- MOD IMEJ (kad.aset.kepak, zaitun, ASET-3NOV C1) ----------
   Kepak = imej alfa lebar penuh sauh atas, poket = badan tile (takuk V tersorok bawah kepak) + imej alfa sauh bawah.
   Token ukuran tema (nisbah lebar sampul, tools/aset_zaitun.py): --kepak-nisbah --kepak-hujung --kepak-sisi --poket-nisbah.
   Token warna tema: --sampul (badan sebelum tile dimuat), --sampul-dalam (dalam sampul, belakang kepak), --sampul-kad
   (kad gading yang naik). --lw = lebar sampul (100cqw, sandaran vw), --naik = kepak dianjak ke atas bila teks tak muat
   (sampul-penuh.js muat()). Semua peraturan di sini berkelas .bk--imej, rupa batik tak berubah. */
.bk--sampul.bk--imej{--lw:min(100vw,var(--col));--naik:0px;--tip:calc(var(--lw) * var(--kepak-hujung) - var(--naik))}
@supports (width:1cqw){.bk--sampul.bk--imej{container-type:inline-size;--lw:100cqw}}
.bk--imej .sp-kepak{top:calc(-1 * var(--naik));height:auto}
.bk--imej .sp-kepak__depan{position:relative;inset:auto;filter:none}
.sp-kepak__img{display:block;width:100%;height:auto}
.bk--imej .sp-kepak__belakang{background:var(--sampul-dalam);
  clip-path:polygon(0 100%,100% 100%,100% calc(100% - 100% * var(--kepak-sisi) / var(--kepak-nisbah)),
    50% calc(100% - 100% * var(--kepak-hujung) / var(--kepak-nisbah)),0 calc(100% - 100% * var(--kepak-sisi) / var(--kepak-nisbah)))}
.bk--imej .sp-poket{background:none;clip-path:none}
.bk--imej .sp-poket::before,.bk--imej .sp-poket::after{content:none}
.sp-poket__badan{position:absolute;inset:0;background-color:var(--sampul);background-repeat:repeat;background-size:100% auto;background-position:50% 0;
  clip-path:polygon(0 0,50% calc(var(--tip) - var(--lw) * .06),100% 0,100% 100%,0 100%)}
.sp-poket__img{position:absolute;left:0;bottom:0;display:block;width:100%;height:auto}
.sp-bayang{position:absolute;left:0;right:0;top:calc(-1 * var(--naik));z-index:3;pointer-events:none}
.sp-bayang__img{display:block;width:100%;height:auto}
.bk--imej .sp-kad{background:var(--sampul-kad)}
.bk--imej .sp-kad .pn__latar{display:none}
.bk--imej .sp-kad .pn{--ink:var(--ink-paper);--ink-soft:var(--ink-soft-paper);--aksen:var(--aksen-paper);--line:var(--line-paper)}
.bk--imej .sp-teks{top:calc(var(--tip) + min(13vw,56px) + 1rem)}
.bk--sampul.bk--imej.bk--panjang{--naik:calc(var(--lw) * .1)}
.mod-video .bk--sampul.bk--imej{--naik:calc(var(--lw) * .2)}
.mod-video .bk--imej .sp-teks{top:calc(var(--tip) + min(13vw,56px) + .8rem)}