/* ==========================================================
   FTR GAMES — BLACK FRIDAY FIRST-VISIT POPUP
   ========================================================== */

.ftr-bf-popup[hidden]{display:none !important;}
.ftr-bf-popup:not([hidden]){display:grid !important;visibility:visible !important;}

.ftr-bf-popup{
  position:fixed;
  inset:0;
  z-index:999999;
  display:grid;
  place-items:center;
  padding:20px;
  font-family:inherit;
}

.ftr-bf-popup__backdrop{
  position:absolute;
  inset:0;
  border:0;
  background:rgba(5,0,10,.82);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  cursor:pointer;
}

.ftr-bf-popup__dialog{
  position:relative;
  z-index:1;
  width:min(560px,calc(100vw - 30px));
  overflow:hidden;
  border:1px solid rgba(255,214,0,.50);
  border-radius:22px;
  background:
    radial-gradient(circle at 88% 7%,rgba(155,34,255,.20),transparent 34%),
    linear-gradient(180deg,#16051f 0%,#0c0111 100%);
  box-shadow:
    0 28px 90px rgba(0,0,0,.65),
    0 0 42px rgba(255,202,0,.10),
    inset 0 1px 0 rgba(255,255,255,.05);
  color:#fff;
  transform:translateY(10px) scale(.985);
  opacity:0;
  animation:ftrBfPopupEnter .38s cubic-bezier(.2,.75,.2,1) forwards;
}

@keyframes ftrBfPopupEnter{
  to{transform:translateY(0) scale(1);opacity:1;}
}

.ftr-bf-popup__close{
  position:absolute;
  top:10px;
  right:10px;
  z-index:3;
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.20);
  border-radius:999px;
  background:rgba(5,0,10,.72);
  color:#fff;
  font-size:24px;
  line-height:1;
  cursor:pointer;
}

.ftr-bf-popup__media{
  display:block;
  background:#08000d;
}

.ftr-bf-popup__media img{
  display:block;
  width:100%;
  height:auto;
  max-height:56vh;
  object-fit:cover;
}

.ftr-bf-popup__content{
  padding:18px 20px 20px;
}

.ftr-bf-popup__eyebrow{
  display:block;
  color:#ffd500;
  font-size:11px;
  line-height:1;
  font-weight:950;
  letter-spacing:.13em;
}

.ftr-bf-popup__content h2{
  margin:7px 0 0;
  color:#fff;
  font-size:25px;
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.035em;
}

.ftr-bf-popup__timer{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin-top:16px;
}

.ftr-bf-popup__timer > div{
  padding:11px 7px 10px;
  border:1px solid rgba(221,72,255,.42);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(53,11,71,.86),rgba(17,2,24,.94));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 0 16px rgba(184,36,255,.09);
  text-align:center;
}

.ftr-bf-popup__timer strong{
  display:block;
  color:#fff;
  font-size:24px;
  line-height:1;
  font-weight:950;
}

.ftr-bf-popup__timer span{
  display:block;
  margin-top:5px;
  color:#c9bed0;
  font-size:8px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.10em;
}

.ftr-bf-popup__cta{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:48px;
  margin-top:14px;
  padding:11px 18px;
  border-radius:13px;
  background:linear-gradient(100deg,#ffd600,#ffbd00);
  box-shadow:0 10px 28px rgba(255,190,0,.15),inset 0 1px 0 rgba(255,255,255,.45);
  color:#11000e;
  font-size:14px;
  font-weight:950;
  text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease;
}

.ftr-bf-popup__cta:hover{
  transform:translateY(-1px);
  box-shadow:0 13px 32px rgba(255,190,0,.23),inset 0 1px 0 rgba(255,255,255,.45);
}

body.ftr-bf-popup-open{overflow:hidden;}

@media (max-width:640px){
  .ftr-bf-popup{padding:12px;}
  .ftr-bf-popup__dialog{width:min(100%,430px);border-radius:18px;}
  .ftr-bf-popup__media img{max-height:52vh;}
  .ftr-bf-popup__content{padding:14px 14px 16px;}
  .ftr-bf-popup__content h2{font-size:20px;}
  .ftr-bf-popup__timer{gap:6px;margin-top:12px;}
  .ftr-bf-popup__timer > div{padding:9px 4px 8px;border-radius:10px;}
  .ftr-bf-popup__timer strong{font-size:21px;}
  .ftr-bf-popup__timer span{font-size:7px;}
  .ftr-bf-popup__cta{min-height:45px;margin-top:12px;font-size:13px;}
}

@media (prefers-reduced-motion:reduce){
  .ftr-bf-popup__dialog{animation:none;transform:none;opacity:1;}
  .ftr-bf-popup__cta{transition:none;}
}