/* 大厅活动横幅(.bnp,2026-10-30 老板选 A 版,11/1 起;画法在 lobby-promo.js,文案在 lobby-promo-locales.js)。
   跟大厅「主推游戏横幅」(.bn-banner-game)同一个位置、同一个高度;字是程序叠的,会动的东西全部是 CSS 画的,只用 transform / opacity。
   只有正在看的那张(.is-on)会动,整张滑出画面(.is-gone)动画拿掉;弹窗打开、大厅被盖住时暂停;系统开「减少动态效果」整组不动。
   位置单位:.bnp-art 里一律用「底图的 %」,不管横幅多宽,动效都对准图上的东西。
   设计稿和预览:output/大厅横幅-11.1/(banner.css 改了要同步到这里)。 */

/* 横幅自带的三套字(子集,OFL,授权在同一个资料夹):汉字只含横幅标题那几个字,外语标题照系统字;档名带版本,/img 有一年快取 */
@font-face { font-family: 'PA Banner Num'; font-style: normal; font-weight: 800; font-display: swap; src: url('/img/dk/banner-1101/fonts/pa-banner-num-800-v1.woff') format('woff'); }
@font-face { font-family: 'PA Banner Serif'; font-style: normal; font-weight: 900; font-display: swap; unicode-range: U+0020, U+5750, U+5E84, U+738B; src: url('/img/dk/banner-1101/fonts/pa-banner-serif-900-v1.woff') format('woff'); }
@font-face { font-family: 'PA Banner Sans'; font-style: normal; font-weight: 900; font-display: swap; unicode-range: U+0020, U+5E78, U+8FD0, U+8F6E, U+8F6C, U+76D8, U+9AB0, U+738B, U+9996, U+5145, U+518D, U+9001; src: url('/img/dk/banner-1101/fonts/pa-banner-sans-900-v1.woff') format('woff'); }

/* cqi 单位要有容器:横幅区块就是容器(手机上等于屏宽,电脑版最宽 520) */
.bn-banner.is-games { container-type: inline-size; }
/* 每张照自己的字撑高(不被轮播里最高那张撑大,不然底图跟着放大、主角往左跑压到字);矮的那张下面接页面底色 */
.bnp { align-self: flex-start; }
/* 轮播圆点压矮、贴底,别盖到按钮下缘 */
.bn-banner.is-promo .bn-banner-controls { inset: auto 0 0; }
.bn-banner.is-promo .bn-banner-controls button { height: 20px; min-height: 20px; }
.bnp {
  --gold: linear-gradient(180deg, #fffbe0 0%, #ffe7a0 22%, #ffc94a 48%, #e09a22 70%, #ffdf8a 100%);
  --f1: 26%; --f2: 46%; --fade-end: 68%; --fade-t: 14%; --fade-b: 66%;
  --title-fill: #fff; --title-shadow: drop-shadow(0 2px 8px rgba(0, 0, 0, .6));
  --tag-bg: var(--neon); --tag-ink: var(--neon-ink); --tag-line: transparent;
  --cta-bg: var(--neon); --cta-ink: var(--neon-ink);
  --acc: var(--neon);
  --title-max: .44; /* 标题最宽占横幅几成(外语长就缩字,见 fitPromoTitles) */
}
.bnp::before { background: linear-gradient(90deg, var(--bg) 0%, rgba(10, 10, 10, .84) var(--f1), rgba(10, 10, 10, .36) var(--f2), rgba(10, 10, 10, 0) var(--fade-end)); }
.bnp::after { background: linear-gradient(180deg, var(--bg) 0%, rgba(10, 10, 10, 0) var(--fade-t), rgba(10, 10, 10, 0) var(--fade-b), var(--bg) 100%); }

/* 底图框:高度 = 横幅高度、宽高比 = 底图,靠右;--ax/--ay 平移(%)、--as 缩放(以右边中点为准) */
.bnp-art { position: absolute; top: 0; right: 0; height: 100%; aspect-ratio: 1536 / 658; z-index: -2; pointer-events: none;
  transform-origin: 100% 50%; transform: translate(var(--ax, 0%), var(--ay, 0%)) scale(var(--as, 1)); }
.bnp-art > img { display: block; width: 100%; height: 100%; }
/* 缩小过的底图上下会露出图边:上下各淡出一截 */
.bnp-art.is-inset { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%); }
/* 电脑版(页面最宽 520)横幅两边不是屏幕边缘:左右都淡出,缩小过的底图左边也不会露出图框 */
@media (min-width: 521px) {
  .bnp-art { -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 82%, transparent); mask-image: linear-gradient(90deg, transparent, #000 14%, #000 82%, transparent); }
  .bnp-art.is-inset { -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 82%, transparent), linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%); -webkit-mask-composite: source-in;
    mask-image: linear-gradient(90deg, transparent, #000 14%, #000 82%, transparent), linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%); mask-composite: intersect; }
}
/* 窄屏:底图再缩一点(以右边中点为准,主角往右让),字才不压到轮盘 / 奖杯 / 骰盅 / 30;缩小后上下一样淡出 */
@container (max-width: 400px) { .bnp-wheel .bnp-art { scale: .9; } }
@container (max-width: 340px) {
  .bnp-wheel .bnp-art { scale: .86; }
  .bnp-niu .bnp-art, .bnp-duel .bnp-art, .bnp-first .bnp-art { scale: .88; }
  .bnp-niu .bnp-art, .bnp-duel .bnp-art { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%); }
  .bnp-first { --title-min: 15 !important; --title-max: .46 !important; }
  /* 主角往右让了,字栏可以宽一点(外语按钮 / 标题放得下) */
  .bnp.bnp-niu, .bnp.bnp-duel { --copy-max: .44; --title-max: .47; } /* 写在各张设定前面,要多一层 .bnp 才盖得过 */
  .bnp.bnp-wheel { --title-min: 17; --title-max: .48; }
}

