.ftr-bropack-page{min-height:100vh;background:radial-gradient(circle at 20% 0,rgba(126,45,255,.22),transparent 30%),linear-gradient(180deg,#0b0014,#08000f);color:#fff;padding:34px 0 90px}
.ftr-bropack-wrap{width:min(1180px,calc(100% - 32px));margin:auto}
.ftr-bropack-crumbs{display:flex;gap:9px;align-items:center;color:#8f82a0;font-size:12px;margin-bottom:20px;overflow:hidden;white-space:nowrap}
.ftr-bropack-crumbs a{color:#b6a7c7;text-decoration:none}
.ftr-bropack-crumbs strong{overflow:hidden;text-overflow:ellipsis}

.ftr-bropack-hero,
.ftr-bropack-panel{
  border:1px solid rgba(151,62,255,.35);
  border-radius:22px;
  background:linear-gradient(135deg,rgba(53,18,86,.9),rgba(11,6,26,.96));
  box-shadow:0 18px 60px rgba(0,0,0,.28)
}

.ftr-bropack-hero{
  display:grid;
  grid-template-columns:minmax(280px,42%) 1fr;
  gap:50px;
  align-items:center;
  padding:40px
}

.ftr-bropack-packart{text-align:center}
.ftr-bropack-packart img{
  max-height:520px;
  max-width:100%;
  filter:drop-shadow(0 22px 30px rgba(87,45,255,.32))
}

.ftr-bropack-eyebrow{
  display:inline-block;
  background:#7b32d8;
  border-radius:8px;
  padding:6px 9px;
  font-weight:900;
  font-size:11px
}

.ftr-bropack-platform{
  margin-top:18px;
  font-weight:800
}

.ftr-bropack-hero h1{
  font-size:clamp(36px,5vw,64px);
  line-height:.98;
  margin:12px 0 14px;
  max-width:650px
}

.ftr-bropack-hero p{color:#b7acc4}

.ftr-bropack-open{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:54px;
  max-width:390px;
  margin-top:26px;
  border-radius:13px;
  background:linear-gradient(135deg,#ffd82e,#ffe665);
  color:#170822!important;
  text-decoration:none!important;
  font-weight:950
}

.ftr-bropack-external-note{
  font-size:11px;
  max-width:430px;
  line-height:1.5;
  margin:10px 0 0
}

.ftr-bropack-panel{
  padding:26px;
  margin-top:22px
}

.ftr-bropack-panel-head{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:space-between
}

.ftr-bropack-panel-head h2{
  margin:0;
  font-size:24px
}

.ftr-bropack-count,
.ftr-bropack-fair{
  background:rgba(255,255,255,.07);
  padding:7px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:800
}

.ftr-bropack-filters{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:18px 0
}

.ftr-bropack-filters button{
  border:1px solid rgba(255,255,255,.14);
  background:#160d26;
  color:#d9cfdf;
  border-radius:999px;
  padding:8px 14px;
  cursor:pointer
}

.ftr-bropack-filters button.is-active{
  background:#9a3dff;
  color:#fff;
  border-color:#b66cff
}

.ftr-bropack-rewards{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px
}

.ftr-bropack-reward{
  position:relative;
  min-width:0;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg,#12091f 0%,#0c0714 100%);
  border-radius:16px;
  text-align:center;
  box-shadow:0 12px 30px rgba(0,0,0,.22);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease
}

.ftr-bropack-reward:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 38px rgba(0,0,0,.32)
}

.rarity-legendary{
  border-color:rgba(255,94,67,.58)
}

.rarity-epic{
  border-color:rgba(255,220,56,.50)
}

.rarity-rare{
  border-color:rgba(70,196,255,.52)
}

.rarity-common{
  border-color:rgba(180,180,190,.32)
}

.ftr-bropack-rarity-image{
  width:100%;
  aspect-ratio:4/1;
  overflow:hidden;
  background:#0d0715
}

.ftr-bropack-rarity-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover
}

.ftr-bropack-reward-img{
  position:relative;
  width:100%;
  aspect-ratio:6/5;
  display:flex;
  align-items:stretch;
  justify-content:center;
  background:#0b0712;
  overflow:hidden
}

.ftr-bropack-reward-img img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:cover
}

.ftr-bropack-reward-content{
  padding:14px 14px 16px;
  background:linear-gradient(180deg,rgba(17,9,29,.98),rgba(10,6,17,.98));
  border-top:1px solid rgba(255,255,255,.06)
}

.ftr-bropack-reward strong{
  display:block;
  font-size:13px;
  line-height:1.3;
  min-height:34px
}

.ftr-bropack-coins{
  margin-top:9px;
  color:#d98cff;
  font-weight:850;
  font-size:12px
}

.ftr-bropack-reward small{
  display:block;
  color:#91859e;
  margin-top:5px
}

.ftr-bropack-drop p{
  color:#a89caf
}

.ftr-bropack-bars{
  display:grid;
  gap:14px
}

.ftr-bropack-bar{
  display:grid;
  grid-template-columns:130px 1fr 70px;
  gap:14px;
  align-items:center
}

.ftr-bropack-bar>span{
  height:10px;
  background:#231734;
  border-radius:99px;
  overflow:hidden
}

.ftr-bropack-bar i{
  display:block;
  height:100%;
  background:linear-gradient(90deg,#8d43ff,#56a5ff);
  border-radius:99px
}

.ftr-bropack-bar b{
  text-align:right
}

.ftr-bropack-prob-note{
  font-size:11px;
  line-height:1.55;
  margin:18px 0 0!important
}

.ftr-bropack-details-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:20px
}

.ftr-bropack-detail{
  padding:16px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px
}

.ftr-bropack-detail span,
.ftr-bropack-description>span{
  display:block;
  color:#9387a1;
  font-size:11px;
  font-weight:700;
  margin-bottom:7px
}

.ftr-bropack-detail strong{
  font-size:15px
}

.ftr-bropack-description{
  margin-top:14px;
  padding:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px
}

.ftr-bropack-description p{
  margin:0;
  color:#c1b8cb;
  line-height:1.7;
  font-size:13px
}

.ftr-bropack-age-info{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:20px;
  align-items:start;
  border-color:rgba(255,210,63,.3);
  background:linear-gradient(135deg,rgba(83,61,15,.42),rgba(15,8,30,.96))
}

.ftr-bropack-age-icon{
  width:58px;
  height:58px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:#ffd83d;
  color:#170822;
  font-size:20px;
  font-weight:950
}

.ftr-bropack-age-info h2{
  margin:2px 0 10px;
  font-size:20px
}

.ftr-bropack-age-info p{
  margin:8px 0;
  color:#c8bfd0;
  line-height:1.65;
  font-size:13px
}

.ftr-bropack-faq details{
  border-top:1px solid rgba(255,255,255,.09);
  padding:0
}

.ftr-bropack-faq details:first-of-type{
  margin-top:18px
}

.ftr-bropack-faq summary{
  list-style:none;
  cursor:pointer;
  padding:17px 2px;
  font-weight:800;
  font-size:14px;
  display:flex;
  justify-content:space-between;
  gap:20px
}

.ftr-bropack-faq summary::-webkit-details-marker{
  display:none
}

.ftr-bropack-faq summary:after{
  content:'+';
  color:#a96aff;
  font-size:20px;
  line-height:1
}

.ftr-bropack-faq details[open] summary:after{
  content:'–'
}

.ftr-bropack-faq details p{
  margin:0 28px 18px 2px;
  color:#aaa0b6;
  font-size:13px;
  line-height:1.7
}

.ftr-bropack-agegate[hidden]{
  display:none!important
}

.ftr-bropack-agegate{
  position:fixed;
  z-index:999999;
  inset:0;
  background:rgba(3,0,9,.88);
  backdrop-filter:blur(12px);
  display:grid;
  place-items:center;
  padding:20px
}

.ftr-bropack-agegate-card{
  width:min(470px,100%);
  background:linear-gradient(145deg,#211037,#0e0718);
  border:1px solid rgba(169,93,255,.55);
  box-shadow:0 30px 100px rgba(0,0,0,.58);
  border-radius:22px;
  padding:34px;
  text-align:center;
  color:#fff
}

.ftr-bropack-agegate-badge{
  width:64px;
  height:64px;
  margin:0 auto 18px;
  border-radius:18px;
  background:#ffd83d;
  color:#170822;
  display:grid;
  place-items:center;
  font-size:23px;
  font-weight:950
}

.ftr-bropack-agegate-card h2{
  font-size:25px;
  line-height:1.15;
  margin:0 0 12px
}

.ftr-bropack-agegate-card p{
  color:#b9aec4;
  font-size:13px;
  line-height:1.65;
  margin:0 auto 24px
}

.ftr-bropack-agegate-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px
}

.ftr-bropack-agegate-actions button{
  min-height:48px;
  border-radius:12px;
  font-weight:900;
  cursor:pointer
}

.ftr-bropack-age-yes{
  border:0;
  background:#ffd83d;
  color:#170822
}

.ftr-bropack-age-no{
  border:1px solid rgba(255,255,255,.16);
  background:#161020;
  color:#fff
}

.ftr-bropack-agegate-open{
  overflow:hidden
}


/* Pack details – premium information panel */

.ftr-bropack-details{
  position:relative;
  overflow:hidden;
  padding:30px;
  background:
    radial-gradient(circle at 8% 0,rgba(142,66,255,.13),transparent 34%),
    linear-gradient(145deg,rgba(35,17,61,.97),rgba(10,5,24,.98));
  border-color:rgba(154,77,255,.45)
}

.ftr-bropack-details:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 0 35%,rgba(164,92,255,.035) 48%,transparent 62%)
}

.ftr-bropack-details-heading{
  position:relative;
  display:flex;
  align-items:center;
  gap:15px;
  margin-bottom:22px
}

.ftr-bropack-details-title-icon{
  width:50px;
  height:50px;
  flex:0 0 50px;
  display:grid;
  place-items:center;
  border-radius:15px;
  color:#a866ff;
  background:linear-gradient(145deg,rgba(136,55,255,.22),rgba(77,27,127,.12));
  border:1px solid rgba(171,102,255,.34);
  box-shadow:
    inset 0 0 20px rgba(148,74,255,.08),
    0 8px 30px rgba(0,0,0,.16)
}

.ftr-bropack-details-title-icon svg{
  width:27px;
  height:27px;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}

.ftr-bropack-details-heading h2{
  margin:0;
  font-size:25px;
  line-height:1.1;
  letter-spacing:-.02em
}

.ftr-bropack-details-heading p{
  margin:6px 0 0;
  color:#9f7cc9;
  font-size:10px;
  font-weight:850;
  letter-spacing:.22em;
  text-transform:uppercase
}

.ftr-bropack-details-grid{
  position:relative;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:0
}

.ftr-bropack-detail{
  min-height:104px;
  padding:18px;
  display:flex;
  align-items:center;
  gap:14px;
  background:linear-gradient(145deg,rgba(55,27,87,.72),rgba(24,12,43,.78));
  border:1px solid rgba(167,94,255,.26);
  border-radius:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
  transition:border-color .18s ease,transform .18s ease,background .18s ease
}

.ftr-bropack-detail:hover{
  transform:translateY(-1px);
  border-color:rgba(178,109,255,.48);
  background:linear-gradient(145deg,rgba(64,31,101,.78),rgba(27,13,48,.86))
}

.ftr-bropack-detail-icon{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:grid;
  place-items:center;
  border-radius:13px;
  color:#ad6cff;
  background:linear-gradient(145deg,rgba(143,62,255,.23),rgba(83,31,142,.12));
  border:1px solid rgba(171,99,255,.3);
  box-shadow:inset 0 0 17px rgba(158,76,255,.09)
}

.ftr-bropack-detail-icon.is-recycle{
  color:#60e5be;
  background:linear-gradient(145deg,rgba(53,207,164,.13),rgba(66,84,140,.12));
  border-color:rgba(96,229,190,.2)
}

.ftr-bropack-detail-icon svg,
.ftr-bropack-description-icon svg{
  width:24px;
  height:24px;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}

.ftr-bropack-detail-copy{
  min-width:0
}

.ftr-bropack-detail-copy span{
  display:block;
  color:#a99bb8;
  font-size:11px;
  font-weight:650;
  margin:0 0 6px
}

.ftr-bropack-detail-copy strong{
  display:flex;
  align-items:center;
  gap:8px;
  color:#fff;
  font-size:17px;
  line-height:1.15;
  font-weight:900;
  letter-spacing:-.015em
}

.ftr-bropack-country-flag{
  font-size:20px;
  line-height:1;
  filter:saturate(.95);
  transform:translateY(-1px)
}

.ftr-bropack-description{
  position:relative;
  margin-top:14px;
  padding:20px 22px;
  display:grid;
  grid-template-columns:46px 1fr;
  gap:16px;
  align-items:start;
  background:linear-gradient(145deg,rgba(54,28,84,.68),rgba(22,11,40,.78));
  border:1px solid rgba(166,93,255,.26);
  border-radius:16px
}

.ftr-bropack-description-icon{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:13px;
  color:#a96cff;
  background:rgba(132,59,221,.15);
  border:1px solid rgba(169,108,255,.24)
}

.ftr-bropack-description-copy{
  min-width:0
}

.ftr-bropack-description-copy>span{
  display:block;
  margin:1px 0 10px;
  color:#fff;
  font-size:16px;
  font-weight:900
}

.ftr-bropack-description-copy p{
  margin:0;
  color:#c7bdd0;
  line-height:1.7;
  font-size:13px;
  max-width:1040px
}


/* Pack detail refinements */

.ftr-bropack-country-flag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:1em!important;
  line-height:1!important;
  width:1.05em;
  height:1.05em;
  transform:none!important;
  vertical-align:middle;
  flex:0 0 auto
}

.ftr-bropack-detail-icon.is-playstation{
  color:#fff;
  background:linear-gradient(145deg,#1677ff,#0457c8);
  border-color:rgba(126,187,255,.55);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 8px 20px rgba(0,88,220,.2)
}

.ftr-bropack-ps-mark{
  display:block;
  color:#fff;
  font-size:17px;
  font-weight:950;
  line-height:1;
  letter-spacing:-.08em;
  font-style:italic;
  transform:skew(-7deg);
  text-shadow:0 1px 2px rgba(0,0,0,.18)
}


/* Gift card face-value badge */

.ftr-bropack-value-badge{
  position:absolute;
  right:10px;
  bottom:10px;
  z-index:3;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;

  min-height:28px;
  padding:5px 9px;

  border:1px solid rgba(255,255,255,.16);
  border-radius:8px;

  background:rgba(9,7,16,.90);

  box-shadow:
    0 5px 16px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.06);

  font-size:11px;
  line-height:1;
  font-weight:950;
  letter-spacing:.01em;
  white-space:nowrap;

  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px)
}

/* 1000 / 500 / 200 etc */
.ftr-bropack-value-number{
  color:#fff
}

/* RON / EUR / GBP etc */
.ftr-bropack-value-currency{
  color:#ffd83d
}


/* Responsive */

@media(max-width:960px){
  .ftr-bropack-details-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}

