/* 活动弹窗(首充送,2026-10-30)—— 照老板选的概念 1「熊猫破框金卡」一比一排。
 * 底图 first-deposit-card.webp:透明底,熊猫和金币冲出金框上缘,框里是空的黑底;字全部用 HTML 叠在框里的安全区:
 *   x 14.7%–85.3%、y 44%–93%(量自原图 1360×2048,见 output/首充30送30海报/popup-asset/规格.txt)。
 * 整张卡按 --ppop-w 等比缩放(宽、高都放得下才取那个宽),卡里所有尺寸都用 --ppop-u(卡宽的 1%)算,所以 320–430 宽排出来一样。
 * 中文照概念两行大金字「首充 RM30 / 再送 RM30」;其他语言字长,改成左右两栏「小字 + 大金额」,中间一个柠檬「+」。
 * 万一某种语言细则折成两行放不下:promo-popup.js 的 fitPromo() 量一次,把 --ppop-fit 调小,整块等比缩。
 * 逻辑在 promo-popup.js;用 <dialog> showModal,底下的大厅自动不可点。类名一律 ppop- 开头,跟进群弹窗(ginv-)互不干扰。
 */
html.ppop-open { overflow: hidden; }

.ppop {
  --ppop-neon: #e5ff3d;
  --ppop-ratio: .6640625; /* 1360 / 2048 */
  --ppop-w: min(400px, calc(100vw - 24px), calc((100vh - var(--safe-t, 0px) - var(--safe-b, 0px) - 24px) * var(--ppop-ratio)));
  --ppop-u: calc(var(--ppop-w) / 100);
  box-sizing: border-box;
  position: fixed;
  inset: var(--safe-t, 0px) 0 var(--safe-b, 0px);
  width: var(--ppop-w);
  max-width: none;
  height: calc(var(--ppop-w) / var(--ppop-ratio));
  max-height: none;
  margin: auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  font-family: var(--sans, system-ui, -apple-system, "PingFang SC", "Noto Sans CJK SC", sans-serif);
  overflow: visible;
  -webkit-user-select: none; user-select: none;
  -webkit-tap-highlight-color: transparent;
}
@supports (height: 100dvh) {
  .ppop { --ppop-w: min(400px, calc(100vw - 24px), calc((100dvh - var(--safe-t, 0px) - var(--safe-b, 0px) - 24px) * var(--ppop-ratio))); }
}
.ppop[open] { display: block; }
dialog.ppop:focus, dialog.ppop:focus-visible { outline: none !important; } /* 打开时焦点放在整张卡上(读屏先念标题),不画框 */
.ppop::backdrop { background: rgba(0, 0, 0, .74); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
/* 很旧的 WebView 没有 <dialog>:当普通固定层,遮罩是 JS 补在卡片前面的一层真元素 */
.ppop.is-fallback { z-index: 41; }
.ppop-scrim { position: fixed; inset: 0; z-index: 40; background: rgba(0, 0, 0, .74); -webkit-tap-highlight-color: transparent; }

/* ---------- 底图 ---------- */
.ppop-card {
  position: absolute; inset: 0; z-index: 0; display: block; width: 100%; height: 100%;
  -webkit-user-drag: none; -webkit-touch-callout: none; /* 要接住卡面上的点按:点熊猫、金框不算「点外面」;长按不跳存图选单 */
  filter: drop-shadow(0 0 calc(var(--ppop-u) * 5) rgba(255, 176, 32, .28));
}
.ppop-tag {
  position: absolute; top: 2%; left: 3%; z-index: 4;
  padding: 4px 10px; border-radius: 999px; background: rgba(0, 0, 0, .72); box-shadow: inset 0 0 0 1px var(--ppop-neon);
  color: var(--ppop-neon); font-size: 12px; font-weight: 800; line-height: 1.4; letter-spacing: .04em;
}
/* × 压在金框右上角(概念 1 的位置),点按范围 48px */
.ppop-x {
  position: absolute; left: calc(89.5% - 24px); top: calc(41.8% - 24px); z-index: 4;
  display: grid; place-items: center; width: 48px; height: 48px; min-height: 0; padding: 0;
  border: 0; border-radius: 50%; background: none; color: #fff; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.ppop-x::before {
  content: ''; position: absolute; inset: 7px; border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, #2a2a2a, #050505 70%);
  box-shadow: inset 0 0 0 2px #e9b949, 0 0 0 2px rgba(0, 0, 0, .55), 0 2px 8px rgba(0, 0, 0, .7), 0 0 12px rgba(255, 190, 60, .35);
}
.ppop-x svg { position: relative; width: 15px; height: 15px; }

/* ---------- 框里的字:安全区 ---------- */
.ppop-body {
  --u: calc(var(--ppop-u) * var(--ppop-fit, 1));
  position: absolute; z-index: 1; left: 14.7%; right: 14.7%; top: 44%; bottom: 7%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
}
/* 概念图金字后面那团金光和几颗闪光:纯 CSS,不挡点按 */
.ppop-body::before {
  content: ''; position: absolute; z-index: -1; inset: 6% -12% 30%; pointer-events: none;
  background:
    radial-gradient(circle at 10% 30%, rgba(255, 236, 160, .95) 0 1.5px, rgba(255, 196, 64, .45) 2.5px, transparent 7px),
    radial-gradient(circle at 92% 22%, rgba(255, 236, 160, .95) 0 1.5px, rgba(255, 196, 64, .45) 2.5px, transparent 8px),
    radial-gradient(circle at 86% 70%, rgba(255, 236, 160, .9) 0 1px, rgba(255, 196, 64, .4) 2px, transparent 6px),
    radial-gradient(circle at 6% 74%, rgba(255, 236, 160, .9) 0 1px, rgba(255, 196, 64, .4) 2px, transparent 6px),
    radial-gradient(ellipse 60% 46% at 50% 52%, rgba(255, 178, 40, .3), rgba(255, 150, 20, .1) 55%, transparent 75%);
}

/* 日期胶囊(柠檬底黑字) */
.ppop-date {
  flex: none; max-width: 100%; margin: 0 0 calc(var(--u) * 2.6);
  padding: calc(var(--u) * 1.1) calc(var(--u) * 4.6);
  border-radius: 999px; background: linear-gradient(180deg, #f6ff92 0%, #e5ff3d 55%, #d3ec22 100%);
  color: #0a0a0a; font-size: max(12px, calc(var(--u) * 4.3)); font-weight: 800; line-height: 1.35; letter-spacing: .02em;
  box-shadow: 0 0 calc(var(--u) * 4) rgba(229, 255, 61, .45), inset 0 1px 0 rgba(255, 255, 255, .6);
  overflow-wrap: anywhere;
}

/* ---------- 金字 ---------- */
.ppop-head {
  flex: none; position: relative; max-width: 100%; margin: 0; font: inherit; font-weight: 900;
  /* 中文:两行同一个字号;--ppop-n 是金额字数,字数多就缩到一行放得进安全区 */
  font-size: min(calc(var(--u) * 12.4), calc(var(--u) * 68 / (3.75 + .64 * var(--ppop-n, 2))));
  line-height: 1.16;
  display: flex; flex-direction: column; align-items: center;
}
.ppop-line { display: flex; align-items: baseline; justify-content: center; gap: .1em; max-width: 100%; white-space: nowrap; }
.ppop-label, .ppop-amt {
  display: block; font-weight: 900; letter-spacing: -.005em;
  background: linear-gradient(180deg, #fffbe6 6%, #ffe68a 30%, #f8c43a 54%, #d78a10 80%, #f0bb45 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 calc(var(--u) * .45) 0 #7a4705) drop-shadow(0 calc(var(--u) * .5) 0 #2b1802) drop-shadow(0 0 calc(var(--u) * 2.6) rgba(255, 186, 52, .5));
}
.ppop-amt { font-variant-numeric: tabular-nums; }
.ppop-cur { letter-spacing: .01em; margin-right: .03em; }
.ppop-plus { display: none; }

/* 其他语言:左右两栏,上面小字(最多两行)、下面大金额 */
html:not(:lang(zh)) .ppop-head {
  display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: end; column-gap: calc(var(--u) * 1.6);
  width: 100%;
  font-size: min(calc(var(--u) * 11.6), calc(var(--u) * 29 / (1.05 + .64 * var(--ppop-n, 2))));
}
html:not(:lang(zh)) .ppop-line { flex-direction: column; align-items: center; justify-content: flex-end; gap: calc(var(--u) * .8); min-width: 0; white-space: normal; }
html:not(:lang(zh)) .ppop-label {
  max-width: 100%; font-size: max(12px, calc(var(--u) * 4.4)); font-weight: 800; line-height: 1.3; letter-spacing: .01em;
  background: none; color: #ffe9a6; -webkit-text-fill-color: currentColor; filter: none; text-shadow: 0 1px 2px rgba(0, 0, 0, .9);
  overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}
html:not(:lang(zh)) .ppop-amt { white-space: nowrap; }
html:not(:lang(zh)) .ppop-cur { font-size: .58em; margin-right: .06em; }
html:not(:lang(zh)) .ppop-plus {
  display: block; align-self: end; padding-bottom: .16em; color: var(--ppop-neon);
  font-size: calc(var(--u) * 8); font-weight: 900; line-height: 1;
  text-shadow: 0 0 calc(var(--u) * 3) rgba(229, 255, 61, .6);
}

/* ---------- 按钮、细则 ---------- */
.ppop-go {
  flex: none; position: relative; display: flex; align-items: center; justify-content: center; width: 100%;
  min-height: max(44px, calc(var(--u) * 13.4)); margin-top: calc(var(--u) * 4.4); padding: calc(var(--u) * 1.5) calc(var(--u) * 4);
  border: 0; border-radius: 999px;
  background: linear-gradient(180deg, #f8ffa6 0%, #ebff4c 42%, #d6ee20 100%);
  color: #0a0a0a; font-family: inherit; font-size: max(16px, calc(var(--u) * 6.4)); font-weight: 900; line-height: 1.2; letter-spacing: .03em; cursor: pointer;
  box-shadow: 0 0 0 calc(var(--u) * .6) #c99a2e, 0 0 0 calc(var(--u) * 1) rgba(0, 0, 0, .6), 0 0 calc(var(--u) * 6) rgba(229, 255, 61, .42), inset 0 calc(var(--u) * .5) 0 rgba(255, 255, 255, .65), inset 0 calc(var(--u) * -.8) 0 rgba(120, 140, 0, .35);
  overflow-wrap: anywhere; -webkit-tap-highlight-color: transparent;
  transition: transform .08s ease-out;
}
.ppop-go:active { transform: translateY(1px) scale(.985); }
.ppop-later {
  flex: none; position: relative; max-width: 100%; min-height: 26px; margin-top: calc(var(--u) * 2); padding: calc(var(--u) * 1.2) calc(var(--u) * 5);
  border: 0; border-radius: 999px; background: none; color: #a8a8a8;
  font-family: inherit; font-size: max(13px, calc(var(--u) * 4.4)); font-weight: 700; line-height: 1.3; cursor: pointer;
  overflow-wrap: anywhere; -webkit-tap-highlight-color: transparent;
}
/* 字小、点按范围往外多给一点,凑够 44px(上面只多 4px,跟「立即充值」之间还隔着 margin,不会吃到它的下缘) */
.ppop-later::before { content: ''; position: absolute; inset: -4px -14px -16px; }
.ppop-later:hover { color: #fff; }
.ppop-terms {
  flex: none; max-width: 100%; margin: calc(var(--u) * 1.2) 0 0; color: rgba(255, 255, 255, .5);
  font-size: max(10.5px, calc(var(--u) * 3.1)); line-height: 1.45; overflow-wrap: anywhere; text-wrap: balance;
}
.ppop-go:focus-visible, .ppop-later:focus-visible, .ppop-x:focus-visible { outline: 2px solid var(--ppop-neon) !important; outline-offset: 3px !important; }
.ppop-go:focus-visible { outline-color: #fff !important; }

/* 泰文、缅文、孟加拉文字高、行距大 */
html:is(:lang(th), :lang(my), :lang(bn)) .ppop-label { line-height: 1.6; }
html:is(:lang(my), :lang(bn)) .ppop-label { line-height: 1.9; } /* 缅文叠在上下的符号比行高还高:不加高会被两行截断切掉一点 */
html:is(:lang(th), :lang(my), :lang(bn)) :is(.ppop-terms, .ppop-date, .ppop-later) { line-height: 1.6; }
html:is(:lang(th), :lang(my), :lang(bn)) .ppop-go { line-height: 1.5; }

/* 横屏 / 很矮的视窗(Telegram 全屏模式可以横着拿):卡片按高度缩得很小,几个 px 下限会让字放不进框;下限放低一点,交给 fitPromo 等比缩 */
@media (max-height: 480px) {
  .ppop-date { font-size: max(10px, calc(var(--u) * 4.3)); }
  html:not(:lang(zh)) .ppop-label { font-size: max(10px, calc(var(--u) * 4.4)); }
  .ppop-go { min-height: max(36px, calc(var(--u) * 13.4)); font-size: max(13px, calc(var(--u) * 6.4)); }
  .ppop-later { min-height: 20px; font-size: max(11px, calc(var(--u) * 4.4)); }
  .ppop-terms { font-size: max(9px, calc(var(--u) * 3.1)); }
  html:is(:lang(th), :lang(my), :lang(bn)) :is(.ppop-terms, .ppop-date, .ppop-later) { line-height: 1.4; }
  html:is(:lang(my), :lang(bn)) .ppop-label { line-height: 1.6; }
  html:is(:lang(th), :lang(my), :lang(bn)) .ppop-go { line-height: 1.3; }
}

/* ---------- 转盘弹窗(2026-11-01,概念 2「夜店奖品展示柜」)----------
 * 底图 wheel-card.webp 跟金卡同比例(1360×2048):上半奖品柜、柜顶小转盘、熊猫从左边探头;
 * 下半黑底量自原图:x 8%–92%、y 61%–96.5%,金条在 y≈60.6%。日期胶囊压在金条上,字叠在 x 12%–88%、y 64%–95.5%。
 */
.ppop--wheel .ppop-card { filter: drop-shadow(0 0 calc(var(--ppop-u) * 5) rgba(255, 120, 40, .26)); }
.ppop--wheel .ppop-x { left: calc(92% - 24px); top: calc(30.5% - 24px); }
.ppop-wdate {
  position: absolute; z-index: 2; left: 50%; top: 60.7%; transform: translate(-50%, -50%);
  max-width: 76%; margin: 0; padding: calc(var(--ppop-u) * 1.1) calc(var(--ppop-u) * 4.6);
  border-radius: 999px; background: linear-gradient(180deg, #f6ff92 0%, #e5ff3d 55%, #d3ec22 100%);
  color: #0a0a0a; font-size: max(12px, calc(var(--ppop-u) * 4.3)); font-weight: 800; line-height: 1.35; letter-spacing: .02em; white-space: nowrap;
  box-shadow: 0 0 0 calc(var(--ppop-u) * .5) #c99a2e, 0 0 calc(var(--ppop-u) * 4) rgba(229, 255, 61, .45), inset 0 1px 0 rgba(255, 255, 255, .6);
  overflow: hidden; text-overflow: ellipsis;
}
.ppop-wbody { left: 12%; right: 12%; top: 63.6%; bottom: 4.8%; justify-content: safe center; } /* 万一还是放不下:往下溢,不往上盖日期胶囊 */
.ppop-wbody::before { inset: 0 -8% 40%; }
.ppop-whead {
  flex: none; max-width: 100%; margin: 0; font: inherit; font-weight: 900;
  font-size: calc(var(--u) * 12.6); line-height: 1.12; letter-spacing: .01em; text-wrap: balance;
  background: linear-gradient(180deg, #fffbe6 6%, #ffe68a 30%, #f8c43a 54%, #d78a10 80%, #f0bb45 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 calc(var(--u) * .45) 0 #7a4705) drop-shadow(0 calc(var(--u) * .5) 0 #2b1802) drop-shadow(0 0 calc(var(--u) * 2.6) rgba(255, 186, 52, .5));
}
html:not(:lang(zh)) .ppop-whead { font-size: calc(var(--u) * 9); }
.ppop-wrule {
  flex: none; max-width: 100%; margin: calc(var(--u) * 1.8) 0 0; color: #fff;
  font-size: max(13px, calc(var(--u) * 4.5)); font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; text-wrap: balance;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .9);
}
.ppop-wamt {
  font-size: 1.32em; font-weight: 900; white-space: nowrap; font-variant-numeric: tabular-nums;
  text-shadow: none; filter: drop-shadow(0 1px 0 #6b3d04) drop-shadow(0 0 calc(var(--u) * 2) rgba(255, 186, 52, .45)); /* 父层的黑色字影会从透明字里透出来,金字改用 drop-shadow */
  background: linear-gradient(180deg, #fffbe6 6%, #ffe68a 34%, #f8c43a 60%, #d78a10 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
}
.ppop--wheel .ppop-go { margin-top: calc(var(--u) * 3.4); }
.ppop--wheel .ppop-later { margin-top: calc(var(--u) * 1.2); }
.ppop--wheel .ppop-terms { margin-top: calc(var(--u) * .6); }
html:is(:lang(th), :lang(my), :lang(bn)) :is(.ppop-wrule, .ppop-wdate) { line-height: 1.6; }
html:is(:lang(th), :lang(my), :lang(bn)) .ppop-whead { line-height: 1.45; }
/* 孟加拉文、缅文字高又长:标题、规则、流水那句都收小一号,不然最后一行会压到金框 */
html:is(:lang(my), :lang(bn)) .ppop-whead { font-size: calc(var(--u) * 7.6); }
html:is(:lang(my), :lang(bn)) .ppop-wrule { margin-top: calc(var(--u) * .8); font-size: max(11.5px, calc(var(--u) * 3.9)); line-height: 1.5; }
html:is(:lang(my), :lang(bn)) .ppop--wheel .ppop-go { margin-top: calc(var(--u) * 2.4); }
/* 矮屏(iPhone SE 这类):卡片按高度缩小,按钮之间的空隙收紧 */
@media (max-height: 700px) {
  .ppop--wheel .ppop-go { margin-top: calc(var(--u) * 2.4); }
  .ppop--wheel .ppop-later { min-height: 22px; margin-top: calc(var(--u) * .4); padding-block: calc(var(--u) * .8); }
  .ppop--wheel .ppop-terms { display: none; } /* 矮屏放不下就不放细则:按「立即充值」进去的充值页轮盘提示条写着门槛和流水 */
  .ppop-whead { font-size: calc(var(--u) * 10.4); }
  html:not(:lang(zh)) .ppop-whead { font-size: calc(var(--u) * 7.4); }
  html:is(:lang(my), :lang(bn)) .ppop-whead { font-size: calc(var(--u) * 6.4); }
  .ppop-wrule { margin-top: calc(var(--u) * .8); font-size: max(12px, calc(var(--u) * 4)); line-height: 1.35; }
}
@media (max-height: 480px) {
  .ppop-wdate { font-size: max(10px, calc(var(--ppop-u) * 4.3)); }
  .ppop-wrule { font-size: max(11px, calc(var(--u) * 4.5)); }
}

/* ---------- 新人红包弹窗(2026-11-02,老板选概念 1「红包炸开」)----------
 * 底图 newbie-card.webp 跟金卡同比例(960×1446):上半熊猫抓骰盅从红包封口探出来(那一块不放字),金边里的红色面板从 y 46.4% 起整片空着;
 * 字叠在安全区 x 14%–86%、y 48%–92%(量自原图,见 output/新人红包/asset);× 放在红色面板右上角里面(中心 x 89.5%、y 49.5%,外面有金币)。
 * 小标签「新人专享」压在封口和红色面板的接缝上(两种状态共用,不占框里的行),字从标签下缘排起。
 * 底是深红:大字金色渐层(照首充金卡)、说明奶白 #fff3d6、按钮照旧柠檬黄底黑字、小标签金底深红字。
 * 领取 / 已领两块都写在 markup 里,dialog 加 .is-claimed 切换;.is-already 换成「你已经领过新人红包」;.is-noplay 游戏进不去只给「稍后再玩」。
 */
.ppop--newbie {
  --nb-left: 14%; --nb-right: 14%; --nb-top: 48%; --nb-bottom: 8%;
  --nb-x: 89.5%; --nb-y: 49.5%;
  --nb-seam: 46.6%; /* 小标签的中线:封口和红色面板的接缝 */
  --nb-cream: #fff3d6;
}
.ppop--newbie .ppop-card { filter: drop-shadow(0 0 calc(var(--ppop-u) * 5) rgba(255, 70, 40, .26)); }
.ppop--newbie .ppop-x { left: calc(var(--nb-x) - 24px); top: calc(var(--nb-y) - 24px); }
.ppop--newbie .ppop-x::before {
  background: radial-gradient(circle at 50% 35%, #8e1010, #3d0404 72%);
  box-shadow: inset 0 0 0 2px #f1c45a, 0 0 0 2px rgba(60, 0, 0, .5), 0 2px 8px rgba(0, 0, 0, .55), 0 0 12px rgba(255, 190, 60, .3);
}
.ppop-nbody { left: var(--nb-left); right: var(--nb-right); top: calc(var(--nb-top) + var(--ppop-u) * 1.4); bottom: var(--nb-bottom); justify-content: safe center; }
.ppop-nbody::before { inset: 4% -10% 50%; } /* 金字后面那团金光收到标题那一带 */
.ppop-nbdone { display: none; }
.ppop--newbie.is-claimed .ppop-nbface { display: none; }
.ppop--newbie.is-claimed .ppop-nbdone { display: flex; }

/* 小标签「新人专享」:金底深红字,压在接缝上 */
.ppop-nbtag {
  position: absolute; z-index: 2; left: 50%; top: var(--nb-seam); transform: translate(-50%, -50%);
  max-width: 64%; margin: 0; padding: calc(var(--ppop-u) * .7) calc(var(--ppop-u) * 3.6);
  border-radius: 999px; background: linear-gradient(180deg, #fff3bf 0%, #f8cf5a 52%, #dc9d1e 100%);
  color: #7d0a0a; font-size: max(11px, calc(var(--ppop-u) * 3.7)); font-weight: 900; line-height: 1.35; letter-spacing: .08em; white-space: nowrap;
  box-shadow: 0 0 0 calc(var(--ppop-u) * .45) rgba(90, 0, 0, .45), 0 calc(var(--ppop-u) * .6) calc(var(--ppop-u) * 1.6) rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .7);
  overflow: hidden; text-overflow: ellipsis;
}
html:not(:lang(zh)) .ppop-nbtag { max-width: 70%; padding-inline: calc(var(--ppop-u) * 3); font-size: max(10.5px, calc(var(--ppop-u) * 3.4)); letter-spacing: .02em; }
/* 金字「送你 RM10」:中文一行;其他语言上面小字、下面大金额 */
.ppop-nbhead {
  flex: none; position: relative; display: flex; align-items: baseline; justify-content: center; gap: 0 .16em;
  max-width: 100%; margin: 0; font: inherit; font-weight: 900; line-height: 1.12; white-space: nowrap;
  font-size: min(calc(var(--u) * 12), calc(var(--u) * 58 / (3.6 + .62 * var(--nb-n, 2)))); /* --nb-n 金额字数:RM100、RM10.50 缩到右边碰不到 × */
}
.ppop-nbgive, .ppop-nbamt, .ppop-nbbig {
  display: block; font-weight: 900; letter-spacing: -.005em;
  background: linear-gradient(180deg, #fffbe6 6%, #ffe68a 30%, #f8c43a 54%, #d78a10 80%, #f0bb45 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 calc(var(--u) * .45) 0 #6e0606) drop-shadow(0 calc(var(--u) * .5) 0 #2b0202) drop-shadow(0 0 calc(var(--u) * 2.6) rgba(255, 186, 52, .45));
}
.ppop-nbamt, .ppop-nbbig { font-variant-numeric: tabular-nums; white-space: nowrap; }
html:not(:lang(zh)) .ppop-nbhead { flex-direction: column; align-items: center; gap: 0; white-space: normal; font-size: calc(var(--u) * 12.4); line-height: 1.08; }
html:not(:lang(zh)) .ppop-nbgive {
  max-width: 100%; font-size: max(12px, calc(var(--u) * 4.4)); font-weight: 800; line-height: 1.3; letter-spacing: .01em;
  background: none; color: #ffe9a6; -webkit-text-fill-color: currentColor; filter: none; text-shadow: 0 1px 2px rgba(60, 0, 0, .9);
  overflow-wrap: anywhere; text-wrap: balance;
}
html:not(:lang(zh)) .ppop-nbamt .ppop-cur, .ppop-nbbig .ppop-cur { font-size: .6em; margin-right: .06em; }
.ppop-nbgame {
  flex: none; max-width: 100%; margin: calc(var(--u) * .8) 0 0; color: var(--nb-cream);
  font-size: max(14px, calc(var(--u) * 5.8)); font-weight: 900; line-height: 1.25; letter-spacing: .02em; overflow-wrap: anywhere; text-wrap: balance;
  text-shadow: 0 1px 2px rgba(60, 0, 0, .85);
}
.ppop-nbline {
  flex: none; max-width: 100%; margin: calc(var(--u) * .4) 0 0; color: rgba(255, 243, 214, .92);
  font-size: max(11.5px, calc(var(--u) * 4)); font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; text-wrap: balance;
  text-shadow: 0 1px 2px rgba(60, 0, 0, .85);
}
html:not(:lang(zh)) .ppop-nbgame { font-size: max(13px, calc(var(--u) * 5)); }
html:not(:lang(zh)) .ppop-nbline { font-size: max(11px, calc(var(--u) * 3.6)); }
.ppop--newbie .ppop-go { margin-top: calc(var(--u) * 3); }
.ppop--newbie .ppop-later { margin-top: calc(var(--u) * 1); color: rgba(255, 236, 200, .8); }
.ppop--newbie .ppop-later:hover { color: #fff; }
.ppop--newbie .ppop-terms { margin-top: calc(var(--u) * .6); color: rgba(255, 236, 200, .7); font-size: max(10px, calc(var(--u) * 3)); line-height: 1.35; }
html:not(:lang(zh)) .ppop--newbie .ppop-go { font-size: max(14px, calc(var(--u) * 5.2)); } /* 外文按钮那句比较长 */
/* 按钮「领取中…」:按下去到回包这段;按钮不变灰,只是按不了 */
.ppop-nbbusy { display: none; }
.ppop-nbgo.is-busy .ppop-nbidle { display: none; }
.ppop-nbgo.is-busy .ppop-nbbusy { display: inline; }
.ppop-nbgo:disabled { cursor: default; }
.ppop-nbgo:disabled:not(.is-busy) { opacity: .55; }
/* 卡片里的错误那一行(toast 会被最顶层的 dialog 盖住);有错误时先不放细则,省一行 */
.ppop-nberr {
  flex: none; max-width: 100%; margin: calc(var(--u) * 1.4) 0 0; padding: calc(var(--u) * .8) calc(var(--u) * 3);
  border-radius: calc(var(--u) * 2); background: rgba(40, 0, 0, .55); box-shadow: inset 0 0 0 1px rgba(255, 210, 120, .35);
  color: var(--nb-cream); font-size: max(11px, calc(var(--u) * 3.5)); font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; text-wrap: balance;
}
.ppop--newbie.has-err .ppop-nbface .ppop-terms { display: none; }
/* 已领:「已存入余额」+ 大金额 +「去玩大话骰」 */
.ppop-nbok { flex: none; max-width: 100%; margin: 0; color: var(--nb-cream); font-size: max(14px, calc(var(--u) * 5.4)); font-weight: 900; line-height: 1.3; overflow-wrap: anywhere; text-wrap: balance; text-shadow: 0 1px 2px rgba(60, 0, 0, .85); }
.ppop-nbok-old { display: none; }
/* 最上面那行跟 × 同一个高度:收窄一点,长的外文折成两行也碰不到 × */
.ppop-nbok, html:not(:lang(zh)) .ppop-nbgive { max-width: 80%; }
.ppop--newbie.is-already .ppop-nbok-new { display: none; }
.ppop--newbie.is-already .ppop-nbok-old { display: inline; }
.ppop-nbbig { flex: none; max-width: 100%; margin: calc(var(--u) * .6) 0 0; font-size: calc(var(--u) * 18); line-height: 1.08; }
.ppop-nbshut { display: none; }
.ppop--newbie.is-noplay .ppop-nbplay, .ppop--newbie.is-noplay .ppop-nblater { display: none; }
.ppop--newbie.is-noplay .ppop-nbshut { display: flex; }
html:is(:lang(th), :lang(my), :lang(bn)) :is(.ppop-nbtag, .ppop-nbgame, .ppop-nbline, .ppop-nbok, .ppop-nberr, .ppop-nbgive) { line-height: 1.5; }
html:is(:lang(th), :lang(my), :lang(bn)) .ppop--newbie .ppop-terms { line-height: 1.5; }
/* 孟加拉文、缅文字高又长:小标签行高再加(它是 overflow: hidden,上下叠的符号会被切掉),说明两行收小一号 */
html:is(:lang(my), :lang(bn)) .ppop-nbtag { line-height: 1.8; padding-block: calc(var(--ppop-u) * .35); }
html:is(:lang(my), :lang(bn)) .ppop-nbgame { font-size: max(12.5px, calc(var(--u) * 4.6)); }
html:is(:lang(my), :lang(bn)) .ppop-nbline { font-size: max(10.5px, calc(var(--u) * 3.4)); }
/* 矮屏(iPhone SE 这类):卡片按高度缩小,空隙收紧 */
@media (max-height: 700px) {
  .ppop--newbie .ppop-go { margin-top: calc(var(--u) * 2.2); }
  .ppop--newbie .ppop-later { min-height: 24px; margin-top: calc(var(--u) * .4); padding-block: calc(var(--u) * .6); } /* 加上 ::before 往外补的 20px 刚好 44px */
}
/* 再矮(320 × 568 这类):几个 px 下限放低一点,外文那几行才收得进框里 */
@media (max-height: 600px) {
  .ppop--newbie .ppop-go { margin-top: calc(var(--u) * 1.4); }
  html:not(:lang(zh)) .ppop-nbhead { font-size: calc(var(--u) * 10.4); }
  html:not(:lang(zh)) .ppop-nbgive { font-size: max(10.5px, calc(var(--u) * 4.4)); line-height: 1.2; }
  html:not(:lang(zh)) .ppop-nbgame, html:is(:lang(my), :lang(bn)) .ppop-nbgame { margin-top: calc(var(--u) * .4); font-size: max(11.5px, calc(var(--u) * 5)); }
  html:not(:lang(zh)) .ppop-nbline, html:is(:lang(my), :lang(bn)) .ppop-nbline { font-size: max(10px, calc(var(--u) * 3.6)); line-height: 1.25; }
  .ppop--newbie .ppop-terms { margin-top: calc(var(--u) * .2); font-size: max(9px, calc(var(--u) * 3)); line-height: 1.25; }
  html:is(:lang(th), :lang(my), :lang(bn)) :is(.ppop-nbgame, .ppop-nbline, .ppop-nbgive) { line-height: 1.35; }
  html:is(:lang(th), :lang(my), :lang(bn)) .ppop--newbie .ppop-terms { line-height: 1.35; }
}
@media (max-height: 480px) {
  /* 横屏:卡片按高度缩到很小,按钮下限放低(跟首充金卡一样)、细则不放(提现页、领取后那块都写着) */
  .ppop--newbie .ppop-go { min-height: max(34px, calc(var(--u) * 12)); margin-top: calc(var(--u) * 1.2); font-size: max(12px, calc(var(--u) * 5.2)); }
  .ppop--newbie .ppop-later { min-height: 20px; padding-block: calc(var(--u) * .4); font-size: max(11px, calc(var(--u) * 4.2)); }
  .ppop--newbie .ppop-nbface .ppop-terms { display: none; }
  .ppop-nbtag { font-size: max(9.5px, calc(var(--ppop-u) * 3.7)); }
  html:not(:lang(zh)) .ppop-nbgive { font-size: max(10px, calc(var(--u) * 4.4)); }
  .ppop-nbgame, html:not(:lang(zh)) .ppop-nbgame { font-size: max(11px, calc(var(--u) * 5.4)); }
  .ppop-nbline, html:not(:lang(zh)) .ppop-nbline, .ppop-nberr { font-size: max(9.5px, calc(var(--u) * 3.6)); }
  .ppop--newbie .ppop-terms { font-size: max(9px, calc(var(--u) * 3)); }
  .ppop-nbok { font-size: max(11px, calc(var(--u) * 5.4)); }
  html:is(:lang(th), :lang(my), :lang(bn)) :is(.ppop-nbgame, .ppop-nbline, .ppop-nbok, .ppop-nberr, .ppop-nbgive) { line-height: 1.35; }
}
/* 领取失败那一行出来(has-err)、「你已经领过新人红包」(is-already):外文长句在矮屏 / 横屏缩到底也放不下,
 * fitPromo 最多缩到 0.72、字号的 px 下限又不跟着缩 → 矮屏先不放「赢了算你的」那句(错误那句更要紧),错误那句、已经领过那句收小一号 */
@media (max-height: 700px) {
  .ppop--newbie.has-err .ppop-nbline { display: none; }
  .ppop-nberr { margin-top: calc(var(--u) * 1); padding-block: calc(var(--u) * .6); font-size: max(10px, calc(var(--u) * 3.3)); line-height: 1.3; }
  html:not(:lang(zh)) .ppop--newbie.is-already .ppop-nbok { font-size: max(12px, calc(var(--u) * 4.6)); }
}
@media (max-height: 480px) {
  .ppop-nberr { margin-top: calc(var(--u) * .8); padding: calc(var(--u) * .4) calc(var(--u) * 2.4); font-size: max(9px, calc(var(--u) * 3.3)); line-height: 1.25; }
  html:not(:lang(zh)) .ppop--newbie.is-already .ppop-nbok { font-size: max(10px, calc(var(--u) * 4.4)); line-height: 1.25; }
  html:is(:lang(th), :lang(my), :lang(bn)) .ppop-nberr { line-height: 1.3; }
}

@media (prefers-reduced-motion: no-preference) {
  .ppop--newbie.is-claimed .ppop-nbbig { animation: ppop-nbpop .5s cubic-bezier(.18, 1.4, .4, 1) both; } /* 领到那一下金额跳出来 */
  .ppop[open] { animation: ppop-in .42s cubic-bezier(.18, 1.25, .4, 1) both; }
  .ppop[open]::backdrop, .ppop-scrim { animation: ppop-fade .22s ease-out both; }
  /* 主按钮慢慢呼吸,引导去按 */
  .ppop[open] .ppop-go { animation: ppop-glow 1.8s ease-in-out .5s infinite; }
}
@keyframes ppop-in { from { opacity: 0; transform: translateY(3%) scale(.86); } 60% { opacity: 1; } to { opacity: 1; transform: none; } }
@keyframes ppop-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ppop-nbpop { from { opacity: 0; transform: scale(.6); } 70% { opacity: 1; } to { opacity: 1; transform: none; } }
@keyframes ppop-glow {
  0%, 100% { box-shadow: 0 0 0 calc(var(--u) * .6) #c99a2e, 0 0 0 calc(var(--u) * 1) rgba(0, 0, 0, .6), 0 0 calc(var(--u) * 5) rgba(229, 255, 61, .35), inset 0 calc(var(--u) * .5) 0 rgba(255, 255, 255, .65), inset 0 calc(var(--u) * -.8) 0 rgba(120, 140, 0, .35); }
  50% { box-shadow: 0 0 0 calc(var(--u) * .6) #e2b544, 0 0 0 calc(var(--u) * 1) rgba(0, 0, 0, .6), 0 0 calc(var(--u) * 9) rgba(229, 255, 61, .6), inset 0 calc(var(--u) * .5) 0 rgba(255, 255, 255, .65), inset 0 calc(var(--u) * -.8) 0 rgba(120, 140, 0, .35); }
}

/* ---------- 新人红包活动说明(2026-11-04 老板「补活动说明」)----------
 * 细则那行后面一个「活动说明」(奶白底线小字);点开整张卡上盖一层深红黑的说明(dialog 里的一层,弹窗关了它也没了),
 * 字照 .nbr(style.css,「游戏」页的 sheet 共用)排,这里只管这一层的底、边框、捲动和「知道了」。
 */
.ppop-rulelink {
  display: inline; min-height: 0; margin: 0; padding: 0 .1em; border: 0; background: none;
  color: var(--nb-cream, #fff3d6); font: inherit; font-weight: 800; text-decoration: underline; text-underline-offset: .2em; cursor: pointer;
  position: relative; -webkit-tap-highlight-color: transparent;
}
.ppop-rulelink::before { content: ''; position: absolute; inset: -10px -6px; } /* 字很小:点按范围往外放 */
.ppop-rules {
  position: absolute; z-index: 6; inset: 6% 2% 2%;
  display: none; flex-direction: column;
  padding: calc(var(--ppop-u) * 5) calc(var(--ppop-u) * 5.4) calc(var(--ppop-u) * 4.6);
  border-radius: calc(var(--ppop-u) * 5);
  background: linear-gradient(180deg, rgba(58, 6, 6, .97) 0%, rgba(26, 3, 3, .98) 100%);
  box-shadow: inset 0 0 0 1.5px rgba(241, 196, 90, .85), 0 0 0 calc(var(--ppop-u) * .8) rgba(60, 0, 0, .55), 0 calc(var(--ppop-u) * 2) calc(var(--ppop-u) * 8) rgba(0, 0, 0, .6);
  overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  -webkit-user-select: text; user-select: text;
}
.ppop.is-rules .ppop-rules { display: flex; }
.ppop.is-rules .ppop-x { visibility: hidden; } /* 说明盖着时 × 只会误按到底下:收说明用「知道了」/ 返回键 */
.ppop-rules .nbr { --nbr-gold: #ffe08a; --nbr-text: #fff3d6; display: flex; flex-direction: column; flex: 1 0 auto; }
.ppop-rules .nbr-ok {
  flex: none; align-self: stretch; margin-top: auto; padding: calc(var(--ppop-u) * 2.6) 0; min-height: 44px;
  border: 0; border-radius: 999px; background: linear-gradient(180deg, #f6ff92 0%, #e5ff3d 55%, #d3ec22 100%);
  color: #0a0a0a; font: inherit; font-size: max(14px, calc(var(--ppop-u) * 4.6)); font-weight: 900; cursor: pointer;
  box-shadow: 0 0 calc(var(--ppop-u) * 4) rgba(229, 255, 61, .35), inset 0 1px 0 rgba(255, 255, 255, .6);
}
