
@font-face {
    font-family: 'fonta';
    src:url(fonts/HYQiHeiX2-65W.ttf);   /* 与 Daka2026 一致：OTF 版度量略宽，导致地址长度变化，退回 TTF */
}
@font-face {
    font-family: 'fontb';
    src:url(fonts/HYQiHeiX2-55W.ttf);
}
@font-face {
    font-family: 'fontc';
    src:url(fonts/Akzidenz-Grotesk-BQ-Condensed.ttf);
}
@font-face {
    font-family: 'fontd';
    src:url(fonts/Xj-Zsky.ttf);
}
@font-face {
    font-family: 'fonte';
    src:url(fonts/HYQiHeiX2-95W.ttf);
}
/* 防伪码专用：PT Mono Bold（等宽粗体） */
@font-face {
    font-family: 'fontf';
    src:url(fontsx/PTMono-Bold.ttf);
}
/* 「防伪」两字专用：阿里妈妈数黑体 Bold（字形最接近今日水印） */
@font-face {
    font-family: 'fontg';
    src:url(fontsx/AlimamaShuHeiTi-Bold.ttf);
}
.fonte{
    font-family: 'fonte';
}
@font-face {
    font-family: 'WxRegular';
    src:url(/fonts/WeChatSansStd-Regular.ttf);
}
.modal-dialog{z-index: 2048;}
#bglist li{list-style:none; float:left;margin:5px;}
#bglist li img{height:200px;}
.i-top{height:32px;z-index:10}
.i-body{top:0; z-index:0;}
.iphone{
    width:710px;
    height:960px;
    background-color: #000;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: 100%;
    font-family: Arial,"微软雅黑";
    position: relative; 
}
.iphone,.i-top,.i-body-wallet{background-color:none}

.i-body{
    position: absolute;
    width: 100%;
    top: 128px;
    bottom: 100px;
    left: 0;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.i-top{background:none;}

.i-nav-pay-detail{border:none;}
.i-w-pay-money{font-weight:bold;}
.i-w-wa-money{
    margin-top: 189px;
    margin-left: 19px;
    text-align:left;
    font-family: "黑体";
}
.panel-wx-tab{
    margin-top: 438px;
}
 
.i-w-wa-money span {
    font-size: 54px;
    font-weight: bold;
    color: #000;
    background: none;
    width: 589px;
    text-align: center;
    margin-left: 0;
    margin-top: 183px;
}
.a-u-pic{
    width: 80px;
    height: 80px;
    background: url(/images/add-ps-pic.png) no-repeat;
    background-size: 100%;
    cursor: pointer;
}

/* .i-zd-desc5 span 已移出本组：其定位/层级统一由 h6o7m8e.asp 底部 JS（DK_WM_POS）控制 */
.i-zd-desc span,.i-zd-desc2 span,.i-zd-desc3 span,.i-zd-desc4 span,.i-zd-desc6 span {
    z-index: 999;
    position: fixed;
}
.i-zd-desc6 span{
    top: 752px;
    left: 217px;
}

.i-b-a-bj {
    width:710px;
    height:960px;
    top: 0px;
    left: 0px;
}

 
.dk-auto-height {
    z-index: 999;
    position: fixed;
    top: 750px;
    left: 135px;
  display: table;
  width: 972px;
  height: auto;
    font-family: 'fzyzhjt';
    color: #00439e;
    font-size: 72px;
}
/**打卡时间背景**/
.i-dk-time-bj{
    z-index: 111;
    position: fixed;
    left: 9px;
    width: 196px;
    height: 62px;
    background-image:url(Daka2026/img/dk-time-bj.png);
    background-size: 196px 62px;
    background-repeat: no-repeat; 
}
/**打卡时间**/
/* 文字由 Canvas 绘制（下黑上蓝渐变 + 白描边），这里只负责定位与兜底字体。
   旧写法用 background-clip:text 做渐变文字，iOS 全系 WebKit、部分安卓 WebView 在
   dom-to-image(SVG foreignObject) 截图时不支持该属性，渐变会铺满整个元素变成一条蓝块。 */
.i-top-time{
    z-index: 999;
    position: fixed;
    left: 85px;
    width: 360px;
    height: 70px;
    margin-left: 15px;
    font-family: "fontc";
    font-size: 48px;
    font-weight: 600;
    letter-spacing: 3px;
    line-height: 70px;
    text-align: left;
    /* 兜底：Canvas 不可用时显示纯色文字 + text-shadow 描边（所有内核都支持） */
    color: #0a6fd8;
    -webkit-text-fill-color: #0a6fd8;
    text-shadow:
        1px 0 0 #fff, -1px 0 0 #fff, 0 1px 0 #fff, 0 -1px 0 #fff,
        1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff,
        0 0 1.5px #fff;
    background: none;
    background-image: none;
    background-clip: border-box;
    -webkit-background-clip: border-box;
    filter: none;
    -webkit-font-smoothing: antialiased;
    transform: translateZ(0);
    display: block;
    opacity: 1;
    visibility: visible;
}
/* Canvas 生效时隐藏底层兜底文字 */
.i-top-time.has-time-canvas{
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-shadow: none;
}
.i-top-time .i-time-text{
    position: relative;
    z-index: 1;
}
.i-top-time-canvas{
    position: absolute;
    left: 0;
    top: 0;
    width: 360px;
    height: 70px;
    z-index: 2;
    display: block;
    pointer-events: none;
    /* 关键：Chromium 内核的 Canvas 文字会继承元素的 letter-spacing（这里父级是 3px），
       而绘制时又按 3px 手动逐字排版，会导致字距翻倍、整行变宽，看起来像时间被挤到右边。
       这里显式清零，只保留脚本里的逐字排版。 */
    letter-spacing: 0;
}
/**  地址日期左侧黄条 **/
.l-dzrq-sx{
    z-index: 111;
    position: fixed;
    background-image:url(Daka2026/img/l-dzrq-sx.png);
    width: 5px;
    left: 13px;
    background-repeat: no-repeat; 
}
/** 地址 **/
.i-zd-desc span{
    left: 33px;
    font-family: 'fonta';
    font-size: 28px;
    color: #fff;
    word-spacing:1px;
    /* 按今日水印原图（1920×2560）像素实测标定：
       19 字地址单行，文字宽 1302px = 画布宽 67.8%，单字 68.5px（占 3.57%）。
       本页画布 710px、字号 28px（占 3.94%，比 App 大约 10%）：
       710×0.678 = 481px，按字号比例放大 → 481×28/25.3 ≈ 532px，取 560px。
       560 ÷ 28 = 20 字/行，与 App「19 字不换行、20 字仍单行」一致。 */
    width:560px;
    word-wrap:break-word;
}
/** 左侧地址下日期 **/
.i-zd-desc2 span{
    left: 28px;
    font-size: 28px;
    font-family: 'fonta';
    color: #fff;
    margin: 90px 0px 0px 6px;
    width: 550px;
    white-space: nowrap; 
	display: inline-block;
	line-height: 1.2;
}
/** 备注渐变背景 **/
.gradient-transition {
    z-index: 999;
    position: fixed;
    top: 857px;
    left: 10px;
    border-radius: 5px;
    background: linear-gradient(to right, #eee 50%, transparent);
    transition: background-size 0.5s, opacity 0.5s;
    opacity: 0.3;
    width:150px;
    height:50px;
    border: none;
}

.xjbz span {
    z-index: 999;
    position: fixed;
    top: 865px;
    left: 23px;
    width:380px;
    font-size: 25px;
    font-family: "fontb";
    color: #fff;
}

/** 左下角验证标志：图标+验证语同一行，垂直居中，只需统一设置 .i-xy-row 的 top **/
.i-xy-row{
    z-index: 999;
    position: fixed;
    top: 914px;
    left: 14px;
    width: 700px;          
    white-space: nowrap;   
    display: flex;
    align-items: center;
    gap: 8px;
}
.i-xy{
    flex: 0 0 auto;
    width: 21px;
    height: 25px;
    background-image:url(Daka2026/img/xy.png);
    background-size: 21px 25px;
    background-repeat: no-repeat;
}
/** 左下角验证语 **/
.i-zd-desc3 span{
    position: static; 
    max-width: 910px;
    white-space: nowrap; 
    font-family: 'fontb';
    font-size: 22px;
    color: #D9D9D9;
    word-spacing:1px;
}
.i-zd-desc3 span a {
  font-size: 19px;
  line-height: 23px;
  height: 12px;
  vertical-align: text-top;
  padding-left:10px;
  padding-right:10px;
  color: #B7B5A9;
  text-decoration:none;
  font-weight:bold;
}

/**右下角防伪Logo：定位与外观全部由 h6o7m8e.asp 底部 JS（DK_WM_POS 分支）行内样式控制，CSS 不再重复维护**/
/**右下角真实防伪**/
.l-r-xjzs{
    z-index: 111;
    position: absolute; 
    bottom: 18px;
    right: 10px;
    width: 71px;
    height: 24px;
    background-image:url(Daka2026/img/zsky-bj.png);
    background-size: 71px 23px;
    background-repeat: no-repeat; 
}

/* 「相机 真实可验」这一行的全部样式统一写在 h6o7m8e.asp 底部的 JS 里
   （berryCss / camCss / bcCss 三个对象，内联 !important，优先级最高），
   这里不再写 CSS，避免两处各改一份、调试时互相打架。 */

@media (max-width: 768px) {
.l-r-xjzs{
    bottom: 18px;
}	
.i-zd-desc3 span a {
  font-size: 18px;
  line-height: 25px;
  height: 11px;
  font-weight:bold;
}
}

@media (max-width: 480px) {
    .l-r-xjzs {
        bottom: 19px;
    }

.i-zd-desc3 span a {
  font-size: 18px;
  line-height: 25px;
  height: 11px;
  font-weight:bold;
}	
}
/**右下角防伪码**/
.i-zd-desc4 span{
    top: 930px;
    right: 120px;
    width: 50px;
    line-height: 28px;
    font-size: 12px;
    color: #fff;
    font-family: "fonte";
}
/* 「右下角防伪码」整行外观（字体/字号/间距/对齐/overflow）统一由 h6o7m8e.asp 底部 JS
   以行内样式写入：dom-to-image 生成图片时只保留行内样式，写在 CSS 类里的规则在成图里会丢失。
   注意：这里若再写 overflow:hidden 会让 inline-block 的基线变成底边，破坏垂直居中。 */

#save {
    z-index: 9999;
    position: relative;
}

.mask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    z-index: 9998;
    display: none;
}
.my-image {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    z-index: 9999;
    display: none;
}

