/* ==========================================================
   ANIMASI BUKU BERPUTAR (dipakai pembaca & proses unggah)
   ========================================================== */
.buku-muat{
  --lebar:96px; --tinggi:68px;
  position:relative;width:var(--lebar);height:var(--tinggi);perspective:700px;margin:0 auto;
  filter:drop-shadow(0 14px 18px rgba(0,0,0,.35));
}
.buku-muat::before,.buku-muat::after{ /* sampul kiri & kanan */
  content:'';position:absolute;top:-4px;bottom:-4px;width:calc(50% + 4px);background:linear-gradient(160deg,#178565,#0b503e);
}
.buku-muat::before{left:-4px;border-radius:7px 0 0 7px}
.buku-muat::after{right:-4px;border-radius:0 7px 7px 0}
.buku-muat .halaman{
  position:absolute;top:0;left:50%;width:50%;height:100%;z-index:2;transform-origin:left center;transform-style:preserve-3d;
  background:linear-gradient(90deg,#e9e4d4,#fff 30%);border-radius:0 4px 4px 0;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.05);
  animation:baliklah 2.1s cubic-bezier(.6,.05,.3,.95) infinite;animation-delay:calc(var(--n) * .22s);
}
.buku-muat .halaman::before{ /* garis teks */
  content:'';position:absolute;inset:12px 9px auto 9px;height:30px;
  background:repeating-linear-gradient(180deg,rgba(11,80,62,.28) 0 2px,transparent 2px 8px);border-radius:2px
}
.buku-muat .halaman:nth-child(1){--n:0}.buku-muat .halaman:nth-child(2){--n:1}
.buku-muat .halaman:nth-child(3){--n:2}.buku-muat .halaman:nth-child(4){--n:3}
@keyframes baliklah{
  0%{transform:rotateY(0deg)}
  45%,100%{transform:rotateY(-178deg)}
}
@media (prefers-reduced-motion:reduce){.buku-muat .halaman{animation-duration:6s}}