/* =========================================================
   CoinASX Contract Reference UI V127
   精修目标：用户提供的移动端合约交易参考图
   ========================================================= */

html{
 --cx127-bg:#ffffff;
 --cx127-card:#f5f5f6;
 --cx127-card2:#f0f0f1;
 --cx127-line:#ececef;
 --cx127-text:#17191d;
 --cx127-sub:#92969e;
 --cx127-muted:#b7bac1;
 --cx127-green:#69cc08;
 --cx127-red:#ff4659;
 --cx127-red-soft:#fff0f2;
 --cx127-green-soft:#f2fae8;
 --cx127-blue:#2b6bff;
 --cx127-radius:9px;
}

html:not(.cx-theme-light):not([data-theme="light"]):not([data-cx-theme="light"]){
 --cx127-bg:#08090b;
 --cx127-card:#15171b;
 --cx127-card2:#1b1e23;
 --cx127-line:#252930;
 --cx127-text:#f5f6f7;
 --cx127-sub:#8f949d;
 --cx127-muted:#656b75;
 --cx127-red-soft:rgba(255,70,89,.09);
 --cx127-green-soft:rgba(105,204,8,.08);
}

/* 页面 */
body,
#app,
.appContent,
.mainBackground{
 background:var(--cx127-bg)!important;
 color:var(--cx127-text)!important;
}

.appContent{
 max-width:750px!important;
 margin:0 auto!important;
}

/* ===== 顶部品种 ===== */
.contract-header{
 background:var(--cx127-bg)!important;
 border-bottom:1px solid var(--cx127-line)!important;
}

.contract-header > div{
 padding-left:28px!important;
 padding-right:28px!important;
}

.contract-header .before{
 padding-top:18px!important;
 padding-bottom:13px!important;
 min-height:54px!important;
 align-items:center!important;
}

.contract-header .font-35{
 font-size:19px!important;
 line-height:24px!important;
 font-weight:800!important;
 letter-spacing:-.35px!important;
}

.contract-header .ml-15{
 margin-left:8px!important;
 padding:2px 5px!important;
 border-radius:4px!important;
 background:var(--cx127-card)!important;
 font-size:10px!important;
 color:var(--cx127-text)!important;
}

.contract-header .pl-30.w-160{
 width:auto!important;
 padding-left:0!important;
 position:absolute!important;
 left:29px!important;
 top:44px!important;
 font-size:12px!important;
 font-weight:700!important;
}

.contract-header img.w-35{
 width:17px!important;
 height:17px!important;
 margin-right:1px!important;
}

.contract-header img.w-38{
 width:21px!important;
 height:19px!important;
}

/* ===== 顶部合约分类导航，做成参考图扁平Tab ===== */
.cx125-contract-nav{
 display:flex!important;
 align-items:center!important;
 gap:22px!important;
 min-height:43px!important;
 padding:0 28px!important;
 overflow-x:auto!important;
 background:var(--cx127-bg)!important;
 border-bottom:1px solid var(--cx127-line)!important;
 box-shadow:none!important;
 scrollbar-width:none!important;
}
.cx125-contract-nav::-webkit-scrollbar{display:none!important}

.cx125-contract-nav-btn{
 flex:0 0 auto!important;
 padding:0!important;
 height:43px!important;
 border:0!important;
 background:transparent!important;
 color:var(--cx127-sub)!important;
 font-size:13px!important;
 font-weight:700!important;
 whit
 border-radius:0!important;
}
.cx125-contract-nav-btn.active{
 color:
 font-weight:800!important;
}
.cx125-contract-nav-btn.active:after{
 content:""!important;
 display:block!important;
 height:2px!important;
 margin-top:-2px!important;
 border-radius:2px!important;
 background:var(--cx127-text)!important;
}

/* ===== 主交易区 ===== */
.perpetual-open{
 padding-left:28px!important;
 padding-right:28px!important;
 background:var(--cx127-bg)!important;
}

.perpet
 min-height:58px!important;
 align-items:ce
 justify-content:space-between!important;
}

.perpetual-open .header-open .pt-34{
 padding-top:0!important;
 align-items:center!important;
}

