/* =================================================
 MOBILE FINAL VERSION
 只影响手机
 不影响PC
================================================= */

@media(max-width:768px){


*{
box-sizing:border-box!important;
}


html,
body{

width:100%!important;
overflow-x:hidden!important;

}



/* =====================
顶部导航【重点改动：申请授权按钮尺寸统一】
===================== */


.navbar{

height:82px!important;

width:100%!important;

padding:0 12px!important;

display:flex!important;

align-items:center!important;

justify-content:space-between!important;

position:relative!important;

z-index:9999!important;

margin-bottom:20px!important;

}



.logo-area{

display:flex!important;

align-items:center!important;

flex-shrink:1!important;

max-width:150px!important;

min-width:0!important;

}



.logo-symbol{

width:40px!important;

height:40px!important;

}



.logo-area h2{

font-size:18px!important;

white-space:nowrap!important;

overflow:hidden!important;

text-overflow:ellipsis!important;

}



.logo-area p{

font-size:9px!important;

white-space:nowrap!important;

}



.navbar nav{

display:flex!important;

overflow-x:auto!important;

gap:12px!important;

max-width:120px!important;

}


.navbar nav a{

font-size:11px!important;

white-space:nowrap!important;

}




.nav-actions{

display:flex!important;

align-items:center!important;

gap:6px!important;

margin-left:auto!important;

flex-shrink:0!important;

}

/* ========== 修改1：登录后台 和 申请授权 按钮宽高统一 ========== */
.nav-actions button:first-child{
display:block!important;
height:36px!important;
font-size:10px!important;
padding:0 10px!important;
min-width:80px!important; /* 和黄金按钮最小宽度对齐 */
white-space:nowrap!important;
background:rgba(255,255,255,.08)!important;
border:1px solid rgba(80,170,255,.5)!important;
color:white!important;
}

.nav-actions .gold-btn{
height:36px!important;
font-size:11px!important;
padding:0 10px!important;
white-space:nowrap!important;
min-width:80px!important; /* 和登录后台宽度保持一致 */
}






/* =====================
首页 HERO
===================== */


.hero{

width:100%!important;
padding:35px 18px!important;
display:block!important;
overflow:hidden!important;

}



.hero-info{

width:100%!important;

}



.system-tag{

font-size:10px!important;
margin-bottom:20px!important;

}



.hero-info h1{

font-size:46px!important;
line-height:1.15!important;

}



.hero-info h3{

font-size:22px!important;
line-height:1.4!important;

}



.feature-mini{

display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:10px!important;

}



.feature-mini span{

font-size:12px!important;
padding:10px 5px!important;
text-align:center!important;

}



.hero-info p{

font-size:14px!important;
line-height:1.8!important;

}



.hero-buttons{

display:flex!important;
gap:10px!important;

}



.hero-buttons button{

flex:1!important;
height:48px!important;

}






/* =====================
数据指标
===================== */


.data-panel{

display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:12px!important;
margin-top:25px!important;

}



.data-panel div{

width:100%!important;
height:85px!important;

}







/* =====================
实时量化交易终端【重点改动：策略按钮容器修复】
===================== */


.quant-terminal{

display:block!important;
width:100%!important;
overflow:hidden!important;
position:relative!important;
padding-bottom:24px!important;
}



.quant-terminal img,
.quant-terminal canvas,
.quant-terminal svg{

max-width:100%!important;

}

/* ========== 修改2：底部策略按钮外层深色容器约束 ========== */
.quant-terminal .strategy-btn-wrap{
    width:100%!important;
    display:grid!important;
    grid-template-columns:repeat(4, 1fr)!important;
    gap:8px!important;
    padding:12px!important;
    background:#142236!important; /*深色底板 */
    border-radius:14px!important;
    margin-top:16px!important;
}

/* 策略子按钮样式统一，文字禁止溢出 */
.quant-terminal .strategy-btn{
    width:100%!important;
    padding:10px 4px!important;
    text-align:center!important;
    font-size:12px!important; /*全部文字统一字号 */
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    border-radius:10px!important;
}







/* =====================
五策略协同
===================== */


.system-modules{

width:100%!important;
display:grid!important;
grid-template-columns:1fr!important;
gap:18px!important;
margin:45px 0 70px!important;
padding:0 18px!important;

}




.module-card{

width:100%!important;
min-height:160px!important;
height:auto!important;
padding:25px 18px!important;
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
overflow:hidden!important;

}



.module-card h3{

font-size:22px!important;
line-height:1.5!important;
white-space:normal!important;
word-break:normal!important;

}



.module-card p{

font-size:14px!important;
line-height:1.7!important;

}







/* =====================
系统核心优势
===================== */


.main-wrap{

width:auto!important;
margin:40px 18px!important;
display:flex!important;
flex-direction:column!important;
gap:30px!important;

}




.left-advantage,
.right-panel{

width:100%!important;
position:relative!important;

}




.left-advantage h2{

font-size:30px!important;
line-height:1.3!important;
margin-bottom:25px!important;

}




.adv-item{

width:100%!important;
min-height:120px!important;
padding:20px!important;
margin-bottom:18px!important;
overflow:hidden!important;

}




.adv-item h4{

font-size:20px!important;

}



.adv-item p{

font-size:14px!important;
line-height:1.7!important;

}








/* =====================
策略实时表现
===================== */


.right-panel{

width:100%!important;
overflow:hidden!important;
min-height:520px!important;

}



.right-inner{

width:100%!important;
padding:18px!important;
overflow:visible!important;

}



.line{

display:grid!important;
grid-template-columns:1fr 1fr 1fr!important;
gap:8px!important;
font-size:13px!important;

}



.chart-box{

width:100%!important;
height:320px!important;
overflow:visible!important;
padding-bottom:30px!important;

}



.chart-box canvas,
.chart-box svg{

width:100%!important;
height:260px!important;
max-width:100%!important;

}








/* =====================
授权 下载 代理 联系
===================== */


.service-area{

width:100%!important;
display:flex!important;
flex-direction:column!important;
gap:25px!important;
padding:30px 18px!important;

}




.service-card{

width:100%!important;
min-height:auto!important;
margin:0!important;
overflow:hidden!important;

}



.service-card h2{

font-size:26px!important;
line-height:1.3!important;

}



.service-card p,
.service-card li{

font-size:14px!important;
line-height:1.7!important;

}








/* =====================
footer
===================== */


.footer-info{

display:flex!important;
flex-direction:column!important;
gap:25px!important;
padding:30px 20px!important;

}




}







