/* =================================================
 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;

}



.nav-actions button:first-child{


display:block!important;

height:36px!important;

font-size:10px!important;

padding:0 6px!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 8px!important;

white-space:nowrap!important;

min-width:70px!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;

}



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


max-width:100%!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;

}


}
/* =================================================
 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{


height:auto!important;

min-height:auto!important;

overflow:visible!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;


}



}
/* =================================================
 MOBILE 最终调整
 顶部导航 + AI策略运行
================================================= */


@media(max-width:768px){


/* ===========================
 顶部导航重新布局
=========================== */


.navbar{

height:78px!important;

padding:0 12px!important;

display:flex!important;

align-items:center!important;

overflow:hidden!important;

}



.logo-area{

flex:1!important;

min-width:0!important;

max-width:160px!important;

}



.logo-symbol{

width:38px!important;

height:38px!important;

}



.logo-area h2{

font-size:18px!important;

white-space:nowrap!important;

}




/* 导航文字区域让位 */

.navbar nav{

flex:1!important;

max-width:120px!important;

overflow:hidden!important;

display:flex!important;

justify-content:center!important;

gap:10px!important;

}



.navbar nav a{

font-size:12px!important;

white-space:nowrap!important;

}




/* 两个按钮统一 */

.nav-actions{


display:flex!important;

gap:8px!important;

flex-shrink:0!important;


}



.nav-actions button:first-child,
.nav-actions .gold-btn{


height:40px!important;

width:auto!important;

min-width:88px!important;

padding:0 14px!important;

font-size:13px!important;

white-space:nowrap!important;

border-radius:8px!important;


}




@media(max-width:390px){


.nav-actions button:first-child,
.nav-actions .gold-btn{


min-width:78px!important;

padding:0 10px!important;

font-size:12px!important;


}



.navbar nav{

display:none!important;

}


}





/* ===========================
 AI策略运行区域
 改成手机纵向
=========================== */


.right-panel{


width:100%!important;

height:auto!important;

margin-top:60px!important;

margin-bottom:60px!important;

overflow:visible!important;


}



.right-inner{


width:100%!important;

padding:20px!important;

overflow:visible!important;


}




/* 策略状态列表 */

.line{


display:flex!important;

flex-direction:column!important;

gap:15px!important;

width:100%!important;

overflow:visible!important;


}



/* 每一个策略 */

.line > *{


width:100%!important;

min-height:70px!important;

display:flex!important;

align-items:center!important;

justify-content:space-between!important;

padding:15px!important;

box-sizing:border-box!important;


}




/* AI策略运行标题 */


.right-inner h3{


font-size:26px!important;

margin-bottom:30px!important;


}





/* 收益曲线 */

.chart-box{


width:100%!important;

height:260px!important;

overflow:hidden!important;

margin-top:30px!important;


}



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


width:100%!important;

height:220px!important;


}





}
/* =====================================
   MOBILE FINAL LAYOUT FIX
   顶部导航 + AI策略 + K线
===================================== */