.perpetual-open .header-open .w-180,
.perpetual-open .header-open .w-140{
 height:34px!important;
 line-height:34px!important;
 border-radius:7px!important;
 background:var(--cx127-card)!important;
 color:var(--cx127-text)!important;
 border:1px solid transpare
 font-size:12px!important;
 f
}

.perpetual-open .header-open .w-180{
 width:90px!important;
}

.perpetual-open .header-open .w-140{
 width:78px!important;
 margin-left:9px!important;
}

.perpetual-open .header-open .wor
 width:78px!important;
 height:34px!important;
 padding-left:14px!important;
 padding-right:8px!important;
 font-size:12px!important;
}

.perpetual-open .header-open img.w-22{
 width:10px!important;
 height:auto!important;
}

/* ===== 双栏比例：左下单 / 右盘口 ===== */
.perpetual-open > .pt-30.pb-20{
 padding-top:0!important;
 padding-bottom:8px!important;
}

.perpetual-open > .pt-30.pb-20 > .flex{
 gap:18px!important;
 align-items:flex-start!important;
}

.perpetual-open .w-440.flex.flex-col{
 flex:0 0 calc(58% - 9px)!important;
 width:calc(58% - 9px)!important;
 min-width:0!important;
}

.perpetual-open .deep-data{
 flex:0 0 calc(42% - 9px)!important;
 width:calc(42% - 9px)!important;
 min-width:0!important;
 padding-left:0!important;
}

/* ===== 开多 / 开空 顶部切换 ===== */
.perpetual-open .w-440 > .h-66.rounded-lg{
 height:36px!important;
 min-height:36px!important;
 padding:2px!important;
 border-radius:8px!important;
 background:var(--cx127-card)!important;
}

.perpetual-open .w-440 > .h-66.rounded-lg p{
 height:32px!important;
 min-height:32px!important;
 font-size:12px!important;
 font-weight:800!important;
 color:var(--cx127-sub)!important;
 border-radius:7px!important;
}

.perpetual-open .w-440 > .h-66.rounded-lg p.long{
 color:#fff!important;
 background:var(--cx127-green)!important;
}

/* ===== 市价/限价 ===== */
.perpetual-open .mt-30.mb-30{
 margin-top:9px!important;
 margin-bottom:8px!important;
}

.perpetual-open .cx126-market-control,
.perpetual-open .mt-30.mb-30 > .inputBackground{
 height:38px!important;
 min-height:38px!important;
 line-height:38px!important;
 border-radius:8px!important;
 border:0!important;
 background:var(--cx127-card)!important;
 color:var(--cx127-text)!important;
 font-size:12px!important;
 font-weight:800!important;
}

.perpetual-open .mt-30.mb-30 > .inputBackground img:first-child{
 width:14px!important;
 height:14px!important;
 padding-left:12px!important;
 opacity:.55!important;
}

.perpetual-open .mt-30.mb-30 > .inputBackground img:last-child{
 width:10px!important;
 height:auto!important;
 padding-right:12px!important;
}

/* ===== 所有下单输入卡片 ===== */
.perpetual-open .w-440 > .h-76,
.perpetual-open .w-440 > .cx126-tpsl-row{
 height:39px!important;
 min-height:39px!important;
 line-height:39px!important;
 margin-bottom:8px!important;
 padding-right:11px!important;
 border:0!important;
 border-radius:8px!important;
 background:var(--cx127-card)!important;
 color:var(--cx127-text)!important;
 box-shadow:none!important;
}

.perpetual-open .w-440 > .h-76 input,
.perpetual-open .w-440 > .cx126-tpsl-row input{
 height:39px!important;
 min-height:39px!important;
 line-height:39px!important;
 padding-left:12px!important;
 background:transparent!important;
 color:var(--cx127-text)!important;
 font-size:11px!important;
 font-weight:700!important;
}

.perpetual-open input::placeholder{
 color:var(--cx127-sub)!important;
 opacity:1!important;
 font-size:10px!important;
 font-weight:600!important;
}

.perpetual-open .w-440 > .h-76 span,
.perpetual-open .cx126-tpsl-row span{
 color:var(--cx127-text)!important;
 font-size:10px!important;
 font-weight:800!important;
}

