/* ============ StockLab 设计系统 ============ */
:root{
  --bg:#0a0d12;
  --bg-soft:#0d1219;
  --panel:#111721;
  --panel-2:#161e2a;
  --panel-3:#1b2431;
  --line:#1e2733;
  --line-soft:#18202b;
  --t1:#e8eef6;
  --t2:#8b98a9;
  --t3:#5c6a7a;
  --brand:#3d7eff;
  --brand-soft:rgba(61,126,255,.12);
  --up:#f0484f;
  --up-soft:rgba(240,72,79,.12);
  --down:#12b886;
  --down-soft:rgba(18,184,134,.12);
  --gold:#d9a441;
  --gold-soft:rgba(217,164,65,.12);
  --radius:10px;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:var(--bg);color:var(--t1);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:14px}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.up{color:var(--up)} .down{color:var(--down)} .muted{color:var(--t2)} .dim{color:var(--t3)}
/* 表格内的涨跌色需要提高特异性，否则被 .table td 覆盖 */
.table td.up, .table td .up{color:var(--up)}
.table td.down, .table td .down{color:var(--down)}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:#232e3c;border-radius:6px}
::-webkit-scrollbar-track{background:transparent}

/* ============ 登录页 ============ */
.auth-body{display:flex;align-items:stretch;min-height:100vh}
.auth-shell{display:grid;grid-template-columns:1fr 460px;width:100%;min-height:100vh}
.auth-brand{
  position:relative;padding:44px 56px;display:flex;flex-direction:column;overflow-y:auto;
  background:
    radial-gradient(900px 480px at 12% 8%, rgba(61,126,255,.10), transparent 70%),
    radial-gradient(700px 420px at 88% 92%, rgba(18,184,134,.07), transparent 70%),
    var(--bg-soft);
  border-right:1px solid var(--line);overflow:hidden;
}
.brand-top{display:flex;align-items:center;gap:12px}
.logo-mark{width:42px;height:42px;border-radius:11px;background:#111a26;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center}
.logo-name{font-size:16px;font-weight:600;letter-spacing:.01em}
.logo-sub{font-size:12px;color:var(--t3);margin-top:1px}
.brand-copy{margin-top:auto;max-width:560px}
.brand-copy h1{font-size:40px;line-height:1.25;font-weight:600;letter-spacing:-.02em}
.brand-copy p{margin-top:20px;color:var(--t2);font-size:14.5px;line-height:1.85}
.brand-copy b{color:var(--t1);font-weight:500}
.brand-points{margin-top:34px;display:grid;grid-template-columns:1fr 1fr;gap:15px 30px;max-width:580px}
.bp{display:flex;gap:12px}
.bp-idx{font-family:var(--mono);font-size:11px;color:var(--brand);padding-top:2px}
.bp h4{font-size:13.5px;font-weight:500}
.bp p{font-size:12.5px;color:var(--t3);margin-top:2px}
.brand-deco{margin-top:auto;padding-top:24px;opacity:.8}
.brand-deco svg{width:100%;height:90px}

.auth-form-side{display:flex;flex-direction:column;justify-content:center;align-items:center;
  padding:48px 40px;background:var(--bg)}
.auth-card{width:100%;max-width:340px}
.auth-card h2{font-size:22px;font-weight:600;letter-spacing:-.01em}
.auth-hint{color:var(--t3);font-size:13px;margin-top:8px;line-height:1.7}
.field{display:block;margin-top:22px}
.field>span{display:block;font-size:12.5px;color:var(--t2);margin-bottom:7px}
.field input{
  width:100%;padding:11px 13px;background:var(--panel);border:1px solid var(--line);
  border-radius:8px;color:var(--t1);outline:none;transition:border-color .15s,background .15s;
}
.field input:focus{border-color:var(--brand);background:var(--panel-2)}
.field input::placeholder{color:var(--t3)}
.field-row{display:flex;justify-content:space-between;align-items:center;margin-top:16px;font-size:12.5px}
.check{display:flex;align-items:center;gap:7px;color:var(--t2);cursor:pointer}
.check input{accent-color:var(--brand)}
.link-muted{color:var(--t3);cursor:pointer}
.link-muted:hover{color:var(--t2)}
.btn-primary{
  width:100%;margin-top:24px;padding:12px;border-radius:8px;
  background:var(--brand);color:#fff;font-size:14px;font-weight:500;
  transition:filter .15s,opacity .15s;
}
.btn-primary:hover{filter:brightness(1.08)}
.btn-primary:disabled{opacity:.6;cursor:not-allowed}
.form-error{display:none;margin-top:14px;font-size:12.5px;color:var(--up);
  background:var(--up-soft);padding:9px 12px;border-radius:7px;line-height:1.6}
.form-error.show{display:block}
.auth-foot{display:flex;gap:8px;margin-top:36px;font-size:11.5px;color:var(--t3);justify-content:center}
.dot-sep{opacity:.5}
.auth-legal{max-width:340px;margin-top:20px;font-size:11px;color:var(--t3);line-height:1.7;text-align:center}
@media(max-width:900px){
  .auth-shell{grid-template-columns:1fr}
  .auth-brand{display:none}
}

/* ============ 应用框架 ============ */
.shell{display:grid;grid-template-columns:228px 1fr;height:100vh;overflow:hidden}
.sidebar{
  background:var(--bg-soft);border-right:1px solid var(--line);
  display:flex;flex-direction:column;overflow:hidden;
}
.sb-head{padding:18px 18px 14px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line-soft)}
.sb-head .logo-mark{width:32px;height:32px;border-radius:9px}
.sb-head .logo-mark svg{width:20px;height:20px}
.sb-name{font-size:13.5px;font-weight:600}
.sb-ver{font-size:10.5px;color:var(--t3);font-family:var(--mono)}
.sb-nav{padding:12px 10px;overflow-y:auto;flex:1}
.nav-group{margin-bottom:18px}
.nav-label{font-size:10.5px;color:var(--t3);letter-spacing:.09em;text-transform:uppercase;
  padding:0 10px 7px;font-weight:500}
