/* Gaya halaman publik dan pratinjau admin. Semua selektor dibatasi di bawah .bp. */
.bp{--bg:#f3f4f6;--btn:#111827;--btn-text:#ffffff;--text:#111827;--radius:999px;--radius-card:20px;
  --font:'Poppins',system-ui,sans-serif;
  margin:0;background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.5;
  -webkit-font-smoothing:antialiased}
body.bp{min-height:100vh}
.bp *{box-sizing:border-box}
.bp .wrap{max-width:480px;margin:0 auto;padding:40px 20px 32px;text-align:center}
.bp .avatar{width:96px;height:96px;border-radius:50%;margin:0 auto 14px;display:flex;
  align-items:center;justify-content:center;background:var(--btn);color:var(--btn-text);
  font-size:2.2rem;font-weight:700}
.bp img.avatar{display:block;object-fit:cover}
.bp h1{font-size:1.4rem;margin:0 0 6px;font-weight:700}
.bp .bio{margin:0 auto 24px;opacity:.8;font-size:.95rem;white-space:pre-line}
.bp .socials{list-style:none;margin:0 0 24px;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.bp .socials a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;
  background:var(--btn);color:var(--btn-text);box-shadow:0 2px 6px rgba(0,0,0,.12);
  transition:transform .15s ease,box-shadow .15s ease}
.bp .socials a:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.18)}
.bp .socials a:active{transform:scale(.95)}
.bp .items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.bp .btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:12px 20px;
  background:var(--btn);color:var(--btn-text);text-decoration:none;font-weight:600;
  border-radius:var(--radius);box-shadow:0 2px 6px rgba(0,0,0,.12);
  transition:transform .15s ease,box-shadow .15s ease}
.bp .btn:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.18)}
.bp .btn:active{transform:scale(.98)}
.bp a:focus-visible{outline:3px solid #60a5fa;outline-offset:2px}
.bp .btn-icon{font-size:1.15rem;line-height:1}
.bp .card{display:block;overflow:hidden;background:#fff;color:#111827;text-align:left;
  border-radius:var(--radius-card);box-shadow:0 2px 6px rgba(0,0,0,.12)}
.bp .card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#e5e7eb}
.bp .card-body{padding:14px 16px 16px}
.bp .card-title{margin:0 0 4px;font-size:1.05rem}
.bp .card-desc{margin:0 0 12px;font-size:.9rem;color:#4b5563}
.bp .card .btn{min-height:44px;padding:10px 16px;box-shadow:none}
.bp .pic{display:block;overflow:hidden;border-radius:var(--radius-card);box-shadow:0 2px 6px rgba(0,0,0,.12);
  transition:transform .15s ease,box-shadow .15s ease}
.bp a.pic:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.18)}
.bp a.pic:active{transform:scale(.98)}
.bp .pic img{display:block;width:100%;height:auto}
.bp .empty{opacity:.6}
.bp footer{margin-top:32px;font-size:.8rem;opacity:.65}
@media (prefers-reduced-motion:reduce){.bp .btn,.bp .pic,.bp .socials a{transition:none}}