
.deck-bbp-no-scroll{overflow:hidden}
.deck-bbp-overlay{
  position:fixed; inset:0; z-index:999999;
  background:rgba(0,0,0,.78);
  display:none; align-items:center; justify-content:center;
  padding:18px;
}
.deck-bbp-overlay.is-open{display:flex}

.deck-bbp-modal{
  width:min(920px,100%);
  max-height:92vh;
  overflow:auto;
  background:#0f0f10;
  color:#fff;
  border-radius:20px;
  box-shadow:0 30px 90px rgba(0,0,0,.60);
  position:relative;
  font-family:inherit;
  border:1px solid rgba(255,255,255,.07);
}

.deck-bbp-close{
  position:absolute;
  right:14px;
  top:10px;
  z-index:3;
  width:40px;
  height:40px;
  border:0;
  border-radius:999px;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:30px;
  line-height:38px;
  cursor:pointer;
}

.deck-bbp-layout{
  display:grid;
  grid-template-columns:minmax(280px,42%) 1fr;
  min-height:560px;
}

.deck-bbp-visual{
  position:relative;
  min-height:560px;
  background-size:cover;
  background-position:center;
  border-radius:20px 0 0 20px;
  overflow:hidden;
}

.deck-bbp-visual-overlay{
  position:absolute; inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,.05));
}

.deck-bbp-visual-badge{
  position:absolute;
  left:20px;
  bottom:20px;
  background:#e6005c;
  color:#fff;
  font-weight:900;
  padding:10px 14px;
  border-radius:10px;
  letter-spacing:.3px;
}

.deck-bbp-visual-fallback{
  background:linear-gradient(145deg,#151515,#272727);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
}

.deck-bbp-big-gift{font-size:72px}
.deck-bbp-visual-copy{font-size:28px;text-align:center;font-weight:700}
.deck-bbp-visual-copy strong{color:#ff0a67}

.deck-bbp-content{
  padding:34px 32px 26px;
}

.deck-bbp-kicker{
  font-size:12px;
  letter-spacing:2px;
  font-weight:900;
  color:#ff0a67;
  margin-bottom:8px;
}

.deck-bbp-content h2{
  margin:0 0 10px;
  font-size:34px;
  line-height:1.04;
  text-transform:uppercase;
}

.deck-bbp-sub{
  font-size:16px;
  line-height:1.45;
  color:#ddd;
  margin:0 0 22px;
}

.deck-bbp-label,
.deck-bbp-grid label{
  display:block;
  font-size:13px;
  font-weight:800;
  margin-bottom:6px;
}

.deck-bbp-content select{
  width:100%;
  min-height:48px;
  border-radius:10px;
  border:1px solid #3d3d42;
  background:#19191c;
  color:#fff;
  padding:0 12px;
  margin-bottom:15px;
}

.deck-bbp-pref-title{
  font-weight:900;
  font-size:18px;
  margin-top:4px;
}

.deck-bbp-help{
  font-size:13px;
  color:#aaa;
  margin:4px 0 12px;
}

.deck-bbp-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}

.deck-bbp-stock-note{
  margin:8px 0 14px;
  padding:11px 12px;
  border-radius:10px;
  background:#1b1b1e;
  color:#d7d7d7;
  font-size:13px;
}

.deck-bbp-error{
  background:#5a1010;
  border:1px solid #a33;
  padding:10px 12px;
  border-radius:8px;
  margin-bottom:12px;
}

.deck-bbp-confirm{
  width:100%;
  border:0;
  border-radius:11px;
  min-height:54px;
  background:#e6005c;
  color:#fff;
  font-weight:900;
  font-size:16px;
  cursor:pointer;
}

.deck-bbp-cancel{
  width:100%;
  border:0;
  background:transparent;
  color:#aaa;
  margin-top:8px;
  cursor:pointer;
}

.deck-bbp-cart-note{
  margin-top:6px;
  font-size:13px;
  font-weight:700;
}

.deck-bbp-loop-badge{
  margin:6px auto 8px;
  width:max-content;
  max-width:100%;
  padding:5px 9px;
  border-radius:999px;
  background:#e6005c;
  color:#fff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.3px;
}

@media(max-width:760px){
  .deck-bbp-overlay{padding:10px}
  .deck-bbp-modal{max-height:96vh;border-radius:16px}
  .deck-bbp-layout{grid-template-columns:1fr;min-height:auto}
  .deck-bbp-visual{
    min-height:220px;
    border-radius:16px 16px 0 0;
    background-position:center;
  }
  .deck-bbp-content{padding:24px 18px 18px}
  .deck-bbp-content h2{font-size:27px}
  .deck-bbp-grid{grid-template-columns:1fr}
  .deck-bbp-visual-badge{left:14px;bottom:14px}
}