@media(max-width:800px){
  .ftr-bropack-hero{
    grid-template-columns:1fr;
    padding:24px;
    gap:20px
  }

  .ftr-bropack-packart img{
    max-height:390px
  }

  .ftr-bropack-rewards{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .ftr-bropack-bar{
    grid-template-columns:85px 1fr 55px
  }

  .ftr-bropack-panel{
    padding:18px
  }

  .ftr-bropack-hero h1{
    font-size:38px
  }

  .ftr-bropack-details-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .ftr-bropack-age-info{
    grid-template-columns:1fr
  }

  .ftr-bropack-agegate-actions{
    grid-template-columns:1fr
  }
}

@media(max-width:600px){
  .ftr-bropack-details{
    padding:20px
  }

  .ftr-bropack-details-heading{
    margin-bottom:17px
  }

  .ftr-bropack-details-title-icon{
    width:44px;
    height:44px;
    flex-basis:44px
  }

  .ftr-bropack-details-heading h2{
    font-size:22px
  }

  .ftr-bropack-details-grid{
    grid-template-columns:1fr
  }

  .ftr-bropack-detail{
    min-height:88px;
    padding:15px
  }

  .ftr-bropack-description{
    grid-template-columns:1fr;
    padding:17px
  }

  .ftr-bropack-description-icon{
    width:42px;
    height:42px
  }

  .ftr-bropack-description-copy>span{
    margin-top:0
  }
}

@media(max-width:480px){
  .ftr-bropack-details-grid{
    grid-template-columns:1fr
  }

  .ftr-bropack-rewards{
    grid-template-columns:1fr
  }

  .ftr-bropack-agegate-card{
    padding:26px 20px
  }

  .ftr-bropack-value-badge{
    right:8px;
    bottom:8px;
    min-height:26px;
    padding:5px 8px;
    font-size:10px;
    gap:3px
  }
}

/* BroPack rarity filter pill colors */
.ftr-bropack-filters button[data-rarity="mythic"]{
  background:linear-gradient(180deg,#8db5ff 0%,#82aaf6 55%,#7399e8 100%);
  border-color:#b7d0ff;
  color:#fff;
}

.ftr-bropack-filters button[data-rarity="legendary"]{
  background:linear-gradient(180deg,#ff2a2a 0%,#c80f12 100%);
  border-color:#ff4a4a;
  color:#fff;
}

.ftr-bropack-filters button[data-rarity="epic"]{
  background:linear-gradient(180deg,#ffd93d 0%,#d4a900 100%);
  border-color:#ffe36b;
  color:#fff;
}

.ftr-bropack-filters button[data-rarity="rare"]{
  background:linear-gradient(180deg,#42d69e 0%,#1ea973 100%);
  border-color:#69e2b3;
  color:#fff;
}

.ftr-bropack-filters button[data-rarity="common"]{
  background:linear-gradient(180deg,#8f9098 0%,#676872 100%);
  border-color:#ababaf;
  color:#fff;
}

.ftr-bropack-filters button[data-rarity="mythic"]:hover,
.ftr-bropack-filters button[data-rarity="legendary"]:hover,
.ftr-bropack-filters button[data-rarity="epic"]:hover,
.ftr-bropack-filters button[data-rarity="rare"]:hover,
.ftr-bropack-filters button[data-rarity="common"]:hover{
  filter:brightness(1.05);
}

.ftr-bropack-filters button[data-rarity="mythic"].is-active,
.ftr-bropack-filters button[data-rarity="legendary"].is-active,
.ftr-bropack-filters button[data-rarity="epic"].is-active,
.ftr-bropack-filters button[data-rarity="rare"].is-active,
.ftr-bropack-filters button[data-rarity="common"].is-active{
  color:#fff;
  box-shadow:0 0 0 1px rgba(255,255,255,.12) inset, 0 8px 20px rgba(0,0,0,.18);
}

/* Mythic reward support — use the real rarity-strip image asset. */
.rarity-mythic{
  border-color:rgba(190,88,255,.62);
}
.rarity-mythic .ftr-bropack-rarity-image{
  background:#0d0715;
}
.rarity-mythic .ftr-bropack-rarity-image img{
  visibility:visible!important;
}
.rarity-mythic .ftr-bropack-rarity-image:after{
  content:none!important;
  display:none!important;
}

.ftr-bropack-mobile-featured-reward.rarity-mythic .ftr-bropack-mobile-featured-rarity{
  background:transparent;
}
.ftr-bropack-mobile-featured-reward.rarity-mythic .ftr-bropack-mobile-featured-rarity img{
  visibility:visible!important;
}
.ftr-bropack-mobile-featured-reward.rarity-mythic .ftr-bropack-mobile-featured-rarity:after{
  content:none!important;
  display:none!important;
}


/* =========================================================
   BroPack overview: Drop chances + Pack details
   ========================================================= */
.ftr-bropack-overview{
  display:grid;
  grid-template-columns:1fr 1fr;
  margin-top:22px;
  overflow:hidden;
  border:1px solid rgba(154,77,255,.62);
  border-radius:28px;
  background:
    radial-gradient(circle at 88% 0,rgba(132,59,255,.18),transparent 34%),
    linear-gradient(135deg,rgba(33,15,59,.98),rgba(12,6,26,.99));
  box-shadow:0 24px 70px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.03)
}

.ftr-bropack-overview-col{
  min-width:0;
  padding:34px 34px 32px
}

.ftr-bropack-overview-col + .ftr-bropack-overview-col{
  border-left:1px solid rgba(255,255,255,.08)
}

.ftr-bropack-overview-heading{
  display:flex;
  align-items:center;
  gap:17px;
  margin-bottom:24px
}

.ftr-bropack-overview-heading-icon{
  width:64px;
  height:64px;
  flex:0 0 64px;
  display:grid;
  place-items:center;
  border-radius:18px;
  color:#a96cff;
  background:linear-gradient(145deg,rgba(147,63,255,.24),rgba(73,29,126,.15));
  border:1px solid rgba(170,99,255,.42);
  box-shadow:inset 0 0 22px rgba(150,74,255,.09),0 10px 30px rgba(0,0,0,.18)
}

.ftr-bropack-overview-heading-icon svg{
  width:32px;
  height:32px;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}

.ftr-bropack-overview-heading h2{
  margin:0;
  color:#fff;
  font-size:30px;
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.025em
}

.ftr-bropack-overview-heading p{
  margin:7px 0 0;
  color:#9d8bad;
  font-size:14px;
  line-height:1.35
}

.ftr-bropack-drop-list{
  display:grid;
  gap:12px
}

.ftr-bropack-drop-row{
  display:grid;
  grid-template-columns:176px minmax(120px,1fr) 72px;
  gap:16px;
  align-items:center;
  min-height:66px;
  padding:0 18px;
  border:1px solid rgba(163,103,255,.22);
  border-radius:15px;
  background:linear-gradient(135deg,rgba(50,26,82,.68),rgba(24,13,43,.78));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)
}

.ftr-bropack-drop-label{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0
}

.ftr-bropack-drop-label strong{
  color:#fff;
  font-size:15px;
  font-weight:950;
  letter-spacing:.01em
}

.ftr-bropack-drop-diamond{
  width:17px;
  height:17px;
  flex:0 0 17px;
  transform:rotate(45deg);
  border-radius:3px;
  box-shadow:0 0 14px currentColor
}

.ftr-bropack-drop-track{
  height:13px;
  overflow:hidden;
  border-radius:999px;
  background:#28203e;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.35)
}

.ftr-bropack-drop-track i{
  display:block;
  height:100%;
  min-width:5px;
  border-radius:999px
}

.ftr-bropack-drop-row>b{
  text-align:right;
  font-size:16px;
  font-weight:950
}

.ftr-bropack-drop-row.rarity-mythic .ftr-bropack-drop-diamond,
.ftr-bropack-drop-row.rarity-mythic .ftr-bropack-drop-track i{background:#c05cff;color:#c05cff}
.ftr-bropack-drop-row.rarity-mythic>b{color:#d486ff}

.ftr-bropack-drop-row.rarity-legendary .ftr-bropack-drop-diamond,
.ftr-bropack-drop-row.rarity-legendary .ftr-bropack-drop-track i{background:#ff4f78;color:#ff4f78}
.ftr-bropack-drop-row.rarity-legendary>b{color:#ff5a7f}

.ftr-bropack-drop-row.rarity-epic .ftr-bropack-drop-diamond,
.ftr-bropack-drop-row.rarity-epic .ftr-bropack-drop-track i{background:#ffd23f;color:#ffd23f}
.ftr-bropack-drop-row.rarity-epic>b{color:#ffd83d}

.ftr-bropack-drop-row.rarity-rare .ftr-bropack-drop-diamond,
.ftr-bropack-drop-row.rarity-rare .ftr-bropack-drop-track i{background:#3dde96;color:#3dde96}
.ftr-bropack-drop-row.rarity-rare>b{color:#48e8a1}

.ftr-bropack-drop-row.rarity-common .ftr-bropack-drop-diamond,
.ftr-bropack-drop-row.rarity-common .ftr-bropack-drop-track i{background:#adb3d3;color:#adb3d3}
.ftr-bropack-drop-row.rarity-common>b{color:#c2c7e3}

.ftr-bropack-drop-note{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:14px;
  align-items:start;
  margin-top:28px;
  padding:18px 20px;
  border:1px solid rgba(160,103,255,.22);
  border-radius:15px;
  background:rgba(42,23,68,.50)
}

.ftr-bropack-drop-note-icon{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border:2px solid #8d72c3;
  border-radius:50%;
  color:#a993d1;
  font-size:15px;
  font-weight:900
}

.ftr-bropack-drop-note p{
  margin:0;
  color:#aa9cba;
  font-size:12px;
  line-height:1.65
}

.ftr-bropack-details-modern-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px
}

.ftr-bropack-detail-modern{
  min-height:106px;
  padding:18px;
  display:flex;
  align-items:center;
  gap:15px;
  border:1px solid rgba(164,100,255,.25);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(49,25,79,.72),rgba(22,12,40,.82));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)
}

.ftr-bropack-detail-modern-icon{
  width:52px;
  height:52px;
  flex:0 0 52px;
  display:grid;
  place-items:center;
  border-radius:15px;
  color:#ad6cff;
  background:linear-gradient(145deg,rgba(143,62,255,.24),rgba(83,31,142,.13));
  border:1px solid rgba(171,99,255,.32)
}

.ftr-bropack-detail-modern-icon svg,
.ftr-bropack-description-modern-icon svg{
  width:26px;
  height:26px;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}

.ftr-bropack-detail-modern-icon.is-recycle{
  color:#56e6b6;
  background:linear-gradient(145deg,rgba(37,190,145,.14),rgba(32,84,108,.13));
  border-color:rgba(86,230,182,.24)
}

.ftr-bropack-detail-modern-icon.is-playstation{
  color:#fff;
  background:linear-gradient(145deg,#126fff,#0b3f9f);
  border-color:rgba(113,173,255,.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 18px rgba(0,75,200,.20)
}

.ftr-bropack-detail-modern-icon.is-platform{
  color:transparent
}

.ftr-bropack-detail-modern-icon.is-platform-ps{
  background:linear-gradient(145deg,#1587ff 0%,#0758d7 100%);
  border-color:rgba(123,190,255,.62);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 8px 20px rgba(0,91,224,.24)
}

.ftr-bropack-detail-modern-icon.is-platform-xbox{
  background:linear-gradient(145deg,#39c86d 0%,#168a43 100%);
  border-color:rgba(116,230,151,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 20px rgba(31,165,82,.22)
}

.ftr-bropack-detail-modern-icon.is-platform-eaapp{
  background:linear-gradient(145deg,#ff9f32 0%,#e96613 100%);
  border-color:rgba(255,183,96,.62);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 8px 20px rgba(232,100,17,.24)
}

.ftr-bropack-detail-modern>div:last-child{min-width:0}

.ftr-bropack-detail-modern span{
  display:block;
  margin:0 0 7px;
  color:#9f8fb0;
  font-size:12px;
  font-weight:650
}

.ftr-bropack-detail-modern strong{
  display:flex;
  align-items:center;
  gap:7px;
  margin:0;
  color:#fff;
  font-size:20px;
  line-height:1.1;
  font-weight:950;
  letter-spacing:-.02em
}

.ftr-bropack-detail-modern strong.is-available{color:#49e98b}

.ftr-bropack-details-modern .ftr-bropack-country-flag{
  display:inline-flex;
  width:auto;
  height:auto;
  margin:0;
  font-size:1em!important;
  line-height:1!important
}

.ftr-bropack-description-modern{
  display:grid;
  grid-template-columns:44px 1fr;
  gap:15px;
  margin-top:14px;
  padding:20px;
  border:1px solid rgba(163,100,255,.25);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(48,25,77,.68),rgba(21,12,38,.82))
}

.ftr-bropack-description-modern-icon{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  color:#a96cff
}

.ftr-bropack-description-modern strong{
  display:block;
  margin:1px 0 9px;
  color:#fff;
  font-size:15px;
  font-weight:950
}

.ftr-bropack-description-modern p{
  margin:0;
  color:#b4a8bf;
  font-size:12px;
  line-height:1.72
}

@media(max-width:1000px){
  .ftr-bropack-overview{grid-template-columns:1fr}
  .ftr-bropack-overview-col + .ftr-bropack-overview-col{border-left:0;border-top:1px solid rgba(255,255,255,.08)}
}

@media(max-width:700px){
  .ftr-bropack-overview{border-radius:20px}
  .ftr-bropack-overview-col{padding:22px 18px}
  .ftr-bropack-overview-heading-icon{width:52px;height:52px;flex-basis:52px;border-radius:15px}
  .ftr-bropack-overview-heading-icon svg{width:27px;height:27px}
  .ftr-bropack-overview-heading h2{font-size:24px}
  .ftr-bropack-drop-row{grid-template-columns:120px minmax(80px,1fr) 58px;gap:10px;padding:0 12px;min-height:58px}
  .ftr-bropack-drop-label{gap:10px}
  .ftr-bropack-drop-label strong{font-size:12px}
  .ftr-bropack-drop-row>b{font-size:13px}
  .ftr-bropack-details-modern-grid{grid-template-columns:1fr}
  .ftr-bropack-detail-modern{min-height:88px;padding:14px}
  .ftr-bropack-detail-modern strong{font-size:17px}
}

/* =========================================================
   BroPack hero redesign
   ========================================================= */
.ftr-bropack-hero-modern{
  grid-template-columns:minmax(120px,170px) minmax(280px,1fr) minmax(360px,460px);
  gap:28px;
  align-items:center;
  padding:22px 24px;
  background:
    radial-gradient(circle at 15% 10%,rgba(93,44,255,.16),transparent 28%),
    linear-gradient(135deg,rgba(18,12,70,.96),rgba(8,13,58,.98));
}

.ftr-bropack-hero-art{
  display:flex;
  align-items:center;
  justify-content:center;
}

.ftr-bropack-hero-art img{
  display:block;
  width:100%;
  max-width:140px;
  max-height:260px;
  object-fit:contain;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.26));
}

.ftr-bropack-hero-main{
  min-width:0;
}

.ftr-bropack-hero-platform{
  width:72px;
  height:36px;
  margin-bottom:12px;
  background:rgba(6,16,79,.65);
  border-radius:2px;
}

.ftr-bropack-hero-modern h1{
  margin:0 0 16px;
  max-width:420px;
  font-size:clamp(34px,4.4vw,58px);
  line-height:.95;
  letter-spacing:-.03em;
}

.ftr-bropack-hero-brocoins{
  display:flex;
  align-items:center;
  gap:10px;
  color:#fff;
  font-size:30px;
  font-weight:900;
  line-height:1.1;
}

.ftr-bropack-coin-badge{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  font-size:16px;
  color:#f6b4ff;
  background:radial-gradient(circle at 35% 30%,#d17eff,#8f35ff 62%,#5a1cc2 100%);
  box-shadow:0 0 0 2px rgba(255,255,255,.08) inset, 0 6px 18px rgba(123,47,255,.3);
}

.ftr-bropack-hero-ftrprice{
  margin-top:10px;
  color:#41dd64;
  font-size:16px;
  font-weight:800;
}

.ftr-bropack-hero-buy-main{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:18px;
  min-height:42px;
  padding:0 16px;
  border-radius:10px;
  background:linear-gradient(180deg,#ffd641,#f0b700);
  color:#180d1f!important;
  font-weight:900;
  text-decoration:none!important;
  box-shadow:0 10px 20px rgba(0,0,0,.22);
}

.ftr-bropack-hero-packages{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  align-items:stretch;
}

.ftr-bropack-package-card{
  min-width:0;
  padding:14px 10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  text-align:center;
  color:#fff;
  background:linear-gradient(180deg,rgba(44,16,87,.95),rgba(16,9,33,.98));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), 0 12px 24px rgba(0,0,0,.22);
}

.ftr-bropack-package-card.tier-mini{border-color:#ff67d7; box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), 0 0 0 1px rgba(255,103,215,.22), 0 12px 24px rgba(0,0,0,.22)}
.ftr-bropack-package-card.tier-midi{border-color:#39adff; box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), 0 0 0 1px rgba(57,173,255,.22), 0 12px 24px rgba(0,0,0,.22)}
.ftr-bropack-package-card.tier-maxi{border-color:#ffd83d; box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), 0 0 0 1px rgba(255,216,61,.22), 0 12px 24px rgba(0,0,0,.22)}
.ftr-bropack-package-card.tier-ultra{border-color:#33dd80; box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), 0 0 0 1px rgba(51,221,128,.22), 0 12px 24px rgba(0,0,0,.22)}

.ftr-bropack-package-coin{
  width:40px;
  height:40px;
  margin:0 auto 10px;
  display:grid;
  place-items:center;
  border-radius:50%;
  font-size:18px;
  color:#f1b0ff;
  background:radial-gradient(circle at 35% 30%,#d07bff,#923bff 65%,#6220c8 100%);
  box-shadow:0 0 0 2px rgba(255,255,255,.08) inset;
}

.ftr-bropack-package-amount{
  font-size:22px;
  line-height:1;
  font-weight:950;
}

.ftr-bropack-package-unit{
  margin-top:2px;
  color:#c8b6df;
  font-size:12px;
  font-weight:700;
}

.ftr-bropack-package-label{
  margin-top:7px;
  font-size:22px;
  line-height:1;
  font-style:italic;
  font-weight:950;
}

.ftr-bropack-package-card.tier-mini .ftr-bropack-package-label{color:#ff75de}
.ftr-bropack-package-card.tier-midi .ftr-bropack-package-label{color:#4bb6ff}
.ftr-bropack-package-card.tier-maxi .ftr-bropack-package-label{color:#ffe157}
.ftr-bropack-package-card.tier-ultra .ftr-bropack-package-label{color:#49e88f}

.ftr-bropack-package-price{
  margin-top:9px;
  font-size:28px;
  line-height:1;
  font-weight:950;
  color:#fff;
}

.ftr-bropack-package-button{
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top:12px;
  min-height:32px;
  border-radius:8px;
  background:linear-gradient(180deg,#5f6fff,#3749d8);
  color:#fff!important;
  font-size:12px;
  font-weight:800;
  text-decoration:none!important;
}

.ftr-bropack-package-button.is-disabled{
  opacity:.6;
  pointer-events:none;
}

@media(max-width:1120px){
  .ftr-bropack-hero-modern{
    grid-template-columns:150px 1fr;
  }

  .ftr-bropack-hero-packages{
    grid-column:1 / -1;
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media(max-width:800px){
  .ftr-bropack-hero-modern{
    grid-template-columns:1fr;
    padding:22px 20px;
  }

  .ftr-bropack-hero-art img{
    max-width:180px;
    max-height:280px;
  }

  .ftr-bropack-hero-packages{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .ftr-bropack-hero-main{
    text-align:left;
  }
}

@media(max-width:520px){
  .ftr-bropack-hero-modern h1{
    font-size:34px;
  }

  .ftr-bropack-hero-brocoins{
    font-size:24px;
  }

  .ftr-bropack-hero-packages{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }

  .ftr-bropack-package-card{
    padding:12px 8px 10px;
  }

  .ftr-bropack-package-price{
    font-size:22px;
  }

  .ftr-bropack-package-label{
    font-size:18px;
  }
}

/* =========================================================
   BroPack hero v2: DB BroCoins products + larger pack art
   ========================================================= */
.ftr-bropack-hero-modern{
  grid-template-columns:minmax(190px,245px) minmax(300px,1fr) minmax(390px,500px);
  min-height:340px;
  padding:16px 22px;
  gap:24px;
}

.ftr-bropack-hero-art{
  align-self:stretch;
}

.ftr-bropack-hero-art img{
  width:100%;
  max-width:235px;
  max-height:330px;
  height:100%;
  object-fit:contain;
}

.ftr-bropack-hero-title{
  white-space:nowrap;
  max-width:none!important;
  font-size:clamp(28px,3.1vw,44px)!important;
  line-height:1!important;
  margin:0 0 8px!important;
}

.ftr-bropack-gold-word{
  color:#ffd84a;
  text-shadow:0 0 16px rgba(255,205,48,.18);
}

.ftr-bropack-hero-country{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:16px;
  color:#d7cee3;
  font-size:16px;
  font-weight:800;
}

.ftr-bropack-hero-country span{
  font-size:18px;
  line-height:1;
}

.ftr-bropack-coin-badge,
.ftr-bropack-package-coin{
  overflow:hidden;
  padding:0;
  background:transparent;
  box-shadow:none;
}

.ftr-bropack-coin-badge img,
.ftr-bropack-package-coin img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

.ftr-bropack-package-price{
  font-size:20px!important;
  line-height:1.05;
  white-space:nowrap;
}

.ftr-bropack-package-card{
  padding-left:8px;
  padding-right:8px;
}

@media(max-width:1120px){
  .ftr-bropack-hero-modern{
    grid-template-columns:minmax(180px,220px) 1fr;
  }

  .ftr-bropack-hero-title{
    white-space:normal;
  }
}

@media(max-width:800px){
  .ftr-bropack-hero-modern{
    min-height:0;
    grid-template-columns:1fr;
  }

  .ftr-bropack-hero-art img{
    max-width:240px;
    height:auto;
  }

  .ftr-bropack-hero-title{
    white-space:normal;
    font-size:34px!important;
  }
}

/* BroPack hero background artwork */
.ftr-bropack-hero-modern{
  background-image:
    linear-gradient(rgba(9,8,43,.08),rgba(9,8,43,.08)),
    url("https://ftrgames.com/wp-content/uploads/2026/09/background_bropacks_1.png")!important;
  background-size:100% 100%!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
}

/* =========================================================
   BroPack reward detail popup
   Opens only on explicit reward-card interaction and stays open
   until the user presses the X close button.
   ========================================================= */
.ftr-bropack-reward[data-ftr-bropack-reward-popup]{
  cursor:pointer
}

.ftr-bropack-reward[data-ftr-bropack-reward-popup]:focus-visible{
  outline:2px solid #b66cff;
  outline-offset:3px;
  box-shadow:0 0 0 4px rgba(154,61,255,.16),0 18px 38px rgba(0,0,0,.32)
}

html.ftr-bropack-reward-modal-open,
html.ftr-bropack-reward-modal-open body{
  overflow:hidden!important
}

.ftr-bropack-reward-modal[hidden]{
  display:none!important
}

.ftr-bropack-reward-modal{
  position:fixed;
  inset:0;
  z-index:2147482000;
  display:grid;
  place-items:center;
  padding:18px;
  color:#fff
}

.ftr-bropack-reward-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(8,1,20,.84);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px)
}

.ftr-bropack-reward-modal__card{
  position:relative;
  z-index:1;
  width:min(390px,100%);
  max-height:calc(100vh - 36px);
  overflow-y:auto;
  padding:22px 20px 20px;
  border:1px solid rgba(161,85,255,.48);
  border-radius:20px;
  background:
    radial-gradient(circle at 50% -12%,rgba(155,70,255,.22),transparent 33%),
    linear-gradient(180deg,#2a0c64 0%,#1b073d 48%,#120523 100%);
  box-shadow:0 32px 100px rgba(0,0,0,.64),0 0 42px rgba(127,48,255,.16)
}

.ftr-bropack-reward-modal__close{
  position:absolute;
  z-index:5;
  top:12px;
  right:12px;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.16);
  border-radius:10px;
  background:rgba(8,3,18,.74);
  color:#fff;
  font-size:25px;
  line-height:1;
  font-weight:500;
  cursor:pointer;
  transition:background .16s ease,border-color .16s ease,transform .16s ease
}

.ftr-bropack-reward-modal__close:hover,
.ftr-bropack-reward-modal__close:focus-visible{
  background:rgba(255,255,255,.11);
  border-color:rgba(255,255,255,.28);
  transform:scale(1.04);
  outline:none
}

.ftr-bropack-reward-modal__visual{
  position:relative;
  width:min(205px,68%);
  aspect-ratio:4/5;
  margin:0 auto 17px;
  overflow:hidden;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.13);
  border-radius:10px;
  background:rgba(255,255,255,.045);
  box-shadow:0 13px 32px rgba(0,0,0,.28)
}

.ftr-bropack-reward-modal__visual>[data-ftr-bropack-reward-modal-image]{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain
}

.ftr-bropack-reward-modal__rarity{
  position:absolute;
  z-index:3;
  top:8px;
  left:8px;
  max-width:calc(100% - 58px);
  padding:4px 7px 3px;
  border-radius:4px;
  color:#fff;
  font-size:9px;
  line-height:1;
  font-weight:950;
  font-style:italic;
  letter-spacing:.015em;
  text-transform:uppercase;
  box-shadow:0 4px 12px rgba(0,0,0,.20)
}

.ftr-bropack-reward-modal__rarity.is-legendary{
  background:#e5232e
}

.ftr-bropack-reward-modal__rarity.is-epic{
  background:#e8bd18
}

.ftr-bropack-reward-modal__rarity.is-rare{
  background:#25ae72
}

.ftr-bropack-reward-modal__rarity.is-common{
  background:#777981
}

.ftr-bropack-reward-modal__visual .ftr-bropack-value-badge{
  right:9px;
  bottom:9px
}

.ftr-bropack-reward-modal__card>h2{
  max-width:330px;
  margin:0 auto;
  color:#fff;
  font-size:19px;
  line-height:1.34;
  font-weight:950;
  letter-spacing:-.025em;
  text-align:center
}

.ftr-bropack-reward-modal__details{
  margin-top:30px
}

.ftr-bropack-reward-modal__details-title{
  margin:0 0 10px;
  color:#fff;
  font-size:12px;
  line-height:1;
  font-weight:950;
  font-style:italic
}

.ftr-bropack-reward-modal__details-box{
  padding:13px 17px 0;
  overflow:hidden;
  border:1px solid rgba(167,104,255,.30);
  border-radius:7px;
  background:rgba(24,5,57,.44)
}

.ftr-bropack-reward-modal__row{
  min-height:26px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  color:#ad9cc4;
  font-size:12px;
  line-height:1.25
}

.ftr-bropack-reward-modal__row>strong{
  max-width:190px;
  color:#fff;
  font-size:12px;
  line-height:1.25;
  font-weight:900;
  text-align:right
}

.ftr-bropack-reward-modal__row[data-ftr-bropack-reward-modal-price-row]>strong{
  color:#ffd83d
}

.ftr-bropack-reward-modal__coins{
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  gap:5px
}

.ftr-bropack-reward-modal__coins img{
  width:16px;
  height:16px;
  object-fit:contain
}

.ftr-bropack-reward-modal__buy{
  min-height:47px;
  margin-top:11px;
  border-top:1px solid rgba(255,255,255,.11);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  color:#ffd800!important;
  font-size:13px;
  line-height:1;
  font-weight:950;
  text-decoration:none!important;
  transition:color .16s ease,background .16s ease
}

.ftr-bropack-reward-modal__buy:hover,
.ftr-bropack-reward-modal__buy:focus-visible{
  color:#fff!important;
  background:rgba(255,216,0,.055);
  outline:none
}

.ftr-bropack-reward-modal__buy[hidden],
.ftr-bropack-reward-modal__row[hidden],
.ftr-bropack-reward-modal__visual .ftr-bropack-value-badge[hidden]{
  display:none!important
}

@media(max-width:480px){
  .ftr-bropack-reward-modal{
    padding:10px
  }

  .ftr-bropack-reward-modal__card{
    width:min(365px,100%);
    max-height:calc(100vh - 20px);
    padding:19px 16px 17px;
    border-radius:17px
  }

  .ftr-bropack-reward-modal__visual{
    width:min(185px,64%);
    margin-bottom:15px
  }

  .ftr-bropack-reward-modal__card>h2{
    font-size:17px
  }

  .ftr-bropack-reward-modal__details{
    margin-top:24px
  }

  .ftr-bropack-reward-modal__details-box{
    padding-left:14px;
    padding-right:14px
  }

  .ftr-bropack-reward-modal__row,
  .ftr-bropack-reward-modal__row>strong{
    font-size:11px
  }
}

/* =========================================================
   BroPack automatic BroCoin value display
   ========================================================= */
.ftr-bropack-hero-ftrprice{
  display:flex;
  align-items:baseline;
  gap:7px;
}

.ftr-bropack-hero-ftrprice-label{
  color:#ffd83d;
  font-weight:900;
}

.ftr-bropack-hero-ftrprice-value{
  color:#43e36d;
  font-size:17px;
  font-weight:950;
}

.ftr-bropack-coins{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
}

.ftr-bropack-coins img{
  width:15px;
  height:15px;
  flex:0 0 15px;
  object-fit:contain;
}

.ftr-bropack-brocoins-value{
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:5px;
  color:#91859e!important;
}

.ftr-bropack-brocoins-value strong{
  display:inline!important;
  min-height:0!important;
  color:#43e36d;
  font-size:inherit!important;
  line-height:inherit!important;
}

/* =========================================================
   BroPack local BroCoin pricing + BroCoins Value info
   ========================================================= */
.ftr-bropack-package-price{
  font-size:16px!important;
  letter-spacing:-.015em
}

.ftr-bropack-brocoins-value>a{
  color:#fff!important;
  font-weight:700;
  text-decoration:underline!important;
  text-decoration-style:dotted!important;
  text-underline-offset:3px;
  cursor:pointer
}

.ftr-bropack-brocoins-value>a:hover,
.ftr-bropack-brocoins-value>a:focus-visible{
  color:#ffd83d!important;
  outline:none
}

@media(min-width:1121px){
  .ftr-bropack-hero-main{
    transform:translateX(-12px)
  }
}

html.ftr-bropack-brocoin-info-open,
html.ftr-bropack-brocoin-info-open body{
  overflow:hidden!important
}

.ftr-bropack-brocoin-info-modal[hidden]{
  display:none!important
}

.ftr-bropack-brocoin-info-modal{
  position:fixed;
  inset:0;
  z-index:2147482500;
  display:grid;
  place-items:center;
  padding:18px;
  color:#fff
}

.ftr-bropack-brocoin-info-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(5,1,14,.86);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px)
}

.ftr-bropack-brocoin-info-modal__card{
  position:relative;
  z-index:1;
  width:min(500px,100%);
  max-height:calc(100vh - 36px);
  overflow-y:auto;
  padding:28px;
  border:1px solid rgba(162,85,255,.52);
  border-radius:20px;
  background:
    radial-gradient(circle at 50% -10%,rgba(154,69,255,.24),transparent 34%),
    linear-gradient(180deg,#271052 0%,#17082f 100%);
  box-shadow:0 30px 100px rgba(0,0,0,.62),0 0 36px rgba(126,48,255,.15)
}

.ftr-bropack-brocoin-info-modal__close{
  position:absolute;
  top:12px;
  right:12px;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.16);
  border-radius:10px;
  background:rgba(8,3,18,.76);
  color:#fff;
  font-size:25px;
  line-height:1;
  cursor:pointer
}

.ftr-bropack-brocoin-info-modal__icon{
  width:52px;
  height:52px;
  margin:0 auto 12px
}

.ftr-bropack-brocoin-info-modal__icon img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain
}

.ftr-bropack-brocoin-info-modal__card h2{
  margin:0 42px 12px;
  color:#fff;
  font-size:23px;
  line-height:1.15;
  text-align:center
}

.ftr-bropack-brocoin-info-modal__card>p{
  margin:0;
  color:#cbbfd8;
  font-size:13px;
  line-height:1.65;
  text-align:center
}

.ftr-bropack-brocoin-info-modal__calc{
  margin:18px 0;
  padding:16px;
  border:1px solid rgba(190,129,255,.24);
  border-radius:13px;
  background:rgba(255,255,255,.045)
}

.ftr-bropack-brocoin-info-modal__calc>strong{
  display:block;
  margin-bottom:7px;
  color:#ffd83d;
  font-size:13px
}

.ftr-bropack-brocoin-info-modal__calc p{
  margin:0;
  color:#ded5e8;
  font-size:12px;
  line-height:1.6
}

.ftr-bropack-brocoin-info-modal__calc b{
  color:#fff
}

.ftr-bropack-brocoin-info-modal__note{
  color:#9f92ad!important;
  font-size:11px!important;
  line-height:1.55!important
}

@media(max-width:520px){
  .ftr-bropack-brocoin-info-modal{
    padding:10px
  }

  .ftr-bropack-brocoin-info-modal__card{
    padding:24px 18px 20px;
    border-radius:17px
  }

  .ftr-bropack-brocoin-info-modal__card h2{
    margin-left:34px;
    margin-right:34px;
    font-size:20px
  }
}

/* =========================================================
   BroPack desktop focus test: larger hero, compact rewards
   ========================================================= */
@media(min-width:1121px){
  .ftr-bropack-hero-modern{
    box-sizing:border-box;
    width:min(1360px,calc(100vw - 32px));
    min-height:400px;
    margin-left:50%;
    transform:translateX(-50%);
    grid-template-columns:minmax(240px,290px) minmax(330px,1fr) minmax(500px,540px);
    gap:22px;
    padding:18px 28px;
  }

  .ftr-bropack-hero-art img{
    max-width:285px;
    max-height:390px;
  }

  .ftr-bropack-hero-main{
    transform:translateX(-10px);
  }

  .ftr-bropack-hero-title{
    font-size:clamp(32px,2.8vw,48px)!important;
  }

  .ftr-bropack-hero-title.is-long-title{
    font-size:clamp(24px,1.7vw,29px)!important;
    letter-spacing:-.028em;
  }

  .ftr-bropack-hero-title.is-very-long-title{
    font-size:clamp(21px,1.45vw,24px)!important;
    letter-spacing:-.032em;
  }

  /* The panel immediately after the hero is the Possible rewards panel. */
  .ftr-bropack-hero-modern + .ftr-bropack-panel{
    box-sizing:border-box;
    width:min(1080px,100%);
    margin-left:auto;
    margin-right:auto;
    padding:22px;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-panel-head h2{
    font-size:21px;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-filters{
    margin:14px 0;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-filters button{
    padding:7px 12px;
    font-size:12px;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-rewards{
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:8px;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-reward{
    border-radius:12px;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-reward-content{
    padding:10px 7px 11px;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-reward-content>strong{
    min-height:30px;
    font-size:11px;
    line-height:1.25;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-coins{
    margin-top:7px;
    gap:4px;
    font-size:10px;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-coins img{
    width:12px;
    height:12px;
    flex-basis:12px;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-brocoins-value{
    gap:3px;
    margin-top:4px;
    font-size:9px;
    white-space:nowrap;
  }

  .ftr-bropack-hero-modern + .ftr-bropack-panel .ftr-bropack-value-badge{
    right:6px;
    bottom:6px;
    min-height:22px;
    padding:4px 6px;
    gap:3px;
    border-radius:6px;
    font-size:8px;
  }
}

/* =========================================================
   BroPack mobile rewards: 3 cards per row
   ========================================================= */
@media(max-width:600px){
  .ftr-bropack-rewards{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
  }

  .ftr-bropack-reward{
    border-radius:10px;
  }

  .ftr-bropack-reward-content{
    padding:8px 5px 9px;
  }

  .ftr-bropack-reward strong,
  .ftr-bropack-reward-content>strong{
    min-height:28px;
    font-size:9px;
    line-height:1.2;
  }

  .ftr-bropack-coins{
    margin-top:6px;
    gap:3px;
    font-size:8px;
    line-height:1.2;
  }

  .ftr-bropack-coins img{
    width:10px;
    height:10px;
    flex:0 0 10px;
  }

  .ftr-bropack-brocoins-value{
    gap:2px;
    margin-top:4px;
    font-size:7.5px;
    line-height:1.15;
  }

  .ftr-bropack-value-badge{
    right:4px;
    bottom:4px;
    min-height:18px;
    padding:3px 4px;
    gap:2px;
    border-radius:5px;
    font-size:7px;
  }
}

/* =========================================================
   BroPack phone: dedicated hero background + single-row filters
   ========================================================= */
@media(max-width:600px){
  .ftr-bropack-hero-modern{
    background-image:
      linear-gradient(rgba(9,8,43,.08),rgba(9,8,43,.08)),
      url("https://ftrgames.com/wp-content/uploads/2026/09/bropacks_background_phone.png")!important;
    background-size:cover!important;
    background-position:center top!important;
    background-repeat:no-repeat!important;
  }

  .ftr-bropack-filters{
    display:flex;
    width:100%;
    gap:4px;
    flex-wrap:nowrap;
    align-items:center;
  }

  .ftr-bropack-filters button{
    flex:1 1 0;
    min-width:0;
    padding:7px 5px;
    font-size:clamp(8px,2.65vw,11px);
    line-height:1.1;
    white-space:nowrap;
  }
}

/* =========================================================
   BroPack phone: BroCoins Value stays clean and on one line
   ========================================================= */
@media(max-width:600px){
  .ftr-bropack-brocoins-value{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:center!important;
    gap:1px!important;
    width:100%;
    white-space:nowrap!important;
    font-size:clamp(5.6px,1.75vw,7.2px)!important;
    line-height:1.05!important;
    letter-spacing:-.025em;
  }

  .ftr-bropack-brocoins-value>a{
    flex:0 1 auto;
    min-width:0;
    white-space:nowrap!important;
    text-decoration:none!important;
    border-bottom:0!important;
  }

  .ftr-bropack-brocoins-value strong{
    flex:0 1 auto;
    min-width:0!important;
    white-space:nowrap!important;
    font-size:inherit!important;
    line-height:inherit!important;
    letter-spacing:inherit;
  }
}

/* =========================================================
   BroPack phone: compact pack pricing + BroCoins offers below Pack details
   ========================================================= */
.ftr-bropack-mobile-pack-price,
.ftr-bropack-brocoins-mobile-panel{
  display:none;
}

@media(max-width:600px){
  /* Keep the pack price visible high in the hero, directly under the country. */
  .ftr-bropack-mobile-pack-price{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:5px;
    margin-top:10px;
  }

  .ftr-bropack-mobile-pack-price__coins,
  .ftr-bropack-mobile-pack-price__local{
    display:flex;
    align-items:center;
    gap:7px;
    min-width:0;
    white-space:nowrap;
  }

  .ftr-bropack-mobile-pack-price__coins img{
    width:22px;
    height:22px;
    flex:0 0 22px;
    object-fit:contain;
  }

  .ftr-bropack-mobile-pack-price__coins strong{
    color:#fff;
    font-size:18px;
    line-height:1.1;
    font-weight:900;
  }

  .ftr-bropack-mobile-pack-price__local span{
    color:#ffd83d;
    font-size:12px;
    line-height:1.1;
    font-weight:900;
  }

  .ftr-bropack-mobile-pack-price__local strong{
    color:#43e36d;
    font-size:13px;
    line-height:1.1;
    font-weight:950;
  }

  /* The dedicated phone price summary replaces the desktop price rows. */
  .ftr-bropack-hero-main>.ftr-bropack-hero-brocoins,
  .ftr-bropack-hero-main>.ftr-bropack-hero-ftrprice{
    display:none!important;
  }

  .ftr-bropack-hero-buy-main{
    margin-top:14px;
  }

  /* BroCoin offers leave the hero on phone and get their own section below Pack details. */
  .ftr-bropack-hero-packages-desktop{
    display:none!important;
  }

  .ftr-bropack-brocoins-mobile-panel{
    display:block;
    margin-top:16px;
    padding:18px 14px 16px;
    overflow:hidden;
    background:
      radial-gradient(circle at 18% 0%,rgba(155,66,255,.18),transparent 38%),
      linear-gradient(180deg,rgba(40,13,70,.98),rgba(21,8,42,.98));
  }

  .ftr-bropack-brocoins-mobile-heading{
    margin-bottom:14px;
  }

  .ftr-bropack-brocoins-mobile-kicker{
    display:block;
    margin-bottom:4px;
    color:#b78cff;
    font-size:9px;
    line-height:1.1;
    font-weight:900;
    letter-spacing:.13em;
  }

  .ftr-bropack-brocoins-mobile-heading h2{
    margin:0;
    color:#fff;
    font-size:24px;
    line-height:1.05;
    font-weight:950;
    letter-spacing:-.02em;
  }

  .ftr-bropack-brocoins-mobile-heading p{
    margin:5px 0 0;
    color:#c9bdd7;
    font-size:11px;
    line-height:1.35;
  }

  .ftr-bropack-hero-packages-mobile{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .ftr-bropack-hero-packages-mobile .ftr-bropack-package-card{
    padding:12px 8px 10px;
  }

  .ftr-bropack-hero-packages-mobile .ftr-bropack-package-price{
    font-size:16px!important;
  }

  .ftr-bropack-hero-packages-mobile .ftr-bropack-package-button{
    min-height:34px;
    margin-top:10px;
    font-size:11px;
  }

  /* Preserve the requested phone density for Possible rewards. */
  .ftr-bropack-rewards{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

/* =========================================================
   BroPack desktop: keep pack BroCoins + FTRGamesPrice visible
   ========================================================= */
@media(min-width:601px){
  .ftr-bropack-mobile-pack-price{
    display:none!important;
  }

  .ftr-bropack-hero-main>.ftr-bropack-hero-brocoins,
  .ftr-bropack-hero-main>.ftr-bropack-hero-ftrprice{
    display:flex!important;
  }
}

/* =========================================================
   BroPack phone refinement: 3 rewards per row, clean BroCoins Value,
   and force the pack price summary to stay visible
   ========================================================= */
@media(max-width:600px){
  .ftr-bropack-mobile-pack-price{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    position:relative;
    z-index:3;
    margin:10px 0 2px!important;
  }

  .ftr-bropack-mobile-pack-price__coins,
  .ftr-bropack-mobile-pack-price__local{
    display:flex!important;
    align-items:center!important;
    white-space:nowrap!important;
  }

  .ftr-bropack-mobile-pack-price__coins strong{
    font-size:clamp(18px,6vw,24px)!important;
  }

  .ftr-bropack-mobile-pack-price__local span{
    font-size:clamp(11px,3.2vw,13px)!important;
  }

  .ftr-bropack-mobile-pack-price__local strong{
    font-size:clamp(13px,3.9vw,17px)!important;
  }

  /* The user requested 3 Possible rewards per row on phone. */
  .ftr-bropack-rewards{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }

  .ftr-bropack-reward{
    border-radius:11px!important;
  }

  .ftr-bropack-reward-content{
    padding:9px 6px 10px!important;
  }

  .ftr-bropack-reward strong,
  .ftr-bropack-reward-content>strong{
    min-height:32px!important;
    font-size:10px!important;
    line-height:1.18!important;
  }

  .ftr-bropack-coins{
    margin-top:7px!important;
    gap:4px!important;
    font-size:8.6px!important;
    line-height:1.18!important;
  }

  .ftr-bropack-coins img{
    width:11px!important;
    height:11px!important;
    flex:0 0 11px!important;
  }

  .ftr-bropack-brocoins-value{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    justify-content:unset!important;
    gap:4px!important;
    width:100%!important;
    margin-top:5px!important;
    white-space:nowrap!important;
    font-size:clamp(7px,2.0vw,8.6px)!important;
    line-height:1.1!important;
    letter-spacing:-.015em!important;
  }

  .ftr-bropack-brocoins-value>a{
    display:block!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    text-decoration:none!important;
    border-bottom:0!important;
  }

  .ftr-bropack-brocoins-value strong{
    display:block!important;
    min-width:0!important;
    white-space:nowrap!important;
    text-align:right!important;
    font-size:inherit!important;
    line-height:inherit!important;
  }
}

/* =========================================================
   BroPack phone rewards v2: featured carousel + 3-card grid
   ========================================================= */
.ftr-bropack-mobile-rewards-kicker,
.ftr-bropack-mobile-rewards-subtitle,
.ftr-bropack-mobile-featured{
  display:none;
}

@media(max-width:600px){
  .ftr-bropack-rewards-panel{
    padding:22px 14px 18px!important;
    overflow:hidden;
    background:
      radial-gradient(circle at 50% -10%,rgba(143,65,255,.18),transparent 34%),
      linear-gradient(180deg,rgba(40,14,70,.98),rgba(22,8,43,.98));
  }

  .ftr-bropack-mobile-rewards-kicker{
    display:block;
    margin:0 0 6px;
    color:#bda8d5;
    text-align:center;
    font-size:9px;
    line-height:1;
    font-weight:900;
    letter-spacing:.42em;
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-panel-head{
    justify-content:center;
    position:relative;
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-panel-head h2{
    margin:0;
    color:#fff;
    text-align:center;
    font-size:clamp(28px,8.3vw,38px)!important;
    line-height:1!important;
    font-weight:950;
    letter-spacing:-.045em;
    text-shadow:0 0 18px rgba(176,84,255,.28);
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-panel-head .ftr-bropack-count{
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
  }

  .ftr-bropack-mobile-rewards-subtitle{
    display:block;
    max-width:280px;
    margin:10px auto 15px;
    color:#c9bdd7;
    text-align:center;
    font-size:11px;
    line-height:1.45;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-filters{
    margin:0 0 14px!important;
    gap:5px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-filters button{
    min-height:34px;
    padding:6px 4px!important;
    border-width:1px;
    border-radius:999px;
    font-size:clamp(8px,2.55vw,10.5px)!important;
    box-shadow:none;
  }

  .ftr-bropack-mobile-featured{
    display:block;
    margin:0 -2px 18px;
  }

  .ftr-bropack-mobile-featured[hidden]{
    display:none!important;
  }

  .ftr-bropack-mobile-featured-stage{
    position:relative;
    display:flex;
    align-items:flex-end;
    justify-content:center;
    width:100%;
    aspect-ratio:9 / 10;
    min-height:360px;
    padding:34px 48px 48px;
    box-sizing:border-box;
    overflow:hidden;
    border-radius:18px;
    background-color:#080a18;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    transition:background-image .22s ease,filter .22s ease;
  }

  .ftr-bropack-mobile-featured[data-featured-rarity="mythic"] .ftr-bropack-mobile-featured-stage{
    background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/phone_m1.png");
  }

  .ftr-bropack-mobile-featured[data-featured-rarity="legendary"] .ftr-bropack-mobile-featured-stage{
    background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/phone_l1.png");
  }

  .ftr-bropack-mobile-featured[data-featured-rarity="epic"] .ftr-bropack-mobile-featured-stage{
    background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/phone_e1.png");
  }

  .ftr-bropack-mobile-featured[data-featured-rarity="rare"] .ftr-bropack-mobile-featured-stage{
    background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/phone_r1.png");
  }

  .ftr-bropack-mobile-featured[data-featured-rarity="common"] .ftr-bropack-mobile-featured-stage{
    background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/phone_c1.png");
  }

  .ftr-bropack-mobile-featured-mount{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-end;
    justify-content:center;
    width:100%;
    height:100%;
  }

  .ftr-bropack-mobile-featured-reward{
    --ftr-rarity-accent:#8d43ff;
    width:min(72%,230px);
    margin:0 auto;
    color:#fff;
    text-align:center;
    cursor:pointer;
    outline:none;
  }

  .ftr-bropack-mobile-featured-reward.rarity-legendary,
  .ftr-bropack-reward.rarity-legendary{--ftr-rarity-accent:#f01928}
  .ftr-bropack-mobile-featured-reward.rarity-epic,
  .ftr-bropack-reward.rarity-epic{--ftr-rarity-accent:#ffd21d}
  .ftr-bropack-mobile-featured-reward.rarity-rare,
  .ftr-bropack-reward.rarity-rare{--ftr-rarity-accent:#45d9b4}
  .ftr-bropack-mobile-featured-reward.rarity-common,
  .ftr-bropack-reward.rarity-common{--ftr-rarity-accent:#92939b}

  .ftr-bropack-mobile-featured-card{
    overflow:hidden;
    border:2px solid var(--ftr-rarity-accent);
    border-radius:15px;
    background:#0b0712;
    box-shadow:
      0 0 0 1px rgba(255,255,255,.06) inset,
      0 0 22px color-mix(in srgb,var(--ftr-rarity-accent) 58%,transparent),
      0 18px 30px rgba(0,0,0,.34);
  }

  .ftr-bropack-mobile-featured-rarity{
    width:100%;
    aspect-ratio:4 / 1;
    overflow:hidden;
    background:#0d0715;
  }

  .ftr-bropack-mobile-featured-rarity img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
  }

  .ftr-bropack-mobile-featured-image{
    position:relative;
    display:flex;
    align-items:stretch;
    justify-content:center;
    width:100%;
    aspect-ratio:6 / 5;
    padding:0 7px 7px;
    box-sizing:border-box;
    background:var(--ftr-rarity-accent);
  }

  .ftr-bropack-mobile-featured-image>img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:0 0 8px 8px;
  }

  .ftr-bropack-mobile-featured-image .ftr-bropack-value-badge{
    right:12px!important;
    bottom:12px!important;
    min-height:24px;
    padding:5px 7px;
    font-size:10px;
  }

  .ftr-bropack-mobile-featured-caption{
    padding-top:12px;
  }

  .ftr-bropack-mobile-featured-caption h3{
    margin:0;
    color:#fff;
    font-size:13px;
    line-height:1.28;
    font-weight:900;
  }

  .ftr-bropack-mobile-featured-meta{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:5px 9px;
    margin-top:7px;
    font-size:11px;
    font-weight:850;
  }

  .ftr-bropack-mobile-featured-coins{
    display:inline-flex;
    align-items:center;
    gap:5px;
    color:#d98cff;
    white-space:nowrap;
  }

  .ftr-bropack-mobile-featured-coins img{
    width:15px;
    height:15px;
    object-fit:contain;
  }

  .ftr-bropack-mobile-featured-value{
    color:#43e36d;
    white-space:nowrap;
    cursor:pointer;
  }

  .ftr-bropack-mobile-featured-arrow{
    position:absolute;
    z-index:4;
    top:50%;
    width:42px;
    height:42px;
    margin-top:-21px;
    padding:0;
    border:1px solid rgba(255,255,255,.72);
    border-radius:50%;
    background:rgba(18,10,36,.68);
    color:#fff;
    font-size:34px;
    line-height:36px;
    font-family:Arial,sans-serif;
    font-weight:300;
    box-shadow:0 8px 24px rgba(0,0,0,.32);
    backdrop-filter:blur(5px);
  }

  .ftr-bropack-mobile-featured-arrow.is-prev{left:8px}
  .ftr-bropack-mobile-featured-arrow.is-next{right:8px}

  .ftr-bropack-mobile-featured-dots{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:7px;
    min-height:9px;
    margin-top:10px;
  }

  .ftr-bropack-mobile-featured-dot{
    display:block;
    width:7px;
    height:7px;
    border-radius:50%;
    background:#504360;
    transition:transform .18s ease,background .18s ease,box-shadow .18s ease;
  }

  .ftr-bropack-mobile-featured-dot.is-active{
    transform:scale(1.18);
    background:#b44dff;
    box-shadow:0 0 10px rgba(180,77,255,.8);
  }

  /* Compact reward grid: exactly three cards per row on phones. */
  .ftr-bropack-rewards-panel .ftr-bropack-rewards{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-reward{
    overflow:hidden;
    border:1px solid color-mix(in srgb,var(--ftr-rarity-accent) 72%,transparent)!important;
    border-radius:12px!important;
    background:linear-gradient(180deg,#12091f 0%,#0b0713 100%);
    box-shadow:0 9px 22px rgba(0,0,0,.22);
  }

  .ftr-bropack-rewards-panel .ftr-bropack-rarity-image{
    position:relative;
    z-index:2;
  }

  /* Product artwork is no longer full bleed: small rarity-colour rails stay visible. */
  .ftr-bropack-rewards-panel .ftr-bropack-reward-img{
    width:100%!important;
    margin:0!important;
    padding:0 4px 4px!important;
    box-sizing:border-box!important;
    background:var(--ftr-rarity-accent)!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-reward-img>img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    border-radius:0 0 5px 5px;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-value-badge{
    right:8px!important;
    bottom:8px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-reward-content{
    padding:9px 5px 10px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-reward-content>strong{
    min-height:31px!important;
    font-size:9.5px!important;
    line-height:1.18!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-coins{
    margin-top:7px!important;
    gap:3px!important;
    font-size:8px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-coins img{
    width:10px!important;
    height:10px!important;
    flex:0 0 10px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-brocoins-value{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:3px!important;
    margin-top:5px!important;
    font-size:clamp(6.4px,1.82vw,7.7px)!important;
  }
}

/* BroPack phone: keep featured carousel product name on one line */
@media(max-width:600px){
  .ftr-bropack-mobile-featured-caption h3{
    width:max-content;
    max-width:calc(100vw - 72px);
    margin-left:50%;
    transform:translateX(-50%);
    white-space:nowrap;
    font-size:clamp(10px,3vw,12px);
    line-height:1.15;
  }
}

/* =========================================================
   BroPack RCV (Real Coins Value)
   Gift-card RCV is the card face value, not the BroCoins estimate.
   ========================================================= */
.ftr-bropack-rcv-value{
  display:flex!important;
  align-items:center;
  justify-content:center;
  width:100%;
  margin-top:5px!important;
  min-height:0!important;
  white-space:nowrap;
  font-size:inherit;
  line-height:1.1
}

.ftr-bropack-rcv-value>a{
  display:inline-flex;
  align-items:center;
  gap:3px;
  min-width:0;
  color:#43e36d!important;
  font-weight:850;
  white-space:nowrap;
  text-decoration:none!important;
  border-bottom:0!important;
  cursor:pointer
}

.ftr-bropack-rcv-value>a:hover,
.ftr-bropack-rcv-value>a:focus-visible{
  color:#62ef84!important;
  text-decoration:none!important;
  outline:none
}

.ftr-bropack-rcv-label{
  color:#fff;
  font-weight:900
}

.ftr-bropack-rcv-info-modal__badge{
  width:58px;
  height:58px;
  margin:0 auto 12px;
  display:grid;
  place-items:center;
  border:1px solid rgba(83,232,117,.42);
  border-radius:17px;
  color:#53e875;
  background:linear-gradient(145deg,rgba(52,218,104,.16),rgba(91,51,160,.18));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 28px rgba(0,0,0,.22);
  font-size:16px;
  line-height:1;
  font-weight:950;
  letter-spacing:.04em
}

.ftr-bropack-rcv-info-modal__eneba-link{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  margin:0 0 14px;
  padding:0 14px;
  border-radius:10px;
  background:linear-gradient(180deg,#ffd83d,#efb900);
  color:#170822!important;
  font-size:12px;
  font-weight:900;
  text-decoration:none!important
}

.ftr-bropack-rcv-info-modal__eneba-link[hidden]{display:none!important}

@media(max-width:600px){
  .ftr-bropack-rewards-panel .ftr-bropack-rcv-value{
    margin-top:5px!important;
    font-size:clamp(7px,2vw,8.6px)!important;
    letter-spacing:-.01em
  }

  .ftr-bropack-rewards-panel .ftr-bropack-rcv-value>a{
    gap:2px;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis
  }

  .ftr-bropack-mobile-featured-value{
    color:#43e36d!important;
    text-decoration:none!important;
    border-bottom:0!important;
    white-space:nowrap!important
  }
}

/* =========================================================
   BroPack phone: diagonal featured reward + boxed reward info
   ========================================================= */
@media(max-width:600px){
  /* Tilt only the featured product card; navigation/background stay straight. */
  .ftr-bropack-mobile-featured-card{
    transform:rotate(-3.5deg) scale(.96);
    transform-origin:50% 88%;
    transition:transform .22s ease;
  }

  /* Keep the information horizontal in a premium box below the tilted card. */
  .ftr-bropack-mobile-featured-caption{
    position:relative;
    z-index:3;
    box-sizing:border-box;
    width:min(calc(100vw - 82px),330px);
    margin:14px 0 0 50%;
    padding:11px 12px 10px;
    transform:translateX(-50%);
    border:1px solid color-mix(in srgb,var(--ftr-rarity-accent) 78%,rgba(255,255,255,.14));
    border-radius:14px;
    background:linear-gradient(180deg,rgba(31,12,45,.94),rgba(15,7,27,.96));
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.05),
      0 10px 24px rgba(0,0,0,.30),
      0 0 16px color-mix(in srgb,var(--ftr-rarity-accent) 20%,transparent);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
  }

  .ftr-bropack-mobile-featured-caption h3{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    transform:none!important;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap!important;
    color:#fff;
    font-size:clamp(10px,3vw,12.5px)!important;
    line-height:1.15!important;
    font-weight:950;
    text-align:center;
  }

  .ftr-bropack-mobile-featured-meta{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    margin-top:8px!important;
    padding-top:7px;
    border-top:1px solid rgba(255,255,255,.08);
    font-size:clamp(9px,2.7vw,11.5px)!important;
    line-height:1.1!important;
  }

  .ftr-bropack-mobile-featured-coins,
  .ftr-bropack-mobile-featured-value{
    flex:0 1 auto;
    min-width:0;
    white-space:nowrap!important;
  }

  .ftr-bropack-mobile-featured-coins{
    color:#d98cff!important;
    font-weight:900;
  }

  .ftr-bropack-mobile-featured-value{
    color:#43e36d!important;
    font-weight:950;
  }

  .ftr-bropack-mobile-featured-coins img{
    width:14px!important;
    height:14px!important;
    flex:0 0 14px;
  }
}

/* =========================================================
   BroPack phone: featured reward orientation + caption below podium
   Requested refinement:
   - make the featured product more diagonal like the mockup
   - move the info box below the podium so the podium remains visible
   ========================================================= */
@media(max-width:600px){
  .ftr-bropack-mobile-featured-stage{
    padding:28px 44px 18px;
  }

  .ftr-bropack-mobile-featured-reward{
    width:min(78%,252px);
  }

  .ftr-bropack-mobile-featured-card{
    transform:rotate(-5.25deg) scale(.95);
    transform-origin:50% 90%;
    margin-bottom:46px;
  }

  .ftr-bropack-mobile-featured-caption{
    width:min(calc(100vw - 88px),338px);
    margin-top:0;
    padding:13px 14px 12px;
  }

  .ftr-bropack-mobile-featured-caption h3{
    font-size:clamp(10px,3vw,13px)!important;
  }

  .ftr-bropack-mobile-featured-meta{
    gap:10px!important;
    margin-top:9px!important;
    padding-top:8px;
  }
}

/* =========================================================
   BroPack phone: featured reward sits on podium top, caption on bottom podium row
   Requested refinement:
   - the reward card must visually sit on the top platform of the podium
   - the info box must be smaller and lower, aligned over the bottom podium ring
   ========================================================= */
@media(max-width:600px){
  .ftr-bropack-mobile-featured-stage{
    padding:24px 42px 10px!important;
  }

  .ftr-bropack-mobile-featured-reward{
    width:min(74%,236px)!important;
  }

  .ftr-bropack-mobile-featured-card{
  transform:translateY(-39px) rotate(-5.4deg) scale(.91)!important;
    transform-origin:50% 90%!important;
    margin-bottom:8px!important;
  }

  .ftr-bropack-mobile-featured-caption{
    width:min(calc(100vw - 106px),298px)!important;
    margin-top:0!important;
    padding:8px 10px 8px!important;
    border-radius:12px!important;
    transform:translate(-50%,4px)!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.05),
      0 8px 18px rgba(0,0,0,.24),
      0 0 12px color-mix(in srgb,var(--ftr-rarity-accent) 14%,transparent)!important;
  }

  .ftr-bropack-mobile-featured-caption h3{
    font-size:clamp(9.5px,2.8vw,12px)!important;
    line-height:1.08!important;
  }

  .ftr-bropack-mobile-featured-meta{
    gap:8px!important;
    margin-top:7px!important;
    padding-top:6px!important;
    font-size:clamp(8.8px,2.55vw,10.8px)!important;
  }

  .ftr-bropack-mobile-featured-coins img{
    width:13px!important;
    height:13px!important;
    flex:0 0 13px!important;
  }
}


/* =========================================================
   BroPack desktop Possible Rewards v3
   Desktop-only showcase + Store Price game suggestions + 7-card pages.
   Mobile/tablet rules remain untouched.
   ========================================================= */
.ftr-bropack-desktop-showcase,
.ftr-bropack-desktop-all-head,
.ftr-bropack-desktop-rewards-arrow,
.ftr-bropack-desktop-games-arrow{
  display:none;
}

.ftr-bropack-desktop-rewards-viewport{
  display:contents;
}

.ftr-bropack-rewards-panel>.ftr-bropack-panel-head h2 em{
  color:inherit;
  font-style:normal;
}

@media(min-width:1121px){
  .ftr-bropack-rewards-panel{
    position:relative;
    box-sizing:border-box;
    width:min(1360px,calc(100vw - 32px))!important;
    max-width:none!important;
    margin-left:50%!important;
    margin-right:0!important;
    padding:26px 28px 28px!important;
    transform:translateX(-50%);
    overflow:hidden;
    background:
      radial-gradient(circle at 20% -25%,rgba(142,57,255,.18),transparent 42%),
      linear-gradient(180deg,rgba(27,10,48,.98),rgba(12,6,25,.99));
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-panel-head{
    width:43%;
    justify-content:flex-start!important;
    gap:12px;
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-panel-head h2{
    margin:0!important;
    color:#fff;
    font-size:clamp(34px,3vw,48px)!important;
    line-height:.95;
    font-weight:950;
    letter-spacing:-.045em;
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-panel-head h2 em{
    color:#d64cff;
    font-style:normal;
    text-shadow:0 0 18px rgba(199,68,255,.28);
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-panel-head .ftr-bropack-count{
    padding:7px 10px;
    border:1px solid rgba(164,88,255,.28);
    background:rgba(107,42,161,.18);
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-mobile-rewards-subtitle{
    display:block;
    width:43%;
    max-width:none;
    margin:7px 0 18px;
    color:#a99bb8;
    text-align:left;
    font-size:12px;
    line-height:1.45;
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-filters{
    position:absolute;
    z-index:4;
    top:29px;
    left:49%;
    right:28px;
    display:flex;
    justify-content:flex-start;
    align-items:center;
    gap:9px;
    margin:0!important;
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-filters button{
    min-width:92px;
    min-height:36px;
    padding:7px 16px!important;
    border-radius:999px;
    font-size:12px!important;
    font-weight:800;
    transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-filters button:hover{
    transform:translateY(-1px);
  }

  .ftr-bropack-rewards-panel>.ftr-bropack-filters button.is-active{
    box-shadow:0 0 0 1px rgba(255,255,255,.13) inset,0 0 20px rgba(161,59,255,.28);
  }

  .ftr-bropack-desktop-showcase{
    display:grid;
    grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
    gap:14px;
    margin-top:4px;
  }

  .ftr-bropack-desktop-featured,
  .ftr-bropack-desktop-games{
    position:relative;
    min-width:0;
    min-height:338px;
    overflow:hidden;
    border:1px solid rgba(139,67,235,.48);
    border-radius:18px;
    background:#100820;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 14px 34px rgba(0,0,0,.24);
  }

  .ftr-bropack-desktop-featured{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(220px,1.1fr);
    align-items:center;
    padding:28px 48px 26px 34px;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
  }

  .ftr-bropack-desktop-featured:before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(90deg,rgba(7,4,15,.92) 0%,rgba(10,4,20,.73) 43%,rgba(8,3,18,.12) 76%,rgba(8,3,18,.04) 100%);
  }

  .ftr-bropack-desktop-featured[data-featured-rarity="mythic"]{background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/desktop_m1.png")}
  .ftr-bropack-desktop-featured[data-featured-rarity="legendary"]{background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/desktop_l1.png")}
  .ftr-bropack-desktop-featured[data-featured-rarity="epic"]{background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/desktop_e11.png")}
  .ftr-bropack-desktop-featured[data-featured-rarity="rare"]{background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/desktop_r1.png")}
  .ftr-bropack-desktop-featured[data-featured-rarity="common"]{background-image:url("https://ftrgames.com/wp-content/uploads/2026/09/desktop_c1.png")}

  .ftr-bropack-desktop-featured-copy,
  .ftr-bropack-desktop-featured-visual{
    position:relative;
    z-index:2;
    min-width:0;
  }

  .ftr-bropack-desktop-featured-copy{
    align-self:center;
  }

  .ftr-bropack-desktop-featured-rarity{
    display:inline-flex;
    min-height:25px;
    align-items:center;
    padding:0 10px;
    border:1px solid rgba(255,255,255,.2);
    border-radius:7px;
    background:rgba(255,255,255,.08);
    color:#fff;
    font-size:10px;
    line-height:1;
    font-weight:950;
    letter-spacing:.03em;
  }

  .ftr-bropack-desktop-featured[data-featured-rarity="legendary"] .ftr-bropack-desktop-featured-rarity{background:#b5121f;border-color:#ff4f61}
  .ftr-bropack-desktop-featured[data-featured-rarity="epic"] .ftr-bropack-desktop-featured-rarity{background:#8d6b00;border-color:#ffd83d}
  .ftr-bropack-desktop-featured[data-featured-rarity="rare"] .ftr-bropack-desktop-featured-rarity{background:#0d8069;border-color:#45d9b4}
  .ftr-bropack-desktop-featured[data-featured-rarity="common"] .ftr-bropack-desktop-featured-rarity{background:#565861;border-color:#a4a6ad}

  .ftr-bropack-desktop-featured-copy h3{
    margin:12px 0 12px;
    max-width:260px;
    color:#fff;
    font-size:clamp(21px,1.8vw,29px);
    line-height:1.03;
    font-weight:950;
    letter-spacing:-.03em;
  }

  .ftr-bropack-desktop-featured-meta{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:5px;
  }

  .ftr-bropack-desktop-featured-coins{
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#d98cff;
    font-size:17px;
    line-height:1;
    font-weight:950;
  }

  .ftr-bropack-desktop-featured-coins img{
    width:20px;
    height:20px;
    object-fit:contain;
  }

  .ftr-bropack-desktop-featured-rcv{
    color:#48e879;
    font-size:16px;
    line-height:1;
    font-weight:950;
    cursor:pointer;
    white-space:nowrap;
  }

  .ftr-bropack-desktop-featured-description{
    max-width:280px;
    margin:16px 0 0;
    color:#c1b5ca;
    font-size:11px;
    line-height:1.52;
  }

  .ftr-bropack-desktop-featured-footer{
    display:flex;
    gap:10px;
    margin-top:19px;
    padding-top:12px;
    border-top:1px solid rgba(255,255,255,.09);
    color:#a89ab4;
    font-size:9.5px;
    font-weight:750;
  }

  .ftr-bropack-desktop-featured-visual{
    display:flex;
    align-items:center;
    justify-content:center;
    align-self:stretch;
  }

  .ftr-bropack-desktop-featured-card{
    --ftr-rarity-accent:#8d43ff;
    width:min(68%,190px);
    overflow:hidden;
    border:2px solid var(--ftr-rarity-accent);
    border-radius:14px;
    background:#0b0712;
    box-shadow:0 0 26px color-mix(in srgb,var(--ftr-rarity-accent) 55%,transparent),0 22px 38px rgba(0,0,0,.38);
    cursor:pointer;
    transform:translateY(-4px) rotate(1.3deg);
  }

  .ftr-bropack-desktop-featured-card.rarity-legendary{--ftr-rarity-accent:#f01928}
  .ftr-bropack-desktop-featured-card.rarity-epic{--ftr-rarity-accent:#ffd21d}
  .ftr-bropack-desktop-featured-card.rarity-rare{--ftr-rarity-accent:#45d9b4}
  .ftr-bropack-desktop-featured-card.rarity-common{--ftr-rarity-accent:#92939b}

  .ftr-bropack-desktop-featured-card .ftr-bropack-rarity-image{
    width:100%;
    aspect-ratio:4/1;
  }

  .ftr-bropack-desktop-featured-card .ftr-bropack-reward-img{
    aspect-ratio:6/5;
    padding:0 6px 6px;
    box-sizing:border-box;
    background:var(--ftr-rarity-accent);
  }

  .ftr-bropack-desktop-featured-card .ftr-bropack-reward-img>img{
    border-radius:0 0 6px 6px;
  }

  .ftr-bropack-desktop-featured-arrow{
    position:absolute;
    z-index:5;
    top:50%;
    width:36px;
    height:36px;
    margin-top:-18px;
    padding:0;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.58);
    border-radius:50%;
    background:rgba(17,8,31,.72);
    color:#fff;
    font:400 29px/1 Arial,sans-serif;
    cursor:pointer;
    backdrop-filter:blur(5px);
  }
  .ftr-bropack-desktop-featured-arrow.is-prev{left:11px}
  .ftr-bropack-desktop-featured-arrow.is-next{right:11px}

  .ftr-bropack-desktop-games{
    position:relative;
    padding:18px 18px 16px;
    background:
      radial-gradient(circle at 30% 0,rgba(136,54,255,.12),transparent 32%),
      linear-gradient(180deg,rgba(20,10,38,.98),rgba(9,6,20,.99));
  }

  .ftr-bropack-desktop-games-eneba,
  .ftr-bropack-desktop-games-fcpoints{
    display:none;
    position:absolute;
    inset:0;
    z-index:3;
    overflow:hidden;
    border-radius:inherit;
  }

  .ftr-bropack-desktop-games-eneba img,
  .ftr-bropack-desktop-games-fcpoints img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
  }

  .ftr-bropack-desktop-games.is-eneba-gift-card,
  .ftr-bropack-desktop-games.is-fc-points-reward{
    padding:0;
  }

  .ftr-bropack-desktop-games.is-eneba-gift-card>.ftr-bropack-desktop-games-eneba,
  .ftr-bropack-desktop-games.is-fc-points-reward>.ftr-bropack-desktop-games-fcpoints{
    display:block;
  }

  .ftr-bropack-desktop-games.is-eneba-gift-card>.ftr-bropack-desktop-games-head,
  .ftr-bropack-desktop-games.is-eneba-gift-card>.ftr-bropack-desktop-games-carousel,
  .ftr-bropack-desktop-games.is-eneba-gift-card>.ftr-bropack-desktop-games-empty,
  .ftr-bropack-desktop-games.is-fc-points-reward>.ftr-bropack-desktop-games-head,
  .ftr-bropack-desktop-games.is-fc-points-reward>.ftr-bropack-desktop-games-carousel,
  .ftr-bropack-desktop-games.is-fc-points-reward>.ftr-bropack-desktop-games-empty{
    display:none!important;
  }

  .ftr-bropack-desktop-games-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:14px;
  }

  .ftr-bropack-desktop-games-head h3{
    margin:0;
    color:#fff;
    font-size:17px;
    line-height:1.1;
    font-weight:950;
  }

  .ftr-bropack-desktop-games-head p{
    margin:4px 0 0;
    color:#917fa4;
    font-size:9.5px;
    line-height:1.3;
  }

  .ftr-bropack-desktop-games-value{
    flex:0 0 auto;
    padding:6px 9px;
    border:1px solid rgba(174,96,255,.26);
    border-radius:8px;
    color:#c995ff;
    background:rgba(105,43,153,.12);
    font-size:9px;
    font-weight:850;
  }

  .ftr-bropack-desktop-games-carousel{
    position:relative;
    min-height:255px;
  }

  .ftr-bropack-desktop-games-track{
    display:flex;
    gap:9px;
    min-width:0;
    overflow-x:auto;
    overflow-y:hidden;
    padding:1px 2px 8px;
    scroll-behavior:smooth;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
  }
  .ftr-bropack-desktop-games-track::-webkit-scrollbar{display:none}

  .ftr-bropack-desktop-game-card{
    flex:0 0 128px;
    min-width:0;
    overflow:hidden;
    padding:7px 7px 9px;
    border:1px solid rgba(133,84,190,.3);
    border-radius:11px;
    background:linear-gradient(180deg,rgba(27,15,47,.98),rgba(13,8,24,.99));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  }

  .ftr-bropack-desktop-game-image{
    width:100%;
    aspect-ratio:4/5;
    overflow:hidden;
    border-radius:7px;
    background:#140b22;
  }

  .ftr-bropack-desktop-game-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
  }

  .ftr-bropack-desktop-game-card>strong{
    display:-webkit-box;
    min-height:29px;
    margin-top:7px;
    overflow:hidden;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    color:#fff;
    font-size:10px;
    line-height:1.25;
    font-weight:850;
  }

  .ftr-bropack-desktop-game-meta{
    display:block;
    margin-top:4px;
    overflow:hidden;
    color:#877a92;
    font-size:8px;
    line-height:1.2;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .ftr-bropack-desktop-game-price-label{
    display:block;
    margin-top:6px;
    color:#7f718d;
    font-size:7.5px;
    line-height:1;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.05em;
  }

  .ftr-bropack-desktop-game-price{
    margin-top:3px;
    color:#fff;
    font-size:12px;
    line-height:1;
    font-weight:950;
  }

  .ftr-bropack-desktop-game-card>a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:26px;
    margin-top:7px;
    border-radius:7px;
    background:linear-gradient(180deg,#7c3cff,#5721cb);
    color:#fff!important;
    font-size:8.5px;
    font-weight:850;
    text-decoration:none!important;
  }

  .ftr-bropack-desktop-games-arrow{
    position:absolute;
    z-index:4;
    top:42%;
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid rgba(255,255,255,.35);
    border-radius:50%;
    background:rgba(10,5,20,.88);
    color:#fff;
    font:400 24px/1 Arial,sans-serif;
    cursor:pointer;
  }
  .ftr-bropack-desktop-games-arrow.is-prev{left:-9px}
  .ftr-bropack-desktop-games-arrow.is-next{right:-9px}
  .ftr-bropack-desktop-games-arrow:disabled{opacity:.28;cursor:default}

  .ftr-bropack-desktop-games-empty{
    margin:75px auto 0;
    max-width:360px;
    color:#8d8099;
    text-align:center;
    font-size:11px;
    line-height:1.55;
  }

  .ftr-bropack-desktop-all-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin:20px 0 11px;
    padding-top:15px;
    border-top:1px solid rgba(145,76,225,.22);
  }

  .ftr-bropack-desktop-all-head>div{
    display:flex;
    align-items:center;
    gap:7px;
    color:#fff;
  }

  .ftr-bropack-desktop-all-icon{
    color:#d64cff;
    font-size:18px;
  }

  .ftr-bropack-desktop-all-head strong{
    font-size:16px;
    font-weight:950;
  }

  .ftr-bropack-desktop-all-head small{
    color:#9c8eaa;
    font-size:11px;
    font-weight:750;
  }

  .ftr-bropack-desktop-all-head p{
    margin:0;
    color:#81758c;
    font-size:9px;
  }

  .ftr-bropack-desktop-rewards-viewport{
    position:relative;
    display:block;
    min-width:0;
    padding:0 20px;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-desktop-rewards-viewport .ftr-bropack-rewards{
    display:grid!important;
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    gap:9px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-reward{
    min-width:0;
    border-radius:11px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-reward-content{
    padding:9px 6px 10px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-reward-content>strong{
    min-height:30px!important;
    font-size:10px!important;
    line-height:1.18!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-coins{
    margin-top:6px!important;
    font-size:8.5px!important;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-rcv-value{
    margin-top:4px!important;
    font-size:9px!important;
  }

  .ftr-bropack-desktop-rewards-arrow{
    position:absolute;
    z-index:5;
    top:50%;
    width:32px;
    height:32px;
    margin-top:-16px;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid rgba(255,255,255,.36);
    border-radius:50%;
    background:rgba(13,7,24,.92);
    color:#fff;
    font:400 24px/1 Arial,sans-serif;
    cursor:pointer;
    box-shadow:0 8px 18px rgba(0,0,0,.28);
  }
  .ftr-bropack-desktop-rewards-arrow.is-prev{left:-2px}
  .ftr-bropack-desktop-rewards-arrow.is-next{right:-2px}
  .ftr-bropack-desktop-rewards-arrow:disabled{opacity:.3;cursor:default}
}


.ftr-bropack-desktop-featured[hidden],
.ftr-bropack-desktop-games-arrow[hidden],
.ftr-bropack-desktop-rewards-arrow[hidden],
.ftr-bropack-desktop-game-card[hidden]{display:none!important;}

/* =========================================================
   BroPack desktop Possible Rewards refinement
   - Games/products panel: 3 visible cards, scroll one card at a time
   - Remove platform/country metadata line from card layout
   - Smaller navigation arrows with reserved clearance so they do not cover content
   Mobile remains unchanged.
   ========================================================= */
@media(min-width:1121px){
  /* Featured reward arrows: keep them inside the outer gutter, not over BroCoins / RCV. */
  .ftr-bropack-desktop-featured-arrow{
    width:24px!important;
    height:24px!important;
    margin-top:-12px!important;
    font-size:18px!important;
    line-height:1!important;
  }
  .ftr-bropack-desktop-featured-arrow.is-prev{left:6px!important}
  .ftr-bropack-desktop-featured-arrow.is-next{right:6px!important}

  /* Reserve arrow clearance and show exactly 3 product cards in the viewport. */
  .ftr-bropack-desktop-games-carousel{
    padding:0 26px;
    box-sizing:border-box;
  }

  .ftr-bropack-desktop-games-track{
    gap:10px!important;
    padding:1px 0 8px!important;
    scroll-snap-type:x mandatory;
  }

  .ftr-bropack-desktop-game-card{
    flex:0 0 calc((100% - 20px) / 3)!important;
    scroll-snap-align:start;
  }

  .ftr-bropack-desktop-game-meta{
    display:none!important;
  }

  .ftr-bropack-desktop-games-arrow{
    top:50%!important;
    width:24px!important;
    height:24px!important;
    margin-top:-12px!important;
    font-size:18px!important;
    line-height:1!important;
  }
  .ftr-bropack-desktop-games-arrow.is-prev{left:0!important}
  .ftr-bropack-desktop-games-arrow.is-next{right:0!important}
}

/* =========================================================
   BroPack desktop: All possible rewards rail
   - keep 7 reward cards visible
   - arrows advance exactly 1 reward at a time (JS)
   - reserve dedicated side gutters so arrows never overlap cards
   Mobile remains unchanged.
   ========================================================= */
@media(min-width:1121px){
  .ftr-bropack-desktop-rewards-viewport{
    padding-left:40px!important;
    padding-right:40px!important;
    box-sizing:border-box;
  }

  .ftr-bropack-desktop-rewards-arrow{
    width:26px!important;
    height:26px!important;
    margin-top:-13px!important;
    font-size:18px!important;
    line-height:1!important;
  }

  .ftr-bropack-desktop-rewards-arrow.is-prev{left:5px!important}
  .ftr-bropack-desktop-rewards-arrow.is-next{right:5px!important}
}

/* =========================================================
   BroPacks compliance copy: affiliate disclosure + modal
   and Booster Packs explanatory heading
   ========================================================= */
.ftr-bropack-affiliate-disclosure{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px;
  margin-top:8px;
  max-width:430px;
  color:#9e91ab;
  font-size:10px;
  line-height:1.4;
}

.ftr-bropack-affiliate-readmore{
  appearance:none;
  padding:0;
  border:0;
  background:transparent;
  color:#d7b8ff;
  font:inherit;
  font-weight:900;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
}

.ftr-bropack-affiliate-readmore:hover,
.ftr-bropack-affiliate-readmore:focus-visible{
  color:#fff;
}

.ftr-bropack-booster-heading{
  grid-column:1 / -1;
  margin:0 0 3px;
}

.ftr-bropack-booster-heading-desktop{
  padding:0 2px 6px;
}

.ftr-bropack-booster-kicker{
  display:block;
  margin-bottom:4px;
  color:#b78cff;
  font-size:9px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:.13em;
}

.ftr-bropack-booster-heading h2{
  margin:0;
  color:#fff;
  font-size:18px;
  line-height:1.1;
  font-weight:950;
  letter-spacing:-.02em;
}

.ftr-bropack-booster-heading p{
  margin:5px 0 0;
  max-width:780px;
  color:#aa9db8;
  font-size:10px;
  line-height:1.45;
}

.ftr-bropack-affiliate-modal{
  position:fixed;
  inset:0;
  z-index:100050;
  display:grid;
  place-items:center;
  padding:20px;
}

.ftr-bropack-affiliate-modal[hidden]{
  display:none!important;
}

.ftr-bropack-affiliate-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(5,2,12,.82);
  backdrop-filter:blur(7px);
}

.ftr-bropack-affiliate-modal__card{
  position:relative;
  z-index:1;
  width:min(520px,100%);
  padding:26px 26px 24px;
  border:1px solid rgba(183,140,255,.30);
  border-radius:18px;
  background:linear-gradient(180deg,#26133f,#140b24);
  color:#fff;
  box-shadow:0 28px 80px rgba(0,0,0,.52);
}

.ftr-bropack-affiliate-modal__close{
  position:absolute;
  top:12px;
  right:12px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.13);
  border-radius:50%;
  background:rgba(255,255,255,.06);
  color:#fff;
  font:700 22px/1 Arial,sans-serif;
  cursor:pointer;
}

.ftr-bropack-affiliate-modal__badge{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  margin-bottom:14px;
  border:1px solid rgba(255,211,63,.42);
  border-radius:12px;
  background:rgba(255,211,63,.10);
  color:#ffd83d;
  font-size:15px;
  font-weight:950;
}

.ftr-bropack-affiliate-modal__card h2{
  margin:0 42px 10px 0;
  color:#fff;
  font-size:24px;
  line-height:1.12;
  font-weight:950;
}

.ftr-bropack-affiliate-modal__card p{
  margin:0;
  color:#c9bdd5;
  font-size:13px;
  line-height:1.65;
}

html.ftr-bropack-affiliate-modal-open,
html.ftr-bropack-affiliate-modal-open body{
  overflow:hidden;
}

@media(max-width:800px){
  .ftr-bropack-affiliate-disclosure{
    max-width:none;
    font-size:9.5px;
  }

  .ftr-bropack-booster-heading-desktop{
    display:none!important;
  }

  .ftr-bropack-affiliate-modal__card{
    padding:22px 20px 20px;
    border-radius:16px;
  }

  .ftr-bropack-affiliate-modal__card h2{
    font-size:21px;
  }

  .ftr-bropack-affiliate-modal__card p{
    font-size:12px;
  }
}


.ftr-bropack-reward-modal__visual-wrap{
  display:block
}

.ftr-bropack-reward-modal__rarity-banner{
  display:none
}

.ftr-bropack-reward-modal__mobile-extra,
.ftr-bropack-reward-modal__mobile-special[hidden],
.ftr-bropack-reward-modal__mobile-games[hidden],
.ftr-bropack-reward-modal__mobile-games-empty[hidden],
.ftr-bropack-reward-modal__mobile-games-viewall[hidden]{
  display:none!important
}

@media(max-width:820px){
  .ftr-bropack-reward-modal{
    padding:10px
  }

  .ftr-bropack-reward-modal__card{
    width:min(395px,100%);
    max-height:calc(100vh - 20px);
    padding:19px 16px 17px;
    border-radius:18px
  }

  .ftr-bropack-reward-modal__visual-wrap{
    margin:-19px -16px 16px
  }

  .ftr-bropack-reward-modal__visual{
    width:100%;
    aspect-ratio:1/1;
    margin:0;
    border-radius:18px 18px 12px 12px;
    border-left:none;
    border-right:none;
    border-top:none;
    background:linear-gradient(180deg,rgba(120,52,220,.38) 0%,rgba(31,8,67,.95) 100%);
    box-shadow:0 20px 40px rgba(0,0,0,.34)
  }

  .ftr-bropack-reward-modal__rarity-banner{
    position:absolute;
    top:0;
    left:0;
    z-index:3;
    display:block;
    width:100%;
    height:auto;
    max-height:62px;
    object-fit:cover;
    object-position:center top
  }

  .ftr-bropack-reward-modal__visual>[data-ftr-bropack-reward-modal-image]{
    position:relative;
    z-index:1;
    padding:46px 14px 12px;
    object-fit:contain
  }

  .ftr-bropack-reward-modal__rarity{
    display:none
  }

  .ftr-bropack-reward-modal__visual .ftr-bropack-value-badge{
    right:12px;
    bottom:12px;
    z-index:4
  }

  .ftr-bropack-reward-modal__card>h2{
    max-width:none;
    margin:0;
    font-size:18px;
    line-height:1.26;
    text-align:left
  }

  .ftr-bropack-reward-modal__details{
    margin-top:18px
  }

  .ftr-bropack-reward-modal__details-title{
    margin-bottom:9px;
    font-size:13px
  }

  .ftr-bropack-reward-modal__details-box{
    padding:14px 14px 0;
    border-radius:12px;
    background:rgba(19,3,47,.62)
  }

  .ftr-bropack-reward-modal__row{
    min-height:30px;
    font-size:13px
  }

  .ftr-bropack-reward-modal__row>strong{
    font-size:13px
  }

  .ftr-bropack-reward-modal__buy{
    min-height:48px;
    margin-top:12px;
    border-top:1px solid rgba(255,255,255,.08);
    background:linear-gradient(180deg,#ffd940 0%,#f4b81d 100%);
    color:#271400!important;
    font-size:15px;
    border-radius:0 0 12px 12px
  }

  .ftr-bropack-reward-modal__buy:hover,
  .ftr-bropack-reward-modal__buy:focus-visible{
    color:#1a0e00!important;
    background:linear-gradient(180deg,#ffe467 0%,#ffc730 100%)
  }

  .ftr-bropack-reward-modal__mobile-extra{
    display:block;
    margin-top:12px;
    border:1px solid rgba(168,104,255,.34);
    border-radius:14px;
    background:linear-gradient(180deg,rgba(74,26,148,.62) 0%,rgba(20,4,50,.96) 100%);
    overflow:hidden
  }

  .ftr-bropack-reward-modal__mobile-extra-head{
    display:flex;
    align-items:flex-start;
    gap:10px;
    padding:12px 12px 10px
  }

  .ftr-bropack-reward-modal__mobile-extra-copy{
    flex:1;
    min-width:0
  }

  .ftr-bropack-reward-modal__mobile-extra-title{
    color:#fff;
    font-size:15px;
    line-height:1.24;
    font-weight:900;
    letter-spacing:-.01em
  }

  .ftr-bropack-reward-modal__mobile-extra-head p{
    margin:4px 0 0;
    color:#c1b7d7;
    font-size:11px;
    line-height:1.35
  }

  .ftr-bropack-reward-modal__mobile-extra-toggle{
    width:28px;
    height:28px;
    flex:0 0 28px;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid rgba(255,255,255,.12);
    border-radius:50%;
    background:rgba(255,255,255,.08);
    color:#fff;
    font-size:15px;
    line-height:1;
    cursor:pointer
  }

  .ftr-bropack-reward-modal__mobile-extra-body{
    padding:0 12px 12px
  }

  .ftr-bropack-reward-modal__mobile-special{
    padding:8px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:12px;
    background:rgba(15,4,38,.68)
  }

  .ftr-bropack-reward-modal__mobile-special img{
    display:block;
    width:100%;
    height:auto;
    border-radius:10px
  }

  .ftr-bropack-reward-modal__mobile-games{
    position:relative
  }

  .ftr-bropack-reward-modal__mobile-games-track{
    display:flex;
    gap:10px;
    overflow-x:auto;
    padding:2px 30px 4px 0;
    scroll-snap-type:x proximity;
    scrollbar-width:none
  }

  .ftr-bropack-reward-modal__mobile-games-track::-webkit-scrollbar{
    display:none
  }

  .ftr-bropack-reward-modal__mobile-game-card{
    flex:0 0 106px;
    min-width:106px;
    display:flex;
    flex-direction:column;
    gap:7px;
    padding:8px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:12px;
    background:linear-gradient(180deg,rgba(23,8,54,.88) 0%,rgba(8,3,24,.96) 100%);
    text-decoration:none!important;
    scroll-snap-align:start
  }

  .ftr-bropack-reward-modal__mobile-game-image{
    display:block;
    width:100%;
    aspect-ratio:3/4;
    overflow:hidden;
    border-radius:9px;
    background:rgba(255,255,255,.04)
  }

  .ftr-bropack-reward-modal__mobile-game-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover
  }

  .ftr-bropack-reward-modal__mobile-game-card strong{
    min-height:30px;
    color:#fff;
    font-size:12px;
    line-height:1.24;
    font-weight:850;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden
  }

  .ftr-bropack-reward-modal__mobile-game-price{
    color:#ffd83d;
    font-size:12px;
    line-height:1.1;
    font-weight:900
  }

  .ftr-bropack-reward-modal__mobile-games-arrow{
    position:absolute;
    top:50%;
    z-index:3;
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid rgba(255,255,255,.16);
    border-radius:50%;
    background:rgba(7,3,20,.86);
    color:#fff;
    font-size:19px;
    line-height:1;
    transform:translateY(-50%);
    cursor:pointer
  }

  .ftr-bropack-reward-modal__mobile-games-arrow.is-prev{
    left:-2px
  }

  .ftr-bropack-reward-modal__mobile-games-arrow.is-next{
    right:-2px
  }

  .ftr-bropack-reward-modal__mobile-games-empty{
    margin:4px 0 0;
    color:#c1b7d7;
    font-size:12px;
    line-height:1.42
  }

  .ftr-bropack-reward-modal__mobile-games-viewall{
    min-height:47px;
    margin-top:12px;
    padding:0 16px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid rgba(168,104,255,.46);
    border-radius:12px;
    background:linear-gradient(180deg,rgba(111,51,212,.92) 0%,rgba(61,20,132,.94) 100%);
    color:#fff!important;
    font-size:14px;
    line-height:1.2;
    font-weight:850;
    text-decoration:none!important
  }

  .ftr-bropack-reward-modal__mobile-games-viewall:hover,
  .ftr-bropack-reward-modal__mobile-games-viewall:focus-visible{
    background:linear-gradient(180deg,rgba(123,63,228,.96) 0%,rgba(74,28,149,.98) 100%);
    outline:none
  }
}

/* =========================================================
   BroPacks — More featured packs shelf
   Same selected platform + region; horizontal on mobile.
   ========================================================= */
.ftr-bropack-featured-packs{
  margin-top:18px;
  padding:20px;
  border:1px solid rgba(151,62,255,.32);
  border-radius:20px;
  background:
    radial-gradient(circle at 12% 0,rgba(118,43,220,.10),transparent 34%),
    linear-gradient(180deg,rgba(21,8,42,.96),rgba(8,3,19,.98));
  box-shadow:0 18px 50px rgba(0,0,0,.20)
}

.ftr-bropack-featured-packs__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:16px
}

.ftr-bropack-featured-packs__kicker{
  display:block;
  margin-bottom:5px;
  color:#9f66f5;
  font-size:9px;
  line-height:1;
  font-weight:900;
  letter-spacing:.16em
}

.ftr-bropack-featured-packs__head h2{
  margin:0;
  color:#fff;
  font-size:22px;
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.02em
}

.ftr-bropack-featured-packs__context{
  display:flex;
  align-items:center;
  gap:7px;
  color:#8f7ca5;
  font-size:11px;
  white-space:nowrap
}

.ftr-bropack-featured-packs__context strong{
  color:#cdbce2;
  font-weight:850
}

.ftr-bropack-featured-packs__track{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(148px,1fr));
  gap:12px
}

.ftr-bropack-featured-pack-card{
  min-width:0;
  padding:10px;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.13);
  border-radius:6px;
  background:rgba(2,2,5,.74);
  color:#fff!important;
  text-decoration:none!important;
  box-shadow:0 8px 24px rgba(0,0,0,.22);
  transition:transform .16s ease,border-color .16s ease,background .16s ease
}

.ftr-bropack-featured-pack-card:hover,
.ftr-bropack-featured-pack-card:focus-visible{
  transform:translateY(-2px);
  border-color:rgba(169,99,255,.55);
  background:rgba(10,5,19,.90);
  outline:none
}

.ftr-bropack-featured-pack-card__image{
  width:100%;
  aspect-ratio:1/1.16;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:4px;
  background:linear-gradient(180deg,rgba(17,17,25,.92),rgba(4,4,8,.98))
}

.ftr-bropack-featured-pack-card__image img{
  display:block;
  width:100%;
  height:100%;
  padding:7px 5px;
  object-fit:contain
}

.ftr-bropack-featured-pack-card__name{
  min-height:38px;
  margin-top:8px;
  color:#fff;
  font-size:11px;
  line-height:1.25;
  font-weight:800;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  overflow:hidden
}

.ftr-bropack-featured-pack-card__meta{
  min-width:0;
  margin-top:7px;
  display:flex;
  align-items:center;
  gap:7px;
  color:#b6a8c7;
  font-size:9px;
  line-height:1.1
}

.ftr-bropack-featured-pack-card__platform{
  min-width:0;
  display:inline-flex;
  align-items:center;
  gap:4px;
  color:#d9d0e6;
  font-weight:800
}

.ftr-bropack-featured-pack-card__platform-icon{
  width:14px;
  height:14px;
  flex:0 0 14px;
  display:block;
  border-radius:50%;
  background:#4e41ff
}

.ftr-bropack-featured-pack-card__platform.is-playstation .ftr-bropack-featured-pack-card__platform-icon{background:#1676ff}
.ftr-bropack-featured-pack-card__platform.is-xbox .ftr-bropack-featured-pack-card__platform-icon{background:#35b852}
.ftr-bropack-featured-pack-card__platform.is-ea .ftr-bropack-featured-pack-card__platform-icon{background:#775cff}
.ftr-bropack-featured-pack-card__platform.is-pc .ftr-bropack-featured-pack-card__platform-icon{background:#f28a22}

.ftr-bropack-featured-pack-card__country{
  min-width:0;
  display:inline-flex;
  align-items:center;
  gap:4px;
  overflow:hidden;
  color:#8c7c9e
}

.ftr-bropack-featured-pack-card__country>span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}

.ftr-bropack-featured-pack-card__country-flag{
  flex:0 0 auto;
  font-size:11px;
  line-height:1
}

.ftr-bropack-featured-pack-card__coins{
  margin-top:7px;
  display:flex;
  align-items:center;
  gap:5px;
  color:#fff;
  font-size:11px;
  line-height:1;
  font-weight:900
}

.ftr-bropack-featured-pack-card__coins img{
  width:14px;
  height:14px;
  object-fit:contain
}

@media(max-width:700px){
  .ftr-bropack-featured-packs{
    margin-top:14px;
    padding:17px 0 16px;
    border-radius:18px
  }

  .ftr-bropack-featured-packs__head{
    align-items:flex-start;
    margin-bottom:13px;
    padding:0 14px
  }

  .ftr-bropack-featured-packs__head h2{
    font-size:20px
  }

  .ftr-bropack-featured-packs__context{
    display:none
  }

  .ftr-bropack-featured-packs__track{
    display:flex;
    gap:10px;
    overflow-x:auto;
    padding:0 14px 4px;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch
  }

  .ftr-bropack-featured-packs__track::-webkit-scrollbar{
    display:none
  }

  .ftr-bropack-featured-pack-card{
    flex:0 0 146px;
    width:146px;
    scroll-snap-align:start
  }
}

/* =========================================================
   BroPack phone: All possible rewards horizontal rail
   - keep roughly 3 reward cards visible
   - swipe horizontally through the complete filtered reward set
   ========================================================= */
@media(max-width:600px){
  .ftr-bropack-rewards-panel .ftr-bropack-rewards{
    display:flex!important;
    grid-template-columns:none!important;
    width:100%;
    max-width:100%;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:0 0 7px!important;
    scroll-snap-type:x proximity;
    scroll-padding-inline:0;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    scrollbar-width:none;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-rewards::-webkit-scrollbar{
    display:none;
  }

  .ftr-bropack-rewards-panel .ftr-bropack-reward{
    flex:0 0 calc((100% - 16px) / 3)!important;
    width:calc((100% - 16px) / 3)!important;
    min-width:calc((100% - 16px) / 3)!important;
    max-width:calc((100% - 16px) / 3)!important;
    scroll-snap-align:start;
    scroll-snap-stop:normal;
  }
}

/* =========================================================
   BroPacks catalog /bropacks/
========================================================= */
.ftr-bropacks-catalog{
  min-height:100vh;
  padding:30px 0 88px;
  color:#fff;
  background:
    radial-gradient(circle at 18% -5%,rgba(91,24,170,.22),transparent 28%),
    radial-gradient(circle at 90% 10%,rgba(61,15,119,.16),transparent 26%),
    linear-gradient(180deg,#090011 0%,#050008 72%,#030005 100%)
}

.ftr-bropacks-catalog__wrap{
  width:min(1320px,calc(100% - 36px));
  margin:0 auto
}

.ftr-bropacks-catalog__crumbs{
  margin-bottom:16px
}

.ftr-bropacks-catalog__carousel{
  position:relative;
  min-height:300px;
  overflow:hidden;
  border:1px solid rgba(143,77,211,.28);
  border-radius:22px;
  background:#10061d;
  box-shadow:0 24px 70px rgba(0,0,0,.34)
}

.ftr-bropacks-catalog__carousel>img{
  display:block;
  width:100%;
  height:clamp(300px,27vw,420px);
  object-fit:cover
}

.ftr-bropacks-catalog__carousel-shade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(5,0,12,.86) 0%,rgba(5,0,12,.44) 42%,rgba(5,0,12,.05) 72%),
    linear-gradient(0deg,rgba(5,0,12,.48),transparent 50%)
}

.ftr-bropacks-catalog__carousel-copy{
  position:absolute;
  z-index:2;
  left:clamp(24px,4vw,62px);
  top:50%;
  width:min(520px,54%);
  transform:translateY(-50%)
}

.ftr-bropacks-catalog__eyebrow,
.ftr-bropacks-catalog__intro-kicker,
.ftr-bropacks-catalog__section-kicker{
  display:block;
  color:#b582ff;
  font-size:11px;
  font-weight:950;
  letter-spacing:.16em;
  text-transform:uppercase
}

.ftr-bropacks-catalog__carousel-copy h1{
  margin:10px 0 10px;
  font-size:clamp(36px,5vw,70px);
  line-height:.96;
  letter-spacing:-.04em
}

.ftr-bropacks-catalog__carousel-copy p{
  max-width:440px;
  margin:0;
  color:#d3c9dd;
  font-size:15px;
  line-height:1.6
}

.ftr-bropacks-catalog__carousel-dots{
  position:absolute;
  z-index:3;
  left:50%;
  bottom:15px;
  display:flex;
  gap:6px;
  transform:translateX(-50%)
}

.ftr-bropacks-catalog__carousel-dots i{
  display:block;
  width:6px;
  height:6px;
  border-radius:999px;
  background:rgba(255,255,255,.33)
}

.ftr-bropacks-catalog__carousel-dots i.is-active{
  width:20px;
  background:#fff
}

.ftr-bropacks-catalog__intro{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:20px;
  align-items:center;
  margin-top:22px;
  padding:22px 24px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(25,11,42,.92),rgba(9,5,16,.96));
  box-shadow:0 14px 40px rgba(0,0,0,.18)
}

.ftr-bropacks-catalog__intro-icon,
.ftr-bropacks-catalog__intro-age{
  display:grid;
  place-items:center;
  border-radius:14px;
  font-weight:950
}

.ftr-bropacks-catalog__intro-icon{
  width:48px;
  height:48px;
  color:#f3e9ff;
  font-size:22px;
  background:linear-gradient(145deg,#6d24c8,#34105e);
  border:1px solid rgba(193,128,255,.34)
}

.ftr-bropacks-catalog__intro-age{
  min-width:58px;
  height:44px;
  padding:0 14px;
  color:#18051f;
  background:#ffd93f;
  box-shadow:0 8px 24px rgba(255,217,63,.12)
}

.ftr-bropacks-catalog__intro h2{
  margin:4px 0 5px;
  font-size:21px;
  line-height:1.15
}

.ftr-bropacks-catalog__intro p{
  margin:0;
  max-width:980px;
  color:#aaa0b7;
  font-size:13px;
  line-height:1.65
}

.ftr-bropacks-catalog__explore{
  margin-top:40px
}

.ftr-bropacks-catalog__section-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px
}

.ftr-bropacks-catalog__section-head h2{
  margin:5px 0 0;
  font-size:clamp(25px,3vw,36px);
  font-style:italic;
  letter-spacing:-.035em;
  text-transform:uppercase
}

.ftr-bropacks-catalog__region-pill{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:34px;
  padding:7px 12px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:#bfb4c9;
  background:rgba(255,255,255,.04);
  font-size:12px;
  font-weight:800
}

.ftr-bropacks-catalog__filters{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:0 0 13px;
  scrollbar-width:thin
}

.ftr-bropacks-catalog__filters button{
  flex:0 0 auto;
  min-height:30px;
  padding:5px 11px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  color:#aaa1b4;
  background:#100a17;
  font-size:11px;
  font-weight:850;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,border-color .16s ease,transform .16s ease
}

.ftr-bropacks-catalog__filters button:hover{
  transform:translateY(-1px);
  border-color:rgba(183,114,255,.35);
  color:#fff
}

.ftr-bropacks-catalog__filters button.is-active{
  color:#fff;
  border-color:rgba(255,255,255,.18);
  background:linear-gradient(180deg,#625a6d,#3e3945)
}

/* Explore Packs platform filter colors */
.ftr-bropacks-catalog__filters button.is-platform-psn{
  color:#fff;
  border-color:#4b83ff;
  background:linear-gradient(180deg,#2672ff 0%,#1248c8 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16)
}

.ftr-bropacks-catalog__filters button.is-platform-xbox{
  color:#fff;
  border-color:#42c96f;
  background:linear-gradient(180deg,#2ab75f 0%,#177a3d 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14)
}

.ftr-bropacks-catalog__filters button.is-platform-eaapp{
  color:#fff;
  border-color:#ff9b49;
  background:linear-gradient(180deg,#f58a2f 0%,#c95413 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16)
}

.ftr-bropacks-catalog__filters button.is-platform-psn:hover,
.ftr-bropacks-catalog__filters button.is-platform-xbox:hover,
.ftr-bropacks-catalog__filters button.is-platform-eaapp:hover{
  color:#fff;
  filter:brightness(1.08)
}

.ftr-bropacks-catalog__filters button.is-platform-psn.is-active{
  border-color:#77a4ff;
  background:linear-gradient(180deg,#3a83ff 0%,#1754df 100%);
  box-shadow:0 0 0 1px rgba(87,139,255,.22),0 7px 18px rgba(18,72,200,.28),inset 0 1px 0 rgba(255,255,255,.2)
}

.ftr-bropacks-catalog__filters button.is-platform-xbox.is-active{
  border-color:#69dc8f;
  background:linear-gradient(180deg,#34c86b 0%,#1a8f46 100%);
  box-shadow:0 0 0 1px rgba(66,201,111,.2),0 7px 18px rgba(23,122,61,.28),inset 0 1px 0 rgba(255,255,255,.18)
}

.ftr-bropacks-catalog__filters button.is-platform-eaapp.is-active{
  border-color:#ffb16f;
  background:linear-gradient(180deg,#ff9a42 0%,#dd6418 100%);
  box-shadow:0 0 0 1px rgba(255,155,73,.2),0 7px 18px rgba(201,84,19,.28),inset 0 1px 0 rgba(255,255,255,.2)
}

.ftr-bropacks-catalog__grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:30px
}

.ftr-bropacks-catalog__card{
  min-width:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:6px;
  color:#fff!important;
  background:linear-gradient(180deg,#08080a,#050506);
  text-decoration:none!important;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease
}

.ftr-bropacks-catalog__card:hover{
  transform:translateY(-4px);
  border-color:rgba(161,83,255,.5);
  box-shadow:0 18px 36px rgba(0,0,0,.30)
}

.ftr-bropacks-catalog__card[hidden]{
  display:none!important
}

.ftr-bropacks-catalog__card-image{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  aspect-ratio:4/5;
  padding:16px 12px 0;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 42%,rgba(92,42,143,.18),transparent 48%),
    #050506
}

.ftr-bropacks-catalog__card-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 14px 18px rgba(0,0,0,.32))
}

.ftr-bropacks-catalog__card-placeholder{
  display:grid;
  place-items:center;
  width:74%;
  aspect-ratio:3/4;
  border-radius:12px;
  color:#9a53ef;
  font-size:74px;
  font-weight:950;
  background:linear-gradient(145deg,#2a0f42,#100619)
}

.ftr-bropacks-catalog__card-body{
  display:block;
  padding:11px 14px 15px
}

.ftr-bropacks-catalog__card-body>strong{
  display:block;
  min-height:36px;
  font-size:12px;
  line-height:1.35
}

.ftr-bropacks-catalog__card-platform{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:10px;
  color:#aaa3af;
  font-size:10px;
  font-weight:800
}

.ftr-bropacks-catalog__card-platform i{
  display:block;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#8f4ee8;
  box-shadow:0 0 0 2px rgba(143,78,232,.13)
}

.ftr-bropacks-catalog__card-platform.is-playstation i,
.ftr-bropacks-catalog__card-platform.is-psn i,
.ftr-bropacks-catalog__card-platform.is-ps i{
  background:#2d9cff
}

.ftr-bropacks-catalog__card-platform.is-xbox i{
  background:#45c85a
}

.ftr-bropacks-catalog__card-platform.is-pc i,
.ftr-bropacks-catalog__card-platform.is-eaapp i,
.ftr-bropacks-catalog__card-platform.is-ea-app i{
  background:#ff4c59
}

.ftr-bropacks-catalog__card-price{
  display:flex;
  align-items:center;
  gap:5px;
  margin-top:9px;
  color:#ca79ff;
  font-size:12px;
  font-weight:950
}

.ftr-bropacks-catalog__card-price img{
  width:13px;
  height:13px;
  object-fit:contain
}

.ftr-bropacks-catalog__empty,
.ftr-bropacks-catalog__empty-filter{
  border:1px solid rgba(255,255,255,.09);
  border-radius:16px;
  background:rgba(255,255,255,.035)
}

.ftr-bropacks-catalog__empty{
  padding:44px 24px;
  text-align:center
}

.ftr-bropacks-catalog__empty-icon{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  margin:0 auto 14px;
  border-radius:15px;
  color:#19051f;
  background:#ffd93f;
  font-weight:950
}

.ftr-bropacks-catalog__empty h3{
  margin:0 0 8px;
  font-size:20px
}

.ftr-bropacks-catalog__empty p,
.ftr-bropacks-catalog__empty-filter{
  color:#9f95aa;
  font-size:13px
}

.ftr-bropacks-catalog__empty p{
  margin:0
}

.ftr-bropacks-catalog__empty-filter{
  margin-top:12px;
  padding:20px;
  text-align:center
}

.ftr-bropacks-catalog__legal{
  margin:34px auto 0;
  max-width:900px;
  color:#746c7d;
  font-size:10px;
  line-height:1.6;
  text-align:center
}

@media(max-width:1180px){
  .ftr-bropacks-catalog__grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:22px}
}

@media(max-width:980px){
  .ftr-bropacks-catalog__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
  .ftr-bropacks-catalog__carousel-copy{width:62%}
}

@media(max-width:760px){
  .ftr-bropacks-catalog{padding-top:20px}
  .ftr-bropacks-catalog__wrap{width:min(100% - 24px,1320px)}
  .ftr-bropacks-catalog__carousel{min-height:260px;border-radius:17px}
  .ftr-bropacks-catalog__carousel>img{height:300px}
  .ftr-bropacks-catalog__carousel-shade{background:linear-gradient(0deg,rgba(5,0,12,.9),rgba(5,0,12,.12) 72%)}
  .ftr-bropacks-catalog__carousel-copy{left:20px;right:20px;top:auto;bottom:31px;width:auto;transform:none}
  .ftr-bropacks-catalog__carousel-copy h1{font-size:38px}
  .ftr-bropacks-catalog__carousel-copy p{font-size:12px}
  .ftr-bropacks-catalog__intro{grid-template-columns:auto 1fr;padding:18px}
  .ftr-bropacks-catalog__intro-age{grid-column:1/-1;width:100%;height:36px}
  .ftr-bropacks-catalog__section-head{align-items:flex-start;flex-direction:column}
  .ftr-bropacks-catalog__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
}

@media(max-width:560px){
  .ftr-bropacks-catalog__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .ftr-bropacks-catalog__card-image{padding:11px 8px 0}
  .ftr-bropacks-catalog__card-body{padding:10px 10px 12px}
  .ftr-bropacks-catalog__card-body>strong{font-size:11px;min-height:31px}
  .ftr-bropacks-catalog__carousel-copy h1{font-size:34px}
}

/* =========================================================
   Welcome Pack only: replace the desktop game suggestions
   with a horizontally scrollable rail of all regional BroPacks.
   Other BroPack pages keep the existing game panel unchanged.
   ========================================================= */
@media(min-width:1121px){
  .ftr-bropack-desktop-games.is-welcome-packs{
    padding:18px 18px 16px;
  }

  .ftr-bropack-welcome-packs-head{
    margin-bottom:14px;
  }

  .ftr-bropack-welcome-packs-carousel{
    position:relative;
    min-height:255px;
  }

  .ftr-bropack-welcome-packs-track{
    display:flex;
    gap:10px;
    min-width:0;
    overflow-x:auto;
    overflow-y:hidden;
    padding:1px 2px 10px;
    scroll-behavior:smooth;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
  }

  .ftr-bropack-welcome-packs-track::-webkit-scrollbar{
    display:none;
  }

  .ftr-bropack-welcome-pack-card{
    flex:0 0 132px;
    min-width:132px;
    padding:8px;
    display:flex;
    flex-direction:column;
    scroll-snap-align:start;
    overflow:hidden;
    border:1px solid rgba(133,84,190,.30);
    border-radius:11px;
    background:linear-gradient(180deg,rgba(27,15,47,.98),rgba(13,8,24,.99));
    color:#fff!important;
    text-decoration:none!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
    transition:transform .16s ease,border-color .16s ease;
  }

  .ftr-bropack-welcome-pack-card:hover,
  .ftr-bropack-welcome-pack-card:focus-visible{
    transform:translateY(-2px);
    border-color:rgba(169,99,255,.58);
    outline:none;
  }

  .ftr-bropack-welcome-pack-card__image{
    width:100%;
    aspect-ratio:1/1.05;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    border-radius:8px;
    background:rgba(9,5,17,.78);
  }

  .ftr-bropack-welcome-pack-card__image img{
    display:block;
    width:100%;
    height:100%;
    padding:4px;
    object-fit:contain;
  }

  .ftr-bropack-welcome-pack-card>strong{
    display:-webkit-box;
    min-height:30px;
    margin-top:7px;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    color:#fff;
    font-size:10px;
    line-height:1.3;
    font-weight:850;
  }

  .ftr-bropack-welcome-pack-card__platform{
    margin-top:6px;
    display:flex;
    align-items:center;
    gap:5px;
    color:#a997bb;
    font-size:8px;
    line-height:1;
    font-weight:850;
  }

  .ftr-bropack-welcome-pack-card__platform i{
    width:9px;
    height:9px;
    flex:0 0 9px;
    border-radius:50%;
    background:#775cff;
  }

  .ftr-bropack-welcome-pack-card__platform.is-playstation i{background:#1676ff}
  .ftr-bropack-welcome-pack-card__platform.is-xbox i{background:#35b852}
  .ftr-bropack-welcome-pack-card__platform.is-ea i{background:#775cff}
  .ftr-bropack-welcome-pack-card__platform.is-pc i{background:#f28a22}

  .ftr-bropack-welcome-pack-card__coins{
    margin-top:auto;
    padding-top:7px;
    display:flex;
    align-items:center;
    gap:5px;
    color:#d98cff;
    font-size:9px;
    line-height:1;
    font-weight:900;
  }

  .ftr-bropack-welcome-pack-card__coins img{
    width:13px;
    height:13px;
    object-fit:contain;
  }

  .ftr-bropack-welcome-packs-empty{
    margin:82px auto 0;
    max-width:360px;
    color:#8d8099;
    text-align:center;
    font-size:11px;
    line-height:1.55;
  }

  .ftr-bropack-desktop-games.is-welcome-packs .ftr-bropack-desktop-games-arrow{
    top:43%;
  }
}

/* =========================================================
   BroPack reward modal — mobile visual polish
   Keep the full rarity artwork visible and make face value readable.
   ========================================================= */
@media(max-width:820px){
  .ftr-bropack-reward-modal__card{
    border-color:rgba(178,104,255,.55);
    box-shadow:0 28px 80px rgba(0,0,0,.68),0 0 34px rgba(127,48,255,.18)
  }

  .ftr-bropack-reward-modal__visual-wrap{
    margin-bottom:18px
  }

  .ftr-bropack-reward-modal__visual{
    overflow:hidden;
    background:linear-gradient(180deg,rgba(126,55,224,.30) 0%,rgba(27,6,60,.98) 100%)
  }

  .ftr-bropack-reward-modal__rarity-banner{
    top:0;
    left:0;
    width:100%;
    height:auto;
    max-height:none;
    aspect-ratio:4/1;
    object-fit:contain;
    object-position:center top;
    background:#7d7f87
  }

  .ftr-bropack-reward-modal__visual>[data-ftr-bropack-reward-modal-image]{
    padding:calc(25% + 8px) 12px 12px;
    object-fit:contain
  }

  .ftr-bropack-reward-modal__visual .ftr-bropack-value-badge{
    right:14px;
    bottom:14px;
    z-index:5;
    min-height:32px;
    padding:7px 10px;
    gap:4px;
    border:1px solid rgba(255,216,61,.48);
    border-radius:8px;
    background:rgba(8,5,16,.94);
    box-shadow:0 7px 20px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.08);
    font-size:12px;
    line-height:1;
    font-weight:950
  }

  .ftr-bropack-reward-modal__visual .ftr-bropack-value-number{
    font-size:14px;
    line-height:1;
    font-weight:950
  }

  .ftr-bropack-reward-modal__visual .ftr-bropack-value-currency{
    font-size:11px;
    line-height:1;
    font-weight:950
  }

  .ftr-bropack-reward-modal__card>h2{
    margin-top:2px;
    font-size:19px
  }

  .ftr-bropack-reward-modal__details-box{
    border-color:rgba(177,111,255,.38);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025)
  }

  .ftr-bropack-reward-modal__row + .ftr-bropack-reward-modal__row{
    border-top:1px solid rgba(255,255,255,.045)
  }
}

/* =========================================================
   BroPack reward modal — mobile full-bleed reward artwork
   Rarity artwork is 1200x300 (4:1) and defines the full card width.
   Product artwork sits edge-to-edge directly below it.
   ========================================================= */
@media(max-width:820px){
  .ftr-bropack-reward-modal{
    padding:4px
  }

  .ftr-bropack-reward-modal__card{
    width:min(420px,calc(100vw - 8px));
    max-width:none;
    padding:0 16px 17px;
    overflow-x:hidden
  }

  .ftr-bropack-reward-modal__visual-wrap{
    margin:0 -16px 18px
  }

  .ftr-bropack-reward-modal__visual{
    width:100%;
    aspect-ratio:auto;
    margin:0;
    display:block;
    overflow:hidden;
    border:0;
    border-radius:17px 17px 0 0;
    background:#14052f;
    box-shadow:0 20px 40px rgba(0,0,0,.34)
  }

  .ftr-bropack-reward-modal__rarity-banner{
    position:relative;
    inset:auto;
    z-index:3;
    display:block;
    width:100%;
    height:auto;
    max-height:none;
    aspect-ratio:4/1;
    object-fit:cover;
    object-position:center;
    background:#7d7f87
  }

  .ftr-bropack-reward-modal__visual>[data-ftr-bropack-reward-modal-image]{
    position:relative;
    z-index:1;
    display:block;
    width:100%;
    height:auto;
    max-width:none;
    max-height:none;
    margin:0;
    padding:0;
    object-fit:cover;
    object-position:center
  }

  .ftr-bropack-reward-modal__close{
    top:9px;
    right:9px
  }
}

/* =========================================================
   BroPack reward modal — desktop full-bleed reward artwork
   Show the real rarity cover at the top, keep the reward artwork
   edge-to-edge below it, and anchor face value to the artwork.
   ========================================================= */
@media(min-width:821px){
  .ftr-bropack-reward-modal__card{
    width:min(560px,calc(100vw - 36px));
    max-width:none;
    padding:0 24px 24px;
    overflow-x:hidden;
    border-radius:22px
  }

  .ftr-bropack-reward-modal__visual-wrap{
    margin:0 -24px 22px
  }

  .ftr-bropack-reward-modal__visual{
    position:relative;
    width:100%;
    aspect-ratio:auto;
    margin:0;
    display:block;
    overflow:hidden;
    border:0;
    border-radius:21px 21px 0 0;
    background:#14052f;
    box-shadow:0 20px 44px rgba(0,0,0,.34)
  }

  .ftr-bropack-reward-modal__rarity-banner{
    position:relative;
    inset:auto;
    z-index:3;
    display:block;
    width:100%;
    height:auto;
    max-height:none;
    aspect-ratio:4/1;
    object-fit:cover;
    object-position:center;
    background:#7d7f87
  }

  .ftr-bropack-reward-modal__visual>[data-ftr-bropack-reward-modal-image]{
    position:relative;
    z-index:1;
    display:block;
    width:100%;
    height:auto;
    max-width:none;
    max-height:none;
    margin:0;
    padding:0;
    object-fit:cover;
    object-position:center
  }

  .ftr-bropack-reward-modal__rarity{
    display:none
  }

  .ftr-bropack-reward-modal__visual .ftr-bropack-value-badge{
    right:14px;
    bottom:14px;
    z-index:5;
    min-height:34px;
    padding:7px 11px;
    font-size:13px
  }

  .ftr-bropack-reward-modal__card>h2{
    max-width:none;
    margin:0;
    text-align:left
  }

  .ftr-bropack-reward-modal__details{
    margin-top:24px
  }
}