.nav-item{
  display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:7px;
  color:var(--t2);font-size:13px;cursor:pointer;transition:background .12s,color .12s;margin-bottom:1px;
}
.nav-item:hover{background:var(--panel);color:var(--t1)}
.nav-item.active{background:var(--brand-soft);color:#a9c4ff}
.nav-item .ico{width:15px;height:15px;flex-shrink:0;opacity:.85}
.nav-item .tail{margin-left:auto;font-size:10px;padding:1px 6px;border-radius:20px;
  background:var(--panel-3);color:var(--t3);font-family:var(--mono)}
.sb-foot{padding:12px 14px;border-top:1px solid var(--line-soft);font-size:11.5px;color:var(--t3)}
.sb-user{display:flex;align-items:center;gap:9px}
.avatar{width:26px;height:26px;border-radius:50%;background:var(--panel-3);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--t2);font-weight:500}
.sb-user .uname{color:var(--t1);font-size:12.5px}
.sb-user .urole{color:var(--t3);font-size:10.5px}
.logout{margin-left:auto;color:var(--t3);font-size:11px;cursor:pointer;padding:3px 6px;border-radius:5px}
.logout:hover{background:var(--panel-3);color:var(--up)}

.main{overflow-y:auto;overflow-x:hidden;background:var(--bg)}
.topbar{
  position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:16px;
  padding:13px 26px;background:rgba(10,13,18,.86);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.tb-title{font-size:15px;font-weight:600}
.tb-sub{font-size:11.5px;color:var(--t3);margin-top:1px}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:12px;color:var(--t3)}
.status-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);display:inline-block;margin-right:6px;
  box-shadow:0 0 0 3px rgba(217,164,65,.14)}
.content{padding:22px 26px 60px;max-width:1500px}