/* ---------- 字 ---------- */
/* 比主推游戏横幅紧一点:四张一样高(约 184px),底图框跟着窄,角色不会被字压到 */
.bnp .bn-banner-copy { gap: 4px; min-height: clamp(168px, 44vw, 206px); min-height: clamp(168px, 44cqi, 206px); padding: 12px 0 20px var(--pad);
  max-width: calc(var(--copy-max, .62) * 100vw + var(--pad)); max-width: calc(var(--copy-max, .62) * 100cqi + var(--pad)); }
.bnp .bn-banner-copy > .bnp-tag { background: var(--tag-bg); color: var(--tag-ink); box-shadow: inset 0 0 0 1px var(--tag-line); height: 22px; padding: 0 9px; font: 700 11px/1 var(--sans); letter-spacing: .02em; }
.bnp .bnp-title { margin: 2px 0 0; font-size: clamp(30px, 9.6vw, 42px); font-size: clamp(30px, 9.6cqi, 42px); font-weight: 900; line-height: 1.04; letter-spacing: .02em; text-shadow: none; white-space: nowrap; }
.bnp-title > span { display: inline-block; padding: .04em .06em .08em 0; filter: var(--title-shadow);
  background-image: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, .95) 50%, transparent 60%), var(--title-fill-img, linear-gradient(var(--title-fill), var(--title-fill)));
  background-size: 260% 100%, 100% 100%; background-repeat: no-repeat; background-position: 100% 0, 0 0;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: bnp-shine 1.38s ease-in-out 2.39s 1 both; }
