/* before/after window of one place (banding.js) */
#bdg{position:fixed;inset:0;z-index:80;background:#020810e0;display:flex;align-items:center;justify-content:center;padding:18px}
#bdg[hidden]{display:none}
body.bdg-buka{overflow:hidden}
.bdg-kartu{width:min(900px,100%);max-height:calc(100dvh - 36px);display:flex;flex-direction:column;background:#0b1622;border:1px solid #1e4668;border-radius:16px;box-shadow:0 24px 80px #000c;overflow:hidden;animation:bdg-masuk .22s ease-out}
@keyframes bdg-masuk{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
.bdg-kepala{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-bottom:1px solid #16344d}
.bdg-kepala div{flex:1;min-width:0}.bdg-kepala b{display:block;color:#fff;font-size:15px}.bdg-kepala small{display:block;color:#8aa4b8;font-size:11.5px;margin-top:3px}
.bdg-kepala button{background:#0e2a40;border:1px solid #1e4668;color:#bfeaff;border-radius:9px;padding:7px 12px;font:800 12px system-ui;cursor:pointer}
.bdg-isi{overflow-y:auto;padding:14px 16px;-webkit-overflow-scrolling:touch}
.bdg-dua{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bdg-sisi{margin:0;min-width:0}
.bdg-cv{position:relative;aspect-ratio:1;background:#071019;border:1px solid #16344d;border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.bdg-cv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;user-select:none}
.bdg-muat,.bdg-kosong{position:relative;color:#8aa4b8;font-size:11.5px;text-align:center;padding:0 18px;line-height:1.5}
.bdg-muat{background:#000a;border-radius:8px;padding:5px 10px;z-index:1}.bdg-muat.gagal{color:#ffb4a0}
.bdg-cincin{position:absolute;aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);border:2px dashed #ffd23c;border-radius:50%;box-shadow:0 0 0 1px #000a,inset 0 0 0 1px #000a;pointer-events:none}
#bdg.tanpa-tanda .bdg-cincin{display:none}
.bdg-sisi figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-top:7px;font-size:12px;color:#d1e2ec}
.bdg-sisi figcaption b{font:800 10.5px var(--mono,ui-monospace,monospace);letter-spacing:1.5px;color:#9fd8ef}
.bdg-sisi:last-child figcaption b{color:#ffb38f}
.bdg-cat{color:#8aa4b8;font-size:11px;line-height:1.55;margin:12px 0 0}
.bdg-kaki{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:10px 16px;border-top:1px solid #16344d}
.bdg-kaki label{display:flex;gap:7px;align-items:center;color:#9fb6c8;font-size:12px;cursor:pointer}
.bdg-kaki button.utama{background:#2fd6ff;border:0;color:#03202e;border-radius:10px;padding:10px 16px;font:800 13px system-ui;cursor:pointer}
.bdg-kaki button.utama:hover{background:#6fe4ff}
.kj.bisa-klik{cursor:pointer}.kj.bisa-klik:hover{border-color:#2fd6ff66}
@media (max-width:640px){
  #bdg{padding:0;align-items:flex-end}
  .bdg-kartu{max-height:94dvh;border-radius:16px 16px 0 0;border-bottom:0}
  .bdg-dua{gap:8px}
  .bdg-isi{padding:12px}
  .bdg-kaki{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
  .bdg-kaki button.utama{flex:1}
}
@media (max-width:640px) and (orientation:portrait){.bdg-dua{grid-template-columns:1fr}.bdg-cv{aspect-ratio:4/3}}
@media (prefers-reduced-motion:reduce){.bdg-kartu{animation:none}}
.bdg-tunggu{display:flex;gap:10px;align-items:center;justify-content:center;padding:70px 0;color:#8aa4b8;font-size:12px}
.bdg-tunggu i{width:16px;height:16px;border-radius:50%;border:2px solid #1e4668;border-top-color:#2fd6ff;animation:bdg-putar .8s linear infinite}
@keyframes bdg-putar{to{transform:rotate(360deg)}}