/* ============ 通用组件 ============ */
.row{display:flex;gap:14px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g-side{grid-template-columns:1fr 340px}
@media(max-width:1200px){.g4{grid-template-columns:repeat(2,1fr)}.g-side{grid-template-columns:1fr}}
@media(max-width:900px){.g2,.g3,.g4{grid-template-columns:1fr}}

.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px}
.card-h{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.card-h h3{font-size:13.5px;font-weight:500}
.card-h .sub{font-size:11.5px;color:var(--t3);margin-left:auto}
.card-h .more{font-size:11.5px;color:var(--brand);cursor:pointer;margin-left:auto}

.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.kpi .k{font-size:11.5px;color:var(--t3);display:flex;align-items:center;gap:6px}
.kpi .v{font-size:23px;font-weight:600;margin-top:8px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kpi .d{font-size:11.5px;margin-top:5px;color:var(--t3);display:flex;align-items:center;gap:6px}

.badge{display:inline-block;font-size:10.5px;padding:2px 8px;border-radius:20px;font-weight:500;
  background:var(--panel-3);color:var(--t2);line-height:1.6}
.badge.b-brand{background:var(--brand-soft);color:#8fb6ff}
.badge.b-up{background:var(--up-soft);color:#ff8a8f}
.badge.b-down{background:var(--down-soft);color:#4fd6ab}
.badge.b-gold{background:var(--gold-soft);color:#e8bf72}
.badge.b-line{background:transparent;border:1px solid var(--line);color:var(--t2)}

.btn{padding:7px 13px;border-radius:7px;font-size:12.5px;border:1px solid var(--line);
  background:var(--panel-2);color:var(--t2);transition:.12s}
.btn:hover{background:var(--panel-3);color:var(--t1)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{filter:brightness(1.1)}
.btn.sm{padding:4px 10px;font-size:11.5px}

.table{width:100%;border-collapse:collapse;font-size:12.5px}
.table th{text-align:left;font-size:11px;color:var(--t3);font-weight:500;letter-spacing:.03em;
  padding:0 12px 9px 0;border-bottom:1px solid var(--line)}
.table td{padding:10px 12px 10px 0;border-bottom:1px solid var(--line-soft);color:var(--t2);
  font-variant-numeric:tabular-nums}
.table tr:last-child td{border-bottom:none}
.table td:first-child{color:var(--t1);font-weight:500}
.table tbody tr:hover{background:var(--panel-2)}
.table .r{text-align:right}

/* 环境雷达 */
.regime-hero{display:grid;grid-template-columns:200px 1fr;gap:26px;align-items:center}
.regime-badge-big{
  font-size:26px;font-weight:600;letter-spacing:-.02em;line-height:1.3;
}
.regime-meta{font-size:12.5px;color:var(--t2);margin-top:10px;line-height:1.8}
.dim-row{display:grid;grid-template-columns:64px 1fr 44px;gap:12px;align-items:center;margin-bottom:11px}
.dim-name{font-size:12px;color:var(--t2)}
.dim-bar{height:5px;background:var(--panel-3);border-radius:3px;overflow:hidden;position:relative}
.dim-bar i{display:block;height:100%;border-radius:3px;background:var(--brand)}
.dim-val{font-size:11.5px;color:var(--t1);text-align:right;font-family:var(--mono)}

/* 战法卡 */
.strat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.strat-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:15px 16px;cursor:pointer;transition:.14s;position:relative;overflow:hidden;
}
.strat-card:hover{border-color:#2c3a4d;background:var(--panel-2);transform:translateY(-1px)}
.strat-card .sc-top{display:flex;align-items:flex-start;gap:8px}
.strat-card h4{font-size:13.5px;font-weight:500;flex:1}
.strat-card .sc-logic{font-size:12px;color:var(--t2);margin-top:8px;line-height:1.7;min-height:40px}
.strat-card .sc-foot{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.strat-card .sc-metric{display:flex;gap:16px;margin-top:12px;padding-top:11px;border-top:1px solid var(--line-soft)}
.strat-card .sc-metric div{font-size:10.5px;color:var(--t3)}
.strat-card .sc-metric b{display:block;font-size:13px;color:var(--t1);font-weight:500;font-variant-numeric:tabular-nums}

/* 抽屉 */
.drawer-mask{position:fixed;inset:0;background:rgba(3,5,8,.6);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity .2s;z-index:60}
.drawer-mask.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100vh;width:520px;max-width:92vw;background:var(--bg-soft);
  border-left:1px solid var(--line);transform:translateX(100%);transition:transform .24s cubic-bezier(.4,0,.2,1);
  z-index:61;display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer-h{padding:18px 22px;border-bottom:1px solid var(--line);display:flex;align-items:flex-start;gap:12px}
.drawer-h h3{font-size:16px;font-weight:600;flex:1}
.drawer-b{padding:20px 22px;overflow-y:auto;flex:1}
.drawer-x{color:var(--t3);cursor:pointer;font-size:18px;line-height:1;padding:2px 4px}
.drawer-x:hover{color:var(--t1)}
.sec-t{font-size:11px;color:var(--t3);letter-spacing:.07em;text-transform:uppercase;margin:20px 0 8px}
.sec-t:first-child{margin-top:0}
.kv{display:grid;grid-template-columns:88px 1fr;gap:8px 12px;font-size:12.5px}
.kv dt{color:var(--t3)}
.kv dd{color:var(--t2);line-height:1.7}
.rule-list{list-style:none;font-size:12.5px;color:var(--t2)}
.rule-list li{position:relative;padding-left:14px;margin-bottom:7px;line-height:1.7}
.rule-list li::before{content:"";position:absolute;left:0;top:8px;width:4px;height:4px;border-radius:50%;
  background:var(--brand);opacity:.7}

/* 表单 */
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.fg{display:block}
.fg>span{display:block;font-size:11.5px;color:var(--t3);margin-bottom:6px}
.fg input,.fg select{width:100%;padding:9px 11px;background:var(--panel-2);border:1px solid var(--line);
  border-radius:7px;color:var(--t1);outline:none;font-size:13px}
.fg input:focus,.fg select:focus{border-color:var(--brand)}
.fg.full{grid-column:1/-1}

/* 空状态 */
.empty{text-align:center;padding:44px 20px;color:var(--t3);font-size:12.5px;line-height:1.9}
.empty .e-ico{width:38px;height:38px;margin:0 auto 12px;border-radius:10px;background:var(--panel-2);
  border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--t3)}

/* 提示条 */
.notice{display:flex;gap:10px;padding:11px 14px;border-radius:8px;font-size:12px;line-height:1.7;
  background:var(--gold-soft);border:1px solid rgba(217,164,65,.22);color:#d9bd8a;margin-bottom:16px}
.notice b{color:var(--gold);font-weight:500}

.page{display:none}
.page.active{display:block}
.chart{width:100%;height:200px}
.chart.sm{height:120px}
.legend{display:flex;gap:16px;font-size:11px;color:var(--t3);margin-top:8px}
.legend i{display:inline-block;width:8px;height:2px;margin-right:5px;vertical-align:middle}


/* ============ 视觉增强 · 终端质感 ============ */

/* 主区域：光晕 + 细网格，营造纵深 */
.main{
  background-color:var(--bg);
  background-image:
    radial-gradient(1100px 520px at 10% -10%, rgba(61,126,255,.095), transparent 62%),
    radial-gradient(820px 460px at 94% 106%, rgba(47,191,143,.05), transparent 62%),
    linear-gradient(rgba(255,255,255,.019) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.019) 1px, transparent 1px);
  background-size:auto, auto, 64px 64px, 64px 64px;
  background-attachment:fixed, fixed, fixed, fixed;
}

/* 侧边栏：顶部渐隐 + 激活项光条 */
.sidebar{
  background-image:linear-gradient(180deg, rgba(61,126,255,.055), transparent 220px);
}
.nav-item{position:relative}
.nav-item.active::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:3px;height:18px;border-radius:0 3px 3px 0;background:var(--brand);
  box-shadow:0 0 10px rgba(61,126,255,.9);
}
.nav-item.active{background:linear-gradient(90deg, rgba(61,126,255,.16), rgba(61,126,255,.05))}

/* Logo 呼吸光 */
.logo-mark{
  box-shadow:0 0 0 1px rgba(61,126,255,.14), 0 0 26px -8px rgba(61,126,255,.55);
}

/* 卡片微交互 */
.card,.kpi{
  transition:border-color .18s ease, box-shadow .2s ease, background .18s ease;
}
.card:hover,.kpi:hover{
  border-color:#2b3849;
  box-shadow:0 8px 32px -14px rgba(0,0,0,.7), inset 0 0 0 1px rgba(61,126,255,.05);
}

/* 数字微光 */
.kpi .v{text-shadow:0 0 30px rgba(61,126,255,.18)}
.kpi{animation:kpiIn .5s cubic-bezier(.2,.7,.3,1) both}
@keyframes kpiIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* 页面切换 */
.page.active{animation:pageIn .32s cubic-bezier(.2,.7,.3,1)}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* 顶栏 */
.topbar{box-shadow:0 1px 0 rgba(61,126,255,.07)}
.status-dot{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.55}50%{opacity:1}}

/* 主按钮 */
.btn.primary{
  background:linear-gradient(180deg,#4a86ff,#3168d8);
  box-shadow:0 6px 20px -10px rgba(61,126,255,.9);
  transition:box-shadow .2s ease, filter .15s ease;
}
.btn.primary:hover{box-shadow:0 8px 28px -8px rgba(61,126,255,.95);filter:brightness(1.07)}

/* 抽屉 */
.drawer{box-shadow:-28px 0 70px -24px rgba(0,0,0,.8)}

/* 登录页光晕与呼吸 */
.auth-brand{
  background:
    radial-gradient(900px 480px at 12% 6%, rgba(61,126,255,.13), transparent 68%),
    radial-gradient(700px 420px at 88% 94%, rgba(47,191,143,.07), transparent 68%),
    #0b0f16;
}
.auth-brand::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(620px 320px at 18% 22%, rgba(61,126,255,.07), transparent 70%);
  animation:breathe 9s ease-in-out infinite;
}
@keyframes breathe{0%,100%{opacity:.45}50%{opacity:1}}
.brand-copy,.brand-quotes,.brand-deco,.brand-top{position:relative;z-index:1}

/* 名言 */
.brand-quotes{margin-top:34px;display:grid;gap:22px;max-width:520px}
.bq{position:relative;padding-left:18px;border-left:1px solid rgba(61,126,255,.26)}
.bq::before{
  content:"";position:absolute;left:-1px;top:0;width:1px;height:22px;
  background:var(--brand);box-shadow:0 0 10px rgba(61,126,255,.75);
}
.bq-idx{
  font-family:var(--mono);font-size:10.5px;color:var(--brand);
  letter-spacing:.14em;margin-bottom:7px;
}
.bq p{font-size:15px;line-height:2;color:#8b98a9;margin:0;letter-spacing:.005em}
.bq b{color:#e8eef6;font-weight:500}
.bq:last-child p{font-size:14.5px}

/* 登录按钮 */
.btn-primary{
  background:linear-gradient(180deg,#4a86ff,#3168d8);
  box-shadow:0 8px 24px -12px rgba(61,126,255,.95);
  transition:box-shadow .2s ease, filter .15s ease;
}
.btn-primary:hover{box-shadow:0 10px 30px -8px rgba(61,126,255,1);filter:brightness(1.07)}

/* 表单聚焦光 */
.field input:focus{box-shadow:0 0 0 3px rgba(61,126,255,.12)}


/* 任务开关 */
.switch{
  width:30px;height:17px;border-radius:20px;background:var(--panel-3);
  border:1px solid var(--line);position:relative;cursor:pointer;flex-shrink:0;
  transition:background .18s ease, border-color .18s ease;
}
.switch::after{
  content:"";position:absolute;top:2px;left:2px;width:11px;height:11px;
  border-radius:50%;background:#5c6a7a;transition:left .18s ease, background .18s ease;
}
.switch.on{background:rgba(61,126,255,.24);border-color:rgba(61,126,255,.55)}
.switch.on::after{left:15px;background:var(--brand);box-shadow:0 0 8px rgba(61,126,255,.8)}
.switch:hover{border-color:#33415a}


/* 图表悬浮提示 */
.chart-tip{
  position:absolute;pointer-events:none;background:rgba(13,17,23,.97);
  border:1px solid #2b3849;border-radius:8px;padding:9px 12px;font-size:11.5px;
  color:#9aa7b4;line-height:1.8;min-width:158px;opacity:0;transition:opacity .12s ease;
  box-shadow:0 10px 30px -14px rgba(0,0,0,.9);z-index:5;
  font-variant-numeric:tabular-nums;
}
.chart-tip.show{opacity:1}
.chart-tip .tt-date{color:#e6edf3;font-weight:500;margin-bottom:5px;font-size:12px}
.chart-tip .tt-row{display:flex;justify-content:space-between;gap:16px}
.chart-tip .tt-row b{color:#e6edf3;font-weight:500}
.chart-tip .tt-sep{height:1px;background:#1e2733;margin:6px 0}


/* 战法卡：没有实测结果时的说明文字，代替原来的假数字 */
.sc-noresult{
  font-size:11.5px;line-height:1.6;color:#8b98a9;
  padding:8px 0 2px;border-top:1px dashed #243040;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}