.bnp .bnp-line { margin: 0; color: #ececec; font: 600 12px/1.38 var(--sans); text-shadow: 0 1px 4px rgba(0, 0, 0, .95); }
.bnp .bnp-line b { color: var(--acc); font-weight: 800; }
.bnp-num { font-family: "PA Banner Num", "DIN Condensed", "Arial Narrow", var(--sans); font-weight: 800; letter-spacing: .01em; font-variant-numeric: tabular-nums; }
.bnp .bnp-amount { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px 6px; color: #f3e6c4; font: 700 12px/1 var(--sans); text-shadow: 0 1px 4px rgba(0, 0, 0, .95); }
.bnp .bnp-amount .bnp-num { white-space: nowrap; font-size: clamp(22px, 6.6vw, 26px); font-size: clamp(22px, 6.6cqi, 26px); line-height: .95; background: var(--gold); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .75)) drop-shadow(0 2px 6px rgba(0, 0, 0, .6)); }
.bnp .bnp-fine { margin: 0; white-space: nowrap; color: rgba(255, 244, 214, .72); font: 500 10px/1.3 var(--sans); text-shadow: 0 1px 3px rgba(0, 0, 0, .95); }
.bnp .bn-banner-cta.bnp-cta { white-space: nowrap; margin-top: 2px; min-height: 36px; padding: 0 11px 0 15px; background: var(--cta-bg); color: var(--cta-ink); font-size: 13.5px; box-shadow: 0 4px 14px rgba(0, 0, 0, .45); }
/* 日期用西文字(中文字体的「–」会像「一」),中间一颗小圆点分开 */
.bnp-date { font-family: "PA Banner Num", "Helvetica Neue", Arial, sans-serif; font-weight: 800; font-size: 1.14em; letter-spacing: .03em; }
.bnp-sep { display: inline-block; width: 3px; height: 3px; margin: 0 6px; border-radius: 50%; background: currentColor; opacity: .7; vertical-align: middle; }
.bnp .bn-banner-cta.bnp-cta:hover { color: var(--cta-ink); }