.hide_ifm {
    display: none;
}
.loading {
    display: none; 
    text-align: center;
    padding: 10px;
    font-size: 16px;
    color: #666;
}

#save, #btn-trade, #submitBtn {
    z-index: 9999 !important;
    position: relative !important;
    cursor: pointer !important;
}

.select-editable {
    position: relative;
    display: inline-block;
    width: 300px;
}
.select-editable select {
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.select-editable input {
    position: absolute;
    top: 0;
    right: 0;
    width: 70%;
    height: 34px;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-radius: 0 4px 4px 0;
    border-left: none;
}

.payment-generator .wx-payment-setting * { font-size: 14px !important; }
.wx-payment-phone-wrap {
}
.payment-generator {
    --primary-color: #3b99ff;
    --bg-color: #f5f7fa;
    --border-color: #e5e7eb;
    --text-color: #333;
    --panel-bg: #ffffff;
    height: fit-content !important; 
    overflow: hidden !important;
}

.dark-mode {
    --primary-color: #4aa3ff;
    --bg-color: #1a1a2e;
    --border-color: #2d2d44;
    --text-color: #e0e0e0;
    --panel-bg: #25253a;
    background-color: #121212;
    color: #e0e0e0;
}
.dark-mode .payment-generator {
    --primary-color: #4aa3ff;
    --bg-color: #1a1a2e;
    --border-color: #2d2d44;
    --text-color: #e0e0e0;
    --panel-bg: #25253a;
}
/* 主站暗黑模式(.night)自动适配本工具面板 */
.night .payment-generator {
    --primary-color: #4aa3ff;
    --bg-color: #1a1a2e;
    --border-color: #3a3a52;
    --text-color: #e0e0e0;
    --panel-bg: #25253a;
}

.payment-generator .wx-payment-container {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
    overflow-x: hidden;
}

.payment-generator .main-layout {
    display: grid;
    grid-template-columns: 545px minmax(0,1fr);
    gap: 10px;
    align-items: start;
    margin-bottom: 20px;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

#preview-iphone {
    transform: none !important;
    width: 720px !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
    font-size-adjust: none !important;
    -webkit-transform: none !important;
}

/* 预览区角标提示 */
.preview-region-tag {
    position: absolute;
    top: 8px;
    right: 24px;
    z-index: 20;
    padding: 3px 14px;
    font-size: 12px;
    line-height: 1.5;
    color: #fff;
    background: var(--primary-color, #3b99ff);
    border-radius: 13px;
    box-shadow: 0 2px 8px rgba(0,0,0,.2);
    pointer-events: none;
    letter-spacing: 1px;
}

.payment-generator .wx-payment-setting {
    width: 100%;
    box-sizing: border-box;
    padding: 0 5px;
}

.payment-generator .wx-payment-setting p {
    margin: 10px 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    display: table !important;
    width: 100% !important;
}
.payment-generator .wx-payment-setting p span:first-child {
    display: inline-block !important;
    width: 70px !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap;
    color: var(--text-color) !important;
    font-size: 13px;
}

.payment-generator .input-common,
.payment-generator .slt-common {
    display: inline-block !important;
    width: auto !important;
    min-width: 60px;
    max-width: 800px;
    box-sizing: border-box !important;
    border: 1px solid var(--border-color) !important;
    background-color: var(--panel-bg) !important;
    color: var(--text-color) !important;
}
.payment-generator #generateTradeNo {
    display: inline-block !important;
    width: auto !important;
    padding: 6px 6px !important; 
    border: 1px solid var(--border-color) !important;
    box-sizing: border-box !important;
    background-color: var(--panel-bg) !important;
    color: var(--text-color) !important;
    margin-left: 8px !important;
}
.payment-generator .wx-payment-setting p select.slt-common + select.slt-common {
    margin-left: 10px !important;
}	
.payment-generator #paymentAmount {
    display: inline-block !important;
    width: auto !important;
    min-width: 60px;
    max-width: 800px;
    max-width: calc(100% - 90px) !important; 
    vertical-align: middle !important;
    box-sizing: border-box !important;
    border: 1px solid var(--border-color) !important;
    background-color: var(--panel-bg) !important;
    color: var(--text-color) !important;
}