/* =====================
小屏手机
===================== */


@media(max-width:390px){



.hero-info h1{

font-size:40px!important;

}




.nav-actions button:first-child{

font-size:9px!important;

}



.nav-actions .gold-btn{

font-size:10px!important;
padding:0 6px!important;

}



.module-card h3{

font-size:20px!important;

}



.left-advantage h2{

font-size:26px!important;

}



.chart-box{

height:280px!important;

}



.chart-box canvas,
.chart-box svg{

height:220px!important;

}

/* 极小屏：底部策略按钮改成2列，防止拥挤 */
.quant-terminal .strategy-btn-wrap{
    grid-template-columns:repeat(2,1fr)!important;
}


}
/* =================================================
 MOBILE FINAL PATCH
 只修复：
 交易终端截断
 五策略显示不全
 策略实时表现重叠
================================================= */


@media(max-width:768px){


/* =========================
 实时量化交易终端
 完整显示
========================= */


.quant-terminal{

width:100%!important;

overflow:visible!important;

padding:0 18px!important;

}



.quant-terminal .terminal-box,
.quant-terminal .market-box,
.quant-terminal .price-box{

width:100%!important;

overflow:visible!important;

}



.quant-terminal .market-list,
.quant-terminal .price-list{

display:grid!important;

grid-template-columns:repeat(3, minmax(0,1fr))!important;

gap:10px!important;

width:100%!important;

}



.quant-terminal .market-card,
.quant-terminal .price-card{

min-width:0!important;

width:100%!important;

overflow:hidden!important;

}



.quant-terminal h3,
.quant-terminal span,
.quant-terminal p{

white-space:normal!important;

overflow-wrap:break-word!important;

}



/* BTUSD 防止右侧切掉 */

.quant-terminal .market-card:last-child{

margin-right:0!important;

}



/* =========================
 收益曲线完整显示
========================= */


.chart-box{


height:260px!important;

min-height:260px!important;

overflow:visible!important;

}



.chart-box canvas,
.chart-box svg{


width:100%!important;

height:220px!important;

max-width:100%!important;

display:block!important;

}



.right-panel{


margin-top:40px!important;

padding-bottom:40px!important;

min-height:600px!important;

overflow:visible!important;

}





/* =========================
 五策略协同
 六个全部显示
========================= */


.system-modules{


display:grid!important;

grid-template-columns:1fr 1fr!important;

gap:15px!important;

height:auto!important;

min-height:auto!important;

overflow:visible!important;

margin-bottom:45px!important;

padding-bottom:20px!important;

}



.module-card{


height:150px!important;

min-height:150px!important;

overflow:hidden!important;

}



.module-card:nth-child(n+5){


margin-bottom:20px!important;


}



/* =========================
 核心优势和实时表现分开
========================= */


.main-wrap{


gap:60px!important;

margin-top:50px!important;

}



.left-advantage{


margin-bottom:40px!important;

}



.left-advantage h2{


margin-bottom:30px!important;

}



.right-panel{


margin-top:50px!important;

}





/* =========================
 防止所有section互相覆盖
========================= */


section,
.hero,
.main-wrap,
.quant-terminal,
.right-panel,
.system-modules{


overflow:visible!important;

height:auto!important;

min-height:auto!important;

}



}


