/* =========================================================
   V131 - 根据参考图重构永续合约页面
   业务原则：
   1) 所有按钮仍是原Vue按钮
   2) 所有input仍是原Vue input
   3) 盘口仍是原deep-data
   4) 只改变位置/尺寸/颜色/间距
   ========================================================= */

html{
  --c131-bg:#000000;
  --c131-card:#1d1f24;
  --c131-card2:#23262c;
  --c131-border:#2b2e34;
  --c131-text:#ffffff;
  --c131-sub:#9da2aa;
  --c131-muted:#70757e;
  --c131-green:#24c58c;
  --c131-lime:#a1e71c;
  --c131-red:#ff4961;
  --c131-buyDepth:rgba(0,92,67,.44);
  --c131-sellDepth:rgba(114,4,27,.52);
}

html.cx-theme-light,
html[data-theme="light"],
html[data-cx-theme="light"]{
  --c131-bg:#ffffff;
  --c131-card:#f1f3f5;
  --c131-card2:#e9ecef;
  --c131-border:#dde1e6;
  --c131-text:#111318;
  --c131-sub:#737a84;
  --c131-muted:#9aa0a8;
  --c131-green:#0fa772;
  --c131-lime:#7fd300;
  --c131-red:#e34258;
  --c131-buyDepth:rgba(15,167,114,.08);
  --c131-sellDepth:rgba(227,66,88,.08);
}

/* ===== 总体 ===== */
body:has(.perpetual-open),
.no_touch.appContent,
.no_touch.appContent .mainBackground,
.no_touch.appContent .perpetual-open{
  background:var(--c131-bg)!important;
  color:var(--c131-text)!important;
}

/* ===== 顶部币对 ===== */
.no_touch.appContent .contract-header{
  background:var(--c131-bg)!important;
  border-bottom:1px solid var(--c131-border)!important;
}

.no_touch.appContent .contract-header .pl-30.pr-30{
  padding:0 18px!important;
}

.no_touch.appContent .contract-header .pt-45{
  min-height:78px!important;
  padding:20px 0 14px!important;
}

.no_touch.appContent .contract-header .font-35{
  color:var(--c131-text)!important;
  font-size:21px!important;
  line-height:27px!important;
  font-weight:900!important;
  letter-spacing:-.3px!important;
}

.no_touch.appContent .contract-header .ml-15{
  margin-left:7px!important;
  padding:2px 6px!important;
  border-radius:5px!important;
  background:var(--c131-card)!important;
  color:var(--c131-sub)!important;
  font-size:10px!important;
}

.no_touch.appContent .contract-header .w-160{
  width:auto!important;
  padding-left:8px!important;
  color:var(--c131-green)!important;
  font-size:12px!important;
  font-weight:750!important;
}

.no_touch.appContent .contract-header img[alt="convert-img"]{
  width:28px!important;
  height:28px!important;
}

.no_touch.appContent .contract-header img[alt="line-img"]{
  width:25px!important;
  height:24px!important;
}

/* ===== 顶部导航，接近参考图粗体标签 ===== */
.cx125-contract-nav{
  height:52px!important;
  min-height:52px!important;
  padding:0 18px!important;
  gap:24px!important;
  justify-content:flex-start!important;
  background:var(--c131-bg)!important;
  border-bottom:1px solid var(--c131-border)!important;
  overflow-x:auto!important;
  white-space:nowrap!important;
  scrollbar-width
}
.cx125-contract-nav::-webkit-scrollbar{display:none!important}

.cx125-cont
  flex:0 0 auto!important;
  width:auto!important;
  min-width:0!important;
  height:51px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--c131-sub)!important;
  font-size:16px!important;
  line-height:51px!important;
  font-weight:800!important;
}

.cx125-contract-nav-btn.active{
  color:var(--c131-tex
  background:transparent!important;
  borde
}

/* ===== 主交易区 ===== */
.no_touch.appContent .perpetual-open{
  padding:0 18px!important;
}

/* JS会把原 header-open 搬到左侧，成为“全仓/杠杆”行 */
.no_touch.appContent .perpetual-open .w-440 > .header-open.cx131-relocated{
  width:100%!important;
  min-height:52px!important;
  margin:12px 0 10px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-
}

.no_touch.appContent .head
  padding:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.55fr) minmax(82px,.62fr)!important;
  gap:10px!important;
}

.no_touch.appContent .header-open.cx131-reloc
.no_touch.appContent .header-open.cx131-relocated .w-140.h-60{
  width:100%!important;
  min-width:0!important;
  height:46px!important;
  line-height:44px!important;
  margin:0!important;
  border:1px solid var(--c131-border)!important;
  border-radius:9px!important;
  background:var(--c131-card)!important;
  color:var(--c131-text)!important;
  font-size:14px!important;
  font-weight:800!important;
}

