/*
 * 三角洲行动 · 黑鹰网吧特权（tab4）
 *
 * 上半部分 = 使用者仓库里的 public/wangba.css，原样保留（弹窗遮罩、移动端适配等）。
 * 下半部分 = 登录弹窗与昵称展示，是为"扫码登录换成本机 qq-auth-desk"新增的。
 *
 * 单位说明：官方 index.css 用的是 rem，且 html 根字号 = 100 × (视口宽 / 3840)，
 * 也就是 1rem = 设计稿 100px。所以这里的尺寸都按「设计稿 px ÷ 100」写 rem，
 * 才能跟页面其它元素一起等比缩放。
 */

/* ==========================================================================
   以下来自使用者仓库的 wangba.css（原样保留）
   ========================================================================== */

/*
 * 官方 index.css 的 @font-face 没有写 font-display，默认是 block：
 * 字体下载期间文字整段隐藏（最长 3 秒），字体一到又突然冒出来 ——
 * 这就是「倒计时得过 1 秒左右才渲染完、样式突然一下子变了」的根因。
 * 这里覆盖成 swap：先用系统字体立即显示，字体就绪后再无缝换字形，
 * 不再有整段空白的闪烁。
 */
@font-face {
  font-family: 'zsct';
  font-display: swap;
  src: url(https://game.gtimg.cn/images/dfm/cp/a20260821wangba/zsct.ttf);
}
@font-face {
  font-family: 'zst';
  font-display: swap;
  src: url(https://game.gtimg.cn/images/dfm/cp/a20260821wangba/zst.ttf);
}
@font-face {
  font-family: 'sjzt';
  font-display: swap;
  src: url(https://game.gtimg.cn/images/dfm/cp/a20260821wangba/sjzt.ttf);
}
@font-face {
  font-family: 'fzlth';
  font-display: swap;
  src: url(https://game.gtimg.cn/images/dfm/cp/a20260821wangba/fzlth.ttf);
}

.modal-scrim {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  background: rgb(0 0 0 / 78%);
}

.modal-scrim[hidden],
.modal-scrim [hidden] {
  display: none !important;
}

.modal-scrim .pop {
  display: block;
  flex: 0 0 auto;
}

.modal-scrim .pop_close {
  cursor: pointer;
}

.modal-scrim [data-close],
.btn_rule,
.btn_lqjl,
.btn_ljlq,
.btn_wwc {
  cursor: pointer;
}

.tab4 .btn_ljlq.gray {
  pointer-events: none;
  cursor: default;
}

.tab4 .time_box li:last-child em small {
  margin: 0 0.025rem 0 0.05rem;
  font-size: 0.17rem;
  vertical-align: 0.03rem;
}

.modal-scrim .table_box {
  overflow: auto;
}

@media (max-width: 760px) {
  html { font-size: 16px !important; }
  body { overflow-x: hidden; }
  .wrap.tab4 {
    width: 100%;
    height: auto;
    min-height: 100svh;
    padding: 0 0 24px;
    background-size: auto 100%;
    background-position: center top;
  }
  .tab4 .logo_box {
    top: 13px;
    left: 12px;
    width: auto;
    gap: 10px;
  }
  .tab4 .btn_logo { width: 72px; height: 19px; }
  .tab4 .btn_logo2 { width: 88px; height: 24px; }
  .tab4 .btn_logo3 { width: 66px; height: 19px; }
  .tab4 .login_top { top: 48px; right: 14px; }
  .login-box { font-size: 11px; }
  .tab4 .btn_rule { top: 71px; right: 14px; font-size: 11px; }
  .tab4 .time_cont {
    position: relative;
    top: auto;
    left: auto;
    width: calc(100% - 28px);
    height: 170px;
    margin: 84px 14px 0;
  }
  .tab4 .time_txt1 { margin-left: 18px; font-size: 12px; }
  .tab4 .time_box { width: 220px; height: 52px; margin: 24px 0 0 16px; }
  .tab4 .time_box li { width: 62px; height: 52px; }
  .tab4 .time_box li span { font-size: 34px; line-height: 52px; }
  .tab4 .time_box li em { right: 2px; bottom: -2px; font-size: 10px; }
  .tab4 .time_box li:last-child em small { margin: 0 1px 0 2px; font-size: 7px; vertical-align: 1px; }
  .tab4 .time_txt2 { bottom: -32px; font-size: 15px; }
  .tab4 .slogan {
    position: relative;
    bottom: auto;
    left: auto;
    width: min(90vw, 390px);
    height: auto;
    aspect-ratio: 16.06 / 7.19;
    margin: 20px auto 0;
  }
  .tab4 .hd_cont {
    position: relative;
    right: auto;
    bottom: auto;
    width: calc(100% - 28px);
    max-width: 500px;
    height: auto;
    margin: 18px auto 0;
    gap: 12px;
  }
  .tab4 .hd_top { min-height: 24px; }
  .wb_txt { width: 170px; height: 24px; font-size: 11px; line-height: 24px; }
  .tab4 .btn_lqjl { font-size: 11px; }
  .tab4 .hd_box { height: 210px; padding: 12px 14px; }
  .tab4 .hd_txt1 { font-size: 12px; line-height: 1.65; }
  .tab4 .btn_ljlq { width: 210px; height: 42px; font-size: 18px; line-height: 42px; }
  .tab4_rw { width: 100%; height: 48px; padding-left: 12px; }
  .tab4_rw p { width: calc(100% - 88px); line-height: 1.2; }
  .tab4_rw p span, .tab4_rw p strong { font-size: 11px; }
  .tab4 .btn_wwc { width: 76px; height: 46px; font-size: 12px; line-height: 46px; }
  .modal-scrim { padding: 18px; }
  .modal-scrim .pop {
    width: min(calc(100vw - 44px), 460px) !important;
    height: auto !important;
    aspect-ratio: 13.03 / 7.15;
    background-size: 100% 100%;
  }
  .modal-scrim .tab4_pop4 { aspect-ratio: 13.03 / 8.05; }
  .modal-scrim .tab4_pop5 { aspect-ratio: 13.03 / 7.57; }
  .modal-scrim .pop_cont { padding: 18% 0 4%; }
  .modal-scrim .tab4_pop2 .pop_cont { justify-content: space-around; }
  .modal-scrim .pop .pop_txt { font-size: 14px; line-height: 1.5; }
  .modal-scrim .pop_btn2 { width: 42%; height: 40px; font-size: 14px; line-height: 40px; }
  .modal-scrim .pop_close { width: 20px; height: 17px; right: -22px; }
  .modal-scrim .tab4_pop4 .pop_cont { padding: 8% 0 3%; }
  .modal-scrim .tab4_pop4 .zd_rule { width: 82%; min-height: 68%; height: 68%; }
  .modal-scrim .zd_rule ul li h6 { font-size: 12px; }
  .modal-scrim .zd_rule ul li p { font-size: 10px; line-height: 1.5; }
  .modal-scrim .table_box { width: 84%; height: 78%; }
  .modal-scrim .table_box table tr th,
  .modal-scrim .table_box table tr td { font-size: 10px; }
}

/* ==========================================================================
   登录后的昵称 —— 照官方样式：
   .txt-nickname { max-width:7rem; overflow:hidden; text-overflow:ellipsis;
                   white-space:nowrap; display:inline-block; vertical-align:bottom; }
   官方登录后就是"欢迎您，昵称 [注销]"一行白字，不显示头像。
   ========================================================================== */

.tab4 .txt-nickname {
  max-width: 7rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  vertical-align: bottom;
}

/* ==========================================================================
   ★ 登录弹窗

   这一段是照**官方登录浮层的真实骨架**一比一写的，不是我凭感觉画的。
   官方那套结构不在活动页里，而是 milo SDK 注入的独立浮层
   （#qcwx-login.milo-qcwx-login），它的样式表是：

     .qcwx-login-frame  750×470  content-box，1px solid #bfbfbf，
                        border-radius:5px 5px 0 0，box-shadow rgba(0,0,0,.3) 0 0 10px
     .qcwx-login-cover  全屏白色、opacity:.7（是"白纱"，不是黑遮罩）
     .qcwx-tabs         40px 高，两个 50% 宽的页签
        激活 QQ：background:#51b7ec; color:#fff
        激活微信：background:#4ab218; color:#fff
        未激活 ：background:#f1f1f1; color:#b1b1b1      字号统一 18px
     .qcwxtab-close     × 25px/25px、color:#808080、padding:0 5px，右下 1px 描边
     .qcwx-tips         30px 高、14px、#a2a2a2、居中、白底
     .qcwx-frame        内容区 750×470；微信那个分支 top:70px / height:400px

   页签图标直接用官方那张雪碧图 sprite_login.png，四个状态各一个坐标：
     激活QQ -200px -90px(20×23)   未激活微信 -220px -90px(24×23)
     未激活QQ -180px -90px(20×23) 激活微信   -250px -90px(24×23)

   两个页签的**内容结构本来就不一样**，不能只换颜色：
     QQ  → 左栏（内容中心 x=245.25）「快捷登录」+ 小二维码 87×87 + 三个文字链接；
           右栏（x=497 起）权限勾选列表。这是 graph.qq.com/oauth2.0/authorize
           里 #ptlogin_iframe 那一层的样子。
     微信 → 单栏居中（中心 x=375）「微信登录」+ 280×280 二维码面板 + 两行说明；
           没有权限列表、没有页脚。这是 open.weixin.qq.com/connect/qrconnect 的样子。

   单位说明：整段用**固定 px**，不跟页面的 rem 走。
   原站的登录框是 SDK 浮层，用的是自己的固定像素尺寸，视口变小页面等比缩、
   浮层不缩。跟着页面的 rem 走会让弹窗在 1080 视口下缩到 155px 宽 —— 那是抄错了对象。
   窄屏改用整体 transform: scale() 等比缩小（见文件末尾），保持内部比例不失真。
   ========================================================================== */

/* 官方是"白色 70% 纱"，跟本页其它弹窗的黑遮罩不同，单独一个修饰类 */
.modal-scrim.scrim-login {
  background: rgb(255 255 255 / 70%);
}

.modal-scrim .df-login {
  position: relative;
  box-sizing: content-box;
  width: 750px;
  height: 470px;
  background: #ffffff;
  border: 1px solid #bfbfbf;
  border-radius: 5px 5px 0 0;
  box-shadow: rgba(0 0 0 / 30%) 0 0 10px;
  overflow: hidden;
  font-family: "Microsoft YaHei", 微软雅黑, sans-serif;
  transform-origin: center center;
}

/* ---- 页签条 ---- */

.dfl-tabs {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 40px;
  line-height: 40px;
}

.dfl-tab {
  display: block;
  float: left;
  width: 50%;
  height: 40px;
  text-align: center;
  font-size: 18px;
  background: #f1f1f1;
  color: #b1b1b1;
  text-decoration: none;
  cursor: pointer;
}

.df-login[data-p="qq"] .dfl-tab[data-p="qq"],
.df-login[data-p="wx"] .dfl-tab[data-p="wx"] {
  color: #ffffff;
}

.df-login[data-p="qq"] .dfl-tab[data-p="qq"] { background: #51b7ec; }
.df-login[data-p="wx"] .dfl-tab[data-p="wx"] { background: #4ab218; }

/* 官方 i.ico-*-logo：inline-block、高 23px、vertical-align:middle、margin:-4px 5px 0 */
.dfl-ic {
  display: inline-block;
  width: 20px;
  height: 23px;
  margin: -4px 5px 0;
  vertical-align: middle;
  background: url("https://vm.gtimg.cn/tencentvideo/vstyle/web/common/style/img/login/sprite_login.png") no-repeat;
}

.dfl-ic-wx { width: 24px; }

.df-login[data-p="qq"] .dfl-ic-qq { background-position: -200px -90px; }
.df-login[data-p="qq"] .dfl-ic-wx { background-position: -220px -90px; }
.df-login[data-p="wx"] .dfl-ic-qq { background-position: -180px -90px; }
.df-login[data-p="wx"] .dfl-ic-wx { background-position: -250px -90px; }

.dfl-close {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  padding: 0 5px;
  border: 0 solid #e0dcdc;
  border-width: 0 0 1px 1px;
  color: #808080;
  font-size: 25px;
  line-height: 25px;
  text-decoration: none;
}

.df-login[data-p="wx"] .dfl-close {
  border-color: #8bc34a;
  color: #d4d2d2;
}

.dfl-close:hover { font-weight: 700; }

/* ---- 提示条 ---- */

.dfl-tips {
  position: absolute;
  z-index: 2;
  top: 40px;
  left: 0;
  width: 100%;
  height: 30px;
  margin: 0;
  background: #ffffff;
  color: #a2a2a2;
  font-size: 14px;
  line-height: 30px;
  text-align: center;
}

/* ---- 内容区（页签 40 + 提示 30 = 70）---- */

.dfl-body {
  position: absolute;
  top: 70px;
  left: 0;
  width: 750px;
  height: 400px;
}

.df-login[data-p="qq"] .dfl-body-wx { display: none; }
.df-login[data-p="wx"] .dfl-body-qq { display: none; }

/* 通用链接色：官方 .link_tips / .oauth_tips a 都是 rgb(46,119,229) */
.dfl-link {
  color: #2e77e5;
  text-decoration: none;
}

/* ==========================================================
   QQ 面板
   ========================================================== */

/* 左栏宽度取 490.5，使 left:50% 正好落在官方内容中心 x=245.25 上 */
.dfl-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 490.5px;
  height: 400px;
}

/* 官方 #title_0：20px/28px、#000、居中、字重 400（不是粗体） */
.dfl-title {
  position: absolute;
  top: 4px;
  left: 0;
  width: 100%;
  margin: 0;
  color: #000000;
  font-size: 20px;
  font-weight: 400;
  line-height: 28px;
  text-align: center;
}

/* 官方 #qlogin_tips_1：12px/16px、#000，「QQ手机版」是蓝色链接 */
.dfl-sub {
  position: absolute;
  top: 37.5px;
  left: 0;
  width: 100%;
  margin: 0;
  color: #000000;
  font-size: 12px;
  line-height: 16px;
  text-align: center;
}

/* 官方 img#qrlogin_img.qrImg：87×87、border:1px solid #f5f5f5、内含 76px 二维码 */
.dfl-qrbox {
  position: absolute;
  top: 78.5px;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 87px;
  height: 87px;
  margin-left: -43.5px;
  background: #ffffff;
  border: 1px solid #f5f5f5;
}

.dfl-qr {
  display: block;
  width: 76px;
  height: 76px;
}

/*
 * 二维码位置只由 renderScanPanel() 一个函数决定可见谁：
 *   'msg' → 提示 + 可选刷新按钮（生成中 / 失败 / 已过期）
 *   'qr'  → 二维码
 *   'ok'  → 已扫描，请在手机上确认
 * 三个状态叠在同一块区域里，用 absolute + inset:0 保证它们不参与布局。
 */
.dfl-state {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  text-align: center;
}

.dfl-state-txt {
  margin: 0;
  color: #666666;
  font-size: 11px;
  line-height: 14px;
}

.dfl-retry {
  color: #2e77e5;
  font-size: 11px;
  line-height: 14px;
  text-decoration: underline;
}

/*
 * 已扫待确认（QQ）—— 官方 xlogin 的 #qrlogin_step2 一比一复刻。
 *
 * 官方结构：白底整栏覆盖层盖住「快捷登录」标题/副行/二维码框，
 * 内容是 手机+绿勾 插画（官方雪碧图 icon_3_tiny.png，cell 0,-348）+ 两行文字。
 * 几何全部按官方截图实测（1920px 截图、对话框 1000px 宽 → 1.330 缩放）：
 *   · 插画元素   左 76 / 上 37（相对左栏；绿勾圆心实测 (175.2,141)，
 *                 雪碧图内绿勾圆心 (99.5,34) → 元素原点 = 175.2-99.5, 141-34-70+70）
 *   · 加粗提示行 字形 14px 高，实测字形中心 y=197（相对弹窗）→ 行盒 top 117（相对左栏）
 *   · 返回行     12px #b4b4b4，「返回」#3481cf，实测字形中心 y=234.5 → top 155
 */
.dfl-step2 {
  position: absolute;
  inset: 0;
  z-index: 3;
  background: #ffffff;
  text-align: left;
}

/* 官方 .step2_outer 的背景即这张雪碧图：icon_3_tiny.png 0 -348px no-repeat #fff */
.dfl-step2-icon {
  position: absolute;
  top: 37px;
  left: 76px;
  width: 152px;
  height: 190px;
  background: url("dfl-scan-icon.png") 0 -348px no-repeat #ffffff;
}

.dfl-step2-txt {
  position: absolute;
  top: 117px;
  left: 191px;
  margin: 0;
  color: #000000;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.dfl-step2-back {
  position: absolute;
  top: 155px;
  left: 191px;
  margin: 0;
  color: #b4b4b4;
  font-size: 12px;
  line-height: 18px;
}

.dfl-step2-back a {
  color: #3481cf;
  text-decoration: none;
}

.dfl-step2-back a:hover {
  text-decoration: underline;
}

/* 官方 #bottom_qlogin：三个 48px 链接，间隔 53px，中间 1×12px #f5f5f5 分隔线 */
.dfl-links {
  position: absolute;
  top: 272px;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 53px;
  width: 100%;
  height: 16px;
}

.dfl-links .dfl-link {
  position: relative;
  width: 48px;
  color: #000000;
  font-size: 12px;
  line-height: 16px;
  text-align: center;
}

.dfl-links .dfl-link + .dfl-link::before {
  content: "";
  position: absolute;
  top: 2px;
  left: -27px;
  width: 1px;
  height: 12px;
  background: #f5f5f5;
}

/* 右栏：官方 .page_accredit 里 #lay_main 的 x=497、宽 227 */
.dfl-right {
  position: absolute;
  top: 0;
  left: 497px;
  width: 227px;
  height: 400px;
}

/* 三行的行盒起点：156 / 178 / 201（相对内容区顶 70 即 86 / 108 / 131）*/
.dfl-row {
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  height: 16px;
  color: #666666;
  font-size: 12px;
  line-height: 16px;
  cursor: pointer;
}

.dfl-row-all { top: 86px; }
.dfl-row-perm { top: 108px; }

/* 「全选」与「腾讯游戏 将获取以下权限：」之间官方实测 12px */
.dfl-row em {
  margin-left: 12px;
  font-style: normal;
}

/*
 * 官方勾选框是 16×16 的圆形图标：蓝色（全选）/ 灰色（单项，禁用但仍勾着）。
 * 这里用 <input type=checkbox> 做，所以白勾必须走 background-image ——
 * input 是替换元素，::after 之类的伪元素在它身上根本不会渲染。
 */
.dfl-cb {
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  margin: 0 8px 0 0;
  border-radius: 50%;
  appearance: none;
  -webkit-appearance: none;
  background-color: #c9c9c9;
  /* 官方白勾实测 ~1.5px 粗、比 16 框的几何中心略偏下：10×8 的图 + 2.3 描边刚好像是这个分量 */
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M1 4.2 3.6 6.8 9 1.4' fill='none' stroke='%23fff' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center 55%;
  background-size: 10px 8px;
  cursor: pointer;
}

.dfl-cb-on { background-color: #0096ff; }

.dfl-cb:not(:checked) { background-image: none; }
.dfl-cb:disabled { cursor: default; }

/* 官方原文是 授权即同意<a>服务协议</a>和<a>QQ隐私保护指引</a>，链接之间没有额外间距 */
.dfl-oauth {
  position: absolute;
  top: 131px;
  left: 0;
  margin: 0;
  color: #555555;
  font-size: 12px;
  line-height: 16px;
}

/* ==========================================================
   微信面板：单栏居中，没有权限列表也没有页脚
   ========================================================== */

.dfl-body-wx { text-align: center; }

/* 官方 .impowerBox .title：20px；行盒顶 = 内容区 2.5，字形落在 76.5..94.5 */
.dfl-wx-title {
  margin: 2.5px 0 0;
  color: #333333;
  font-size: 20px;
  font-weight: 400;
  line-height: 28px;
}

/* 官方 .impowerBox .qrcode：宽 280、border:1px solid #e2e2e2；内含 272px 二维码图 */
.dfl-wx-qrbox {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 280px;
  height: 280px;
  margin: 16.5px auto 0;
  background: #ffffff;
  border: 1px solid #e2e2e2;
  overflow: hidden;
}

/*
 * 微信扫码图自带白边（静默区）：官方图 272px 里可见码面是 244px，
 * 而我们这张上游二维码的静默区比例更大，同样放 272px 只剩 238px。
 * 所以按 244 / 238 放大到 279px，可见码面才和官方一样大；
 * 多出来的 0.5px 是白色静默区，被 .dfl-wx-qrbox 的 overflow:hidden 裁掉，看不见。
 * margin-top:2px 是为了把码面从"面板正中"再往下压 1px —— 官方实测就偏下 1px。
 */
.dfl-wx-qr {
  display: block;
  width: 279px;
  height: 279px;
  margin-top: 2px;
}

/* 微信大码框里的提示态（生成中 / 已过期）：官方同款 14px 文案 */
.dfl-wx-qrbox .dfl-state { gap: 6px; }

.dfl-wx-qrbox .dfl-state-txt {
  color: #333333;
  font-size: 14px;
  line-height: 20px;
}

/*
 * 已扫待确认（微信）—— 官方 qrconnect 旧版模板（impowerBox）的 status_succ 一比一：
 * 二维码保持可见，只把下方提示换成一行 [44px 官方绿勾 PNG] + 「扫描成功」 +
 * 「在微信中轻触允许即可登录」。图标直接内嵌官方 CSS 里的那张 base64 PNG（44×44）。
 */
.dfl-wx-scanok {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 280px;
  margin: 8.5px auto 0;
  padding: 7px 14px;
  text-align: left;
}

/* 官方 .impowerBox .icon38_msg：44×44，background-size:cover */
.dfl-wx-status-icon {
  display: inline-block;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  margin-right: 5px;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAYAAAAehFoBAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAALKADAAQAAAABAAAALAAAAAD8buejAAAEF0lEQVRYCe2Zz2sTQRTHZ3YTk6ZSUQ+VHj168KCiIm2k6kVEK4IHPTWtKIg9KohnERRPiiBa05OCB7EKBQWVph6K1AoePPgHBD1URNtN0mR3fN9NN83O/shud9NS7F52Z+bNe599Oz/evGVs49rwgM0D3FaKUBBC8K7Pl7YbmtFT46IHqhKCF5WMUvyz9+Ec51xEUN/oGgm489PlHXqlfEoYYoAxcYS0phua7Q9lxvh7rvBxNZV+tbD/wQ97c/DSioA3F3K7qoLdYlycZIKF08Gph+Cvk5xdn8/mvwVHrUuGMtY5faFbr9ZuCoMNUnc1rDFJXucKG1OTiRsLBx//lNo8i4GBMx+H9hmGGKexao5PT40hG2hsFxWFD2i9T2aCdFWCCHVM5c7phlGIGxa2oRO6YSMIS0sPQxF59mkQZVFlyNPnS335Z356fIExDPD2NE06/JTE1sZZSVWUrN/w8AQ2J9iiPtuOYeD3ghjT6iZ1j9dE9BzD5moQ8wTzA7XazDFNK5FVlu+uHq6vs+IrCUddumR7Qct6kvPdbuu0q4fNTWHtYPFS6hKD4wUdHsZ2WytrxdA7mEO1XwWvkOHftOV1e0rRjphIZ3rkbdzhYcQG7YZVVXEmqSSymGCewLTlmyySgAOYApnTkkyMRV4BrNY7NvG379F3RfW35cZiA6YZSl9K9MdI2KRqGRaV26ZHugyd32sScHkU/XWm5SYbMOJZavIKEZd7hX5ywmqL828J5kALVeklpoaYDRjBd6Ol1QPn1VYi9fYVw5rdZSYbsHVSaAVCk+UXLdAHFc7v+8tGg4VumSnhb9CtlVeUhHJMOzT6hVpnOwo5ZghxxSkZHdapkzGbh3EGcxOy14mUXtMboWApmx9xejo+WJnJBowDox3OoyTY1VRh8LbVaoeODxb6ZSbbToclJF3IaSQXbKXg7E4lO3bNAk8Vhu6qivEO6yzqts5c3FLSqm8CrAaWCvleLmfzGZozjRO3DRjSqckcGRPH5Z6eZQnakosBllTxicrh/AlLJ+62IYEKOoq/xD3wheExmXuRnhraiT5nxXM1XRg+WlqozkTwrGkeaQGZw+HhKMEPKZujb4fh1CkbCl0OGvyY0RHlDUIboA4Ei50yOiyME4McqaHaMSRQiSQH3XQ8r9FFAbzJ4DDvCoxIH0kOh/QqVcC222kD5l2B0YCMjG+8CqE2XLAJ216qPYFxakVGhjJnJa/OsdeTLdj0OjHDnicwGpEfoG13GM+rccGWX04CDL7AEEAmBhmZtnq67tmWWR/wONZhVLpd6yoZiBfAp0JGhmbwKBXjWPKQbh2FzlbDoNmBgT3c3GndJLSbofHc9MuATtrm4dUrysMvgw+IU9bkl4EMjjJC09X4KeNme6Puv/bAP9U/9N7f2fg5AAAAAElFTkSuQmCC") center / cover no-repeat;
}

/* 官方 .status_txt：inline-block、vertical-align:middle（这里用 flex 等价居中） */
.dfl-wx-status-txt {
  display: inline-block;
  vertical-align: middle;
  text-align: left;
}

.dfl-wx-status-txt h4 {
  margin: 0;
  color: #000000;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
}

/* 官方 .impowerBox .status p：13px；.status_txt p：relative top:-2px */
.dfl-wx-status-txt p {
  position: relative;
  top: -2px;
  margin: 0;
  color: #000000;
  font-size: 13px;
  line-height: 20px;
}

/* 官方 .impowerBox .status p：13px。两行紧挨着，行距 21px */
.dfl-wx-cap {
  margin: 15.5px 0 0;
  color: #333333;
  font-size: 13px;
  line-height: 21px;
}

/* 扫码确认期间官方不再显示下方提示行（提示行的位置让给 status_succ 行） */
.dfl-wx-cap[hidden] {
  display: none;
}

/* ==========================================================================
   领取成功弹窗：使用者要求只保留文字「恭喜获得限时三角券×388」，不放图片。
   .dj_box 的基础版式来自官方 index.css（按图片+文案设计的固定高度），
   去掉图片后把文案在这块区域里垂直水平居中即可。
   ========================================================================== */

.modal-scrim .tab4_pop1 .dj_box_text {
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-scrim .tab4_pop1 .dj_box_text p {
  margin: 0;
  text-align: center;
}

/* ==========================================================================
   窄屏：整块等比缩放。
   官方浮层是固定像素，视口再窄也不会重排；这里用 transform 等比缩小，
   比"改成流式"更接近原站行为，也不会把 750px 的内部版式挤变形。
   缩放系数由 df.js 的 fitLogin() 写在 style 上（CSSOM 赋值不受 CSP 限制）。
   ========================================================================== */

@media (max-width: 790px) {
  .modal-scrim { padding: 12px; }
  .modal-scrim .df-login { transform-origin: center center; }
}