.payment-generator .wx-payment-setting p select.slt-phone-time {
    display: inline-block !important;
    padding-right: 15px !important; 
    margin-right: 5px !important; 
    background-color: var(--panel-bg) !important;
    color: var(--text-color) !important;
    border:1px solid var(--border-color) !important;
}


@media (max-width: 768px) {	
    .payment-generator .wx-payment-setting .trade-no-row {
    max-width: none !important; 
        display: inline-block !important;
    }
    .payment-generator .wx-payment-setting p:has(#transferNumber) {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box;
        padding-right: 5px;
    }
    .payment-generator #transferNumber {
        display: inline-block !important;
        width: auto !important;
        padding: 4px 6px !important;
        font-size: 14px !important;
        background-color: var(--panel-bg) !important;
        color: var(--text-color) !important;
        border:1px solid var(--border-color) !important;
    }
    .payment-generator #generateTradeNo {
        display: inline-block !important;
        width: auto !important;
        padding: 4px 8px !important; 
        font-size: 12px !important;
        margin-left: 5px !important; 
        white-space: nowrap; 
    }

    .payment-generator .wx-payment-setting p {
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important; 
        gap: 8px !important; 
    }
    .payment-generator .input-common {
        flex: 1 !important; 
        width: auto !important;
        min-width: 0 !important; 
        box-sizing: border-box !important;
    }
    /* 地址输入框同步适配 */
    #simpleAddressInput {
        min-width: 0 !important;
        flex: 1 !important;
        width: 100% !important;
    }	
    .payment-generator #generatedImage {
        max-height: 150vh; 
    }
    .payment-generator .main-layout {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }
    .payment-generator .wx-payment-phone-wrap {
        transform: translate(-50%, 0) scale(0.5) !important;
        transform-origin: top center !important;
        width: 750px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
        left: 50% !important;
        top: 0 !important;
    }

    .payment-generator .add-user {
        display: block !important;
    }
    .payment-generator .a-u-pic {
        margin-bottom: 10px !important;
    }
    .payment-generator .a-u-name {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .main-layout {
        display: block !important;
        width: 100% !important;
        margin: 0; 
        padding: 0 5px;
        gap: 0 !important;
    }

    .panel-body.panel-wx-tab {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    #preview-wrap.phone-wrap.wx-payment-phone-wrap {
        transform: translate(-50%, 0) scale(0.5) !important;
        transform-origin: top center !important;
        margin: 10px 0 30px 0 !important;
        width: 750px !important;
        max-width: 750px !important;
        position: relative !important;
        left: 50% !important;
    }

    .payment-generator-wrap .adjust-btn-group {
        display: inline-flex !important;
        align-items: center;
        gap: 0 !important;
        box-sizing: border-box;
    }
    .pos-input { 
        width: auto !important;
        min-width: 40px !important;
        max-width: 80px !important;
        text-align: center; 
        margin:0 !important; 
        padding:3px 1px !important;
        font-size:12px !important;
        border:1px solid var(--border-color) !important;
        background:var(--panel-bg) !important;
        color:var(--text-color) !important;
    }
    .payment-generator-wrap .adjust-btn {
        width: 28px !important;
        height: 28px !important;
        font-size: 14px !important;
        padding:0 !important;
        margin:0 !important;
        min-width: 28px;
    }

    .payment-generator .adjust-btn#fontSizeMinus,
    .payment-generator .adjust-btn#fontSizePlus {
        width: 26px !important;
        height: 26px !important;
        font-size: 15px !important;
        padding:0 !important;
        margin:0 !important;
    }
    #fontSizeInput {
        width: 38px !important;
        text-align: center;
        padding:2px 1px !important;
        font-size:12px !important;
        margin:0 !important;
        height:26px !important;
        box-sizing: border-box !important;
    }
    .watermark-text { font-size: 28px !important; }

}

@media (max-width: 480px) {
    .payment-generator .wx-payment-phone-wrap {
        transform: translate(-50%, 30px) scale(0.5) !important;
    }
    #preview-wrap.phone-wrap.wx-payment-phone-wrap {
        transform: translate(-50%, 0) scale(0.4) !important;
        position: relative !important;
    }
    .payment-generator-wrap .adjust-btn {
        width: 26px !important;
        height: 26px !important;
        font-size: 13px !important;
    }
}

@media (min-width: 1025px) {
    .payment-generator .wx-payment-phone-wrap {
        transform: translate(-50%, 0) scale(0.65);
    }
    .pos-input {
        width: auto !important;
    }
    .payment-generator-wrap .adjust-btn {
        width: 30px !important;
        height: 30px !important;
        font-size: 16px !important;
    }
}

.payment-generator .wx-payment-phone-wrap {
    position: relative !important;
    left: 50%;
    transform: translate(-50%, 0) scale(0.6);
    transform-origin: top center;
    margin: 0 0 50px 0;
    padding-top: 0px !important; 
    width: 750px;
    max-width: 750px;
    height: auto;
    min-height: auto;
    z-index: 1 !important; 
    border: 16px solid #666;
    border-radius: 40px;
    box-sizing: border-box;
    overflow: hidden !important;
    background: transparent !important;
}

.payment-generator .wx-payment-iphone {
    width: 720px !important;    
    height: 960px !important; 
    position: absolute !important; 
    margin: 0 auto !important; 
    padding: 0 !important;
    border: none !important;
    transform: none !important; 
    transform-origin: top left !important;
    overflow: hidden;
    color: #000;
    background-image:url(PaymentScreenshot.jpg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    font-family: Arial,"微软雅黑";
    background-color: #ffffff !important;
    z-index: 0 !important;
}

.payment-generator #generatedImage {
    width: auto !important;
    max-width: 100% !important; 
    max-height: calc(90vh - 120px) !important; 
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    object-fit: contain !important; 
    margin: 0 auto 20px; 
    display: block;
    pointer-events: auto !important; 
    -webkit-touch-callout: default !important; 
    -webkit-user-drag: auto !important;
}