.no_touch.appContent .header-open.cx131-relocated .select-wrap{
  width:100%!important;
  height:44px!important;
  padding:0 12px!important;
  font-size:14px!important;
}

.no_touch.appContent .header-open.cx131-relocated > div:last-child{
  width:28px!important;
  flex:0 0 28px!important;
  margin-left:8px!important;
}

.no_touch.appContent .header-open.cx131-relocated img[alt="line-img"]{
  width:24px!important;
  height:23px!important;
}

/* ===== 左右栏比例 ===== */
.no_touch.appContent .perpetual-open > .pt-30.pb-20{
  padding:12px 0 16px!important;
}

.no_touch.appContent .perpetual-open > .pt-30.pb-20 > .flex{
  display:grid!important;
  grid-template-columns:minmax(0,1.38fr) minmax(142px,.92fr)!important;
  gap:16px!important;
  align-items:start!important;
}

.no_touch.appContent .perpetual-open .w-440{
  width:100%!important;
  min-width:0!important;
}

/* ===== 开多/开空：参考图顶部大胶囊 ===== */
.no_touch.appContent .perpetual-open .w-440 > .flex.items-center.h-66{
  height:54px!important;
  min-height:54px!important;
  padding:3px!important;
  border:1px solid var(--c131-border)!important;
  border-radius:28px!important;
  background:var(--c131-card)!important;
}

.no_touch.appContent .perpetual-open .w-440 > .flex.items-center.h-66 p{
  height:46px!important;
  min-height:46px!important;
  line-height:46px!important;
  border-radius:24px!important;
  color:var(--c131-sub)!important;
  font-size:18px!important;
  font-weight:850!important;
}

.no_touch.appContent .perpetual-open .w-440 > .flex.items-center.h-66 p.long{
  background:var(--c131-red)!important;
  color:#fff!important;
}

/* 第二项选中时用绿色，功能仍由原Vue long class决定 */
.no_touch.appContent .perpetual-open .w-440 > .flex.items-center.h-66 p:nth-child(2).long{
  background:var(--c131-green)!important;
  color:#fff!important;
}

/* ===== 委托类型 ===== */
.no_touch.appContent .perpetual-open .mt-30.mb-30{
  margin:10px 0!important;
}

.no_touch.appContent .cx127-order-type,
.no_touch.appContent .cx126-market-control{
  height:54px!important;
  min-height:54px!important;
  border:1px solid var(--c131-border)!important;
  border-radius:9px!important;
  background:var(--c131-card)!important;
  color:var(--c131-text)!important;
  font-size:17px!important;
  font-weight:800!important;
}

.no_touch.appContent .cx127-order-type img[alt="warn-icon"]{
  width:18px!important;
  height:18px!important;
  padding-left:12px!important;
}

.no_touch.appContent .cx127-order-type img[alt="select-icon"]{
  width:11px!important;
  height:auto!important;
  padding-right:12px!important;
}

/* ===== 下拉 ===== */
.no_touch.appContent .option-box{
  z-index:100!important;
  border:1px solid var(--c131-border)!important;
  border-radius:10px!important;
  overflow:hidden!important;
  background:var(--c131-card2)!important;
  box-shadow:0 14px 38px rgba(0,0,0,.35)!important;
}
.no_touch.appContent .option-box > div{
  min-height:48px!important;
  line-height:48px!important;
  padding:0 14px!important;
  background:var(--c131-card2)!important;
  color:var(--c131-text)!important;
  font-size:14px!important;
}

/* ===== 输入框 ===== */
.no_touch.appContent .perpetual-open .h-76.inputBackground,
.no_touch.appContent .perpetual-open .w-440.inputBackground.h-76{
  height:58px!important;
  min-height:58px!important;
  line-height:56px!important;
  margin-bottom:10px!important;
  padding-right:12px!important;
  border:1px solid var(--c131-border)!important;
  border-radius:10px!important;
  background:var(--c131-card)!important;
  box-shadow:none!important;
}

.no_touch.appContent .perpetual-open input{
  height:56px!important;
  min-width:0!important;
  background:transparent!important;
  color:var(--c131-text)!important;
  border:0!important;
  outline:0!important;
  font-size:15px!important;
  font-weight:650!important;
}

.no_touch.appContent .perpetual-open input::placeholder{
  color:var(--c131-muted)!important;
}
.no_touch.appContent .perpetual-open input:disabled{
  opacity:1!important;
  color:var(--c131-text)!important;
  -webkit-text-fill-color:var(--c131-text)!important;
}