/* ---------- 每个活动自己的世界 ---------- */
/* 幸运转盘:黑 + 柠檬黄(跟 App 转盘页同色) */
.bnp-wheel { --acc: #edfb31; --title-shadow: drop-shadow(0 0 14px rgba(237, 251, 49, .28)) drop-shadow(0 2px 6px rgba(0, 0, 0, .7)); }
.bnp-wheel .bnp-line b { font-size: 1.42em; } /* 跟着整行缩字 */
.bnp-wheel .bnp-title { font-size: clamp(28px, 8.6vw, 38px); font-size: clamp(28px, 8.6cqi, 38px); }
/* 牛牛坐庄王:绯红 + 金,宋体黑 */
.bnp-niu, .bnp-duel { --copy-max: .38; }
.bnp-niu { --acc: #ffd98a; --title-fill-img: var(--gold); --title-shadow: drop-shadow(0 2px 0 #5c0a0a) drop-shadow(0 3px 10px rgba(0, 0, 0, .7));
  --tag-bg: linear-gradient(180deg, #a5161a, #5e0708); --tag-ink: #ffe7a6; --tag-line: rgba(240, 190, 90, .85);
  --cta-bg: linear-gradient(180deg, #fff1bd, #ffcc58 55%, #e19a2a); --cta-ink: #5a0606; }
.bnp-niu .bnp-title { font-family: "PA Banner Serif", "Songti SC", "STSong", serif; letter-spacing: .06em; }
/* 大话骰骰王:暗紫 + 金,黑体斜切 */
.bnp-duel { --acc: #ffd98a; --title-fill-img: var(--gold); --title-shadow: drop-shadow(0 2px 0 #2a0850) drop-shadow(0 3px 12px rgba(80, 10, 140, .55));
  --tag-bg: linear-gradient(180deg, #4c1590, #23073f); --tag-ink: #f0ddff; --tag-line: rgba(240, 190, 90, .85);
  --cta-bg: linear-gradient(180deg, #fff1bd, #ffcc58 55%, #e19a2a); --cta-ink: #2a0850; }
.bnp-duel .bnp-title { font-family: "PA Banner Sans", var(--sans); letter-spacing: .04em; }
.bnp-duel .bnp-title > span { transform: skewX(-9deg); transform-origin: 0 100%; padding-right: .2em; } /* 以左下角斜切,右上角凸出的那截留在 padding 里 */
/* 首充送 30:黑 + 暖金 */
.bnp-first { --title-max: .5; --acc: #ffd98a; --tag-bg: rgba(20, 14, 4, .7); --tag-ink: #ffd98a; --tag-line: rgba(255, 210, 120, .9);
  --cta-bg: linear-gradient(180deg, #fff1bd, #ffcc58 55%, #e19a2a); --cta-ink: #1a1203; }
.bnp-first .bnp-title { font-family: "PA Banner Sans", var(--sans); font-size: clamp(24px, 7vw, 30px); font-size: clamp(24px, 7cqi, 30px); line-height: 1.06; letter-spacing: .02em; }
.bnp-first .bnp-title > span { display: block; }
.bnp-first .bnp-lbl { font-size: .66em; letter-spacing: 0; }
.bnp-first .bnp-title .bnp-num { font-size: 1.22em; line-height: .9; margin-inline-start: .14em; background: var(--gold); -webkit-background-clip: text; background-clip: text; color: transparent; }
.bnp-first .bnp-title > span { background-image: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, .55) 50%, transparent 60%), linear-gradient(#fff, #fff); }
.bnp-wheel .bnp-title { font-family: "PA Banner Sans", var(--sans); }

/* ---------- 动效:基本 ---------- */
.fx { position: absolute; left: var(--x); top: var(--y); pointer-events: none; }
.bnp .fx, .bnp .fx *, .bnp .fx::before, .bnp .fx::after, .bnp .bnp-title > span { animation-play-state: paused; }
.bnp.is-on .fx, .bnp.is-on .fx *, .bnp.is-on .fx::before, .bnp.is-on .fx::after, .bnp.is-on .bnp-title > span { animation-play-state: running; }
@keyframes bnp-shine { from { background-position: 100% 0, 0 0; } to { background-position: 0% 0, 0 0; } }
/* 整张滑出画面:动画整个拿掉、粒子藏起来(暂停的动画还会占显卡图层) */
.bnp.is-gone .fx, .bnp.is-gone .fx *, .bnp.is-gone .fx::before, .bnp.is-gone .fx::after, .bnp.is-gone .bnp-title > span { animation-name: none; }
.bnp.is-gone .fx-move { visibility: hidden; }

/* 转盘盘面:12 格 + 奖品,6 秒一轮 = 大厅轮播一张的时间;转 3 圈正好停回 iPhone 18 Pro Max(第一格) */
.fx-wheel { width: var(--d); aspect-ratio: 1; margin: calc(var(--d) / -2) 0 0 calc(var(--d) / -2); }
.fx-wheel > svg { display: block; width: 100%; height: 100%; overflow: visible; animation: bnp-spin 6s infinite; }
@keyframes bnp-spin { 0% { transform: rotate(0deg); animation-timing-function: cubic-bezier(.34, .04, .14, 1); } 70%, 100% { transform: rotate(1080deg); } }
.fx-gloss { width: var(--d); aspect-ratio: 1; margin: calc(var(--d) / -2) 0 0 calc(var(--d) / -2); border-radius: 50%;
  background: radial-gradient(circle, transparent 0 84%, rgba(0, 0, 0, .28) 95%, rgba(0, 0, 0, .55) 100%), radial-gradient(ellipse 60% 45% at 34% 24%, rgba(255, 255, 255, .16), transparent 70%); }
/* 灯泡跑马:单双号交替亮 */
.fx-bulb { width: 2.7%; aspect-ratio: 1; margin: -1.35% 0 0 -1.35%; border-radius: 50%;
  background: radial-gradient(circle, #fffef2 0 16%, rgba(255, 238, 160, .9) 30%, rgba(255, 196, 70, .32) 52%, transparent 70%); animation: bnp-bulb .9s steps(1, end) infinite; }
.fx-bulb.is-odd { animation-delay: -.45s; }
@keyframes bnp-bulb { 0% { opacity: 1; } 50% { opacity: 0; } }
/* 停下那一刻指针爆亮 */
.fx-flash { width: 10%; aspect-ratio: 1; margin: -5% 0 0 -5%; border-radius: 50%; opacity: 0;
  background: radial-gradient(circle, rgba(255, 255, 236, .95) 0 9%, rgba(237, 251, 49, .55) 30%, transparent 66%); animation: bnp-flash 6s infinite; }
@keyframes bnp-flash { 0%, 69% { opacity: 0; transform: scale(.4); } 73% { opacity: 1; transform: scale(1.15); } 88%, 100% { opacity: 0; transform: scale(1.7); } }

/* 转盘中心爆光 + 慢慢转的光芒 */
.fx-burst { width: var(--w, 16%); aspect-ratio: 1; margin: calc(var(--w, 16%) / -2) 0 0 calc(var(--w, 16%) / -2); border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 240, .95) 0 10%, rgba(255, 226, 120, .55) 32%, transparent 68%); animation: bnp-pulse 1.5s ease-out infinite; }
@keyframes bnp-pulse { 0% { transform: scale(.55); opacity: .95; } 100% { transform: scale(1.25); opacity: .15; } }
.fx-rays { width: var(--w, 48%); aspect-ratio: 1; margin: calc(var(--w, 48%) / -2) 0 0 calc(var(--w, 48%) / -2); border-radius: 50%;
  background: repeating-conic-gradient(from 0deg, rgba(255, 240, 170, .26) 0deg 5deg, transparent 5deg 18deg);
  -webkit-mask-image: radial-gradient(circle, #000 8%, transparent 64%); mask-image: radial-gradient(circle, #000 8%, transparent 64%); animation: bnp-turn 22s linear infinite; }
@keyframes bnp-turn { to { transform: rotate(360deg); } }

/* 奖品从转盘中心飞出来再浮着(--fx/--fy:从目标点回到中心的位移,单位是奖品自己的宽) */
.fx-prize { width: var(--w); aspect-ratio: 1; margin: calc(var(--w) / -2) 0 0 calc(var(--w) / -2); animation: bnp-fly 6s cubic-bezier(.18, .9, .26, 1.12) var(--dl, 0s) infinite backwards; }
.fx-prize > i { display: block; width: 100%; height: 100%; animation: bnp-bob 2.6s ease-in-out var(--dl, 0s) infinite alternate backwards; }
.fx-prize img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 0 6px rgba(255, 228, 120, .55)) drop-shadow(0 5px 6px rgba(0, 0, 0, .55)); }
@keyframes bnp-fly { 0% { transform: translate(var(--fx), var(--fy)) scale(.12) rotate(0deg); opacity: 0; } 5% { opacity: 1; }
  22%, 90% { transform: translate(0, 0) scale(1) rotate(var(--r, 0deg)); opacity: 1; } 100% { transform: translate(0, 0) scale(1.06) rotate(var(--r, 0deg)); opacity: 0; } }
@keyframes bnp-bob { from { transform: translateY(-5%); } to { transform: translateY(5%); } }

/* 往下飘的东西(红包 / 彩纸):外层直落,里层左右晃 */
.fx-fall { top: -14%; height: 100%; width: var(--w); animation: bnp-fall var(--t, 7s) linear infinite var(--dl, 0s); }
.fx-fall > i { display: block; width: 100%; animation: bnp-sway calc(var(--t, 7s) / 3) ease-in-out infinite alternate var(--dl, 0s); }
@keyframes bnp-fall { from { transform: translateY(0); } to { transform: translateY(130%); } }
@keyframes bnp-sway { from { transform: translateX(-40%) rotate(-26deg); } to { transform: translateX(40%) rotate(24deg); } }
.bnp-env { aspect-ratio: 2 / 3; border-radius: 12%;
  background: radial-gradient(circle at 50% 38%, #ffe08a 0 12%, #c88f1e 14%, transparent 16.5%), linear-gradient(165deg, #f04545 0%, #c4141b 55%, #840a10 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 210, 120, .8), 0 2px 5px rgba(0, 0, 0, .5); }
.bnp-conf { aspect-ratio: 3 / 5; border-radius: 1px; background: linear-gradient(135deg, #fff3b8, #ffcf52 50%, #c98a1c); }
.fx-fall > i.bnp-conf { animation-name: bnp-flutter; animation-duration: 1.3s; animation-timing-function: linear; animation-direction: normal; }
@keyframes bnp-flutter { from { transform: rotate3d(1, .5, .2, 0deg); } to { transform: rotate3d(1, .5, .2, 360deg); } }

/* 金币:往上弹再落下(--dx 横移、--up 最高点,单位是金币自己的宽)。零件 class 一律带 bnp- 前缀:以前叫 .coin,撞到翻硬币整页 <section class="coin">,整页被画成一枚圆金币 */
.bnp-coin { display: block; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle, transparent 0 50%, rgba(140, 80, 6, .6) 53%, rgba(255, 236, 160, .5) 57%, transparent 60%),
    radial-gradient(circle at 34% 28%, #fffbe2 0 7%, #ffe07a 22%, #f0b437 50%, #c47e14 78%, #8a540a 100%);
  box-shadow: inset 0 0 0 1.5px rgba(255, 244, 196, .85), inset 0 -2px 0 2px rgba(120, 70, 4, .45), 0 2px 0 #8a540a, 0 4px 6px rgba(0, 0, 0, .55), 0 0 8px rgba(255, 200, 80, .35); }
.fx-pop { width: var(--w); margin-left: calc(var(--w) / -2); animation: bnp-popx var(--t, 2.8s) linear infinite var(--dl, 0s); }
.fx-pop > b { display: block; animation: bnp-popy var(--t, 2.8s) infinite var(--dl, 0s); }
.fx-pop .bnp-coin { animation: bnp-flip calc(var(--t, 2.8s) / 3) linear var(--dl, 0s) infinite; }
@keyframes bnp-popx { from { transform: translateX(0); } to { transform: translateX(var(--dx)); } }
@keyframes bnp-popy { 0% { transform: translateY(0) scale(.5); opacity: 0; animation-timing-function: cubic-bezier(.2, .75, .4, 1); } 8% { opacity: 1; }
  44% { transform: translateY(var(--up)) scale(1); animation-timing-function: cubic-bezier(.55, 0, .85, .4); } 92% { opacity: 1; } 100% { transform: translateY(var(--down, 40%)) scale(1); opacity: 0; } }
@keyframes bnp-flip { to { transform: rotateY(360deg); } }

/* 闪光(四角星 + 光晕) */
.fx-spark { width: var(--w, 4%); aspect-ratio: 1; margin: calc(var(--w, 4%) / -2) 0 0 calc(var(--w, 4%) / -2); border-radius: 50%; opacity: 0;
  background: radial-gradient(circle, rgba(255, 250, 220, .9) 0 6%, rgba(255, 220, 120, .35) 22%, transparent 46%); animation: bnp-spark var(--t, 3s) ease-in-out infinite var(--dl, 0s); }
.fx-spark::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle, #fff 0 14%, #fff3c0 34%, rgba(255, 220, 120, 0) 70%);
  clip-path: polygon(50% 0, 56% 44%, 100% 50%, 56% 56%, 50% 100%, 44% 56%, 0 50%, 44% 44%); }
@keyframes bnp-spark { 0%, 62% { transform: scale(0) rotate(0deg); opacity: 0; } 74% { transform: scale(1) rotate(40deg); opacity: 1; } 90%, 100% { transform: scale(0) rotate(90deg); opacity: 0; } }

/* 一道光扫过(腰带 / 30):框住那块,光带从左扫到右 */
.fx-sheen { width: var(--w); height: var(--h); overflow: hidden; border-radius: var(--rad, 30%);
  -webkit-mask-image: radial-gradient(closest-side, #000 55%, transparent 100%); mask-image: radial-gradient(closest-side, #000 55%, transparent 100%); }
.fx-sheen::before { content: ''; position: absolute; top: -10%; left: 0; width: 55%; height: 120%;
  background: linear-gradient(100deg, transparent 22%, rgba(255, 252, 228, .55) 50%, transparent 78%); transform: translateX(-130%) skewX(-12deg);
  animation: bnp-sheen var(--t, 3.8s) ease-in-out infinite var(--dl, 0s); }
@keyframes bnp-sheen { 0%, 48% { transform: translateX(-130%) skewX(-12deg); } 80%, 100% { transform: translateX(260%) skewX(-12deg); } }

/* 舞台灯(大话骰):从上面打下来左右摇 */
.fx-beam { top: -8%; width: var(--w, 10%); height: 120%; margin-left: calc(var(--w, 10%) / -2); transform-origin: 50% 0; opacity: .5;
  background: linear-gradient(180deg, rgba(214, 150, 255, .6), rgba(170, 90, 255, .14) 58%, transparent 86%);
  clip-path: polygon(44% 0, 56% 0, 100% 100%, 0 100%); animation: bnp-beam 6.5s ease-in-out infinite alternate var(--dl, 0s); }
@keyframes bnp-beam { from { transform: rotate(var(--a1, -16deg)); } to { transform: rotate(var(--a2, 14deg)); } }

/* 骰盅砸下去的冲击波 */
.fx-ring { width: var(--w, 34%); aspect-ratio: 4 / 1; margin: calc(var(--w, 34%) / -8) 0 0 calc(var(--w, 34%) / -2); border-radius: 50%; opacity: 0;
  border: 2px solid rgba(255, 228, 150, .95); box-shadow: 0 0 10px 2px rgba(255, 190, 70, .7), inset 0 0 8px rgba(255, 210, 120, .6);
  animation: bnp-ring 1.8s cubic-bezier(.12, .6, .3, 1) infinite var(--dl, 0s); }
@keyframes bnp-ring { 0% { transform: scale(.22); opacity: 0; } 10% { opacity: 1; } 100% { transform: scale(1.25); opacity: 0; } }

/* 吊灯光圈呼吸(牛牛 B) */
.fx-glow { width: var(--w, 20%); aspect-ratio: 2 / 1; margin: calc(var(--w, 20%) / -4) 0 0 calc(var(--w, 20%) / -2); border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255, 214, 130, .5), transparent 68%); animation: bnp-breathe 3.2s ease-in-out infinite alternate; }
@keyframes bnp-breathe { from { opacity: .25; transform: scale(.92); } to { opacity: .85; transform: scale(1.05); } }

@media (prefers-reduced-motion: reduce) {
  .bnp .fx-move:not(.fx-prize), .bnp .fx-bulb, .bnp .fx-flash, .bnp .fx-spark, .bnp .fx-ring { display: none; }
  .bnp .fx, .bnp .fx *, .bnp .fx::before, .bnp .bnp-title > span { animation: none !important; }
  .bnp .fx-prize { transform: rotate(var(--r, 0deg)); }
  .bnp .fx-burst { opacity: .45; transform: scale(.8); }
  .bnp .fx-glow { opacity: .6; }
}

/* ---------- 外语排版 ---------- */
/* 两行的标题(越南文轮盘名) */
.bnp .bnp-title.is-2l { font-size: clamp(20px, 6vw, 24px); font-size: clamp(20px, 6cqi, 24px); line-height: 1.06; }
/* 越南文叠声调、泰 / 缅 / 孟上下标:金字是 background-clip 画的,行高太紧会切掉;泰文字距一定要 0(不然声调会飘) */
.bnp .bn-banner-copy:is(:lang(vi), :lang(th), :lang(my), :lang(bn)) .bnp-title { line-height: 1.22; }
.bnp .bn-banner-copy:is(:lang(vi), :lang(th), :lang(my), :lang(bn)) .bnp-title > span { padding-top: .14em; }
.bnp .bn-banner-copy:is(:lang(th), :lang(my), :lang(bn)) :is(.bnp-title, .bnp-tag, .bnp-line, .bnp-amount) { letter-spacing: 0; }
/* 孟 / 缅文字高:标签不能固定 22px;行距本来就高,字块间距收一点,横幅别比别的语言高太多 */
.bnp .bn-banner-copy:is(:lang(my), :lang(bn)) { gap: 2px; }
.bnp .bn-banner-copy:is(:lang(my), :lang(bn)) .bnp-fine { line-height: 1.2; }
.bnp .bn-banner-copy:is(:lang(my), :lang(bn)) > .bnp-tag { height: auto; min-height: 22px; padding-block: 2px; line-height: 1.5; }

/* ---------- 大厅被盖住时暂停(弹窗 / 德州开桌把 #shell 设成 inert) ---------- */
html.sheet-open .bnp :is(.fx, .fx *, .bnp-title > span), html.sheet-open .bnp .fx::before, html.sheet-open .bnp .fx::after,
#shell[inert] .bnp :is(.fx, .fx *, .bnp-title > span), #shell[inert] .bnp .fx::before, #shell[inert] .bnp .fx::after { animation-play-state: paused; }
/* 进群弹窗这类挂在 body 上的 <dialog>(没有 :has 的旧内核整条忽略,不影响上面那条) */
html:has(dialog[open]) .bnp :is(.fx, .fx *, .bnp-title > span), html:has(dialog[open]) .bnp .fx::before, html:has(dialog[open]) .bnp .fx::after { animation-play-state: paused; }