/* =============================================================================
* h5-fixes-round5.css — H5 收口·第五波·纯换皮/隐藏覆盖(零功能丢失)
* 端: H5 预览副本 D:/最新版项目包/JP项目审计最终包/preview-h5/
* 注入: index.html 末尾(在既有 CSS 之后):
*
* 性质: 只隐藏「JS 精确打标」的空框/已满足徽章 + 自绘暗色弹窗/SL-TP 控件样式。
* 不删功能、不改主包逻辑、不绑业务事件、不动接口。
* 回滚: 删除该 行并删除本文件(配合删 .js)即可,无持久化副作用。
*
* 设计令牌(沿用主包 index-JmA2uOWk.css / uiux-h5pc-binance.css):
* bg #0B0E11 / surface #181A20 / surface2 #1E2329 / border #2B3139
* text #EAECEF / muted #848E9C / gold #FCD535 / danger #F6465D / 买 #3D7EFF
* ========================================================================== */
/* -----------------------------------------------------------------------------
* [U3] 交易页「一档即时买卖价 / 盤口」下方多余空框 → 隐藏
* 仅命中 .js 精确识别的「纯空占位 div」(无子元素、无文本),绝不影响有数据的阶梯行。
* 纯隐藏,DOM 不删,数据不丢。
* -------------------------------------------------------------------------- */
[data-h5r5-empty-box="1"] {
display: none !important;
}
/* -----------------------------------------------------------------------------
* [U4] 资产页「手機未綁定 / 未認證」徽章 → 真实已绑/已认证则隐藏
* 由 .js 读 /api/wallet、/api/user 真实状态后,仅在「确已满足」时打标。
* 无真实证据不打标 → 徽章保留(诚实展示)。
* -------------------------------------------------------------------------- */
[data-h5r5-phone-bound="1"],
[data-h5r5-kyc-verified="1"] {
display: none !important;
}
/* -----------------------------------------------------------------------------
* [U5] 客服「加载中」残留 → 隐藏(仅 .js 在客服窗实际未打开时打标的残留节点)
* -------------------------------------------------------------------------- */
[data-h5r5-support-loading="1"] {
display: none !important;
}
/* -----------------------------------------------------------------------------
* [F11] 平倉确认 / [U8] 止損止盈设置 —— 自绘暗色弹窗(币安质感)
* 遮罩 + 居中卡片;按钮金主/暗次。仅样式,逻辑全在 .js。
* -------------------------------------------------------------------------- */
.jp-r5-mask {
position: fixed;
inset: 0;
z-index: 100000;
background: rgba(0, 0, 0, 0.58);
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
}
.jp-r5-dialog {
width: 100%;
max-width: 340px;
background: #181A20;
border: 1px solid #2B3139;
border-radius: 16px;
box-shadow: 0 18px 48px rgba(0, 0, 0, 0.5);
color: #EAECEF;
padding: 20px 18px 16px;
font: 400 14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI",
"PingFang SC", "Microsoft YaHei", sans-serif;
animation: jpR5In 0.16s ease-out;
}
@keyframes jpR5In {
from { transform: translateY(8px) scale(0.98); opacity: 0; }
to { transform: translateY(0) scale(1); opacity: 1; }
}
.jp-r5-dialog-title {
font-size: 16px;
font-weight: 700;
color: #EAECEF;
margin-bottom: 12px;
}
.jp-r5-dialog-body {
font-size: 14px;
color: #B7BDC6;
margin-bottom: 18px;
line-height: 1.6;
}
.jp-r5-dialog-err {
font-size: 12px;
color: #F6465D;
min-height: 16px;
margin: 6px 2px 10px;
}
.jp-r5-field {
margin-bottom: 12px;
}
.jp-r5-field input {
width: 100%;
box-sizing: border-box;
background: #0B0E11;
border: 1px solid #2B3139;
border-radius: 10px;
padding: 11px 12px;
color: #EAECEF;
font-size: 14px;
outline: none;
}
.jp-r5-field input:focus {
border-color: #FCD535;
}
.jp-r5-field input::placeholder {
color: #5E6673;
}
.jp-r5-dialog-actions {
display: flex;
gap: 10px;
margin-top: 6px;
}
.jp-r5-btn {
flex: 1 1 0;
border: none;
border-radius: 10px;
padding: 11px 12px;
font-size: 14px;
font-weight: 700;
cursor: pointer;
transition: filter 0.12s ease, opacity 0.12s ease;
}
.jp-r5-btn:active {
filter: brightness(0.92);
}
.jp-r5-btn-cancel {
background: #2B3139;
color: #EAECEF;
}
.jp-r5-btn-ok {
background: linear-gradient(135deg, #FCD535, #E0A93B);
color: #1E2026;
}
.jp-r5-btn[disabled] {
opacity: 0.55;
cursor: default;
}
/* -----------------------------------------------------------------------------
* [U8] 持仓卡 SL/TP 显示行 + 「設置止損止盈」按钮(纯增量控件样式)
* 注入位置在「平倉」按钮上方;与卡片暗色一致,不挤压原内容。
* -------------------------------------------------------------------------- */
.jp-r5-sltp-info {
display: flex;
gap: 16px;
margin-top: 6px;
font-size: 11.5px;
color: var(--text-3, #848E9C);
}
.jp-r5-sltp-info .jp-r5-sltp-item b {
color: var(--text-2, #B7BDC6);
font-weight: 700;
margin-left: 2px;
}
.jp-r5-sltp-btn {
margin-top: 8px;
width: 100%;
border: 1px solid rgba(252, 213, 53, 0.5);
border-radius: 10px;
padding: 8px 9px;
background: rgba(252, 213, 53, 0.08);
color: var(--gold-deep, #FCD535);
font-weight: 700;
font-size: 12.5px;
cursor: pointer;
transition: background 0.12s ease;
}
.jp-r5-sltp-btn:active {
background: rgba(252, 213, 53, 0.16);
}