.no_touch.appContent .perpetual-open .h-76.inputBackground span{
  color:var(--c131-sub)!important;
  font-size:12px!important;
  font-weight:650!important;
}

.no_touch.appContent .cx126-unit-price{
  display:block!important;
  margin:-3px 0 10px 6px!important;
  color:var(--c131-sub)!important;
  font-size:10px!important;
}
.no_touch.appContent .cx126-unit-price b{
  color:var(--c131-text)!important;
  font-size:11px!important;
}

/* ===== 张数 ===== */
.no_touch.appContent .perpetual-open .w-440.inputBackground.h-76 > .w-80{
  width:48px!important;
  flex:0 0 48px!important;
}

.no_touch.appContent .perpetual-open .w-440.inputBackground.h-76 input[type="number"]{
  width:calc(100% - 96px)!important;
  text-align:center!important;
}

.no_touch.appContent .perpetual-open img[alt="add"]{width:18px!important;height:auto!important}
.no_touch.appContent .perpetual-open img[alt="reduce"]{width:19px!important;height:19px!important}

/* ===== 可开张数 ===== */
.no_touch.appContent .perpetual-open .mt-40.mb-30.w-full{
  margin:14px 0 10px!important;
}

.no_touch.appContent .perpetual-open .mt-40.mb-30.w-full .font-22{
  color:var(--c131-sub)!important;
  font-size:11px!important;
}

/* ===== 滑杆 ===== */
.no_touch.appContent .amount-slider{padding:5px 3px 0!important}
.no_touch.appContent .mainBox.vue-slider{width:100%!important}
.no_touch.appContent .vue-slider-rail{background:var(--c131-border)!important}
.no_touch.appContent .vue-slider-process{background:var(--c131-text)!important;transition:none!important}
.no_touch.appContent .custom-step{
  width:9px!important;height:9px!important;
  background:var(--c131-bg)!important;border:2px solid var(--c131-border)!important;
}
.no_touch.appContent .custom-step.active,
.no_touch.appContent .vue-slider-dot-handle{
  background:var(--c131-text)!important;
  border-color:var(--c131-text)!important;
}
.no_touch.appContent .poecs{
  margin-top:3px!important;
  color:var(--c131-sub)!important;
  font-size:9px!important;
}

/* ===== 登录/下单区域 ===== */
.no_touch.appContent .perpetual-open .w-full.mt-120{
  margin-top:24px!important;
}

.no_touch.appContent .perpetual-open .w-full.mt-120 .textColor{
  color:var(--c131-sub)!important;
  font-size:11px!important;
  line-height:18px!important;
}

.no_touch.appContent .perpetual-open .btnBackground{
  height:62px!important;
  min-height:62px!important;
  line-height:62px!important;
  margin-top:14px!important;
  border-radius:31px!important;
  border:0!important;
  background:var(--c131-red)!important;
  color:#fff!important;
  font-size:18px!important;
  font-weight:900!important;
}

/* 原Vue如果渲染绿色/红色交易按钮，保持原事件只换色 */
.no_touch.appContent .perpetual-open .bg-green{
  background:var(--c131-green)!important;
  color:#fff!important;
}
.no_touch.appContent .perpetual-open .bg-red{
  background:var(--c131-red)!important;
  color:#fff!important;
}

/* ===== 右侧盘口 ===== */
.no_touch.appContent .perpetual-open > .pt-30.pb-20 > .flex > .ml-30{
  margin-left:0!important;
  min-width:0!important;
  padding-left:0!important;
  border-left:0!important;
}

.no_touch.appContent .deep-data{
  width:100%!important;
  min-width:0!important;
  background:var(--c131-bg)!important;
}

/* 标题价格/数量拉开距离 */
.no_touch.appContent .deep-data > .flex.justify-between.text-grey{
  display:grid!important;
  grid-template-columns:minmax(72px,1fr) minmax(60px,.8fr)!important;
  column-gap:20px!important;
  align-items:end!important;
  margin-bottom:6px!important;
  color:var(--c131-sub)!important;
  font-size:11px!important;
  line-height:15px!important;
}

.no_touch.appContent .deep-data > .flex.justify-between.text-grey > div:last-child{
  justify-self:end!important;
  text-align:right!important;
}

/* 数据行 */
.no_touch.appContent .deep-data .font-26{
  display:grid!important;
  grid-template-columns:minmax(72px,1fr) minmax(60px,.8fr)!important;
  column-gap:20px!important;
  align-items:center!important;
  min-height:34px!important;
  height:34px!important;
  padding:0 4px!important;
  font-size:13px!important;
  line-height:34px!important;
  font-variant-numeric:tabular-nums!important;
  overflow:hidden!important;
}