/* 单价0.01 */
.cx126-unit-price{
 display:flex!important;
 width:100%!important;
 height:30px!important;
 margin:0 0 8px 0!important;
 padding:0 11px!important;
 justify-content:space-between!important;
 border:0!important;
 border-radius:7px!important;
 background:var(--cx127-card)!important;
 color:var(--cx127-sub)!important;
 font-size:9px!important;
}
.cx126-unit-price:before{content:"默认单价"!important}
.cx126-unit-price b{
 color:var(--cx127-text)!important;
 font-size:11px!important;
}

/* 数量加减 */
.perpetual-open .w-440.flex.items-center.inputBackground.h-76{
 height:39px!important;
 min-height:39px!important;
 border-radius:8px!important;
 background:var(--cx127-card)!important;
}
.perpetual-open .w-440.flex.items-center.inputBackground.h-76 .w-80{
 width:38px!important;
}
.perpetual-open .w-440.flex.items-center.inputBackground.h-76 img.w-30{
 width:14px!important;
 height:auto!important;
 opacity:.65!important;
}
.perpetual-open .w-440.flex.items-center.inputBackground.h-76 input{
 flex:1!important;
 width:auto!important;
 font-size:11px!important;
}

/* 可开张数 */
.perpetual-open .mt-40.mb-30.w-full{
 margin-top:10px!important;
 margin-bottom:10px!important;
}
.perpetual-open .mt-40.mb-30.w-full span{
 font-size:9px!important;
 color:var(--cx127-sub)!important;
}

/* ===== 滑杆 ===== */
.slider-index{
 margin-top:3px!important;
}
.amount-slider .mainBox{
 width:96%!important;
}
.vue-slider-rail{
 height:2px!important;
 background:var(--cx127-line)!important;
}
.vue-slider-process{
 background:var(--cx127-green)!important;
}
.custom-step{
 width:8px!important;
 height:8px!important;
 border:2px solid var(--cx127-line)!important;
 background:var(--cx127-bg)!important;
 border-radius:50%!important;
 transform:translate(-2px,-3px)!important;
}
.custom-step.active{
 border-color:var(--cx127-text)!important;
}
.vue-slider-dot{
 width:14px!important;
 height:14px!important;
}
.vue-slider-dot-handle{
 width:14px!important;
 height:14px!important;
 border:2px solid var(--cx127-text)!important;
 background:var(--cx127-bg)!important;
 border-radius:50%!important;
}
.poecs{
 margin-top:7px!important;
 color:var(--cx127-sub)!important;
 font-size:8px!important;
}

/* ===== 下单按钮 ===== */
.perpetual-open .w-full.mt-120{
 margin-top:15px!important;
}

.perpetual-open .w-full.mt-120 > .textCol
 margin-bottom:8px!important;
 color:var(--cx127-sub)!important;
 font-size:9px!important;
}

.perpetual-open .btnBackground,
.perpetual-open .btnBackground1,
.perpetual-open [class*="btnBackground"]{
 min-height:42px!important;
 height:42px!important;
 line-height:42px!important;
 border-radius:8px!important;
 font-size:13px!important;
 font-weight:800!important;
 box-shadow:none!important;
}

/* ===== 盘口 ===== */
.deep-data{
 color:var(--cx127-sub)!important;
 font-variant-numeric:tabular-nums!important;
}

.deep-data .font-22,
.deep-data .font-24,
.deep-data .font-26,
.deep-data .font-28,
.deep-data .font-30{
 font-size:9.5px!important;
}

.deep-data .textColor{
 color:var(--cx127-text)!important;
}
.deep-data .text-grey{
 color:var(--cx127-sub)!important;
}
.deep-data .text-red{
 color:var(--cx127-red)!important;
}
.deep-data .text-green{
 color:var(--cx127-green)!important;
}

.deep-data [class*="h-"],
.deep-data [class*="lh-"]{
 line-height:19px!important;
}

.deep-data .flex.justify-between{
 min-height:19px!important;
}

.deep-data .bg-red,
.deep-data [style*="background"][class*="red"]{
 background:var(--cx127-red-soft)!important;
}