/* 小屏 */

@media(max-width:390px){


.system-modules{


grid-template-columns:1fr!important;

}



.module-card{


height:140px!important;


}



.chart-box{


height:230px!important;


}


}
/* =================================================
 MOBILE 修复层级顺序
 黄金K线 / AI策略 / 五策略
 不影响PC
================================================= */


@media(max-width:768px){


/* =========================
 黄金实时K线区域
 强制完整占位
========================= */


.quant-terminal{

position:relative!important;

z-index:2!important;

height:auto!important;

min-height:420px!important;

margin-bottom:50px!important;

overflow:visible!important;

}




/* K线图容器 */

.quant-terminal .chart-box,
.quant-terminal .kline-box,
.quant-terminal canvas,
.quant-terminal svg{


position:relative!important;

z-index:3!important;

}



.quant-terminal canvas,
.quant-terminal svg{

height:auto!important;

max-height:320px!important;

}




/* =========================
 AI策略预期/策略运行区域
 与K线分开
========================= */


.right-panel{


position:relative!important;

z-index:2!important;

margin-top:50px!important;

margin-bottom:60px!important;

clear:both!important;

}




/* 策略实时表现标题 */

.right-panel h3{


margin-top:25px!important;

margin-bottom:25px!important;

}





/* =========================
 五策略协同
 永远排在后面
========================= */


.system-modules{


position:relative!important;

z-index:5!important;

clear:both!important;

margin-top:60px!important;

padding-top:20px!important;

}



.system-modules::before{


content:"";

display:block;

height:20px;


}



/* 卡片不要覆盖其它区域 */

.module-card{


position:relative!important;

z-index:6!important;

}



/* =========================
 防止父级裁剪
========================= */


section,
.hero,
.main-wrap,
.quant-terminal,
.right-panel,
.system-modules{


overflow:visible!important;

height:auto!important;

min-height:auto!important;

}



}



/* 小屏手机 */

@media(max-width:390px){


.quant-terminal{


min-height:380px!important;

margin-bottom:40px!important;


}



.system-modules{


margin-top:50px!important;


}



}