*,*::before,*::after{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}

@font-face{
  font-family:'eFootball Stencil';
  src:url('../fonts/eFootballStencil-Regular.woff2') format('woff2'),
      url('../fonts/eFootballStencil-Regular.woff')  format('woff');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

html,body{margin:0;padding:0;background:#020810;min-height:100vh;font-family:'Rajdhani',sans-serif;overflow-x:clip;}

#app{max-width:480px;margin:0 auto;background:#060d1f;min-height:100vh;position:relative;padding-bottom:54px;}
::-webkit-scrollbar{width:3px;}::-webkit-scrollbar-track{background:#060d1f;}::-webkit-scrollbar-thumb{background:#1c5df6;border-radius:2px;}

@keyframes floatY    {0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

@keyframes floatYsm  {0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes tickerRun {0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes badgeShin {0%{background-position:-220% center}100%{background-position:220% center}}
@keyframes divGlow   {0%,100%{opacity:.1}50%{opacity:.42}}
@keyframes overlayIn {from{opacity:0}to{opacity:1}}
@keyframes dialogIn  {from{opacity:0;transform:scale(.88)}to{opacity:1;transform:scale(1)}}
@keyframes meshPulse {0%,100%{opacity:.038}50%{opacity:.09}}

.coin-float{animation:floatY 3s ease-in-out infinite;}

#bg-mesh{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;animation:meshPulse 6s ease-in-out infinite;}

.hdr-sheen{
  position:absolute;inset:0;overflow:hidden;pointer-events:none;
  z-index:0;border-radius:inherit;
}
.hdr-sheen::before{
  content:'';position:absolute;top:0;bottom:0;left:0;width:72px;
  background:linear-gradient(105deg,
    transparent 0%,
    rgba(210,235,255,.16) 45%,
    rgba(210,235,255,.22) 55%,
    transparent 100%);
  animation:hdrSheen 4.5s ease-in-out infinite;
  will-change:transform;
}
@keyframes hdrSheen{
  0%   {transform:translateX(-140%)}
  55%  {transform:translateX(760%)}
  100% {transform:translateX(760%)}
}
.hdr-row{position:relative;z-index:1}

@media (prefers-reduced-motion:reduce){
  .hdr-sheen{display:none}
}

.hdr-row{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;
  min-height:26px;
}
.hdr-side{display:flex;align-items:center;min-width:0}
.hdr-l{justify-content:flex-start}
.hdr-r{justify-content:flex-end;gap:6px}
.hdr-mid{display:flex;align-items:center;justify-content:center;pointer-events:none}
.hdr-logo{
  height:22px;max-width:165px;object-fit:contain;display:block;
  filter:drop-shadow(0 2px 8px rgba(255,215,0,.35));
}

.banner-wrap{margin-top:0}

.hdr-coin{
  display:inline-flex;align-items:center;gap:4px;
  height:26px;box-sizing:border-box;
  padding:0 10px 0 6px;border-radius:13px;
  background:rgba(28,93,246,.18);
  border:1px solid rgba(77,159,255,.6);
  box-shadow:0 0 10px rgba(28,93,246,.5),inset 0 0 8px rgba(77,159,255,.12);
}
.hdr-coin img.coin-float{
  width:17px;height:17px;flex-shrink:0;object-fit:contain;
  animation:floatYsm 3s ease-in-out infinite;
}
.hdr-coin span{
  font-family:'Rajdhani',sans-serif;font-weight:700;
  font-size:12.5px;color:#cfe6ff;line-height:1;white-space:nowrap;
}

.banner-wrap{
  position:relative;
  padding:10px;
}

.banner-box{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(77,159,255,.26);
  box-shadow:0 8px 24px rgba(0,0,0,.5);
  background:#0a1424;

  isolation:isolate;
}

.banner-scrim{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,
    transparent 38%,
    rgba(4,10,22,.55) 68%,
    rgba(4,10,22,.95) 100%);
}

.banner-copy{
  position:absolute;left:0;right:0;bottom:0;z-index:3;
  display:flex;flex-direction:column;align-items:flex-start;
  text-align:left;padding:0 14px 14px;
}
.banner-title{
  font-family:'eFootball Stencil','Barlow Condensed',sans-serif;font-weight:400;
  color:#fff;font-size:19px;letter-spacing:0;line-height:1.1;
  text-transform:uppercase;
  text-shadow:0 2px 10px rgba(0,0,0,.9);
}
.banner-sub{
  font-size:10px;color:#9fb4cc;font-family:sans-serif;
  margin-top:3px;line-height:1.45;
  text-shadow:0 1px 6px rgba(0,0,0,.9);
}

.banner-track{
  display:flex;
  transition:transform .5s cubic-bezier(.25,.46,.45,.94);
  will-change:transform;
}
.banner-slide{
  flex:0 0 100%;min-width:100%;
  height:172px;overflow:hidden;
  position:relative;
}
.banner-slide img{
  width:100%;height:100%;display:block;
  object-fit:cover;object-position:top center;
}

.bn-badge{
  display:inline-block;
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:8px;
  letter-spacing:1px;text-transform:uppercase;
  color:#dbe9ff;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.3);
  border-radius:3px;padding:2px 6px;margin-bottom:5px;
}
.bn-row{
  display:flex;align-items:center;gap:8px;
  margin-top:7px;flex-wrap:wrap;
}

.bn-cta{
  display:inline-flex;align-items:center;gap:4px;
  font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:11px;
  letter-spacing:.4px;text-transform:uppercase;color:#fff;
  background:linear-gradient(180deg,#2e6dff,#1c5df6);
  border:0;border-radius:6px;padding:8px 14px;cursor:pointer;
  min-height:32px;justify-content:center;line-height:1;
  box-shadow:0 3px 10px rgba(28,93,246,.45);
}
.bn-cta:active{transform:scale(.97);}
.bn-cta i{font-size:9px;font-style:normal;}

.banner-dots{
  position:absolute;right:10px;bottom:10px;z-index:4;
  display:flex;align-items:center;gap:4px;
}
.banner-dot{
  width:5px;height:5px;padding:0;border:0;border-radius:50%;
  background:rgba(255,255,255,.38);cursor:pointer;
  box-shadow:0 0 4px rgba(0,0,0,.75);
  transition:background .2s ease,width .2s ease,border-radius .2s ease;
}
.banner-dot.on{
  background:#fff;width:14px;border-radius:3px;
}
.banner-dot:focus-visible{
  outline:2px solid #fff;outline-offset:2px;
}

.c-wrap{overflow:hidden;}

.cr{margin-bottom:12px;}
.cr:last-child{margin-bottom:0;}

.cr-hd{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 14px 8px;
}
.cr-hd-l{
  display:flex;align-items:center;
  min-width:0;
}
.cr-ttl{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;
  color:#fff;font-size:15px;letter-spacing:.6px;
  white-space:nowrap;
}

.cr-ttl--stencil{
  font-family:'eFootball Stencil','Barlow Condensed','Rajdhani',system-ui,sans-serif;
  font-weight:400;
  font-size:16px;
  letter-spacing:0;
}

@media (max-width:360px){
  .cr-ttl--stencil{font-size:14px;}
}
@media (max-width:320px){
  .cr-ttl--stencil{
    font-size:13px;
    white-space:normal;
    line-height:1.1;
  }
}



.cr-lbl{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:8px;
  padding:0 12px 4px;
}
.cr-lbl .t{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;
  font-size:9px;letter-spacing:1px;text-transform:uppercase;
  color:#42566f;
  min-width:0;
}

.cr-lbl .t--desc{
  font-family:'Rajdhani',sans-serif;font-weight:600;
  font-size:9px;letter-spacing:0;line-height:1.45;
  text-transform:none;
  color:#4a5f7c;
  white-space:normal;
}

.c-track{display:flex;transition:transform .44s cubic-bezier(.25,.46,.45,.94);will-change:transform;}
.c-slide{flex:0 0 100%;min-width:100%;display:flex;gap:7px;padding:0 10px 4px;}
.reward-card{
  position:relative;background:linear-gradient(160deg,#232f47 0%,#101a2e 100%);
  border:1px solid rgba(80,120,180,.3);border-radius:10px;padding:0 6px 8px;
  flex:1;min-width:0;overflow:hidden;

  display:flex;flex-direction:column;align-items:center;
  box-shadow:0 0 0 1px rgba(60,100,160,.1),0 4px 10px rgba(0,0,0,.3);
  cursor:pointer;
}
.badge-lim{
  position:absolute;top:0;left:0;z-index:2;
  background:linear-gradient(90deg,#1b2f57 0%,#3d72e0 28%,#9ec2ff 50%,#3d72e0 72%,#1b2f57 100%);
  background-size:220% auto;animation:badgeShin 2.4s linear infinite;
  font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:10px;letter-spacing:1.2px;
  color:#eef4ff;padding:4px 9px 3.5px 7px;border-radius:10px 0 8px 0;text-transform:uppercase;line-height:1;
  text-shadow:0 1px 1px rgba(0,0,0,.35);
}
.reward-coin{display:flex;align-items:center;gap:4px;margin-top:20px;}
.reward-coin img{width:15px;height:15px;object-fit:contain;flex-shrink:0;}
.reward-coin span{font-family:'Barlow Condensed',sans-serif;font-weight:800;color:#f5c518;font-size:15px;line-height:1;}
.reward-plus{color:#fff;font-size:13px;font-weight:700;line-height:1;margin:3px 0;}
.reward-players{width:100%;height:92px;flex-shrink:0;display:flex;justify-content:center;align-items:flex-end;gap:2px;margin-bottom:7px;}
.reward-players img{height:100%;object-fit:contain;}

.reward-players.single img{width:auto;max-width:100%;}
.reward-players.dual img{width:48%;}

.reward-players img.rp-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  pointer-events:none;
  user-select:none;
}

.reward-players .rp-wrap,
.conf-player .rp-wrap,
.rp-wrap{
  display:inline-block;
  line-height:0;
  vertical-align:top;
}

.rp-text{
  position:absolute;
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
  white-space:nowrap;
  line-height:1;

  font-family:'eFootball Stencil','Barlow Condensed','Rajdhani',system-ui,sans-serif;
}

.acct-box{
  position:relative;

  background:#F0F0F0;
  border:1px solid #dfe3e8;
  border-radius:18px;
  padding:22px 18px 18px;
  width:90%;
  max-width:360px;
  box-shadow:0 12px 40px rgba(0,0,0,.25);
  animation:dialogIn .3s cubic-bezier(.25,.46,.45,.96);
  text-align:center;
}
.acct-x{
  position:absolute;top:11px;right:12px;
  background:none;border:none;
  color:#5a6270;font-size:13px;
  cursor:pointer;padding:3px;line-height:1;
  transition:color .15s;

  z-index:10;
  -webkit-tap-highlight-color:transparent;
}

.acct-x::before{
  content:'';
  position:absolute;
  top:-9px;right:-9px;bottom:-9px;left:-9px;
}
.acct-x:hover,.acct-x:focus-visible{color:#5a6270;}
.acct-hd{
  display:flex;align-items:center;gap:8px;
  margin-bottom:10px;padding-right:22px;
}
.acct-hd i{color:#1c5df6;font-size:14px;flex-shrink:0;}
.acct-t{
  font-family:'Barlow Condensed',sans-serif;
  font-weight:800;font-size:14.5px;
  color:#111;letter-spacing:.3px;line-height:1.2;
}
.acct-txt{
  font-size:12px;color:#5a6270;
  line-height:1.5;margin-bottom:14px;
  font-family:'Rajdhani',sans-serif;
}
.acct-txt b{color:#111;font-weight:700;}
.acct-b1{
  width:100%;
  background:#1c5df6;
  color:#fff;border:none;border-radius:12px;
  padding:13px;
  font-family:'Barlow Condensed',sans-serif;
  font-weight:800;font-size:16px;letter-spacing:.8px;
  cursor:pointer;
  box-shadow:0 3px 14px rgba(28,93,246,.28);
  transition:transform .12s,box-shadow .18s;
}
.acct-b1:active{transform:scale(.985);}
.acct-b1:focus-visible{outline:2px solid #1c5df6;outline-offset:2px;}

.acct-box.acct-live{max-width:360px;padding:22px 18px 18px;}

.acct-head{position:relative;text-align:center;margin-bottom:14px;padding:0 18px;}
.acct-ico{
  width:34px;height:34px;border-radius:50%;margin:0 auto 7px;
  background:#e6f7ec;border:1.5px solid #a8dfbb;
  display:flex;align-items:center;justify-content:center;
  color:#1f7a45;font-size:13px;
}
.acct-ttl{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;
  font-size:21px;color:#111;letter-spacing:.2px;line-height:1.2;
  margin-bottom:4px;
}
.acct-sub{font-size:12px;color:#5a6270;line-height:1.45;}

.acct-user-row{
  display:flex;align-items:center;gap:7px;
  background:#fff;border:1px solid #e0e4ea;
  border-radius:11px;padding:8px 11px;margin-bottom:12px;
}
.acct-av{
  width:20px;height:20px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,#2a72ff,#1a4fd0);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:9px;
}
.acct-user-lbl{
  font-size:8px;letter-spacing:1.2px;text-transform:uppercase;
  color:#5a6270;font-weight:700;flex-shrink:0;
}
.acct-un{
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:11.5px;
  color:#1a2438;letter-spacing:.2px;margin-left:auto;

  min-width:0;flex:1;text-align:right;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

.acct-blk{margin-bottom:11px;}
.acct-blk-h{
  font-size:9.5px;letter-spacing:1.2px;text-transform:uppercase;
  color:#5a6270;font-weight:700;margin-bottom:6px;
  display:flex;align-items:center;gap:6px;
}
.acct-blk-h::after{content:'';height:1px;flex:1;background:#dde2e8;order:2;}
.acct-tot{
  order:3;flex-shrink:0;display:inline-flex;align-items:center;gap:3px;
  background:#eef3fb;border:1px solid #dbe5f3;
  border-radius:20px;padding:1px 7px;
  font-size:9.5px;font-weight:800;color:#1c5df6;
  font-family:'Rajdhani',sans-serif;letter-spacing:0;
}
.acct-tot-l{font-size:7.5px;font-weight:700;color:#5a6270;letter-spacing:.6px;}
.acct-row{
  display:flex;justify-content:space-between;align-items:center;
  gap:8px;padding:5px 0;font-size:10.5px;
}
.acct-row + .acct-row{border-top:1px solid #eef1f5;}
.acct-k{color:#5a6270;font-family:sans-serif;font-size:10.5px;flex:0 0 auto;}
.acct-v{
  color:#1a2438;font-weight:700;font-family:'Rajdhani',sans-serif;
  text-align:right;letter-spacing:.2px;word-break:break-all;font-size:11.5px;
}

.acct-refbox{display:inline-flex;align-items:center;gap:5px;}
.acct-refcode{
  font-family:Consolas,monospace;font-size:11px;font-weight:700;
  color:#1c5df6;letter-spacing:.3px;
}
.acct-cp{
  background:#eef3fb;border:1px solid #dbe5f3;
  border-radius:5px;color:#1c5df6;font-size:9px;padding:3px 6px;
  cursor:pointer;line-height:1;display:inline-flex;align-items:center;
  transition:transform .1s,background .15s;
}
.acct-cp:active{transform:scale(.94);}
.acct-cp:focus-visible{outline:2px solid #1c5df6;outline-offset:1px;}

.acct-chip{
  display:inline-flex;align-items:center;gap:4px;
  background:#fff7e8;border:1px solid #f5dfae;border-radius:20px;
  padding:2px 8px;font-size:9px;font-weight:700;color:#7d5a1f;
  font-family:'Rajdhani',sans-serif;white-space:nowrap;
}
.acct-dot{
  width:5px;height:5px;border-radius:50%;background:#e0a83a;
  animation:acctBlip 1.6s ease-in-out infinite;flex-shrink:0;
}
.acct-chip.is-idle{background:#e9f9f0;border-color:#bfe9d3;color:#0d8a4f;}
.acct-chip.is-idle .acct-dot{background:#14a860;}
@keyframes acctBlip{0%,100%{opacity:1}50%{opacity:.35;}}

.acct-count{
  display:flex;align-items:center;justify-content:center;gap:7px;
  background:#f4f8ff;border:1px solid #dce8ff;
  border-radius:9px;padding:8px;margin:10px 0 12px;
  font-family:'Barlow Condensed',sans-serif;
}
.acct-count-n{font-size:18px;font-weight:800;color:#1c5df6;line-height:1;}
.acct-count-t{font-size:9.5px;color:#5a6270;letter-spacing:.4px;text-transform:uppercase;}
.acct-b2{
  width:100%;
  background:#1c5df6;
  color:#fff;border:none;border-radius:12px;padding:13px;
  font-family:'Barlow Condensed',sans-serif;
  font-weight:800;font-size:16px;letter-spacing:.8px;
  cursor:pointer;box-shadow:0 3px 14px rgba(28,93,246,.28);
  transition:transform .12s,opacity .18s;
}
.acct-b2:active{transform:scale(.985);}
.acct-b2:focus-visible{outline:2px solid #1c5df6;outline-offset:2px;}
.acct-b2[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none;}

#notifSheet{font-family:'Rajdhani',system-ui,sans-serif;}

.nt-box{

  max-width:340px;
  max-height:70vh;
  display:flex;
  flex-direction:column;
  padding:18px 0 0;
}
.nt-box .acct-x{top:11px;right:12px;}
.nt-top{
  display:flex;align-items:center;gap:9px;
  padding:0 18px 12px;
  border-bottom:1px solid #dfe3e8;
  flex-shrink:0;
}

.nt-title{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;
  font-size:21px;color:#111;letter-spacing:.2px;
}
.nt-count{
  margin-left:auto;
  font-size:9.5px;color:#1c5df6;font-weight:800;
  background:#eef3fb;border:1px solid #dbe5f3;
  border-radius:20px;padding:2px 9px;
  font-family:'Rajdhani',sans-serif;
}
.nt-body{
  padding:14px 13px 16px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  flex:1 1 auto;
  min-height:0;
}

.nt-day{
  font-size:9.5px;letter-spacing:1.4px;text-transform:uppercase;
  color:#5a6270;font-weight:800;margin:2px 2px 9px;
}

.nt-card{
  background:#fff;
  border:1px solid #e0e4ea;border-radius:11px;
  padding:11px 12px;margin-bottom:9px;
  position:relative;overflow:hidden;
  box-shadow:0 1px 3px rgba(0,0,0,.04);
}
.nt-card::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:2.5px;
  background:#4ed88a;
}
.nt-hd{display:flex;align-items:center;gap:6px;margin-bottom:5px;}
.nt-ic{
  width:19px;height:19px;border-radius:5px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:9px;
  background:#e6f7ec;color:#1f7a45;
}
.nt-lbl{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:10px;
  letter-spacing:1px;text-transform:uppercase;color:#5a6270;
}
.nt-time{
  margin-left:auto;font-size:9px;color:#5a6270;
  font-family:sans-serif;flex-shrink:0;
}
.nt-ttl{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:13.5px;
  color:#111;letter-spacing:.2px;margin-bottom:4px;
}
.nt-txt{
  font-size:11px;color:#5a6270;line-height:1.55;
}
.nt-txt b{color:#111;font-weight:700;}
.nt-ref{
  font-family:Consolas,monospace;font-size:10px;color:#1c5df6;
  font-weight:700;letter-spacing:.2px;
}
.nt-btn{
  margin-top:8px;width:100%;
  background:#eef3fb;border:1px solid #dbe5f3;
  border-radius:8px;color:#1c5df6;padding:8px;
  font-family:'Barlow Condensed',sans-serif;font-weight:800;
  font-size:11px;letter-spacing:.5px;cursor:pointer;
  transition:background .15s;
}
.nt-btn:active{background:#e2ecfa;}
.nt-btn:focus-visible{outline:2px solid #1c5df6;outline-offset:1px;}

.nt-empty{text-align:center;padding:22px 18px 26px;}
.nt-empty-ic{
  width:52px;height:52px;border-radius:50%;margin:0 auto 12px;
  background:#eef3fb;border:1.5px solid #dbe5f3;
  display:flex;align-items:center;justify-content:center;
  color:#1c5df6;font-size:19px;
}
.nt-empty-t{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:16px;
  color:#111;letter-spacing:.3px;margin-bottom:5px;
}
.nt-empty-s{
  font-size:11.5px;color:#5a6270;line-height:1.55;margin-bottom:14px;
}
.nt-empty-b{
  background:#1c5df6;color:#fff;border:none;
  border-radius:12px;padding:11px 20px;
  font-family:'Barlow Condensed',sans-serif;font-weight:800;
  font-size:13px;letter-spacing:.6px;cursor:pointer;
  box-shadow:0 3px 14px rgba(28,93,246,.28);
  transition:transform .12s;
}
.nt-empty-b:active{transform:scale(.97);}

.reward-card img,
.banner-wrap img,
.pkg-cell img,
.pd-card img,
.conf-player img {
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
  user-select: none;
  pointer-events: none;
}
.reward-stock{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:10.5px;color:#ff6060;margin-bottom:7px;}

.btn-claim-glow{width:100%;min-height:38px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#2a6ff0,#1c4fd8);border:1px solid rgba(90,150,255,.5);border-radius:7px;color:#fff;font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:11.5px;letter-spacing:.3px;padding:8px 4px;cursor:pointer;box-shadow:0 2px 8px rgba(28,93,246,.4),inset 0 1px 0 rgba(255,255,255,.15);transition:all .18s;text-transform:uppercase;}
.btn-claim-glow:active{transform:scale(.96);}

@media (max-width:400px){
  .reward-players{height:62px;}
}

.car-nav{display:flex;align-items:center;justify-content:center;gap:9px;padding:10px 0 4px;}
/* J PILL-DOT: panah biru solid (brand #1c5df6), bukan emas.
   Emas lama dipakai di logo/header; di sini diganti supaya senada
   dengan tombol aksi utama. */
.car-ar{width:30px;height:30px;border-radius:50%;padding:0;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:#1c5df6;border:none;color:#fff;
  cursor:pointer;-webkit-tap-highlight-color:transparent;
  box-shadow:0 2px 8px rgba(28,93,246,.5);
  transition:background .18s,border-color .18s,opacity .2s,transform .12s,box-shadow .18s;}
.car-ar svg{width:12px;height:12px;display:block;}
.car-ar:active{transform:scale(.9);}
.car-ar[disabled]{opacity:.22;cursor:default;pointer-events:none;color:#7c8ea8;
  background:#243a5e;box-shadow:none;}

/* J PILL-DOT: wadah jadi pill berisi angka. Titik disembunyikan. */
.car-thumbs{
  display:inline-flex;align-items:center;justify-content:center;
  gap:0;min-width:52px;height:22px;padding:0 10px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:11px;box-sizing:border-box;
}
.car-count{
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:11.5px;
  color:#a9c3e4;letter-spacing:.6px;line-height:1;white-space:nowrap;
  font-variant-numeric:tabular-nums;
}

/* Dot TETAP di DOM (handler klik + aria-label per slide), tapi tidak
   dirender. display:none dipilih supaya tidak ada area klik tak terlihat
   yang bisa tersenggol. Navigasi slide pakai .car-ar. */
.car-thumb{display:none;}

.pkg-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.pkg-cell{display:flex;align-items:center;gap:8px;background:linear-gradient(160deg,#232f47 0%,#101a2e 100%);border:1px solid rgba(80,120,180,.3);border-radius:10px;padding:9px 8px;cursor:pointer;box-shadow:0 0 0 1px rgba(60,100,160,.1),0 4px 10px rgba(0,0,0,.3);transition:border-color .2s,background .2s;position:relative;overflow:hidden;}
.pkg-cell:active{transform:scale(.97);border-color:rgba(28,93,246,.7);}
.pkg-cell.span2{grid-column:1/-1;}
.pkg-cell img{width:34px;height:34px;object-fit:contain;flex-shrink:0;}
.pkg-amt{font-family:'Rajdhani',sans-serif;font-weight:700;color:#f5c518;font-size:16px;line-height:1;}
.btn-claim-pill{margin-left:auto;flex-shrink:0;min-height:38px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#2a6ff0,#1c4fd8);
border:1px solid rgba(90,150,255,.5);color:#fff;font-family:'Barlow Condensed',sans-serif;font-weight:800;
font-size:12px;letter-spacing:.2px;padding:6px 10px;border-radius:7px;cursor:pointer;white-space:nowrap;
box-shadow:0 2px 8px rgba(28,93,246,.4),inset 0 1px 0 rgba(255,255,255,.15);transition:all .18s;text-transform:uppercase;}
.btn-claim-pill:active{transform:scale(.95);filter:brightness(.9);}

.promo-banner{margin:6px 12px 18px;background:linear-gradient(160deg,#232f47 0%,#101a2e 100%);border:1px solid rgba(80,120,180,.3);border-radius:14px;padding:15px 14px;display:flex;align-items:center;gap:12px;cursor:pointer;box-shadow:0 0 0 1px rgba(60,100,160,.1),0 4px 10px rgba(0,0,0,.3);transition:border-color .2s;}
.promo-banner:active{transform:scale(.985);}
.promo-icon{width:38px;height:38px;border-radius:10px;background:rgba(28,93,246,.15);display:flex;align-items:center;justify-content:center;color:#1c5df6;font-size:16px;flex-shrink:0;}
.promo-title{font-family:'Barlow Condensed',sans-serif;font-weight:800;color:#fff;font-size:12.5px;line-height:1.35;letter-spacing:.2px;}
.promo-sub{font-size:11.5px;color:#8297b8;font-family:sans-serif;margin-top:3px;}

.divider{height:1px;background:linear-gradient(90deg,transparent,rgba(28,93,246,.3),transparent);margin:4px 14px;animation:divGlow 3.5s ease-in-out infinite;}

.site-footer{background:#07102a;border-top:1px solid rgba(28,93,246,.15);padding:20px 16px 16px;text-align:center;}
.site-footer .footer-line{font-size:10.5px;color:#4a5f7d;font-family:'Rajdhani',sans-serif;font-weight:600;line-height:1.5;letter-spacing:.5px;}
.site-footer .footer-tagline{font-size:9px;color:#33465e;font-family:'Rajdhani',sans-serif;font-weight:600;line-height:1.5;letter-spacing:.8px;text-transform:uppercase;margin-top:3px;}

/* ── FAQ ────────────────────────────────────────────────────────────
   Pakai <details>/<summary> native, bukan akordeon JS:
   tetap terbuka tanpa JS, tidak butuh handler delegasi, dan tidak
   menambah entri di CSP. Marker bawaan disembunyikan, panah diganti
   ikon chevron Font Awesome yang sudah dimuat halaman ini. */
.faq-sec{margin:6px 12px 20px;}
.faq-hd{display:flex;align-items:center;gap:8px;padding:2px 2px 10px;}
.faq-hd i{color:#1c5df6;font-size:14px;flex-shrink:0;}
.faq-hd span{font-family:'Barlow Condensed',sans-serif;font-weight:800;color:#fff;font-size:15px;letter-spacing:.6px;}
.faq-list{display:flex;flex-direction:column;gap:8px;}
.faq-item{
  background:linear-gradient(160deg,#232f47 0%,#101a2e 100%);
  border:1px solid rgba(80,120,180,.3);border-radius:11px;
  overflow:hidden;transition:border-color .2s,background .2s;
}
.faq-item[open]{border-color:rgba(28,93,246,.5);}
.faq-q{
  display:flex;align-items:center;gap:8px;list-style:none;
  padding:12px 12px;cursor:pointer;
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:12.5px;
  color:#dbe6f6;line-height:1.35;letter-spacing:.15px;
}
.faq-q::-webkit-details-marker{display:none;}
.faq-q::after{
  content:"\f078";font-family:"Font Awesome 6 Free";font-weight:900;
  font-size:8.5px;color:#5c7aa4;margin-left:auto;flex-shrink:0;
  transition:transform .2s,color .2s;
}
.faq-item[open] .faq-q{color:#fff;}
.faq-item[open] .faq-q::after{transform:rotate(180deg);color:#1c5df6;}
.faq-a{
  padding:0 12px 13px;font-family:sans-serif;font-size:11.5px;
  line-height:1.62;color:#8297b8;
}
.faq-a strong{color:#b9cfe8;font-weight:600;}
.faq-q:focus-visible{outline:2px solid #4d94ff;outline-offset:-2px;}

@media (max-width:360px){
  .faq-q{font-size:12px;padding:11px 11px;}
  .faq-a{font-size:11px;padding:0 11px 12px;}
}

.ticker-bar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;height:44px;background:#060e25;border-top:1px solid rgba(28,93,246,.2);display:flex;align-items:center;z-index:900;overflow:hidden;}
.tick-inner{flex:1;overflow:hidden;}
.tick-wrap{display:inline-flex;animation:tickerRun 330s linear infinite;white-space:nowrap;}
.tick-wrap:hover{animation-play-state:paused;}

.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.76);z-index:1000;display:flex;align-items:flex-end;justify-content:center;animation:overlayIn .22s ease;}
.modal-overlay.center{align-items:center;}

#modalConfirm.modal-overlay{
  background:rgba(4,8,14,.62);
  -webkit-backdrop-filter:blur(3px) saturate(.92);
  backdrop-filter:blur(3px) saturate(.92);
  padding:22px 0;
}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  #modalConfirm.modal-overlay{background:rgba(0,0,0,.68);}
}

.modal-box{background:#fff;width:90%;max-width:326px;max-height:calc(100vh - 44px);overflow-y:auto;-webkit-overflow-scrolling:touch;border-radius:18px;padding:0;animation:dialogIn .28s cubic-bezier(.25,.46,.45,.94);position:relative;box-shadow:none;}
@supports (height:100dvh){.modal-box{max-height:calc(100dvh - 44px);}}
.modal-title{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:20px;color:#111;text-align:center;letter-spacing:.3px;}
.modal-sub{font-size:13px;color:#666;text-align:center;margin:5px 0 18px;}
.modal-close{position:absolute;top:14px;right:16px;background:#eef2f7;border:none;border-radius:50%;width:28px;height:28px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#888;font-size:13px;transition:background .18s,color .18s;}
.modal-close:active{transform:scale(.92);background:#c9d3e0;}

.conf-hd{position:relative;padding:13px 46px;border-bottom:1px solid #eceef2;text-align:center;}
.conf-hd .modal-title{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:20px;color:#111;text-align:center;letter-spacing:.3px;line-height:1.15;}
.conf-hd .modal-close{top:50%;right:13px;transform:translateY(-50%);background:none;border-radius:50%;width:24px;height:24px;color:#a2a8b3;font-size:17px;transition:color .18s;}
.conf-hd .modal-close:active{transform:translateY(-50%) scale(.92);background:none;color:#6b7280;}
.conf-hd .modal-close::before{content:'';position:absolute;top:-9px;right:-9px;bottom:-9px;left:-9px;}
.conf-bd{padding:16px 18px 18px;}
.conf-ask{font-family:'Inter',sans-serif;font-size:12.5px;color:#5c636e;text-align:center;margin-bottom:16px;line-height:1.45;}

.conf-items{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:16px;border:none;padding:0;}
.conf-coin-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;}
.conf-coin-wrap img{width:56px;height:56px;object-fit:contain;}
.conf-coin-lbl{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:16px;color:#1c5df6;text-align:center;line-height:1.2;}
.conf-coin-sub{font-size:11px;color:#767676;text-align:center;font-family:sans-serif;}
.conf-plus{font-size:22px;color:#8a8a8a;font-weight:800;line-height:1;flex-shrink:0;}
.conf-players{display:flex;gap:8px;align-items:flex-start;}
.conf-player{display:flex;flex-direction:column;align-items:center;gap:3px;}
.conf-player img{width:84px;height:84px;object-fit:contain;border-radius:5px;}
.conf-pname{font-family:'Rajdhani',sans-serif;font-size:11.5px;font-weight:700;color:#333;text-align:center;max-width:74px;line-height:1.2;}

.conf-pname:empty{display:none;}
.conf-price{text-align:center;margin-bottom:16px;font-size:13px;color:#666;}

.conf-price:empty{display:none;}
.conf-price strong{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:17px;color:#111;}

.btn-confirm{
  width:100%;
  background:#1c5df6;color:#fff;border:none;border-radius:10px;
  padding:13px;
  font-family:'Barlow Condensed',sans-serif;
  font-weight:800;
  font-size:15px;
  letter-spacing:.6px;
  line-height:1.1;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .18s,transform .12s;
}
.btn-confirm:active{transform:scale(.98);background:#265ab8;}

.modal-loading-overlay{position:fixed;inset:0;background:rgba(4,8,20,.90);z-index:1300;display:flex;align-items:center;justify-content:center;animation:overlayIn .2s ease;}
.loader-box{display:flex;flex-direction:column;align-items:center;gap:0;width:100%;text-align:center;}
.spinner-icon{display:flex;justify-content:center;align-items:center;padding:15px 0;width:min(80vw,200px);max-width:100%;text-align:center;}
.spinner-image{height:24px;width:auto;max-width:100%;display:block;}
.spinner-loader{border-radius:9px;height:4px;margin:0 auto;overflow:hidden;width:150px;background:rgba(255,255,255,.18);}
.spinner-loading-bar{height:100%;width:100%;border-radius:9px;transform-origin:0 50%;background:#F0F0FA;animation:loadingBar 1s linear infinite;will-change:transform;}
@keyframes loadingBar{
  0%  {transform:translate(0)    scaleX(0)}
  40% {transform:translate(0)    scaleX(.4)}
  to  {transform:translate(100%) scaleX(.5)}
}
.spinner-text{font-size:14px;font-weight:400;line-height:150%;padding:15px 5px;color:#F0F0FA;margin:0;letter-spacing:.2px;font-family:inherit;}

/* ══════════════════════════════════════════════════════════════
   MODAL SUCCESS — W4 FLOAT (putih modern)
   Ikon centang menembus tepi atas kartu (efek melayang), kartu putih
   bersih dengan bayangan berlapis. Struk jadi bagian kartu (hairline),
   bukan kotak terpisah — itu yang membuat versi lama terasa "form".
   ══════════════════════════════════════════════════════════════ */
.success-box{
  position:relative;
  background:#fff;width:90%;max-width:352px;
  border-radius:24px;padding:44px 22px 22px;
  box-shadow:0 2px 4px rgba(15,23,42,.03),0 22px 48px rgba(15,23,42,.14);
  animation:dialogIn .3s cubic-bezier(.25,.46,.45,.96);
  text-align:center;
}

/* ikon centang melayang — menembus tepi atas 30px */
.succ-float{
  position:absolute;top:-30px;left:50%;transform:translateX(-50%);
  width:60px;height:60px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#fff;border:3px solid #fff;
  color:#12a150;font-size:26px;font-weight:800;line-height:1;
  box-shadow:0 8px 22px rgba(18,161,80,.28),0 0 0 6px rgba(18,161,80,.10);
}

.success-title{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;
  font-size:24px;color:#0b1220;margin-bottom:5px;letter-spacing:.1px;
}
.success-sub{
  font-family:'Inter',system-ui,sans-serif;font-size:12px;line-height:1.5;
  color:#69748a;margin-bottom:20px;
}

/* kartu item yang diklaim (diisi app.js) */
.success-reward{
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;
  background:#fafbfd;border:1px solid #f0f3f8;border-radius:16px;
  padding:12px;margin-bottom:16px;
}
.success-reward img{width:76px;height:76px;object-fit:contain;}

/* ── struk ──────────────────────────────────────────────────────
   Tanpa background & border kotak: cukup hairline atas/bawah.
   .succ-row + .succ-row memberi pemisah tipis antar baris.
   ─────────────────────────────────────────────────────────────── */
.succ-rcpt{
  border-top:1px solid #f1f4f8;border-bottom:1px solid #f1f4f8;
  padding:2px 0;margin-bottom:16px;text-align:left;
}
.succ-row{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:9px 0;line-height:1.35;
}
.succ-row + .succ-row{border-top:1px solid #f1f4f8;}
.succ-k{
  color:#8b96a8;font-family:'Inter',sans-serif;font-size:11px;
  flex:0 0 auto;
}
.succ-v{
  color:#1b2434;font-weight:600;font-family:'Inter',sans-serif;font-size:11.5px;
  text-align:right;letter-spacing:0;word-break:break-all;
}

/* username: avatar huruf + nama */
.succ-who{display:inline-flex;align-items:center;gap:6px;max-width:180px;}
.succ-wav{
  width:20px;height:20px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#2a72ff,#1a4fd0);color:#fff;
  font-family:'Inter',sans-serif;font-weight:700;font-size:9.5px;line-height:1;
}
.succ-wnm{
  font-family:'Inter',sans-serif;font-weight:600;font-size:11.5px;color:#1b2434;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px;
}

/* status chip — hijau sukses, bukan kuning */
.succ-chip{
  display:inline-flex;align-items:center;gap:5px;
  background:#e9f9ef;border:1px solid #cfefda;border-radius:20px;
  padding:3px 9px;font-family:'Inter',sans-serif;font-size:10px;font-weight:600;
  color:#0f8f47;white-space:nowrap;
}
.succ-dot{
  width:5px;height:5px;border-radius:50%;background:#12a150;
  animation:blip 1.6s ease-in-out infinite;flex-shrink:0;
}
@keyframes blip{0%,100%{opacity:1}50%{opacity:.35;}}

/* referensi + tombol copy */
.succ-ref{display:inline-flex;align-items:center;gap:5px;}
.succ-refcode{
  font-family:ui-monospace,Consolas,monospace;font-size:11px;font-weight:600;
  color:#1c5df6;letter-spacing:.2px;
}
.succ-cp{
  background:#eef3fb;border:1px solid #dbe5f3;border-radius:6px;color:#1c5df6;
  font-size:9px;padding:3px 6px;cursor:pointer;line-height:1;
  display:inline-flex;align-items:center;
  transition:background .15s,transform .1s;
}
.succ-cp:active{transform:scale(.94);}
.succ-cp:focus-visible{outline:2px solid #7fb3ff;outline-offset:1px;}

/* ── countdown delivery ────────────────────────────────────────
   tabular-nums WAJIB: tanpa itu lebar digit berubah tiap detik
   (1 vs 8) sehingga teks bergoyang saat menghitung.
   ─────────────────────────────────────────────────────────────── */
.succ-cd{
  font-family:ui-monospace,Consolas,monospace;font-size:11.5px;font-weight:700;
  font-variant-numeric:tabular-nums;letter-spacing:.3px;color:#1b2434;
}
.succ-cd.warn{color:#c2410c;}
.succ-cd.dead{color:#b91c1c;}
.succ-cdbar{
  height:3px;border-radius:99px;overflow:hidden;
  background:#eef2f7;margin:0 0 8px;
}
.succ-cdbar i{
  display:block;height:100%;width:100%;border-radius:99px;
  background:linear-gradient(90deg,#1c8ff6,#12a150);
  transition:width 1s linear;
}
.succ-cdbar i.warn{background:linear-gradient(90deg,#f59e0b,#ea580c);}
.succ-cdbar i.dead{background:#dc2626;}

/* ── tombol aksi ─────────────────────────────────────────────── */
.success-actions{display:flex;gap:8px;}
.btn-back-home{
  flex:1;background:#1c5df6;color:#fff;border:none;border-radius:14px;
  padding:13px;font-family:'Barlow Condensed',sans-serif;font-weight:800;
  font-size:15.5px;letter-spacing:.4px;cursor:pointer;
  box-shadow:0 4px 14px rgba(28,93,246,.28);
  transition:background .18s;
}
.btn-copy-details{
  flex:1;background:#f4f7fb;color:#42506a;border:1px solid #e8edf4;
  border-radius:14px;padding:13px;font-family:'Barlow Condensed',sans-serif;
  font-weight:800;font-size:15.5px;letter-spacing:.4px;cursor:pointer;
  transition:background .18s,border-color .18s;
}
.btn-copy-details:active{transform:scale(.97);background:#e9eef6;}
.btn-copy-details.copied{background:#e6f7ec;border-color:#a8dfbb;color:#1f7a45;}
.btn-back-home:active{transform:scale(.97);filter:brightness(.94);}

.coming-box{background:#fff;width:88%;max-width:340px;border-radius:18px;padding:30px 22px 22px;text-align:center;animation:dialogIn .28s cubic-bezier(.25,.46,.45,.94);}
.coming-icon{width:60px;height:60px;margin:0 auto 14px;font-size:36px;color:#1c5df6;display:flex;align-items:center;justify-content:center;}
.coming-title{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:22px;color:#111;margin-bottom:6px;}
.coming-sub{font-size:13px;color:#767676;margin-bottom:20px;}

.search-box{
  background:#fff;width:90%;max-width:370px;border-radius:18px;
  padding:26px 22px 22px;
  animation:dialogIn .28s cubic-bezier(.25,.46,.45,.94);
  max-height:calc(100vh - 32px);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
@supports (height:100dvh){
  .search-box{max-height:calc(100dvh - 32px);}
}

/* .coming-box: tidak punya anak melayang -> overflow aman.
   .success-box: DIPISAH. Dia punya .succ-float (top:-30px) yang keluar
   kotak; overflow selain visible akan MEMOTONG ikon itu (bug N6).
   Scroll untuk .success-box diberikan lewat media query di bawah,
   hanya saat layar benar-benar pendek. */
.coming-box{
  max-height:calc(100vh - 32px);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
@supports (height:100dvh){
  .coming-box{max-height:calc(100dvh - 32px);}
}

/* Modal success WAJIB tidak meng-clip: anak melayang keluar tepi atas.
   max-height:none + overflow:visible membatalkan klausa generik di atas
   (urutan file: aturan ini MENANG karena datang setelahnya + spesifisitas sama). */
.success-box{
  max-height:none;
  overflow:visible;
}

/* Layar pendek (HP kecil / keyboard muncul): struk harus tetap bisa
   di-scroll. TAPI kalau overflow diaktifkan, anak melayang (-24px) tetap
   TERPOTONG — sudah dibuktikan di viewport 540: float top 4px, box top 28px,
   24px di luar area clip. Jadi di mode ini ikon DIPINDAH KE DALAM box
   (top:8px, bukan negatif) dan padding-top dinaikkan supaya teks tidak
   tertimpa. Hasil: scroll jalan DAN ikon utuh. */
@media (max-height:620px){
  .success-box{
    max-height:calc(100vh - 56px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    padding-top:66px;
  }
  .succ-float{
    top:8px;width:50px;height:50px;font-size:22px;
    box-shadow:0 4px 14px rgba(18,161,80,.26),0 0 0 5px rgba(18,161,80,.10);
  }
}
@supports (height:100dvh){
  @media (max-height:620px){
    .success-box{max-height:calc(100dvh - 56px);}
  }
}

.search-input{width:100%;border:1.5px solid #d4dce8;border-radius:8px;padding:12px 14px;font-family:'Rajdhani',sans-serif;font-size:16px;font-weight:bold;letter-spacing:0.5px;color:#222;outline:none;transition:border-color .2s;margin-top:14px;display:block;}
.search-input:focus,.search-input:focus-visible{outline:none;border-color:#1c5df6;box-shadow:0 0 0 3px rgba(28,93,246,.15);}
.search-input::placeholder{color:#767676;}
.search-actions{display:flex;gap:10px;margin-top:14px;}

.btn-cancel{flex:1;background:#dce8ff;color:#1b5aef;border:none;border-radius:10px;padding:13px;font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:15px;cursor:pointer;transition:background .18s;text-transform:uppercase;}
.btn-cancel:active{transform:scale(.97);background:#a9c4f5;color:#1547ba;}
.btn-search{flex:1;background:#e8ecf0;color:#aaa;border:none;border-radius:10px;padding:13px;font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:15px;cursor:not-allowed;pointer-events:none;transition:all .18s;text-transform:uppercase;}
.btn-search.active{background:#1c5df6;color:#fff;cursor:pointer;pointer-events:auto;}

@media(min-width:481px){body{background:#020810;}}
.ef-select{
  width:100%;border:1.5px solid #d4dce8;border-radius:8px;
  padding:11px 36px 11px 14px;
  font-family:'Rajdhani',sans-serif;font-size:16px;color:#222;
  background:#fff;outline:none;cursor:pointer;
  appearance:none;-webkit-appearance:none;
  transition:border-color .2s;
}
.ef-select:focus{border-color:#1c5df6;}

:root{--modal-w:414px;--blue:#1a73e8;--sub:#5f6368;--border:#dadce0;--error:#d93025;--bg:#fff}
.ui-modal a { color: var(--blue) !important; text-decoration: none !important; }
.ui-modal a:hover { text-decoration: underline !important; }
[class^="ui-"], [class*=" ui-"]{
  font-family:'Roboto',system-ui,Segoe UI,Arial,sans-serif;
}

.ui-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:60;
}

.ui-modal{position:relative;background:var(--bg);width:min(92vw,var(--modal-w));border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.2);overflow:hidden}

.ui-topbar{display:flex;align-items:center;gap:.6rem;padding:12px 16px;border-bottom:1px solid var(--border)}
.ui-titlebar{font-size:16px;font-weight:450;color:#3c4043}
.ui-progress{height:4px;background:#e8f0fe;display:none}
.ui-progress .ui-bar{height:100%;width:0;background:var(--blue)}
.ui-card{padding:24px 28px 26px}

.ui-h1{font-size:28px;font-weight:400;line-height:1.25;margin:20px 0 8px}
.ui-subtitle{display:flex;gap:6px;align-items:baseline;margin:0 0 18px}
.ui-muted-small{color:#5f6368;font-size:16px}
.ui-app-link{color:#1a73e8;font-size:16px;font-weight:500;text-decoration:none}
.ui-app-link:hover{text-decoration:underline}

.ui-group{position:relative;margin-bottom:18px}
.ui-group .ui-input{width:100%;padding:14px;border:1px solid #dadce0;border-radius:6px;font-size:16px;color:#202124;outline:none;transition:border-color .2s ease-out, box-shadow .2s ease-out, background-color .2s ease-out}
.ui-group .ui-input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(26,115,232,.15)}
.ui-input.error:focus{border-color:var(--error)!important;box-shadow:0 0 0 3px rgba(217,48,37,.12)!important}
.ui-group .ui-label{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#5f6368;font-size:16px;pointer-events:none;transition:all .18s ease;background:transparent}
.ui-group .ui-input:focus + .ui-label,
.ui-group .ui-input:not(:placeholder-shown) + .ui-label{top:-8px;font-size:12px;color:var(--blue);background:#fff;padding:0 4px;left:10px;transform:none;z-index:2}
.ui-input.error{border-color:var(--error)!important;box-shadow:0 0 0 3px rgba(217,48,37,.12)!important;transition:border-color 0ms, box-shadow 0ms, background-color 0ms!important}
.ui-input.error + .ui-label{color:var(--error)!important;top:-8px;left:10px;transform:none;font-size:12px;background:#fff;padding:0 4px;z-index:2;transition:color 0ms!important}
.ui-errtxt{display:none;margin-top:6px;font-size:12.5px;color:var(--error);opacity:0;max-height:0;overflow:hidden;transition:opacity .15s ease-out, max-height .15s ease-out}
.ui-errtxt.visible{display:flex;align-items:center;gap:6px;opacity:1;max-height:50px;transition:opacity 0ms, max-height 0ms}
.ui-errtxt .fa-circle-exclamation{font-size:13px}

.ui-link{display:inline-block;color:var(--blue);font-size:14px;text-decoration:none}
.ui-link:hover{text-decoration:underline}

.ui-muted{color:var(--sub);font-size:12px;line-height:1.4;margin:0 0 18px}
.ui-muted a{color:var(--blue);text-decoration:none}
.ui-muted a:hover{text-decoration:underline}

.ui-actions{display:flex;align-items:center;justify-content:space-between;margin-top:6px}
.ui-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:8px 18px;border-radius:22px;border:1px solid transparent;cursor:pointer;font-weight:700;font-size:14px;user-select:none}

.ui-btn-primary{background:var(--blue);color:#fff;min-width:88px;min-height:36px}
.ui-btn-primary:active{transform:scale(.97);background:#2359bd}
.ui-btn-primary:disabled{background:#a5c7fb;opacity:.65;cursor:not-allowed}
.ui-btn-primary:focus{outline:2px solid rgba(26,115,232,.3);outline-offset:2px}

.ui-row{display:flex;align-items:center;gap:.5rem}
.ui-email-pill{display:flex;align-items:center;gap:.5rem;color:#3c4043;margin-top: 10px;margin-bottom: 10px;}
.ui-email-pill .fa-user{color:#5f6368}

.ui-checkwrap{display:flex;align-items:center;gap:.5rem;margin:10px 0 16px}
.ui-checkwrap input[type="checkbox"]{appearance:none;width:18px;height:18px;border:2px solid #5f6368;border-radius:3px;display:inline-block;position:relative;cursor:pointer}
.ui-checkwrap input[type="checkbox"]:checked{border-color:#1a73e8;background:#1a73e8}
.ui-checkwrap input[type="checkbox"]:checked::after{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;color:#fff;position:absolute;left:50%;top:50%;transform:translate(-50%,-58%);font-size:11px}

@media (max-width:420px){.ui-card{padding:18px 16px}}

@media (max-width:380px){
  .ui-h1{font-size:24px}
  .ui-muted-small{font-size:14px}
  .ui-card{padding:20px 18px 22px}
}

.pkg-img-box{border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:4px;flex-shrink:0;}

.reward-inner-box{
  width:100%;
  margin-top:20px;
  margin-bottom: 5px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:8px;
  padding:8px 4px 4px;
}
.reward-inner-box .reward-coin{margin-top:0;}
.reward-inner-box .reward-players{margin-bottom:0;}
.reward-inner-box .reward-stock{margin-bottom:0;}

.no-coin .reward-inner-box{
  padding-top:28px;
  padding-bottom:4px;
}
.no-coin .reward-players{height:118px;}

@media (max-width:400px){
  .no-coin .reward-inner-box{padding-top:32px;}
  .no-coin .reward-players{height:84px;}
}

.pd-overlay{display:none;position:fixed;inset:0;z-index:1000;background:#060d1f;overflow-y:auto;}
.pd-panel{max-width:480px;margin:0 auto;min-height:100vh;position:relative;padding-bottom:24px;}

.pd-titlebar{padding:18px 14px 12px;}
.pd-title{font-family:'Barlow Condensed',sans-serif;font-weight:800;color:#fff;font-size:22px;letter-spacing:.3px;}
.pd-subtitle{font-size:12px;color:#7d93b5;font-family:sans-serif;margin-top:4px;}

.pd-tabs{display:flex;gap:8px;overflow-x:auto;padding:0 14px 14px;scrollbar-width:none;}
.pd-tabs::-webkit-scrollbar{display:none;}
.pd-tab{flex-shrink:0;background:transparent;border:1px solid rgba(80,120,180,.3);color:#93a9c4;font-family:'Rajdhani',sans-serif;font-weight:600;font-size:12.5px;padding:8px 14px;border-radius:20px;cursor:pointer;white-space:nowrap;}
.pd-tab.active{background:#1c5df6;border-color:#1c5df6;color:#fff;}

.pd-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:0 12px;}
.pd-card{position:relative;background:linear-gradient(160deg,#232f47 0%,#101a2e 100%);border:1px solid rgba(80,120,180,.3);border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px rgba(60,100,160,.1),0 4px 10px rgba(0,0,0,.3);}
.pd-badge{position:absolute;top:6px;left:6px;background:#1c5df6;color:#fff;font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:10px;letter-spacing:.5px;padding:2px 6px;border-radius:4px;z-index:2;}
.pd-img{width:100%;height:78px;object-fit:cover;display:block;}
.pd-body{padding:7px 7px 0;}
.pd-cat{font-size:10.5px;color:#8297b8;font-family:sans-serif;text-transform:uppercase;letter-spacing:.3px;}
.pd-name{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:11px;color:#fff;line-height:1.25;margin:2px 0 5px;min-height:28px;}
.pd-remaining{font-size:11px;color:#ffb020;font-weight:700;font-family:'Rajdhani',sans-serif;margin-bottom:7px;}
.pd-claim{width:calc(100% - 14px);margin:0 7px 7px;min-height:38px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#2a6ff0,#1c4fd8);border:1px solid rgba(90,150,255,.5);border-radius:6px;color:#fff;font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:11px;letter-spacing:.2px;padding:7px 4px;cursor:pointer;box-shadow:0 2px 8px rgba(28,93,246,.4),inset 0 1px 0 rgba(255,255,255,.15);transition:all .18s;text-transform:uppercase;}

.pd-claim:active{transform:scale(.95);filter:brightness(.9);}

.pd-back{margin:18px 12px 0;width:calc(100% - 24px);background:linear-gradient(180deg,#2e6dff,#1c5df6);border:none;border-radius:12px;color:#fff;font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:15px;padding:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 6px 16px rgba(28,93,246,.4);}

.pd-panel{overflow-x:clip;}
.pd-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
.pd-card{min-width:0;}
.pd-name{overflow-wrap:break-word;word-break:break-word;}

.verify-footer-game{display:flex;align-items:center;justify-content:center;margin-top:18px;}
.verify-game-text{display:flex;flex-direction:column;gap:2px;}
.verify-game-text span{font-size:11px;color:#6b7790;font-family:sans-serif;white-space:nowrap;}

.verify-profile-card{background:#f0f5ff;border:1.5px solid #d4dce8;border-radius:8px;padding:5px 14px;display:flex;align-items:center;gap:14px;margin-bottom:18px;min-height:45px;}

.verify-avatar-logo{width:32px;height:32px;background:transparent;border:none;border-radius:5px;display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:0;box-shadow:0 0 12px rgba(28,93,246,.3);overflow:hidden;}
.verify-avatar-logo img{width:28px;height:28px;object-fit:contain;}

.verify-profile-info{flex:1;min-width:0;}

.search-box > .verify-hd,
.search-box > .box-hd{
  position:relative;      /* anchor untuk .modal-close (X) di header */
  margin:-26px -22px 0;
  padding:13px 46px;
  border-bottom:1px solid #eceef2;
  text-align:center;
}
/* X di header Game Verification — digeser ke tengah TINGGI HEADER,
   bukan tengah box. ::before memperluas area sentuh jadi 42x42. */
.verify-hd .modal-close{
  top:50%;right:13px;transform:translateY(-50%);
  width:24px;height:24px;background:none;border-radius:50%;
  color:#a2a8b3;font-size:17px;
}
.verify-hd .modal-close:active{transform:translateY(-50%) scale(.92);background:none;color:#6b7280;}
.verify-hd .modal-close::before{content:'';position:absolute;top:-9px;right:-9px;bottom:-9px;left:-9px;}
.search-box > .verify-hd .modal-title,
.search-box > .box-hd .modal-title{line-height:1.15;}

.verify-profile-name{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:20px;color:#111;line-height:1.25;letter-spacing:.3px;position:relative;top:-2px;}

:root{
  --efb-bg-op:0.82;
  --efb-veil-1:0.08;
  --efb-veil-2:0.20;
  --efb-veil-3:0.40;
}

#bg-scene{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
#bg-scene .img{
  position:absolute;inset:0;
  background-image:url('../img/konami-bg-cl2.webp');
  background-size:cover;background-position:center top;background-repeat:no-repeat;
  opacity:var(--efb-bg-op);
}
#bg-scene .veil{
  position:absolute;inset:0;
  background:linear-gradient(180deg,
    rgba(6,13,31,var(--efb-veil-1)) 0%,
    rgba(6,13,31,var(--efb-veil-2)) 38%,
    rgba(6,13,31,var(--efb-veil-3)) 100%);
}

#app{background:transparent;}

#app{position:relative;z-index:2;}

.tick-item{font-family:'Rajdhani',sans-serif;font-size:12px;color:#667e95;margin-right:60px;font-weight:500}

 .app-header{position:sticky;top:5px;z-index:50;margin:5px 5px 0;background:linear-gradient(135deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,.02) 45%,rgba(255,255,255,.08) 100%),rgba(18,28,52,.28);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border:1px solid rgba(255,255,255,.22);border-radius:16px;box-shadow:0 6px 20px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.25),inset 0 -1px 0 rgba(0,0,0,.15);padding:10px 14px}

#app > header.app-header{
  position:sticky;top:0;z-index:50;
  background:#060d1f;backdrop-filter:none;-webkit-backdrop-filter:none;
  margin:0;padding:10px 14px;
  border:0;border-radius:0;
  border-bottom:1px solid rgba(77,159,255,.3);
  box-shadow:0 2px 12px rgba(0,0,0,.45);
}

@media (hover: hover) and (pointer: fine){
  .btn-claim-glow:hover{background:linear-gradient(180deg,#3b7dff,#2560e8);}
  .btn-claim-pill:hover{background:linear-gradient(180deg,#3b7dff,#2560e8);}
  .pd-claim:hover{background:linear-gradient(180deg,#3b7dff,#2560e8);}
  .car-thumb:hover{border-color:#3b7dff;}
  .pkg-cell:hover{border-color:rgba(28,93,246,.5);background:linear-gradient(160deg,#2a3854,#141f36);}
  .btn-confirm:hover{background:#2e6dff;}
  .btn-back-home:hover{background:#2e6dff;}
  .btn-cancel:hover{background:#c8daff;color:#1750d8;}
  .btn-search.active:hover{background:#2e6dff;}
  .ui-btn-primary:hover{background:#2a6fe3}
  .promo-banner:hover{border-color:rgba(28,93,246,.55);}
  .modal-close:hover{background:#dce4ee;color:#333;}
  .car-ar:hover{background:#3b7dff;color:#fff;
  box-shadow:0 0 14px rgba(59,125,255,.75);}
}

.btn-claim-glow:focus-visible,
.btn-claim-pill:focus-visible,
.pd-claim:focus-visible,
.btn-confirm:focus-visible,
.btn-back-home:focus-visible,
.btn-cancel:focus-visible,
.btn-search:focus-visible,
.btn-copy-details:focus-visible,
.btn-logout-confirm:focus-visible,
.modal-close:focus-visible,
.car-ar:focus-visible,
.car-thumb:focus-visible,
.pkg-cell:focus-visible,
.promo-banner:focus-visible,
.reward-card:focus-visible,
.pd-card:focus-visible,
.pd-tab:focus-visible,
.pd-back:focus-visible{
  outline:2px solid #4d94ff;
  outline-offset:2px;
}

.ui-btn-primary:focus-visible{
  outline:2px solid #4d94ff;
  outline-offset:2px;
  box-shadow:0 0 0 4px rgba(6,13,31,.28);
}

.btn-confirm:focus-visible,
.btn-back-home:focus-visible,
.btn-copy-details:focus-visible,
.btn-cancel:focus-visible,
.btn-search:focus-visible,
.modal-close:focus-visible,
.pd-tab:focus-visible{
  box-shadow:0 0 0 4px rgba(6,13,31,.28);
}

.btn-logout-confirm:focus-visible{
  outline-color:#fff;
  box-shadow:0 0 0 4px rgba(6,13,31,.35);
}

@media (hover: none){
  .btn-claim-glow:hover{background:linear-gradient(180deg,#2a6ff0,#1c4fd8);}
  .btn-claim-pill:hover{background:linear-gradient(180deg,#2a6ff0,#1c4fd8);}
  .pd-claim:hover{background:linear-gradient(180deg,#2a6ff0,#1c4fd8);}
  .pkg-cell:hover{border-color:rgba(80,120,180,.3);background:linear-gradient(160deg,#232f47 0%,#101a2e 100%);}
  .car-ar:hover{background:#1c5df6;box-shadow:0 2px 8px rgba(28,93,246,.5);}
}

.logout-ico{
  width:52px;height:52px;margin:0 auto 14px;border-radius:50%;
  background:rgba(229,62,62,.1);border:1.5px solid rgba(229,62,62,.25);
  display:flex;align-items:center;justify-content:center;
  color:#e53e3e;font-size:22px;
  animation:icoPulse 2.4s ease-in-out infinite;
}
@keyframes icoPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(229,62,62,.25)}
  50%    {box-shadow:0 0 0 8px rgba(229,62,62,0)}
}

.logout-warn{
  font-size:11.5px;color:#b45309;line-height:1.5;text-align:center;
  background:#fffbeb;border:1px solid #fde68a;border-radius:9px;
  padding:9px 11px;margin-bottom:4px;
}

.btn-logout-confirm{
  flex:1;background:#d83b3b;color:#fff;border:none;border-radius:10px;
  padding:13px;
  font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:15px;
  cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  box-shadow:0 2px 8px rgba(229,62,62,.35);
  transition:background .18s,transform .12s;
  text-transform:uppercase;
}
.btn-logout-confirm:hover{background:#d12f2f;}
.btn-logout-confirm:active{transform:scale(.97);}

.ef-toast{
  position:fixed;left:50%;bottom:80px;
  transform:translateX(-50%) translateY(20px);
  background:#0f1a33;border:1px solid rgba(80,120,180,.4);
  border-radius:11px;padding:12px 18px;
  color:#c8d8ec;font-family:'Rajdhani',sans-serif;font-weight:600;font-size:13px;
  box-shadow:0 8px 24px rgba(0,0,0,.5);
  opacity:0;pointer-events:none;
  transition:opacity .28s ease,transform .28s ease;
  z-index:2000;
  display:flex;align-items:center;gap:9px;white-space:nowrap;
}
.ef-toast.show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}
.ef-toast i{color:#4ade80;font-size:15px;}

@media (max-width:380px){
  .ef-toast{white-space:normal;max-width:88%;text-align:left;}
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  /* Loading bar: kalau animasi dipaksa .01ms + iteration 1, bar berhenti di
     keyframe TERAKHIR (translate 100% + scaleX .5) = keluar layar = TAK TERLIHAT.
     Override: matikan animasi, taruh di tengah track supaya tetap terbaca
     sebagai indikator "ada proses". */
  .spinner-loading-bar{
    animation:none !important;
    transform:translate(0) scaleX(.55) !important;
  }
}

/* ══════════════════════════════════════════════════════════════
   CLAIMED (per-user, localStorage) — visual D2 STAMP
   Dipasang JS lewat class .claimed + child .efb-cl-ovl.

   D2 = STEMPEL diagonal "CLAIMED", BUKAN overlay gelap penuh.
   Alasan pilih D2: art kartu tetap terbaca (user masih tahu kartu mana
   yang dia klaim), tapi maknanya tegas. Overlay penuh (D3) membuat art
   tidak dikenali lagi di kartu sempit.

   Perubahan dari D3 CHECK:
   - .efb-cl-ovl TIDAK lagi background gradient gelap penuh; jadi transparan,
     hanya wadah untuk stempel.
   - centang bulat 40px DIHAPUS. .ck sekarang kotak bergaris (border) yang
     diputar bersama teks = bingkai stempel.
   - anak kartu tidak lagi diredupkan opacity:.34 (itu milik D3). D2 hanya
     desaturasi + gelap sedikit lewat filter di .claimed.

   Animasi badgeShin DIMATIKAN: kartu yang sudah diklaim tidak boleh
   terlihat masih "hidup".
   ══════════════════════════════════════════════════════════════ */
.reward-card.claimed{pointer-events:none;filter:saturate(.55) brightness(.86);}
.reward-card.claimed .badge-lim{animation:none;background:#2a3a52;color:#8fa5c0;}
.reward-card.claimed .reward-stock{color:#8a99ad;}
.reward-card.claimed .btn-claim-glow{background:#3a4759;border-color:rgba(120,140,170,.35);box-shadow:none;color:#9fb0c4;}

/* wadah stempel — transparan, tidak menutupi art */
.efb-cl-ovl{
  position:absolute;inset:0;z-index:6;pointer-events:none;
  display:flex;align-items:center;justify-content:center;
  background:none;
}

/* stempel: satu kotak bergaris diputar, isi teks .tx */
.efb-cl-ovl .ck{
  display:none;   /* D2 tidak pakai ikon centang */
}
.efb-cl-ovl .tx{
  font-family:'Barlow Condensed',sans-serif;font-weight:900;
  font-size:20px;letter-spacing:2.5px;line-height:1;
  color:rgba(255,255,255,.92);text-transform:uppercase;white-space:nowrap;
  border:2.5px solid rgba(255,255,255,.72);border-radius:6px;
  padding:4px 12px;
  text-shadow:0 2px 6px rgba(0,0,0,.75);
  box-shadow:0 0 0 1px rgba(0,0,0,.35);
  background:rgba(10,20,36,.42);
  transform:rotate(-19deg);
}

/* ── CLAIMED = HIJAU ────────────────────────────────────────────────
   Tiga status punya tiga warna supaya bisa dibedakan dari jauh:
     HIJAU  = sudah diklaim user  (per-user, localStorage)
     MERAH  = sold out            (global, dari admin)
     PUTIH  = base/fallback       (tidak dipakai status mana pun sekarang)

   Kenapa hijau: sejalan dengan aksen sukses yang SUDAH dipakai di situs
   (#12a150 di .succ-float modal Claimed). Jadi bahasa visualnya konsisten,
   bukan warna baru yang muncul tiba-tiba.

   Selector pertama menang untuk kartu (.claimed), kedua untuk koin yang
   mungkin tidak punya class .claimed di overlay-nya. Keduanya TIDAK
   menyentuh stempel 'Sold Out' — merah tetap merah. */
.efb-cl-ovl.claimed > .tx,
.efb-cl-ovl[data-stamp="Claimed"] > .tx{
  color:rgba(200,255,220,.96);
  border-color:rgba(80,230,150,.8);
  background:rgba(8,42,28,.5);
  text-shadow:0 2px 6px rgba(0,0,0,.8);
}

/* ── ukuran kecil untuk coin package ── */
/* Kartu koin jauh lebih kecil (224x69), teks 20px + padding 12px tidak muat.
   D2 di koin: huruf lebih kecil, border lebih tipis, sudut putar sama. */
.pkg-cell.claimed{pointer-events:none;filter:saturate(.6) brightness(.9);}
.pkg-cell.claimed .badge-lim{animation:none;}
.pkg-cell.claimed .btn-claim-pill{background:#3a4759;border-color:rgba(120,140,170,.35);color:#9fb0c4;}
.efb-cl-ovl.sm .tx{
  font-size:10px;letter-spacing:1.4px;
  border-width:1.5px;border-radius:4px;padding:3px 7px;
  transform:rotate(-12deg);
}

/* SOLD OUT (status global dari admin)
   Struktur & sudut putar SAMA dengan CLAIMED (satu komponen .efb-cl-ovl),
   hanya warna & label yang beda: MERAH = habis, PUTIH = sudah diklaim.
   Kalau keduanya putih, user tidak bisa membedakan "saya sudah ambil"
   dari "stoknya habis".

   PENTING: data-stamp dipasang di OVERLAY, bukan di .tx. Selector harus
   menyasar anaknya (tanpa `>`, tetap valid tapi lebih tepat pakai `>`). */
.reward-card.sold-out{pointer-events:none;filter:saturate(.5) brightness(.82);}
.reward-card.sold-out .badge-lim{animation:none;background:#3a2028;color:#c08f98;}
.reward-card.sold-out .reward-stock{color:#b08a92;}
.reward-card.sold-out .btn-claim-glow{
  background:#4a2a30;border-color:rgba(170,90,100,.35);box-shadow:none;color:#c9a4aa;
}

/* stempel MERAH. 'SOLD OUT' 8 karakter vs 'Claimed' 7 -> huruf 17px. */
.efb-cl-ovl[data-stamp="Sold Out"] > .tx{
  font-size:17px;letter-spacing:1.8px;
  color:rgba(255,214,214,.96);
  border-color:rgba(255,110,110,.8);
  background:rgba(58,16,22,.5);
  text-shadow:0 2px 6px rgba(0,0,0,.8);
}

@media (prefers-reduced-motion: reduce){
  .reward-card.claimed .badge-lim{animation:none !important;}
  .reward-card.sold-out .badge-lim{animation:none !important;}
}