@media(max-width:768px){


/* =====================
 顶部导航修复
===================== */

.navbar{

height:82px!important;
padding:0 14px!important;

display:flex!important;
align-items:center!important;

overflow:hidden!important;

}


.logo-area{

display:flex!important;

align-items:center!important;

flex:1!important;

min-width:0!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;

}



.nav-actions{

display:flex!important;

align-items:center!important;

gap:12px!important;

flex-shrink:0!important;

}



.nav-actions button{

height:48px!important;

border-radius:12px!important;

font-size:14px!important;

padding:0 18px!important;

white-space:nowrap!important;

}



.nav-actions button:first-child{

width:auto!important;

min-width:100px!important;

}



.nav-actions .gold-btn{

width:auto!important;

min-width:120px!important;

}







/* =====================
 黄金K线区域
===================== */


.chart-kline,
.gold-chart,
.kline-box{


width:calc(100% - 36px)!important;

margin:25px 18px!important;

height:230px!important;

overflow:hidden!important;

}



.chart-kline canvas,
.gold-chart canvas,
.kline-box canvas{


width:100%!important;

height:200px!important;

}








/* =====================
 AI策略运行区域
===================== */


.strategy-running,
.ai-strategy,
.strategy-panel{


width:calc(100% - 36px)!important;

margin:35px 18px!important;

height:auto!important;

overflow:hidden!important;

display:block!important;

}





.strategy-running .item,
.ai-strategy .item,
.strategy-panel .item{


width:100%!important;

height:95px!important;

margin-bottom:16px!important;

display:flex!important;

align-items:center!important;

justify-content:space-between!important;

padding:18px!important;

border-radius:18px!important;

}





.strategy-running h3,
.ai-strategy h3,
.strategy-panel h3{


font-size:18px!important;

line-height:1.3!important;

}





.strategy-running span,
.ai-strategy span,
.strategy-panel span{


font-size:22px!important;

font-weight:700!important;

}








/* =====================
 五策略协同
 防止重叠
===================== */


.system-modules{


margin-top:60px!important;

padding:0 18px!important;

display:flex!important;

flex-direction:column!important;

gap:22px!important;

}




.module-card{


width:100%!important;

min-height:160px!important;

height:auto!important;

padding:25px 18px!important;

display:flex!important;

justify-content:center!important;

align-items:center!important;

text-align:center!important;

}



.module-card h3{


font-size:22px!important;

margin-bottom:15px!important;

}



.module-card p{


font-size:15px!important;

line-height:1.7!important;

}





}






/* 小屏手机 */

@media(max-width:390px){



.nav-actions{

gap:6px!important;

}



.nav-actions button:first-child{

min-width:90px!important;

padding:0 10px!important;

font-size:12px!important;

}



.nav-actions .gold-btn{

min-width:105px!important;

font-size:12px!important;

}



.strategy-running .item,
.ai-strategy .item,
.strategy-panel .item{


height:85px!important;

}



.module-card h3{

font-size:20px!important;

}



}
/* ======================================
 MOBILE OVERRIDE FINAL
 覆盖前面所有重复手机CSS
====================================== */

@media(max-width:768px){


/* ===== 顶部导航 ===== */

.navbar{
height:78px!important;
padding:0 12px!important;
display:flex!important;
align-items:center!important;
overflow:hidden!important;
}



.logo-area{
flex:none!important;
width:160px!important;
max-width:160px!important;
}



.logo-area h2{
font-size:18px!important;
overflow:visible!important;
white-space:nowrap!important;
}




.navbar nav{
display:none!important;
}




.nav-actions{
margin-left:auto!important;
display:flex!important;
gap:8px!important;
flex:none!important;
}



.nav-actions button:first-child,
.nav-actions .gold-btn{

height:40px!important;
font-size:13px!important;
border-radius:10px!important;
padding:0 12px!important;
min-width:auto!important;

}



.nav-actions button:first-child{

width:95px!important;

}



.nav-actions .gold-btn{

width:120px!important;

}




/* ===== 黄金K线 ===== */

.quant-terminal{

width:100%!important;
padding:0 18px!important;
overflow:visible!important;
margin-bottom:60px!important;

}



.chart-box,
.kline-box,
.gold-chart{

width:100%!important;
height:230px!important;
overflow:hidden!important;

}




/* ===== AI策略运行 ===== */


.right-panel{

width:100%!important;
margin-top:80px!important;
margin-bottom:80px!important;
overflow:visible!important;

}



.right-inner{

padding:18px!important;

}



.line{

display:flex!important;
flex-direction:column!important;
gap:15px!important;
width:100%!important;

}



.line>*{

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

display:flex!important;
align-items:center!important;
justify-content:space-between!important;

padding:15px!important;

}




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


.system-modules{

display:flex!important;
flex-direction:column!important;

width:100%!important;

padding:0 18px!important;

gap:20px!important;

margin-top:80px!important;

}




.module-card{

width:100%!important;

height:150px!important;

min-height:150px!important;

overflow:hidden!important;

}



.module-card h3{

font-size:22px!important;

}




}


/* 小屏 */

@media(max-width:390px){


.logo-area{

width:130px!important;

}


.nav-actions button:first-child{

width:85px!important;

font-size:12px!important;

}


.nav-actions .gold-btn{

width:105px!important;

font-size:12px!important;

}



.system-modules{

gap:18px!important;

}



.module-card{

height:140px!important;

}

}