.payment-generator .wx-payment-panel {
    background-color: var(--panel-bg) !important;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    padding: 1rem;
    margin-bottom: 1.5rem;
    border: 1px solid var(--border-color) !important;
}
.payment-generator .wx-payment-tab-content {
    padding: 1rem 0;
}
.payment-generator .wx-payment-setting {
    padding-bottom: 2rem;
}

.add-user {
  position: relative;
  padding-top: 5px;
  margin-bottom: 15px; 
  border-bottom: 1px var(--border-color) dotted !important;
  min-height: 95px;
  box-sizing: border-box;
}
.a-u-pic {
  position: absolute;
  width: 80px;
  height: 80px;
  background: url(/images/add-ps-pic.png) no-repeat;
  background-size: 100%;
  cursor: pointer;
  left: 10px; 
}
.a-u-name {
  position: absolute;
  left: 100px; 
  top: 45%;
  transform: translateY(-50%);
  transform-origin: left center; 
}
.a-u-pic-show{
    position: relative;
    background: var(--panel-bg) !important;
}
.a-u-pic-show img{
    width: 80px;height: 80px;vertical-align: top;
}
.a-u-pic-show input{
    width: 80px;height:80px;position:absolute;top:0;left:0;z-index:2;cursor:pointer;opacity:0;
}

.payment-generator-wrap #preview-amount {
    position: absolute;
    top: 370px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 58px;
    color: #000000;
    font-family: 'WxRegular', sans-serif; 
    transition: all 0.2s ease;
    z-index: 10;
    background-color: #FFFFFF;
    padding: 8px 20px;
    border-radius: 4px;
    text-align: center; 
}

.dark-mode .payment-generator-wrap #preview-amount {
    color: #000000 !important;
    background-color: #FFFFFF !important;
}

.dhx {
  transition: none !important;
  transform: none !important;  
  box-shadow: none !important;
}
.cool-btn {
  border: none;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  background: var(--primary-color);
  border-radius: 6px;
  cursor: pointer;
  box-shadow: 0 4px 0 #1a6fcc, 0 6px 10px rgba(59,153,255,0.2);
  transition: all 0.15s ease;
  user-select: none;
}
.cool-btn:active {
  transform: translateY(4px);
  box-shadow: 0 1px 0 #1a6fcc, 0 3px 5px rgba(59,153,255,0.1);
}
.cool-btn:hover {
  background: #4aa3ff;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 5px 0 #1a6fcc, 0 8px 14px rgba(59,153,255,0.35);
}

.payment-generator-wrap .adjust-btn-group {
    display: inline-flex; 
    gap: 0 !important;
    margin: 0 5px;
    box-sizing: border-box;
}
.payment-generator-wrap .adjust-btn {
    width: 30px;
    height: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.payment-generator .head_select,
.payment-generator input:not([type=checkbox],[type=radio],[type=button],[type=submit]),
.payment-generator select,
.payment-generator textarea {
  border: 1px solid var(--border-color) !important; 
  background-color: var(--panel-bg) !important;
  color: var(--text-color) !important;
}
.payment-generator input:not([type=checkbox],[type=radio],[type=button],[type=submit]):focus,
.payment-generator select:focus,
.payment-generator textarea:focus,
.payment-generator .head_select:focus {
   border-color: var(--primary-color) !important; 
   box-shadow: 0 0 0 3px rgba(59, 153, 255, 0.2) !important;
}

.dark-mode .payment-generator input:not([type=checkbox],[type=radio],[type=button],[type=submit]):focus,
.dark-mode .payment-generator select:focus,
.dark-mode .payment-generator textarea:focus,
.dark-mode .payment-generator .head_select:focus {
    box-shadow: 0 0 0 3px rgba(78, 140, 238, 0.3) !important;
    border-color: var(--primary-color) !important;
}
.payment-generator .input-wrapper input:not([type=submit],[type=button]) {
    border: none !important;
    box-shadow: none !important;
}

.panel-wx-tab {
    background-color: var(--bg-color) !important;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    padding: 0;
    margin: 0;
    border: 1px solid var(--border-color) !important;
    overflow: hidden;
}
.panel-wx-tab .nav-tabs {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    background-color: var(--bg-color) !important;
    border-bottom: 1px solid var(--border-color) !important;
    border-radius: 6px 6px 0 0;
    display: flex !important;
    flex-wrap: wrap;
}
.panel-wx-tab .nav-tabs > li {
    width: 120px;
    margin: 0;
    padding: 0;
    text-align: center;
    flex: none;
    background-color: var(--bg-color) !important;
    border-right: 1px solid var(--border-color) !important;
}
.panel-wx-tab .nav-tabs > li > a {
    display:block;
    padding:14px 0;
    font-size:14px;
    font-weight:500;
    color: var(--text-color) !important;
    text-decoration:none;
    border:none !important;
    border-bottom:none !important;
    transition:all 0.2s ease;
    background-color:transparent !important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.panel-wx-tab .nav-tabs > li.active {
    background-color: var(--panel-bg) !important;
    margin-bottom:-1px;
}
.panel-wx-tab .nav-tabs > li.active > a {
    color: var(--primary-color) !important;
    font-weight:600;
}
.panel-wx-tab .nav-tabs > li:not(.active) > a:hover {
    color: var(--primary-color) !important;
    background-color: #f0f7ff !important;
}
.dark-mode .panel-wx-tab .nav-tabs > li:not(.active) > a:hover {
    background-color: #2d2d44 !important;
}
.panel-wx-tab .tab-content {
    padding:5px;
    background-color: var(--panel-bg) !important;
    border-radius:0 0 6px 6px;
    width:100%;
    box-sizing:border-box;
}
.panel-wx-tab .tab-pane {
    transition:opacity 0.3s ease, transform 0.3s ease;
    opacity:0;
    transform:translateY(10px);
    display:none;
}
.panel-wx-tab .tab-pane.active {
    display:block;
    opacity:1;
    transform:translateY(0);
}

.payment-generator .pop-pic {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw; 
    height: 100vh; 
    background: rgba(0,0,0,0.85);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 999999 !important; 
    padding: 20px;
    box-sizing: border-box; 
    overflow: hidden;
}
.payment-generator .pop-pic-content {
    background:var(--panel-bg) !important;
    padding:5px;
    border-radius:12px;
    max-width:90%;
    width:100%;
    max-width:600px;
    box-shadow:0 10px 30px rgba(0,0,0,0.2);
    position:relative;
    max-height:90vh;
    overflow-y: auto;
    overflow-x: hidden; 
    box-sizing:border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.payment-generator .tips {
    text-align:center;margin-top:5px;color:var(--text-color) !important;
}
.payment-generator .tips p {margin:8px 0;}
.payment-generator .tips a {
    display:inline-block;margin-bottom:30px; padding:8px 20px;background:var(--primary-color);color:#fff;border-radius:6px;text-decoration:none;transition:background-color 0.2s;
}
.payment-generator .tips a:hover {background:#2588e7;}
.payment-generator #savetipsbox {
    display:none;position:absolute;background:rgba(0,0,0,0.7);border-radius:10px;padding:15px 20px;min-width:180px;left:50%;top:30%;transform:translate(-50%,-50%);z-index:10001;text-align:center;
}
.payment-generator #savetipsbox span {display:block;color:#fff;font-size:16px;line-height:24px;}
.payment-generator .savetip {
    width:50px;height:50px;display:block;margin:0 auto 10px;background:url('/images/finger.png') no-repeat;background-size:50px 200px;background-position:0 0;animation:savetip 1s infinite steps(1) 0s forwards;
}
@keyframes savetip {	0%,100%{background-position-y:0;}25%{background-position-y:-50px;}50%{background-position-y:-100px;}75%{background-position-y:-150px;}
}

/* 水印样式 */
#watermarkLayer {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 9999 !important; 
    overflow: hidden;
    display: block !important; 
    visibility: visible !important; 
}
.watermark-text {
    position: absolute;
    color: #000;
    font-family: "微软雅黑",Arial;
    font-size: 36px;
    font-weight: 900;
    white-space: nowrap;
    transform: rotate(-25deg);
    opacity: 0.03 !important; 
    user-select: none !important;
    -webkit-user-select: none !important;
    pointer-events: none !important;
    margin: 0;
    padding: 0;
    text-shadow: 0 0 2px rgba(0,0,0,0.2) !important;
}

.dark-mode .watermark-text {
    color: #fff !important;
    text-shadow: 0 0 2px rgba(255,255,255,0.2) !important;
}

#watermarkMask {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 9998 !important;
    background-image: repeating-linear-gradient(-25deg,rgba(0,0,0,0.02),rgba(0,0,0,0.02)2px,transparent 2px,transparent 20px)!important;
    display: block !important;
    visibility: visible !important;
}
.dark-mode #watermarkMask {
    background-image: repeating-linear-gradient(-25deg,rgba(255,255,255,0.02),rgba(255,255,255,0.02)2px,transparent 2px,transparent 20px)!important;
}