.no_touch.appContent .deep-data .font-26 > div:first-child{
  justify-self:start!important;
  text-align:left!important;
  white-space:nowrap!important;
}

.no_touch.appContent .deep-data .font-26 > div:last-child{
  justify-self:end!important;
  text-align:right!important;
  white-space:nowrap!important;
}

.no_touch.appContent .deep-data .text-green{color:var(--c131-green)!important}
.no_touch.appContent .deep-data .text-red{color:var(--c131-red)!important}
.no_touch.appContent .deep-data .textColor{color:var(--c131-text)!important}

/* 中间最新价 */
.no_touch.appContent .deep-data .font-34{
  margin:8px 0 0!important;
  padding:8px 0 0!important;
  color:var(--c131-text)!important;
  font-size:24px!important;
  line-height:30px!important;
  text-align:left!important;
  font-weight:900!important;
  font-variant-numeric:tabular-nums!important;
}

.no_touch.appContent .deep-data .approximately-text{
  padding-bottom:8px!important;
  color:var(--c131-sub)!important;
  font-size:12px!important;
  text-align:left!important;
}

/* 深度背景 */
.no_touch.appContent .deep-data .font-26[style*="rgba(94, 186, 137"],
.no_touch.appContent .deep-data .font-26[style*="rgba(94,186,137"]{
  background:linear-gradient(to left,var(--c131-buyDepth),transparent 74%)!important;
}
.no_touch.appContent .deep-data .font-26[style*="rgba(246, 70, 93"],
.no_touch.appContent .deep-data .font-26[style*="rgba(246,70,93"]{
  background:linear-gradient(to left,var(--c131-sellDepth),transparent 74%)!important;
}

/* ===== 盘口精度 ===== */
.no_touch.appContent .k-select-box{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin-top:8px!important;
}

.no_touch.appContent .k-select-box .select-box{
  flex:1!important;
  margin:0!important;
  border:1px solid var(--c131-border)!important;
  border-radius:8px!important;
  background:var(--c131-card)!important;
}

.no_touch.appContent .k-select-box .select-box .h-70{height:42px!important}
.no_touch.appContent .k-select-box .select-box .pl-16{
  padding-left:10px!important;
  color:var(--c131-text)!important;
  font-size:12px!important;
}

/* ===== 底部持仓区 ===== */
.no_touch.appContent .line{
  height:10px!important;
  background:var(--c131-card)!important;
}

.no_touch.appContent .cx127-position-tabs{
  background:var(--c131-bg)!important;
  color:var(--c131-text)!important;
}

.no_touch.appContent .cx127-position-tabs.pl-30.pr-30{
  padding-left:18px!important;
  padding-right:18px!important;
}

.no_touch.appContent .cx127-position-tabs .border-b-color{
  border-color:var(--c131-border)!important;
}

.no_touch.appContent .cx127-position-tabs .text-grey{
  color:var(--c131-sub)!important;
  font-size:15px!important;
  font-weight:750!important;
}

.no_touch.appContent .cx127-position-tabs .active-line{
  color:var(--c131-text)!important;
}

.no_touch.appContent .cx127-position-tabs .active-line:after{
  background:var(--c131-text)!important;
}

/* ===== 实时行情不闪 ===== */
.no_touch.appContent .deep-data *,
.no_touch.appContent .deep-data .font-26,
.no_touch.appContent .deep-data .font-34{
  animation:none!important;
  transform:none!important;
  transition:none!important;
}

/* ===== 适配较窄屏幕 ===== */
@media(max-width:390px){
  .no_touch.appContent .perpetual-open{padding:0 12px!important}
  .no_touch.appContent .perpetual-open > .pt-30.pb-20 > .flex{
    grid-template-columns:minmax(0,1.40fr) minmax(118px,.86fr)!important;
    gap:10px!important;
  }
  .cx125-contract-nav{
    gap:17px!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
  .cx125-contract-nav-btn{font-size:14px!important}
  .no_touch.appContent .deep-data > .flex.justify-between.text-grey,
  .no_touch.appContent .deep-data .font-26{
    grid-template-columns:minma
    column-gap:14px!important;
  }
  .no_touch.appContent .deep-data .font-26{
    font-size:11px!important;
    height:31px!important;
    min-height:31px!important;
    line-height:31px!important;
  }
  .no_touch.appContent .deep-data .font-34{font-size:20px!important}
}

/* 主题切换静态区域平滑 */
.no_touch.appContent .contract-header,
.cx125-contract-nav,
.no_touch.appContent .perpetual-open,
.no_touch.appContent .inputBackground,
.no_touch.appContent .header-open.cx131-relo
.no_touch.appContent .cx127-position-tabs{
  transition:background-color .14s ease,color .14s ease,border-color .14s ease!important;
}