.deep-data .bg-green,
.deep-data [style*="background"][class*="green"]{
 background:var(--cx127-green-soft)!important;
}

/* 当前价强调 */
.deep-data .font-40,
.deep-data .font-45,
.deep-data .font-50{
 font-size:17px!important;
 line-height:24px!important;
 font-weight:800!important;
}

/* ===== 持仓/当前委托 ===== */
.line{
 height:7px!important;
 background:var(--cx127-card)!important;
}

.perpetual-open + .line,
.mainBackground > .line{
 background:var(--cx127-card)!important;
}

[data-v-fd92b1e2].pl-30.pr-30{
 padding-left:20px!important;
 padding-right:20px!important;
 background:var(--cx127-bg)!important;
}

[data-v-fd92b1e2] .mt-18{
 margin-top:0!important;
}

[data-v-fd92b1e2] .border-b-color{
 min-height:45px!important;
 align-items:center!important;
 border-bottom:1px solid var(--cx127-line)!important;
}

[data-v-fd92b1e2] .pb-10{
 padding-bottom:0!important;
}

[data-v-fd92b1e2] .px-10.py-10{
 padding:13px 3px 10px!important;
 font-size:12px!important;
 font-weight:800!important;
 color:var(--cx127-sub)!important;
}

[data-v-fd92b1e2] .ml-50{
 margin-left:24px!important;
}

[data-v-fd92b1e2] .active-line{
 position:relative!important;
 color:var(--cx127-text)!important;
}
[data-v-fd92b1e2] .active-line:after{
 content:""!important;
 position:absolute!important;
 left:3px!important;
 right:3px!important;
 bottom:0!important;
 height:2px!important;
 border-radius:2px!important;
 background:var(--cx127-text)!important;
}

[data-v-fd92b1e2] img.w-32{
 width:18px!important;
 height:18px!important;
 padding-right:0!important;
 padding-top:0!important;
 padding-bottom:0!important;
 opacity:.8!important;
}

[data-v-105face8] .py-300{
 padding-top:72px!important;
 padding-bottom:72px!important;
 font-size:11px!important;
 color:var(--cx127-sub)!important;
}

/* ===== K线标题区 ===== */
.fixed.w-full.shadow.z-10.tabBackground1{
 position:relative!important;
 bottom:auto!important;
 box-shadow:none!important;
 background:var(--cx127-bg)!important;
 border-top:1px solid var(--cx127-line)!important;
 border-bottom:1px solid var(--cx127-line)!important;
}
.fixed.w-full.shadow.z-10.tabBackground1 .px-30{
 padding-left:28px!important;
 padding-right:28px!important;
}
.fixed.w-full.shadow.z-10.tabBackground1 span{
 font-size:10px!important;
 color:var(--cx127-text)!important;
}

/* ===== 全局圆角、边框、文字 ===== */
.perpetual-open .rounded-lg{
 border-radius:8px!important;
}
.text-grey{color:var(--cx127-sub)!important}
.textColor{color:var(--cx127-text)!important}
.border-b-color{border-color:var(--cx127-line)!important}

/* ===== 小屏幕 ===== */
@media(max-width:390px){
 .contract-header > div,
 .perpetual-open{
   padding-left:16px!important;
   padding-right:16px!important;
 }
 .cx125-contract-nav{
   padding-left:16px!important;
   padding-right:16px!important;
   gap:17px!important;
 }
 .perpetual-open > .pt-30.pb-20 > .flex{
   gap:11px!important;
 }
 .perpetual-open .w-440.flex.flex-col{
   flex-basis:calc(58% - 6px)!important;
   width:calc(58% - 6px)!important;
 }
 .perpetual-open .deep-data{
   flex-basis:calc(42% - 5px)!important;
   width:calc(42% - 5px)!important;
 }
}

/* 不让旧样式产生夸张阴影 */
.perpetual-open *,
.contract-header *,
[data-v-fd92b1e2] *{
 text-shadow:none!important;
}

/* 图片深浅主题 */
html.cx-theme-light .perpetual-open img,
html[data-theme="light"] .perpetual-open img,
html[data-cx-theme="light"] .perpetual-open img{
 filter:none;
}