/* 按钮样式优化 */
.payment-generator .center-btn,
#centerAmountBtn {
  display: inline-block !important;
  width: auto !important;    
  min-width: auto !important;
  max-width: none !important;  
  padding: 4px 15px !important;
  height: 30px !important;
  line-height: 22px !important;
  margin: 0 0 0 0 !important;
  font-size: 14px !important;
  white-space: nowrap !important;  
  box-sizing: border-box !important;
}
.dark-mode #centerAmountBtn{background:#2a3550 !important;border:1px solid #2d2d44 !important;color:#fff !important;box-shadow:0 2px 4px rgba(0,0,0,0.4) !important;}
.dark-mode #centerAmountBtn:hover{background:#354266 !important;}
.dark-mode #centerAmountBtn:active{background:#1c2538 !important;transform:translateY(1px) !important;box-shadow:0 1px 2px rgba(0,0,0,0.2) !important;}

#fontSizeMinus, #fontSizePlus, #moveUp, #moveDown, #moveLeft, #moveRight {
    width: 42px !important;
    height: 42px !important;
    line-height: 42px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    font-size: 18px !important;
    font-weight: bold !important;
    color: #ffffff !important;
    background: linear-gradient(120deg, #3a99fe, #2078e0) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15), inset 0 1px 1px rgba(255,255,255,0.3) !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: none !important;
    position: relative !important;
    z-index: 1 !important;
}
#fontSizeInput, #posTopInput, #posLeftInput {
    width: 90px !important;
    height: 42px !important;
    line-height: 42px !important;
    padding: 0 8px !important;
    margin: 0 !important;
    border: none !important;
    text-align: center !important;
    font-size: 15px !important;
    color: var(--text-color) !important;
    background: var(--panel-bg) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08), inset 0 1px 2px rgba(0,0,0,0.06) !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
    outline: none !important;
}
#fontSizeMinus, #moveUp, #moveLeft { border-radius: 6px 0 0 6px !important; }
#fontSizePlus, #moveDown, #moveRight { border-radius: 0 6px 6px 0 !important; }
#fontSizeMinus:hover, #fontSizePlus:hover, #moveUp:hover, #moveDown:hover, #moveLeft:hover, #moveRight:hover {
    background: linear-gradient(120deg, #4aa4ff, #2a86f0) !important;
    box-shadow: 0 3px 6px rgba(0,0,0,0.2), inset 0 1px 1px rgba(255,255,255,0.4) !important;
    transform: translateY(-1px) !important;
    transition: all 0.2s ease !important;
}
#fontSizeMinus:active, #fontSizePlus:active, #moveUp:active, #moveDown:active, #moveLeft:active, #moveRight:active {
    background: linear-gradient(120deg, #2078e0, #1967c0) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.15), inset 0 2px 3px rgba(0,0,0,0.1) !important;
    transform: translateY(0) !important;
}
.dark-mode #fontSizeMinus,.dark-mode #fontSizePlus,.dark-mode #moveUp,.dark-mode #moveDown,.dark-mode #moveLeft,.dark-mode #moveRight{background:linear-gradient(120deg,#2a3550,#1c2538) !important;box-shadow:0 2px 4px rgba(0,0,0,0.4) !important;}
.dark-mode #fontSizeMinus:hover,.dark-mode #fontSizePlus:hover,.dark-mode #moveUp:hover,.dark-mode #moveDown:hover,.dark-mode #moveLeft:hover,.dark-mode #moveRight:hover{background:linear-gradient(120deg,#354266,#25324d) !important;}
.dark-mode #fontSizeMinus:active,.dark-mode #fontSizePlus:active,.dark-mode #moveUp:active,.dark-mode #moveDown:active,.dark-mode #moveLeft:active,.dark-mode #moveRight:active{background:linear-gradient(120deg,#1c2538,#141c2b) !important;}
#fontSizeInput:focus, #posTopInput:focus, #posLeftInput:focus {
    color: var(--primary-color) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08), inset 0 1px 2px rgba(0,0,0,0.06), 0 0 0 2px rgba(58, 153, 254, 0.3) !important;
}
.adjust-btn-group, .pos-adjust-group { 
    display: inline-flex !important; 
    align-items: center !important; 
    gap: 0 !important;
    flex-shrink: 1 !important;
}

#opacityToggle {
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  border: 1px solid #3b99ff;
  border-radius: 3px;
  background: #fff;
  cursor: pointer;
  vertical-align: middle !important;
  margin-right: 5px !important;
}
#opacityToggle:checked {
  background: #3b99ff;
  border-color: #3b99ff;
}
#opacityToggle:checked::after {
  content: "✓";
  color: #fff;
  font-size: 12px;
  line-height: 16px;
  text-align: center;
  display: block;
}
.dark-mode #opacityToggle{background:#1a1d2c !important;border-color:#2d2d44 !important;}
.dark-mode #opacityToggle:checked{background:#4aa3ff !important;border-color:#4aa3ff !important;}
.dark-mode #opacityToggle {
  background: var(--panel-bg);
  border-color: #4aa3ff;
}
.dark-mode #opacityToggle:checked {
  background: #4aa3ff;
}

.address-container {
  margin: 10px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
}

#simpleAddressInput {
  order: 1 !important;
  flex: 1 1 0% !important;
  min-width: 0 !important;
  padding: 8px 32px 8px 12px !important;
  border: 1px solid var(--border-color, #ddd) !important;
  border-radius: 4px !important;
  font-size: 14px !important;
  display: block !important;
  float: none !important;
  position: static !important;
  width: 100% !important;
  box-sizing: border-box !important;
  background: var(--panel-bg, #fff) !important;
  color: var(--text-color, #333) !important;
}

/* 地址输入框外层包裹：允许收缩并填满剩余空间，移动端紧贴三角按钮 */
.addr-input-wrap {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  position: relative !important;
}

.address-container button:nth-child(2) {
  order: 2 !important;
  padding: 8px 12px !important;
  border: 1px solid var(--border-color, #ddd) !important;
  border-radius: 4px !important;
  background: var(--panel-bg, #f5f5f5) !important;
  color: var(--text-color, #333) !important;
  cursor: pointer !important;
  font-size: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: 34px !important;
}

.address-container button:nth-child(2):hover {
  background: rgba(128,128,128,.15) !important;
  border-color: var(--border-color, #bbb) !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.12) !important;
}

.address-container button:nth-child(3) {
  order: 3 !important;
  padding: 8px 16px !important;
  border: none !important;
  border-radius: 4px !important;
  background: #007bff !important;
  color: white !important;
  cursor: pointer !important;
  font-size: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: 34px !important; 
}

.address-container button:nth-child(3):hover {
  background: #0056b3 !important;
  box-shadow: 0 2px 6px rgba(0,123,255,.3) !important;
  transform: translateY(-1px) !important;
}

/* 「刷新」按钮隐藏态：地址填入后由 JS 加上 .is-hidden。
   上面 nth-child(3) 那条带了 !important，普通行内 display 压不过它，这里用 id+class 的更高优先级覆盖 */
#refreshLocationBtn.is-hidden {
  display: none !important;
}

.address-container [style*="position:absolute"] {
  left: 0 !important;
  top: calc(100% + 5px) !important;
  z-index: 9999 !important;
}

/* 兼容移动端：输入框外层与输入框均可收缩，自动拉长到三角按钮旁 */
@media (max-width: 768px) {
  #simpleAddressInput,
  .addr-input-wrap {
    min-width: 0 !important;
  }
  .address-container {
    flex-wrap: nowrap !important;
  }
}

/* 暗黑模式：地址下拉菜单配色 */
.dark-mode .address-container .dropdown-menu {
  background: var(--panel-bg, #25253a) !important;
  border-color: var(--border-color, #2d2d44) !important;
}
.dark-mode .address-container .dropdown-menu * {
  color: var(--text-color, #e0e0e0) !important;
}
.dark-mode .address-container .dropdown-menu div {
  background-color: var(--panel-bg, #25253a) !important;
}

/* 可点击的提交按钮样式 */
.submit-enabled {
    background-color: #007bff; 
    color: #fff;
    cursor: pointer;
    border: 1px solid #007bff;
}
/* 禁用的提交按钮样式 */
.submit-disabled {
    background-color: #ccc;
    color: #666;
    cursor: not-allowed;
    border: 1px solid #999;
}
/* 统一按钮样式 */
#btn-trade, #submit {
    padding: 8px 16px !important;
    border: none !important;
    border-radius: 4px !important;
    background: #007bff !important;
    color: white !important;
    cursor: pointer !important;
    font-size: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: 34px !important;
    margin-left: 5px !important; 
    box-sizing: border-box !important;
}

/* 随机生成按钮 hover */
#btn-trade:hover {
    background: #4aa3ff !important;
    box-shadow: 0 3px 8px rgba(0,123,255,.35) !important;
    transform: translateY(-1px) !important;
}

/* 确定保存按钮 hover（启用状态） */
#submit:not(:disabled):hover {
    background: #4aa3ff !important;
    box-shadow: 0 3px 8px rgba(0,123,255,.35) !important;
    transform: translateY(-1px) !important;
}

/* 确定保存按钮禁用状态 */
#submit:disabled {
    background: #ccc !important;
    color: #666 !important;
    cursor: not-allowed !important;
}

/* 确定保存按钮启用状态 */
#submit:not(:disabled) {
    background: #007bff !important;
    color: #fff !important;
}

/* 防伪码行布局优化 */
.payment-generator .wx-payment-setting p:has(#tradeCodeInput) {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
}

#tradeCodeInput {
    flex: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    box-sizing: border-box !important;
}

/* 保存按钮行布局 */
.payment-generator .wx-payment-setting p:has(#submit) {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding-top: 10px !important;
}

#checkbox {
    margin: 0 !important;
}
/* 复选框 */
.payment-generator .wx-payment-setting p label[for="checkbox"],
.payment-generator .wx-payment-setting p label:has(#checkbox) {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important; 
    cursor: pointer !important;
    user-select: none !important;
}

#checkbox {
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important; 
    vertical-align: middle !important; 
    flex: none !important; 
}

.night .payment-generator-wrap { color: #ddd; }
.night .payment-generator .form-control, .night .payment-generator input, .night .payment-generator textarea, .night .payment-generator select { background: #333; color: #ddd; border-color: #555; }
.night .payment-generator .panel, .night .payment-generator .card { background: #2a2a2a; color: #ddd; }

@media screen and (max-width:768px){
  /* #dkCam 与 .i-body 的规则统一在文件后部 1581/1582 行，此处原重复规则已删除 */
  body.dk-mobile .dk-flip-btn{position:absolute;right:2%;top:calc(2% + 46px);z-index:5;width:5.5%;height:5.5%;min-width:34px;min-height:34px;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;border:none;font-size:20px;line-height:1;cursor:pointer;display:block !important;}
  /* 闪光灯/翻转/刷新定位统一在文件后部 1572/1576/1579 行（固定 px），此处原重复规则已删除 */
  /* 获取地址失败或地址未更新时才显示相机页「刷新定位」按钮 */
  body.dk-mobile.dk-loc-stale .dk-loc-refresh-btn{display:flex !important;}
  body.dk-cam-off .dk-loc-refresh-btn{display:none !important;}
  body.dk-mobile .dk-zoom{display:flex !important;position:absolute;right:2%;bottom:24%;z-index:5;flex-direction:column;gap:10px;align-items:center;}
  body.dk-mobile .dk-zoom-opt{width:56px;height:56px;border-radius:50%;background:rgba(0,0,0,.35);color:#fff;border:none;font-size:32px;cursor:pointer;padding:0;}
  body.dk-mobile .dk-zoom-opt.active{background:rgba(255,255,255,.92);color:#000;font-weight:700;transform:scale(1.08);}
  body.dk-cam-off .dk-flash-btn{display:none !important;}
  body.dk-cam-off .dk-zoom{display:none !important;}
  body.dk-cam-off .dk-flipcam-btn{display:none !important;}
  body.dk-mobile .dk-cam-bar{display:block;background:#fff;border-top:1px solid #eceef2;padding:20px 14px calc(24px + env(safe-area-inset-bottom));}
  body.dk-mobile .dk-cam-tabs{display:flex;gap:12px;align-items:stretch;margin-bottom:16px;}
  body.dk-mobile .dk-tab{flex:1;text-align:center;font-size:20px;color:#666;background:#fff;border:1px solid #e8eaee;border-radius:16px;padding:24px 0;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;transition:background .2s ease;}
  body.dk-mobile .dk-tab.active{background:#f1f2f4;border-color:#e2e4e8;color:#666;font-weight:600;}
  body.dk-mobile .dk-cam-ctrls{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 30px;}
  body.dk-mobile .dk-side{width:78px;height:78px;border-radius:16px;background:#f0f4f8;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;}
  body.dk-mobile .dk-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
  body.dk-mobile .dk-shutter{position:relative;width:132px;height:132px;border-radius:50%;border:11px solid #222;background:#fff;cursor:pointer;padding:0;flex-shrink:0;transition:transform .15s ease;box-shadow:0 6px 20px rgba(0,0,0,.18);}
  body.dk-mobile .dk-shutter-core{position:absolute;inset:4px;border-radius:50%;background:linear-gradient(180deg,#ff8a3d,#ff6500);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 -3px 8px rgba(0,0,0,.18);}
  body.dk-mobile .dk-shutter::after{content:'';position:absolute;inset:-12px;border-radius:50%;border:2px solid rgba(255,101,0,.5);animation:dkpulse 2.2s ease-out infinite;pointer-events:none;}
  body.dk-mobile .dk-shutter:active{transform:scale(.86);}
  body.dk-mobile .dk-shutter.snap{animation:dksnap .32s ease;}
  @keyframes dkpulse{0%{transform:scale(.92);opacity:.9;}70%{transform:scale(1.18);opacity:0;}100%{transform:scale(1.18);opacity:0;}}
  @keyframes dksnap{0%{transform:scale(1);}35%{transform:scale(.8);}100%{transform:scale(1);}}
  @keyframes dkspin{to{transform:rotate(360deg);}}
  body.dk-mobile .dk-shutter:active{transform:scale(.9);}
  body.dk-mobile .dk-cam-tip{display:none;font-size:12px;color:#999;text-align:center;padding:6px 0 0;}
  body.dk-mobile.dk-cam-fail .dk-cam-tip{display:block;}
  body.dk-mobile.dk-cam-fail .dk-shutter{display:block;}
  body.dk-mobile.dk-cam-off .dk-upload{background:#ffe9dd;}
  /* 标签页切换：相机页隐藏通用设置面板，设置页只显示面板 */
  body.dk-mobile:not(.dk-on-set) .panel-wx-tab{display:none;}
  body.dk-mobile .main-layout{display:flex !important;flex-direction:column !important;}
  body.dk-mobile .phone-wrap.wx-payment-phone-wrap{order:-1;}
  body.dk-mobile .panel-wx-tab{margin-top:14px;}
  body.dk-mobile.dk-on-set .dk-cam-ctrls .dk-side{visibility:hidden;}
  body.dk-mobile.dk-generating .dk-cam-ctrls{pointer-events:none;}
  body.dk-mobile .dk-shutter.busy::after,body.dk-mobile.dk-generating .dk-shutter::after{inset:-12px;border:3px solid rgba(255,255,255,.55);border-top-color:#ff6500;animation:dkspin .85s linear infinite;opacity:1;}
  body.dk-mobile .dk-thumb{background:#eef1f5;}
  #dkViewer{position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(0,0,0,.93);display:none;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:99998;}
  #dkViewer.show{display:flex;}
  #dkViewer img{max-width:92vw;max-height:80vh;border-radius:8px;box-shadow:0 8px 40px rgba(0,0,0,.5);}
  #dkViewer span{color:#cfd4da;font-size:13px;}
  body.dk-mobile .dk-shutter.busy{pointer-events:none;}
  body.dk-mobile.dk-generating .dk-shutter{pointer-events:none;}
  body.dk-mobile .dk-shutter.busy .dk-shutter-core,body.dk-mobile.dk-generating .dk-shutter-core{filter:grayscale(1) brightness(.82);}
  body.dk-mobile.dk-cam-off .dk-upload{background:#ffe9dd;}
  body.dk-mobile .dk-cam-bar{position:relative;}
  #dkToast{position:absolute;left:50%;top:14px;transform:translateX(-50%) translateY(12px);background:rgba(17,17,17,.82);color:#fff;font-size:22px;line-height:1;padding:18px 34px;border-radius:32px;opacity:0;visibility:hidden;pointer-events:none;transition:all .25s ease;z-index:50;max-width:86vw;text-align:center;white-space:nowrap;}
  #dkToast.show{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
}

body.dk-mobile .dk-cam-bar{display:block !important;position:relative;background:#fff;border-top:1px solid #eceef2;padding:20px 14px 24px;}
body.dk-mobile .dk-flip-btn{display:block !important;position:absolute;right:2%;top:calc(2% + 46px);z-index:5;width:5.5%;height:5.5%;min-width:34px;min-height:34px;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;border:none;font-size:20px;line-height:1;cursor:pointer;}
body.dk-mobile .dk-flash-btn{display:flex !important;position:absolute;right:0;top:2%;z-index:5;width:11%;height:11%;min-width:78px;min-height:78px;border-radius:50%;background:transparent;border:none;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;padding:0;}
body.dk-mobile .dk-flash-btn svg{width:46%;height:52%;}
body.dk-mobile .dk-flash-mode{font-size:16px;color:#fff;line-height:1;margin-top:2px;text-shadow:0 1px 2px rgba(0,0,0,.7);}
body.dk-mobile .dk-flash-btn.on svg{fill:#ffdf60;stroke:#ffdf60;}
body.dk-mobile .dk-flipcam-btn{display:flex !important;position:absolute;right:0;top:calc(2% + 88px);z-index:5;width:11%;height:11%;min-width:78px;min-height:78px;border-radius:50%;background:transparent;border:none;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;padding:0;}
body.dk-mobile .dk-flipcam-btn svg{width:46%;height:80%;}
body.dk-mobile .dk-flip-label{font-size:16px;color:#fff;line-height:1;margin-top:2px;text-shadow:0 1px 2px rgba(0,0,0,.7);}
body.dk-mobile .dk-loc-refresh-btn{display:none;position:absolute;right:0;top:calc(2% + 176px);z-index:5;width:11%;height:11%;min-width:78px;min-height:78px;border-radius:50%;background:transparent;border:none;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;padding:0;}
body.dk-mobile .dk-loc-refresh-btn svg{width:46%;height:80%;}
body.dk-mobile .dk-loc-label{font-size:16px;color:#fff;line-height:1;margin-top:2px;text-shadow:0 1px 2px rgba(0,0,0,.7);}
body.dk-mobile.dk-loc-stale .dk-loc-refresh-btn{display:flex !important;}
body.dk-cam-off .dk-loc-refresh-btn{display:none !important;}
body.dk-mobile .dk-zoom{display:flex !important;position:absolute;right:2%;bottom:24%;z-index:5;flex-direction:column;gap:10px;align-items:center;}
body.dk-mobile .dk-zoom-opt{width:50px;height:50px;border-radius:50%;background:rgba(0,0,0,.35);color:#fff;border:none;font-size:32px;cursor:pointer;padding:0;}
body.dk-mobile .dk-zoom-opt.active{background:rgba(255,255,255,.92);color:#000;font-weight:700;transform:scale(1.08);}
body.dk-cam-off .dk-flash-btn{display:none !important;}
body.dk-cam-off .dk-zoom{display:none !important;}
body.dk-cam-off .dk-flipcam-btn{display:none !important;}
body.dk-mobile #dkCam{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;z-index:0;}
body.dk-mobile #preview-iphone .i-body{position:relative;overflow:hidden;width:100% !important;}
body.dk-mobile #preview-iphone .i-top{height:0;} 
/* 「相机 真实可验」无 CSS 规则：定位/样式全部由 h6o7m8e.asp 底部 JS（berryCss，DK_WM_POS）控制 */
/* 防伪Logo / 右下角防伪码：外观统一由 h6o7m8e.asp 底部 JS 行内样式控制（含手机端），此处不再重复 */
body.dk-mobile .main-layout{display:flex !important;flex-direction:column !important;}
body.dk-mobile .phone-wrap.wx-payment-phone-wrap{order:-1 !important;position:relative !important;left:50%;width:750px;max-width:100vw;}
body.dk-mobile .panel-wx-tab{width:100%;margin-top:14px;}
body.dk-mobile:not(.dk-on-set) .panel-wx-tab{display:none !important;}
body.dk-mobile.dk-on-set .dk-cam-ctrls .dk-side{visibility:hidden;}
body.dk-mobile .dk-cam-tabs{display:flex;gap:12px;align-items:stretch;margin-bottom:16px;}
body.dk-mobile .dk-tab{flex:1;text-align:center;font-size:20px;color:#666;background:#f1f2f4;border:1px solid #e8eaee;border-radius:16px;padding:24px 0;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;transition:background .2s ease;}
body.dk-mobile .dk-tab.active{background:#fff;border-color:#e2e4e8;color:#666;font-weight:600;}
body.dk-mobile .dk-cam-ctrls{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 30px;}
body.dk-mobile .dk-side{width:78px;height:78px;border-radius:16px;background:#f0f4f8;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;}
body.dk-mobile .dk-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
body.dk-mobile .dk-shutter{position:relative;width:132px;height:132px;border-radius:50%;border:11px solid #222;background:#fff;cursor:pointer;padding:0;flex-shrink:0;transition:transform .15s ease;box-shadow:0 6px 20px rgba(0,0,0,.18);}
body.dk-mobile .dk-shutter-core{position:absolute;inset:2px;border-radius:50%;background:linear-gradient(180deg,#ff8a3d,#ff6500);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 -3px 8px rgba(0,0,0,.18);}
body.dk-mobile .dk-shutter::after{content:'';position:absolute;inset:-12px;border-radius:50%;border:2px solid rgba(255,101,0,.5);animation:dkpulse 2.2s ease-out infinite;pointer-events:none;}
body.dk-mobile .dk-shutter:active{transform:scale(.86);}
body.dk-mobile .dk-shutter.snap{animation:dksnap .32s ease;}
body.dk-mobile .dk-shutter.busy{pointer-events:none;}
body.dk-mobile .dk-shutter.busy .dk-shutter-core,body.dk-mobile.dk-generating .dk-shutter-core{filter:grayscale(1) brightness(.82);}
body.dk-mobile .dk-shutter.busy::after,body.dk-mobile.dk-generating .dk-shutter::after{inset:-12px;border:3px solid rgba(255,255,255,.55);border-top-color:#ff6500;animation:dkspin .85s linear infinite;opacity:1;}
body.dk-mobile.dk-generating .dk-cam-ctrls{pointer-events:none;}
body.dk-mobile .dk-cam-tip{display:none;font-size:12px;color:#999;text-align:center;padding:6px 0 0;}
body.dk-mobile.dk-cam-fail .dk-cam-tip{display:block;}
#dkToast{position:absolute;left:50%;top:14px;transform:translateX(-50%) translateY(12px);background:rgba(17,17,17,.82);color:#fff;font-size:22px;line-height:1;padding:18px 34px;border-radius:32px;opacity:0;visibility:hidden;pointer-events:none;transition:all .25s ease;z-index:50;max-width:86vw;text-align:center;white-space:nowrap;}
#dkToast.show{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
#dkViewer{position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(0,0,0,.93);display:none;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:99998;}
#dkViewer.show{display:flex;}
#dkViewer img{max-width:92vw;max-height:80vh;border-radius:8px;box-shadow:0 8px 40px rgba(0,0,0,.5);}
#dkViewer span{color:#cfd4da;font-size:13px;}
@keyframes dkpulse{0%{transform:scale(.92);opacity:.9;}70%{transform:scale(1.18);opacity:0;}100%{transform:scale(1.18);opacity:0;}}
@keyframes dksnap{0%{transform:scale(1);}35%{transform:scale(.8);}100%{transform:scale(1);}}
@keyframes dkspin{to{transform:rotate(360deg);}}

body.dk-mobile .dk-flash-btn,body.dk-mobile .dk-flipcam-btn,body.dk-mobile .dk-loc-refresh-btn{flex-direction:column !important;align-items:center !important;justify-content:center !important;text-align:center;}
body.dk-mobile .dk-flash-btn>svg,body.dk-mobile .dk-flipcam-btn>svg,body.dk-mobile .dk-loc-refresh-btn>svg{display:block;flex:none;margin:0;}
body.dk-mobile .dk-flash-mode{display:block;flex:none;width:100%;text-align:center;line-height:1;margin:3px 0 0;}
body.dk-mobile .dk-flip-label{display:block;flex:none;width:100%;text-align:center;line-height:1;margin:-18px 0 0;}
body.dk-mobile .dk-loc-label{display:block;flex:none;width:100%;text-align:center;line-height:1;margin:-18px 0 0;}
