/* ================================================================================
   实盘回测大师 · Design System v2「深色电影感」
   --------------------------------------------------------------------------------
   定位：整体替换 index.html 现有 <style> 块的唯一样式表（零框架、零预处理器、零构建）。
   影调：墨蓝黑三级纵深 + 金/青/红三点缀色；卡片不靠描边靠明度差分层；
        「没有一个词提电影，但每一眼都是电影」——只有调色、光影、景深、
        镜头缓动、黑场转场、颗粒、定格，无任何直白道具元素。

   ■ 对接说明（index.html 需要做的两处改动，本文件不改动它）
     1. 删除 <head> 内整块 <style>…</style>
     2. 替换为 <link rel="stylesheet" href="v2-style.css">
     3. <meta name="theme-color" content="#0b0f16">
     4. 三档强度由 JS 切换 body 类：默认(无类)=full；body.cine-lite=精简；body.cine-off=静态

   ■ Design Tokens 清单（:root）
     明度纵深  --bg0 #0b0f16(页面底) / --bg1 #12171f(卡片) / --bg2 #1a212c(浮层·输入·悬停)
     强调色    --gold #d4a94e(盈利·主按钮·高光) / --cyan #5aa9c7(信息·基准·链接) / --red #e05a5a(亏损·危险)
     涨跌语义  --up = --red(涨,中国习惯) / --down #3f9e6e(跌,墨绿)
     文字三级  --tx0 近白 / --tx1 次要 / --tx2 弱化
     线条      --line / --line-soft（1px 低透明亮色）
     镜头缓动  --cine cubic-bezier(.16,.84,.3,1)；时长 --t1 240ms / --t2 600ms / --t3 1200ms
     圆角      --r1 8px / --r2 12px / --r3 18px
     阴影/辉光 --sh1/--sh2/--sh3；--glow-gold/--glow-red；卡片顶部 inset 内高光
     字级      --fs-hero/--fs-title/--fs-body/--fs-sub/--fs-cap
     兼容别名  --brand/--sub/--faint/--text/--ink/--card/--bg/--line* 等旧变量名全部保留映射，
               供 index.html 内联样式与 JS 模板字符串引用，不会出现裸样式。

   ■ 类名目录
     布局       header/.logo/.tabs/.tab/.tab-ink/main/.panel/.grid/.card
     表单       button(.gray/.danger)/input/select/textarea/.form-row/.field-err
     反馈       .toast-wrap/.toast-item/.prog 系列/.sk(骨架)/.skeleton(旧别名)/.retry-bar/.empty-state
     弹层       .modal-mask/.modal-card(.danger)
     步骤       .step-bar(.done/.cur)/.roadmap/.rm-*(旧四步路线图)
     数据       .tier-head/.pnl/.up/.down/.kv/table/.table-wrap/th.sortable/.chart-box/.flt-bar(.chip)
     记录       .run-item(.sel/.picked)/.run-del/.run-pick/.badge/.toggle-runs/.cmp-bar
     AI 对话    #ai-chat/.msg(.user/.ai/.thinking)/.chips/.chip(.on)/.eng-tag/.ai-chat-flash
     图表交互   .xhair/.xhair-x/.xhair-y/.xhair-tip
     电影层     #cine-root/.cine-veil/.cine-year/.cine-narr/.cine-final/.cine-skip/.grain/.vignette
     其他       .plan-card/.hl-系列/.pay-系列/.op-系列/.next-step/.badge/#auth-gate/.gate-tab/.muted/.hint-系列
   ================================================================================ */

/* === 1. Design Tokens === */
:root {
  /* 明度纵深（不靠描边靠明度分层） */
  --bg0: #0b0f16;
  --bg1: #12171f;
  --bg2: #1a212c;

  /* 点缀色（一个画面一个色调，只有这三个） */
  --gold: #d4a94e;
  --gold-hi: #e8c476;
  --gold-deep: #a8832f;
  --cyan: #5aa9c7;
  --cyan-dim: #3d7d99;
  --red: #e05a5a;
  --red-deep: #b33a3a;

  /* 涨跌语义（中国习惯：红涨绿跌，绿调低饱和墨绿融入影调） */
  --up: #e05a5a;
  --down: #3f9e6e;
  --ok: #3f9e6e;

  /* 文字三级 */
  --tx0: #e9edf4;
  --tx1: #9aa5b6;
  --tx2: #5f6b7e;

  /* 分割线：1px 低透明亮色 */
  --line: rgba(233, 237, 244, .09);
  --line-soft: rgba(233, 237, 244, .05);

  /* 镜头缓动与时长三档 */
  --cine: cubic-bezier(.16, .84, .3, 1);
  --t1: 240ms;
  --t2: 600ms;
  --t3: 1200ms;

  /* 圆角分级 */
  --r1: 8px;
  --r2: 12px;
  --r3: 18px;

  /* 阴影分级（暗场里阴影深而柔，辉光替代描边做层级） */
  --sh1: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .22);
  --sh2: 0 2px 6px rgba(0, 0, 0, .34), 0 14px 36px rgba(0, 0, 0, .34);
  --sh3: 0 8px 20px rgba(0, 0, 0, .42), 0 30px 70px rgba(0, 0, 0, .5);
  --glow-gold: 0 0 18px rgba(212, 169, 78, .35);
  --glow-red: 0 0 22px rgba(224, 90, 90, .3);

  /* 卡片「胶片打光」：极淡顶部内高光 + 柔和外阴影 */
  --card-light: inset 0 1px 0 rgba(255, 255, 255, .045);

  /* 字级阶梯 */
  --fs-hero: 30px;
  --fs-title: 15.5px;
  --fs-body: 14px;
  --fs-sub: 12.5px;
  --fs-cap: 11.5px;

  /* 间距阶梯（4/8/12/16/24/32） */
  --sp1: 4px;
  --sp2: 8px;
  --sp3: 12px;
  --sp4: 16px;
  --sp5: 24px;
  --sp6: 32px;

  /* ---- 旧变量别名：index.html 内联样式 / JS 模板仍在引用，全部映射到新影调 ---- */
  --bg: var(--bg0);
  --card: var(--bg1);
  --ink: var(--tx0);
  --text: var(--tx0);
  --sub: var(--tx1);
  --faint: var(--tx2);
  --brand: var(--gold);
  --brand-dark: var(--gold-deep);
  --brand-soft: rgba(212, 169, 78, .1);
  --gold-soft: rgba(212, 169, 78, .1);
  --radius: var(--r3);
  --radius-sm: var(--r2);
  --shadow-sm: var(--sh1);
  --shadow: var(--sh2);
  --shadow-lg: var(--sh3);
  --ease: var(--cine);
  --spring: var(--cine);
}

/* === 2. Reset & Base === */
* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter",
    "PingFang SC", "Segoe UI", "Microsoft YaHei", sans-serif;
  background:
    radial-gradient(1100px 500px at 85% -12%, rgba(212, 169, 78, .05), transparent 62%),
    radial-gradient(900px 460px at -12% 8%, rgba(90, 169, 199, .045), transparent 62%),
    var(--bg0);
  background-attachment: fixed;
  color: var(--tx0);
  -webkit-font-smoothing: antialiased;
  font-size: var(--fs-body);
  font-variant-numeric: tabular-nums;
  line-height: 1.55;
}

::placeholder { color: var(--tx2); opacity: 1; }
::selection { background: rgba(212, 169, 78, .28); color: #fff; }

::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb {
  background: rgba(233, 237, 244, .14);
  border-radius: 99px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(233, 237, 244, .26);
  background-clip: padding-box;
  border: 2px solid transparent;
}
::-webkit-scrollbar-track { background: transparent; }

:focus-visible {
  outline: 2px solid rgba(212, 169, 78, .55);
  outline-offset: 2px;
  border-radius: 6px;
}

a { color: var(--cyan); text-decoration: none; }
a:hover { color: var(--tx0); }

/* === 3. Keyframes（全部只动画 transform/opacity，镜头式长缓动） === */
@keyframes fadeUp   { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes fadeIn   { from { opacity: 0; } to { opacity: 1; } }
@keyframes popIn    { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: none; } }
@keyframes shimmer  { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
@keyframes spin     { to { transform: rotate(360deg); } }
@keyframes dots     { 0% { content: ''; } 25% { content: '·'; } 50% { content: '··'; } 75% { content: '···'; } }
@keyframes pulse    { 50% { opacity: .35; } }
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(212, 169, 78, 0), var(--card-light), var(--sh1); }
  50%      { box-shadow: 0 0 26px 3px rgba(212, 169, 78, .22), var(--card-light), var(--sh1); }
}
@keyframes numPop   { 0% { opacity: .35; transform: translateY(4px); } 100% { opacity: 1; transform: none; } }
@keyframes chatflash {
  0%   { box-shadow: 0 0 0 0 rgba(212, 169, 78, .28); background: rgba(212, 169, 78, .05); }
  100% { box-shadow: 0 0 0 16px rgba(212, 169, 78, 0); background: transparent; }
}
@keyframes hairline { to { background-position: 220% 0; } }
/* 黑场转场 */
@keyframes veilIn  { from { opacity: 0; } to { opacity: 1; } }
@keyframes veilOut { from { opacity: 1; } to { opacity: 0; } }
/* 旁白：从略低处显影上浮，静止后由 JS 加 .out 淡出 */
@keyframes narrIn  { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
/* 结局定格：极缓推近 + 显影，像片名定帧 */
@keyframes finalIn {
  from { opacity: 0; transform: scale(1.045); filter: blur(6px); }
  to   { opacity: 1; transform: none; filter: blur(0); }
}
/* 颗粒极慢漂移（只在 full 档启用，位移极小） */
@keyframes grainDrift {
  0%   { transform: translate(0, 0); }
  25%  { transform: translate(-1.5%, 1%); }
  50%  { transform: translate(1%, -1.5%); }
  75%  { transform: translate(-1%, -.5%); }
  100% { transform: translate(0, 0); }
}
/* 章节巨字显影 */
/* 终态必须保留 translate(-50%,-50%) 定位位移（元素靠它居中），
   写 transform:none 会被 both 填充锁定，巨字整体偏右下出屏。 */
@keyframes yearIn {
  from { opacity: 0; transform: translate(-50%, -50%) scale(1.08); letter-spacing: .22em; }
  to   { opacity: 1; transform: translate(-50%, -50%); }
}

/* === 4. 顶部动态发丝线（金青渐变，替代旧红金亮线） === */
body::before {
  content: '';
  position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 60;
  background: linear-gradient(90deg,
    var(--gold-deep), var(--gold) 30%, var(--cyan) 55%, var(--gold) 80%, var(--gold-deep));
  background-size: 220% 100%;
  animation: hairline 16s linear infinite;
  pointer-events: none;
  opacity: .85;
}

/* === 5. Header & Logo === */
header {
  background: rgba(11, 15, 22, .78);
  backdrop-filter: saturate(1.6) blur(18px);
  -webkit-backdrop-filter: saturate(1.6) blur(18px);
  border-bottom: 1px solid var(--line);
  padding: 0 28px; height: 64px;
  display: flex; align-items: center; gap: 14px;
  position: sticky; top: 0; z-index: 10;
}
.logo { display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; transition: opacity var(--t1) var(--cine); }
.logo:hover { opacity: .85; }
.logo svg { width: 33px; height: 33px; display: block; filter: drop-shadow(0 0 10px rgba(212, 169, 78, .3)); }
.logo svg path { stroke: var(--gold) !important; }
.logo svg path:first-child { stroke: var(--tx0) !important; }
.logo .name { font-size: 17px; font-weight: 800; letter-spacing: 1.2px; line-height: 1.25; color: var(--tx0); }
.logo .en { font-size: 9px; letter-spacing: 3px; color: var(--gold); font-weight: 700; }
header .sub { font-size: 12px; color: var(--tx2); padding-left: 14px; border-left: 1px solid var(--line); }
header .spacer { flex: 1; }
header .user-chip { font-size: 12px; color: var(--tx1); display: flex; gap: 10px; align-items: center; }
header .user-chip .plan {
  background: linear-gradient(135deg, var(--gold-hi), var(--gold-deep));
  color: #17130a; border-radius: 999px; padding: 3.5px 14px;
  font-size: 11px; font-weight: 700; letter-spacing: .3px;
  box-shadow: var(--glow-gold), inset 0 1px 0 rgba(255, 255, 255, .35);
}
header .user-chip .plan.free {
  background: var(--bg2); color: var(--tx1);
  box-shadow: inset 0 0 0 1px var(--line);
}
header a.auth-link { color: var(--cyan); font-size: 12px; cursor: pointer; text-decoration: none; font-weight: 600; }
header a.auth-link:hover { color: var(--tx0); }

/* === 6. Tabs（滑动指示条） === */
.tabs {
  display: flex; gap: 24px;
  background: rgba(11, 15, 22, .78);
  backdrop-filter: saturate(1.6) blur(18px);
  -webkit-backdrop-filter: saturate(1.6) blur(18px);
  padding: 0 28px;
  border-bottom: 1px solid var(--line);
  position: sticky; top: 64px; z-index: 9;
}
.tab {
  padding: 14px 2px 13px; cursor: pointer; font-size: 14px; color: var(--tx1);
  margin-bottom: -1px; font-weight: 500; position: relative; user-select: none;
  transition: color var(--t1) var(--cine), transform var(--t1) var(--cine);
}
.tab:hover { color: var(--tx0); }
.tab:active { transform: scale(.97); }
.tab.active { color: var(--gold); font-weight: 700; }
.tab-ink {
  position: absolute; bottom: -1px; left: 0; height: 2px; width: 0;
  border-radius: 99px; pointer-events: none;
  background: linear-gradient(90deg, var(--gold-hi), var(--gold-deep));
  box-shadow: var(--glow-gold);
  transition: transform var(--t2) var(--cine), width var(--t2) var(--cine);
}

/* === 7. Layout & Panels === */
main { padding: 28px 28px 60px; max-width: 1200px; margin: 0 auto; }
.panel { display: none; }
.panel.active { display: block; }
.panel.active > * { animation: fadeUp var(--t2) var(--cine) both; }
.panel.active > *:nth-child(2) { animation-delay: .05s; }
.panel.active > *:nth-child(3) { animation-delay: .1s; }
.panel.active > *:nth-child(4) { animation-delay: .15s; }
.panel.active > *:nth-child(5) { animation-delay: .2s; }
.panel.active > *:nth-child(6) { animation-delay: .25s; }

/* === 8. Cards（明度分层 + 胶片打光） === */
.card {
  background: var(--bg1);
  border-radius: var(--r3);
  border: 1px solid var(--line-soft);
  padding: 22px 24px; margin-bottom: 16px;
  box-shadow: var(--card-light), var(--sh1);
  transition: box-shadow var(--t2) var(--cine), border-color var(--t2) var(--cine), transform var(--t2) var(--cine);
}
.card:hover {
  box-shadow: var(--card-light), var(--sh2);
  border-color: var(--line);
}
.card.will-reveal { opacity: 0; transform: translateY(16px); }
.card.will-reveal.in {
  opacity: 1; transform: none;
  transition: opacity var(--t2) var(--cine), transform var(--t2) var(--cine),
    box-shadow var(--t2) var(--cine), border-color var(--t2) var(--cine);
}
.card h3 {
  font-size: var(--fs-title); font-weight: 700; margin-bottom: 15px;
  display: flex; align-items: center; gap: 10px;
  letter-spacing: .6px; color: var(--tx0);
}
.card h3 .ic {
  width: 30px; height: 30px; border-radius: 9px; flex: none;
  background: rgba(212, 169, 78, .1);
  color: var(--gold);
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: inset 0 0 0 1px rgba(212, 169, 78, .18);
}
.card h3 .muted { font-weight: 400; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }

/* === 9. Controls：按钮 === */
button {
  position: relative;
  background: linear-gradient(135deg, var(--gold-hi), var(--gold-deep));
  color: #17130a; border: none; border-radius: 10px;
  padding: 9.5px 20px; cursor: pointer; font-size: 13px; font-weight: 700; letter-spacing: .4px;
  transition: transform var(--t1) var(--cine), box-shadow var(--t1) var(--cine), filter var(--t1) var(--cine);
  box-shadow: 0 2px 12px rgba(212, 169, 78, .22),
    inset 0 1px 0 rgba(255, 255, 255, .3), inset 0 -1px 0 rgba(0, 0, 0, .12);
}
button:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(212, 169, 78, .32),
    inset 0 1px 0 rgba(255, 255, 255, .3), inset 0 -1px 0 rgba(0, 0, 0, .12);
  filter: brightness(1.05);
}
button:active:not(:disabled) {
  transform: translateY(0) scale(.98);
  box-shadow: 0 1px 6px rgba(212, 169, 78, .2);
  filter: brightness(.97);
}
button.gray {
  background: var(--bg2); color: var(--tx0);
  border: 1px solid var(--line); font-weight: 500; letter-spacing: 0;
  box-shadow: var(--card-light), var(--sh1);
}
button.gray:hover:not(:disabled) {
  color: var(--tx0); border-color: rgba(233, 237, 244, .2);
  background: #202835;
  transform: translateY(-1px);
  box-shadow: var(--card-light), var(--sh2);
  filter: none;
}
button.gray:active:not(:disabled) { transform: translateY(0) scale(.98); }
button:disabled {
  background: var(--bg2); color: var(--tx2);
  cursor: not-allowed; box-shadow: none; transform: none; filter: none;
  opacity: .55;
  animation: pulse 1.6s ease-in-out infinite;
}
/* 危险操作（弹层删除等） */
button.danger {
  background: linear-gradient(135deg, #ef7070, var(--red-deep));
  color: #fff;
  box-shadow: 0 2px 12px rgba(224, 90, 90, .28), inset 0 1px 0 rgba(255, 255, 255, .22);
}
button.danger:hover:not(:disabled) {
  box-shadow: 0 6px 22px rgba(224, 90, 90, .4), inset 0 1px 0 rgba(255, 255, 255, .22);
}
/* 登录门禁里的幽灵按钮（内联样式已给大半，这里补统一行为） */
.btn-ghost { transition: background var(--t1) var(--cine), border-color var(--t1) var(--cine); }
.btn-ghost:hover:not(:disabled) { background: rgba(255, 255, 255, .12) !important; }
.btn-ghost:disabled { opacity: .5; cursor: not-allowed; animation: none; }

/* === 10. Controls：输入 === */
input, select, textarea {
  padding: 9.5px 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 13px;
  background: var(--bg2);
  color: var(--tx0);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, .3);
  transition: border-color var(--t1) var(--cine), box-shadow var(--t1) var(--cine), background var(--t1) var(--cine);
  font-family: inherit;
}
input:hover, select:hover, textarea:hover { border-color: rgba(233, 237, 244, .2); }
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: rgba(212, 169, 78, .65);
  background: #1d2431;
  box-shadow: 0 0 0 3.5px rgba(212, 169, 78, .14), inset 0 1px 3px rgba(0, 0, 0, .3);
}
select {
  appearance: none; -webkit-appearance: none; padding-right: 30px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%239aa5b6' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center;
}
select option { background: var(--bg2); color: var(--tx0); }
input[type="checkbox"] { accent-color: var(--gold); }
input[type="date"] { color-scheme: dark; }
textarea { resize: vertical; }

.form-row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.muted { color: var(--tx2); font-size: 12px; }
.hint-line { margin-top: 10px; line-height: 1.9; font-size: 12px; color: var(--tx2); }
.hint-line b { color: var(--tx1); font-weight: 600; }
.hint-fold { margin-top: 8px; font-size: 12px; color: var(--tx2); }
.hint-fold summary { cursor: pointer; color: var(--tx1); font-weight: 600; user-select: none; transition: color var(--t1) var(--cine); }
.hint-fold summary:hover { color: var(--gold); }
.hint-fold .sec { margin-top: 12px; }
.hint-fold .sec-title { color: var(--tx1); font-weight: 600; }
.hint-fold ul { margin: 4px 0 0; padding-left: 18px; }
.hint-fold li { margin: 2px 0; line-height: 1.8; }

/* 表单字段错误（L0-5：红框 + 字段下红字） */
input.err, select.err, textarea.err,
.field-err-input {
  border-color: rgba(224, 90, 90, .7) !important;
  box-shadow: 0 0 0 3.5px rgba(224, 90, 90, .13), inset 0 1px 3px rgba(0, 0, 0, .3) !important;
}
.field-err {
  display: block;
  margin-top: 5px;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--red);
  animation: fadeUp var(--t1) var(--cine) both;
}
.field-err::before { content: '⚠ '; }

/* === 11. 回测进度条（镜头推进感：金色光带扫过） === */
.prog { margin-top: 10px; min-width: 260px; flex: 1; animation: fadeUp var(--t1) var(--cine); }
.prog-head { display: flex; justify-content: space-between; align-items: baseline; font-size: 12px; margin-bottom: 7px; }
.prog-stage { color: var(--tx1); font-weight: 600; }
.prog-stage::after { content: ''; display: inline-block; width: 1.2em; text-align: left; animation: dots 1.4s steps(4) infinite; }
.prog-meta { color: var(--tx2); }
.prog-clock { color: var(--tx2); font-variant-numeric: tabular-nums; }
.prog-pct { font-weight: 800; color: var(--gold); font-variant-numeric: tabular-nums; }
.prog-bar {
  height: 6px; border-radius: 99px;
  background: rgba(233, 237, 244, .07);
  overflow: hidden;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, .4);
}
.prog-fill {
  height: 100%; width: 0%; border-radius: 99px;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold-hi));
  box-shadow: 0 0 12px rgba(212, 169, 78, .45);
  transition: width .5s var(--cine);
  position: relative;
}
.prog-fill::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .45), transparent);
  animation: shimmer 1.8s infinite;
}
.prog-live {
  margin-top: 8px; font-size: 13.5px; font-weight: 600;
  color: var(--gold); font-variant-numeric: tabular-nums;
  letter-spacing: .02em; min-height: 1.5em;
  transition: opacity .3s var(--cine);
}
.prog-desc { font-size: 12.5px; color: var(--tx2); margin-top: 3px; line-height: 1.7; }
.prog-tip { font-size: 11.5px; color: var(--tx2); margin-top: 7px; transition: opacity .4s var(--cine); }
.prog.done .prog-fill {
  background: linear-gradient(90deg, #2e7a55, var(--down));
  box-shadow: 0 0 12px rgba(63, 158, 110, .4);
}
.prog.done .prog-pct { color: var(--down); }
.prog.done .prog-stage::after { content: '' !important; animation: none; }

/* 本次回测条件卡：策略原文 + 参数 chips */
#run-params-card { scroll-margin-top: 84px; }
.rp-desc {
  font-size: 13.5px; line-height: 1.8; color: var(--tx1);
  padding: 10px 14px; border-radius: 10px;
  background: rgba(212, 169, 78, .07);
  border: 1px solid rgba(212, 169, 78, .18);
}
.rp-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.rp-chip {
  font-size: 12px; color: var(--tx2);
  padding: 3px 11px; border-radius: 999px;
  background: rgba(233, 237, 244, .05);
  border: 1px solid var(--line);
  font-variant-numeric: tabular-nums;
}
/* 披露行：扫描池规模 / 卫生过滤 / 排序规则——弱化但可读，放在 chips 下 */
.rp-note {
  margin-top: 9px;
  font-size: 12px; line-height: 1.8;
  color: var(--tx2); opacity: .85;
}

/* === 12. Data display：数字 / 涨跌 / 指标格 === */
.tier-head { display: flex; justify-content: space-between; align-items: baseline; }
.tier-head .name { font-weight: 700; font-size: 15px; letter-spacing: .3px; }
.pnl {
  font-size: 23px; font-weight: 800;
  font-variant-numeric: tabular-nums; letter-spacing: -.5px;
}
.up { color: var(--up); }
.down { color: var(--down); }
.kv {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
  font-size: 11.5px; color: var(--tx2); margin-top: 14px;
}
.kv span {
  background: rgba(233, 237, 244, .025);
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  padding: 9px 11px 8px;
  box-shadow: var(--card-light);
}
.kv b {
  display: block; font-size: 14.5px; color: var(--tx0); margin-top: 3px;
  font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -.2px;
}
.num-anim { animation: numPop .5s var(--cine); }

/* === 13. Tables（sticky 表头 + 可排序） === */
table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
th, td {
  padding: 9px 10px; text-align: right;
  border-bottom: 1px solid var(--line-soft);
  white-space: nowrap; font-variant-numeric: tabular-nums;
}
tbody tr { transition: background var(--t1) var(--cine); }
tbody tr:hover { background: rgba(233, 237, 244, .035); }
th {
  color: var(--tx2); font-weight: 600; text-align: right;
  font-size: 10.5px; letter-spacing: .08em;
  position: sticky; top: 0;
  background: rgba(18, 23, 31, .96);
  backdrop-filter: blur(8px);
  z-index: 1;
  box-shadow: 0 1px 0 var(--line);
}
td:first-child, th:first-child { text-align: left; }
.table-wrap {
  max-height: 400px; overflow: auto;
  border-radius: var(--r2);
  border: 1px solid var(--line-soft);
  box-shadow: var(--card-light);
}
/* 可排序表头（L1-4）：默认/升序/降序三态箭头 */
th.sortable { cursor: pointer; user-select: none; transition: color var(--t1) var(--cine); }
th.sortable:hover { color: var(--tx0); }
th.sortable::after {
  content: '▴▾';
  display: inline-block;
  margin-left: 5px;
  font-size: 8px;
  letter-spacing: -1px;
  color: var(--tx2);
  opacity: .55;
  transition: color var(--t1) var(--cine), opacity var(--t1) var(--cine);
}
th.sortable.asc::after  { content: '▴'; color: var(--gold); opacity: 1; font-size: 9px; letter-spacing: 0; }
th.sortable.desc::after { content: '▾'; color: var(--gold); opacity: 1; font-size: 9px; letter-spacing: 0; }

.chart-box { position: relative; height: 340px; }

/* === 14. 记录列表 / 对比 === */
.run-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 11px 10px;
  border-bottom: 1px solid var(--line-soft);
  cursor: pointer; font-size: 13px; gap: 10px; flex-wrap: wrap;
  border-radius: 9px;
  transition: background var(--t1) var(--cine), transform var(--t1) var(--cine), box-shadow var(--t1) var(--cine);
}
.run-item:hover { background: rgba(233, 237, 244, .04); transform: translateX(3px); }
.run-item.sel {
  background: rgba(212, 169, 78, .08);
  box-shadow: inset 0 0 0 1px rgba(212, 169, 78, .4);
}
.run-item.picked {
  background: rgba(90, 169, 199, .08);
  box-shadow: inset 0 0 0 1px rgba(90, 169, 199, .35);
}
.run-del {
  cursor: pointer; color: var(--tx2); font-weight: 700;
  padding: 1px 7px; border-radius: 6px; font-size: 12px;
  transition: color var(--t1) var(--cine), background var(--t1) var(--cine);
}
.run-del:hover { color: var(--red); background: rgba(224, 90, 90, .12); }
.run-pick { width: 15px; height: 15px; accent-color: var(--cyan); cursor: pointer; flex: 0 0 auto; }
.badge {
  background: rgba(233, 237, 244, .06);
  border-radius: 999px; padding: 2.5px 11px;
  font-size: 11.5px; color: var(--tx1); font-weight: 500;
  box-shadow: inset 0 0 0 1px var(--line-soft);
}
.badge.hot {
  background: rgba(212, 169, 78, .12); color: var(--gold); font-weight: 600;
  box-shadow: inset 0 0 0 1px rgba(212, 169, 78, .25);
}
.badge.gold { background: rgba(212, 169, 78, .1); color: var(--gold); }
.toggle-runs { padding: 9px 6px; cursor: pointer; font-size: 12.5px; color: var(--cyan); font-weight: 600; }
.toggle-runs:hover { text-decoration: underline; }
.cmp-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px;
  padding-top: 10px; border-top: 1px dashed var(--line); font-size: 12.5px;
}
.cmp-bar button {
  border: 1px solid var(--line); background: var(--bg2); color: var(--tx0);
  border-radius: 8px; padding: 6px 13px; font-size: 12.5px; cursor: pointer;
  box-shadow: var(--card-light); font-weight: 500; letter-spacing: 0;
  transition: border-color var(--t1) var(--cine), color var(--t1) var(--cine), transform var(--t1) var(--cine);
}
.cmp-bar button:hover { border-color: var(--cyan); color: var(--cyan); transform: none; box-shadow: var(--card-light); filter: none; }
.cmp-bar button.primary {
  background: linear-gradient(135deg, var(--gold-hi), var(--gold-deep));
  border-color: transparent; color: #17130a; font-weight: 700;
}
.cmp-bar button.primary:hover { filter: brightness(1.06); color: #17130a; border-color: transparent; }
.cmp-bar button:disabled { opacity: .45; cursor: not-allowed; animation: none; }
.cmp-bar button:disabled:hover { border-color: var(--line); color: inherit; }

/* === 15. AI 对话澄清 === */
#ai-chat {
  display: flex; flex-direction: column; gap: 8px;
  max-height: 420px; overflow-y: auto;
  border-radius: var(--r2);
  padding: 2px;
}
.ai-chat-flash { animation: chatflash .9s ease-out; }
.msg {
  max-width: 86%; padding: 10px 14px; border-radius: 14px;
  font-size: 13px; line-height: 1.75;
  animation: popIn var(--t1) var(--cine);
}
.msg.user {
  align-self: flex-end;
  background: linear-gradient(135deg, rgba(212, 169, 78, .22), rgba(212, 169, 78, .12));
  color: var(--tx0);
  border-bottom-right-radius: 4px;
  box-shadow: inset 0 0 0 1px rgba(212, 169, 78, .22);
}
.msg.ai {
  align-self: flex-start;
  background: var(--bg2); color: var(--tx0);
  border-bottom-left-radius: 4px;
  box-shadow: var(--card-light);
}
.msg.ai .ok-line { color: var(--down); font-weight: 700; margin-top: 4px; display: inline-block; }
.msg.ai .q-line { font-weight: 700; margin-top: 4px; display: inline-block; }
.msg.ai.thinking::after {
  content: ''; display: inline-block; width: 1.4em; text-align: left;
  animation: dots 1.4s steps(4) infinite;
}
.eng-tag {
  display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: .04em;
  color: var(--cyan); background: rgba(90, 169, 199, .1);
  border: 1px solid rgba(90, 169, 199, .3);
  border-radius: 999px; padding: 1px 8px; margin-bottom: 4px; margin-right: 6px; vertical-align: 1px;
}
/* AI 追问行首的小徽章（替代原 🤖 emoji，与 eng-tag 同族的金色版） */
.ai-tag {
  display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: .04em;
  color: var(--gold); background: rgba(212, 169, 78, .1);
  border: 1px solid rgba(212, 169, 78, .32);
  border-radius: 999px; padding: 1px 7px; margin-right: 2px; vertical-align: 1px;
}
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.chip {
  background: var(--bg2); color: var(--cyan);
  border: 1px solid rgba(90, 169, 199, .4);
  border-radius: 999px; padding: 4px 13px;
  font-size: 12px; font-weight: 600; cursor: pointer;
  transition: background var(--t1) var(--cine), color var(--t1) var(--cine),
    border-color var(--t1) var(--cine), transform var(--t1) var(--cine), box-shadow var(--t1) var(--cine);
}
.chip:hover {
  background: rgba(90, 169, 199, .16); color: var(--tx0);
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(90, 169, 199, .2);
}
.chip:active { transform: translateY(0) scale(.96); }

/* === 16. 测策略四步路线图（旧组件，沿用类名） === */
.roadmap {
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  max-width: 1100px; margin: 0 auto 18px; padding: 18px 8px 0;
}
.rm-label { font-size: 11px; font-weight: 700; color: var(--tx2); letter-spacing: .08em; margin-right: 4px; }
.rm-step {
  display: flex; flex-direction: column; line-height: 1.35; padding: 8px 16px;
  border: 1px solid var(--line); border-radius: var(--r2);
  background: var(--bg1);
  cursor: pointer;
  transition: border-color var(--t1) var(--cine), transform var(--t1) var(--cine), box-shadow var(--t1) var(--cine), background var(--t1) var(--cine);
  box-shadow: var(--card-light), var(--sh1);
}
.rm-step b { font-size: 12.5px; color: var(--tx1); font-weight: 600; white-space: nowrap; transition: color var(--t1) var(--cine); }
.rm-step span { font-size: 11px; color: var(--tx2); white-space: nowrap; }
.rm-step:hover { border-color: rgba(212, 169, 78, .35); transform: translateY(-1.5px); box-shadow: var(--card-light), var(--sh2); }
.rm-step.active {
  border-color: rgba(212, 169, 78, .5);
  background: linear-gradient(180deg, var(--bg1), rgba(212, 169, 78, .07));
  box-shadow: var(--card-light), 0 4px 16px rgba(212, 169, 78, .12);
}
.rm-step.active b { color: var(--gold); font-weight: 700; }
.rm-arrow { color: var(--tx2); font-size: 13px; }

/* === 17. 下一步引导条 === */
.next-step {
  margin-top: 14px; padding: 12px 16px;
  border: 1px solid rgba(212, 169, 78, .3);
  border-radius: var(--r2);
  background: linear-gradient(180deg, var(--bg1), rgba(212, 169, 78, .05));
  font-size: 13px; color: var(--tx0);
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  animation: fadeUp var(--t2) var(--cine);
  box-shadow: var(--card-light), 0 2px 14px rgba(212, 169, 78, .08);
}
.next-step button { font-size: 12.5px; padding: 6px 14px; }
.next-step input { font-size: 12.5px; }

/* === 18. 寻优参数卡片 === */
.op-cards { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.op-card {
  border: 1px solid var(--line); border-radius: var(--r2); padding: 12px 14px;
  background: var(--bg1);
  width: calc(50% - 5px); min-width: 260px; flex: 1;
  box-shadow: var(--card-light);
  transition: border-color var(--t1) var(--cine), box-shadow var(--t1) var(--cine), transform var(--t1) var(--cine);
}
.op-card:hover { border-color: rgba(212, 169, 78, .3); box-shadow: var(--card-light), var(--sh2); transform: translateY(-1px); }
.op-card-title { font-size: 12.5px; font-weight: 600; color: var(--tx0); margin-bottom: 2px; }
.op-card-plain { font-size: 11.5px; color: var(--tx2); line-height: 1.6; margin-bottom: 7px; }
.op-card input { width: 100% !important; font-size: 12.5px; }
.op-opts { display: flex; flex-wrap: wrap; gap: 7px; }
.op-opts .chip {
  cursor: pointer; user-select: none;
  border-color: var(--line); color: var(--tx2);
  background: rgba(233, 237, 244, .03);
  font-size: 12.5px; padding: 5px 14px;
}
.op-opts .chip:hover {
  background: var(--bg2); color: var(--gold); border-color: rgba(212, 169, 78, .5);
  transform: none; box-shadow: none;
}
.op-opts .chip.on {
  background: linear-gradient(135deg, var(--gold-hi), var(--gold-deep));
  color: #17130a; border-color: transparent; font-weight: 700;
  box-shadow: 0 2px 10px rgba(212, 169, 78, .28);
}
.op-empty {
  margin-top: 10px; padding: 14px 16px;
  border: 1px dashed var(--line);
  border-radius: var(--r2);
  background: rgba(233, 237, 244, .02);
  font-size: 12.5px; color: var(--tx1); line-height: 1.9;
}

/* === 19. Plan / 支付 / 账户区 === */
.plan-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.hl-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; margin-top: 12px; }
.hl-item {
  background: var(--bg1); border: 1px solid var(--line); border-radius: var(--r2);
  padding: 14px 16px; position: relative; overflow: hidden;
  box-shadow: var(--card-light);
  transition: transform var(--t1) var(--cine), box-shadow var(--t1) var(--cine), border-color var(--t1) var(--cine);
}
.hl-item::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, var(--gold-hi), var(--gold-deep));
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--t2) var(--cine);
}
.hl-item:hover { transform: translateY(-3px); box-shadow: var(--card-light), var(--sh2); border-color: rgba(212, 169, 78, .25); }
.hl-item:hover::before { transform: scaleX(1); }
.hl-item b { display: block; font-size: 13px; color: var(--tx0); margin-bottom: 5px; font-weight: 700; }
.hl-item span { font-size: 12px; color: var(--tx1); line-height: 1.75; }

.plan-card {
  background: var(--bg1); border: 1px solid var(--line); border-radius: var(--r3);
  padding: 26px;
  box-shadow: var(--card-light), var(--sh1);
  transition: transform var(--t1) var(--cine), box-shadow var(--t1) var(--cine);
  position: relative; overflow: hidden;
}
.plan-card:hover { transform: translateY(-3px); box-shadow: var(--card-light), var(--sh3); }
.plan-card.hot {
  border: 1px solid rgba(212, 169, 78, .45);
  box-shadow: var(--card-light), 0 8px 36px rgba(212, 169, 78, .12);
}
.plan-card.hot::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, var(--gold-hi), var(--gold-deep), var(--cyan));
}
.plan-card .price {
  font-size: 30px; font-weight: 800; margin: 8px 0 4px; letter-spacing: -.6px;
  background: linear-gradient(135deg, var(--tx0), var(--tx1));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.plan-card.hot .price {
  background: linear-gradient(135deg, var(--gold-hi), var(--gold-deep));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.plan-card ul { list-style: none; font-size: 13px; line-height: 2.1; margin-top: 10px; color: var(--tx1); }
.plan-card ul li::before { content: "✓"; color: var(--down); font-weight: 800; margin-right: 8px; }
.plan-card ul li.no { color: var(--tx2); }
.plan-card ul li.no::before { content: "✗"; color: var(--tx2); }
.pay-channels { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.pay-btn {
  padding: 11px 0; border-radius: 10px; border: none;
  font-size: 13.5px; font-weight: 700; cursor: pointer; color: #fff;
  transition: transform var(--t1) var(--cine), opacity var(--t1) var(--cine);
}
.pay-btn:hover { transform: translateY(-1px); }
.pay-btn.pend { opacity: .5; cursor: default; box-shadow: none; }
.pay-btn.pend:hover { transform: none; }

.auth-box { max-width: 440px; margin: 16px auto 0; }
.auth-box input { width: 100%; margin-bottom: 10px; }
/* 「我的」页底部双卡：邀请码兑换 + 账号设置 并排（窄屏自动单列） */
.acct-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 16px; margin-top: 16px; align-items: start; }
#auth-card input { width: 100%; margin-bottom: 10px; }
#auth-card .form-row input { width: auto; margin-bottom: 0; }
.export-btns { display: inline-flex; gap: 8px; margin-left: 12px; }
.export-btns button {
  background: var(--bg2); color: var(--tx1);
  border: 1px solid var(--line); padding: 4px 12px; font-size: 12px;
  box-shadow: var(--card-light); font-weight: 500; letter-spacing: 0;
}
.export-btns button:hover:not(:disabled) {
  color: var(--gold); border-color: rgba(212, 169, 78, .45);
  background: rgba(212, 169, 78, .07);
  transform: none; box-shadow: none; filter: none;
}
.disclaimer {
  font-size: 12px; color: var(--tx2); margin-top: 26px; line-height: 1.7;
  border-top: 1px solid var(--line); padding-top: 16px;
}

/* === 20. 登录门禁（保留全屏暗场，融进新影调） === */
#auth-gate .card {
  background: rgba(18, 23, 31, .6);
  border: 1px solid var(--line);
  box-shadow: var(--card-light), 0 24px 70px rgba(0, 0, 0, .55);
  backdrop-filter: blur(20px) saturate(1.4);
  -webkit-backdrop-filter: blur(20px) saturate(1.4);
}
#auth-gate .card h3 { color: var(--tx0); }
#auth-gate input {
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .14);
  color: var(--tx0); border-radius: 12px;
}
#auth-gate input:hover { border-color: rgba(255, 255, 255, .26); background: rgba(255, 255, 255, .08); }
#auth-gate input:focus {
  border-color: rgba(212, 169, 78, .7);
  background: rgba(255, 255, 255, .09);
  box-shadow: 0 0 0 3.5px rgba(212, 169, 78, .18);
}
#auth-gate input::placeholder { color: var(--tx2); }
#auth-gate .muted { color: var(--tx1); }
#auth-gate #gate-switch b { color: var(--gold) !important; }
#auth-gate .gate-tab {
  flex: 1; padding: 9px 0; border-radius: 10px; cursor: pointer; font-size: 13px;
  border: 1px solid rgba(255, 255, 255, .14);
  background: rgba(255, 255, 255, .05);
  color: var(--tx1);
  box-shadow: none; font-weight: 500; letter-spacing: 0;
  transition: background var(--t1) var(--cine), border-color var(--t1) var(--cine), color var(--t1) var(--cine);
}
#auth-gate .gate-tab:hover { transform: none; filter: none; }
#auth-gate .gate-tab.on {
  background: rgba(212, 169, 78, .14);
  border-color: rgba(212, 169, 78, .5);
  color: var(--tx0); font-weight: 700;
}

/* === 21. Toast（站内提示条） === */
.toast-wrap {
  position: fixed; top: 18px; left: 50%; transform: translateX(-50%);
  z-index: 9999; display: flex; flex-direction: column; gap: 8px; align-items: center;
  pointer-events: none; max-width: min(92vw, 560px);
}
.toast-item {
  background: var(--bg2); color: var(--tx0);
  font-size: 13px; line-height: 1.55;
  padding: 11px 18px; border-radius: 999px;
  box-shadow: var(--card-light), var(--sh3), inset 0 0 0 1px var(--line);
  white-space: pre-line; text-align: center;
  opacity: 0; translate: 0 -8px;
  transition: opacity var(--t1) var(--cine), translate var(--t1) var(--cine);
}
.toast-item.on { opacity: 1; translate: 0 0; }
.toast-item.err { box-shadow: var(--card-light), var(--sh3), inset 0 0 0 1px rgba(224, 90, 90, .5); color: #f3c1c1; }
.toast-item.ok  { box-shadow: var(--card-light), var(--sh3), inset 0 0 0 1px rgba(63, 158, 110, .5); color: #bfe6d2; }

/* === 22. 骨架屏（.sk 新组件 + .skeleton 旧别名，深色 shimmer） === */
.sk, .skeleton {
  position: relative; overflow: hidden;
  background: rgba(233, 237, 244, .055);
  border-radius: var(--r1);
  color: transparent !important;
  min-height: 14px;
}
.sk::after, .skeleton::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(233, 237, 244, .09), transparent);
  animation: shimmer 1.6s infinite;
}
/* 常用骨架形态 */
.sk-line { height: 13px; margin: 8px 0; }
.sk-line.w60 { width: 60%; }
.sk-line.w80 { width: 80%; }
.sk-block { height: 120px; border-radius: var(--r2); }
.sk-card {
  height: 150px; border-radius: var(--r3);
  background: var(--bg1);
  border: 1px solid var(--line-soft);
  box-shadow: var(--card-light);
}

/* === 23. 空态引导（L0-7） === */
.empty-state {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px;
  padding: 44px 24px;
  text-align: center;
  color: var(--tx1);
  animation: fadeUp var(--t2) var(--cine) both;
}
.empty-state .es-ic {
  width: 52px; height: 52px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(212, 169, 78, .08);
  color: var(--gold);
  box-shadow: inset 0 0 0 1px rgba(212, 169, 78, .18), var(--card-light);
  font-size: 22px;
}
.empty-state .es-title { font-size: 14px; font-weight: 700; color: var(--tx0); letter-spacing: .4px; }
.empty-state .es-desc { font-size: 12.5px; color: var(--tx2); line-height: 1.8; max-width: 380px; }
.empty-state .es-act { margin-top: 6px; }

/* === 24. 统一确认弹层（L0-6） === */
.modal-mask {
  position: fixed; inset: 0; z-index: 1000 !important;
  background: rgba(5, 8, 13, .62);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0;
  transition: opacity var(--t1) var(--cine);
}
.modal-mask.on { opacity: 1; }
.modal-card {
  width: min(440px, 100%);
  background: var(--bg1);
  border: 1px solid var(--line);
  border-radius: var(--r3);
  padding: 24px 26px;
  box-shadow: var(--card-light), var(--sh3);
  transform: translateY(14px) scale(.97);
  opacity: 0;
  transition: transform var(--t1) var(--cine), opacity var(--t1) var(--cine);
}
.modal-mask.on .modal-card { transform: none; opacity: 1; }
.modal-card .m-title {
  font-size: 15.5px; font-weight: 700; letter-spacing: .5px;
  color: var(--tx0); margin-bottom: 10px;
  display: flex; align-items: center; gap: 9px;
}
.modal-card .m-body { font-size: 13px; color: var(--tx1); line-height: 1.85; }
.modal-card .m-acts {
  display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px;
}
/* 危险态变体：删除等不可逆操作 */
.modal-card.danger { border-color: rgba(224, 90, 90, .35); }
.modal-card.danger .m-title { color: var(--red); }
.modal-card.danger .m-title::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: var(--red); box-shadow: var(--glow-red); flex: none;
}

/* === 25. 四步任务步骤条（L1-1） === */
.step-bar {
  display: flex; align-items: center; gap: 0;
  padding: 12px 16px;
  background: var(--bg1);
  border: 1px solid var(--line-soft);
  border-radius: var(--r2);
  box-shadow: var(--card-light), var(--sh1);
  overflow: hidden;
}
.step-bar .step {
  display: flex; align-items: center; gap: 9px;
  flex: 1; min-width: 0;
  position: relative;
}
.step-bar .step + .step { padding-left: 18px; }
.step-bar .step + .step::before {
  content: ''; position: absolute; left: 0; top: 50%;
  width: 10px; height: 1px;
  background: var(--line);
}
.step-bar .dot {
  width: 22px; height: 22px; border-radius: 50%; flex: none;
  display: flex; align-items: center; justify-content: center;
  font-size: 10.5px; font-weight: 700;
  background: var(--bg2); color: var(--tx2);
  box-shadow: inset 0 0 0 1px var(--line);
  transition: background var(--t2) var(--cine), color var(--t2) var(--cine), box-shadow var(--t2) var(--cine);
}
.step-bar .txt { min-width: 0; line-height: 1.3; }
.step-bar .txt b { display: block; font-size: 12.5px; font-weight: 600; color: var(--tx2); white-space: nowrap; transition: color var(--t2) var(--cine); }
.step-bar .txt span { font-size: 10.5px; color: var(--tx2); white-space: nowrap; font-variant-numeric: tabular-nums; }
/* 完成态 */
.step-bar .step.done .dot {
  background: rgba(63, 158, 110, .16); color: var(--down);
  box-shadow: inset 0 0 0 1px rgba(63, 158, 110, .45);
}
.step-bar .step.done .txt b { color: var(--tx1); }
/* 当前态：金色呼吸 */
.step-bar .step.cur .dot {
  background: linear-gradient(135deg, var(--gold-hi), var(--gold-deep));
  color: #17130a;
  box-shadow: var(--glow-gold);
  animation: pulseGlow 2.4s var(--cine) infinite;
}
.step-bar .step.cur .txt b { color: var(--gold); }
/* 未达态 = 默认样式（弱化） */
.step-bar.mini { padding: 7px 14px; }
.step-bar.mini .txt span { display: none; }

/* === 26. 失败重试条（L1-6） === */
.retry-bar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: 0 0 14px;
  padding: 11px 16px;
  background: rgba(224, 90, 90, .08);
  border: 1px solid rgba(224, 90, 90, .3);
  border-radius: var(--r2);
  color: #f0c6c6; font-size: 12.5px;
  box-shadow: var(--card-light);
  animation: fadeUp var(--t1) var(--cine) both;
}
.retry-bar .r-msg { flex: 1; min-width: 200px; line-height: 1.6; }
.retry-bar button {
  background: linear-gradient(135deg, #ef7070, var(--red-deep));
  color: #fff; font-size: 12px; padding: 6px 14px;
  box-shadow: 0 2px 10px rgba(224, 90, 90, .3);
}
.retry-bar .r-close {
  cursor: pointer; color: var(--tx2); padding: 2px 6px; border-radius: 6px;
  transition: color var(--t1) var(--cine), background var(--t1) var(--cine);
}
.retry-bar .r-close:hover { color: var(--tx0); background: rgba(255, 255, 255, .07); }

/* === 27. 图表十字光标与数值气泡（L1-2，JS 在 .chart-box 内创建 DOM） === */
.xhair { position: absolute; inset: 0; pointer-events: none; z-index: 3; opacity: 0; transition: opacity var(--t1) var(--cine); }
.xhair.on { opacity: 1; }
.xhair .xhair-x, .xhair .xhair-y { position: absolute; background: rgba(90, 169, 199, .35); }
.xhair .xhair-x { top: 0; bottom: 0; width: 1px; }
.xhair .xhair-y { left: 0; right: 0; height: 1px; }
.xhair .xhair-dot {
  position: absolute; width: 7px; height: 7px; border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 10px rgba(90, 169, 199, .7), 0 0 0 2px rgba(11, 15, 22, .9);
  transform: translate(-50%, -50%);
}
.xhair .xhair-tip {
  position: absolute;
  background: rgba(26, 33, 44, .95);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 12px;
  font-size: 11.5px; line-height: 1.7; color: var(--tx1);
  box-shadow: var(--card-light), var(--sh2);
  backdrop-filter: blur(8px);
  white-space: nowrap;
  transform: translate(-50%, 0);
}
.xhair .xhair-tip b { color: var(--tx0); font-variant-numeric: tabular-nums; font-weight: 700; }
.xhair .xhair-tip .up, .xhair .xhair-tip .down { font-weight: 700; }

/* === 28. 筛选栏（L1-3）：容器 + chips 三态 === */
.flt-bar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 12px; margin-bottom: 12px;
  background: rgba(233, 237, 244, .02);
  border: 1px solid var(--line-soft);
  border-radius: var(--r2);
  box-shadow: var(--card-light);
}
.flt-bar .flt-label { font-size: 11px; font-weight: 700; letter-spacing: .08em; color: var(--tx2); margin-right: 2px; }
.flt-bar input[type="search"], .flt-bar .flt-kw {
  flex: 1; min-width: 160px;
  padding: 6.5px 12px; font-size: 12.5px;
  border-radius: 999px;
}
.flt-bar .chip {
  border-color: var(--line); color: var(--tx1);
  background: transparent;
  padding: 5px 14px; font-weight: 500;
}
/* 选中 */
.flt-bar .chip.on {
  background: rgba(212, 169, 78, .13);
  border-color: rgba(212, 169, 78, .55);
  color: var(--gold); font-weight: 700;
  box-shadow: 0 0 12px rgba(212, 169, 78, .12);
}
.flt-bar .chip.on:hover { background: rgba(212, 169, 78, .2); color: var(--gold); }
/* 未选 hover */
.flt-bar .chip:not(.on):not(:disabled):hover {
  background: var(--bg2); color: var(--tx0); border-color: rgba(233, 237, 244, .22);
  transform: none; box-shadow: none;
}
/* 禁用 */
.flt-bar .chip:disabled, .flt-bar .chip.dis {
  opacity: .38; cursor: not-allowed;
  background: transparent; color: var(--tx2); border-color: var(--line-soft);
  transform: none; box-shadow: none;
}

/* === 29. 电影层：全屏覆盖容器（JS 创建，pointer-events 精确管理） === */
#cine-root {
  position: fixed; inset: 0; z-index: 2000 !important;
  pointer-events: none;          /* 默认放行点击；JS 在开演时改为 auto */
  overflow: hidden;
}
#cine-root.live { pointer-events: auto; }   /* 开演时接住 ESC/点击跳过 */

/* 黑场幕布 */
.cine-veil {
  position: absolute; inset: 0;
  background: #05080d;
  opacity: 0;
}
.cine-veil.in  { animation: veilIn  var(--t2) var(--cine) both; }
.cine-veil.out { animation: veilOut var(--t2) var(--cine) both; }
.cine-veil.slow.in  { animation-duration: var(--t3); }
.cine-veil.slow.out { animation-duration: var(--t3); }

/* 结果揭晓舞台：全屏暗场压暗背景 + 双层画布（红雾在下、光迹在上） */
.cine-stage {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(5, 8, 13, .82);
  backdrop-filter: blur(3px);
}
.cine-stage canvas {
  position: absolute; left: 50%; top: 46%;
  transform: translate(-50%, -50%);
}

/* 年份/章节巨字：衬线感 + 宽字距，像章节卡而非道具字幕 */
.cine-year {
  position: absolute; top: 42%; left: 50%;
  transform: translate(-50%, -50%);
  font-family: Georgia, "Times New Roman", "Songti SC", "SimSun", serif;
  font-size: clamp(64px, 14vw, 150px);
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--tx0);
  text-shadow: 0 0 60px rgba(212, 169, 78, .25);
  white-space: nowrap;
  animation: yearIn var(--t3) var(--cine) both;
  user-select: none;
}
.cine-year.small { font-size: clamp(30px, 6vw, 64px); }

/* 底部极简旁白：克制的一行字，浮现又淡出，纪录片旁白感（非字幕道具） */
.cine-narr {
  position: absolute; left: 50%; bottom: 12%;
  transform: translateX(-50%);
  max-width: min(84vw, 760px);
  text-align: center;
  font-size: 20px; font-weight: 600;
  letter-spacing: .05em;
  line-height: 1.9;
  color: rgba(240, 243, 248, .96);
  text-shadow: 0 2px 18px rgba(0, 0, 0, .95), 0 0 44px rgba(0, 0, 0, .8);
  padding: 10px 26px;
  background: rgba(8, 11, 17, .42);
  border-radius: 14px;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 0;
  animation: narrIn var(--t3) var(--cine) .3s both;
  user-select: none;
}
.cine-narr.out { animation: veilOut var(--t2) var(--cine) both; }

/* 结局定格卡：本金/盈亏/余额大数字 + 定性章，像片名一样定帧。
   inset:0 + flex 居中：点击区覆盖全屏（"点击任意处关闭"），
   且居中对齐不被 finalIn 动画的 transform 终值干扰。 */
.cine-final {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  animation: finalIn var(--t3) var(--cine) both;
  user-select: none;
}
.cine-final .f-nums {
  font-size: clamp(30px, 6.5vw, 58px);
  font-weight: 800;
  letter-spacing: .02em;
  font-variant-numeric: tabular-nums;
  color: var(--tx0);
  line-height: 1.3;
}
.cine-final .f-nums .f-arrow { color: var(--tx2); font-weight: 300; margin: 0 .35em; }
.cine-final .f-pnl { font-size: clamp(20px, 4vw, 34px); font-weight: 800; margin-top: 10px; font-variant-numeric: tabular-nums; }
.cine-final .f-pnl.up   { color: var(--gold); text-shadow: 0 0 40px rgba(212, 169, 78, .4); }
.cine-final .f-pnl.down { color: var(--red); text-shadow: 0 0 40px rgba(224, 90, 90, .35); }
/* 定性章：一行克制的判词 */
.cine-final .f-verdict {
  margin-top: 18px;
  font-size: 13px; letter-spacing: .3em;
  color: var(--tx1);
}
/* 关闭提示：比判词更弱一档 */
.cine-final .f-hint {
  margin-top: 26px;
  font-size: 11px; letter-spacing: .18em;
  color: var(--tx2);
}

/* 右下角 ESC 跳过提示 */
.cine-skip {
  position: absolute; right: 26px; bottom: 22px;
  font-size: 11px; letter-spacing: .12em;
  color: var(--tx2);
  pointer-events: auto;
  cursor: pointer;
  padding: 7px 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(11, 15, 22, .5);
  backdrop-filter: blur(6px);
  opacity: 0;
  animation: fadeIn var(--t2) var(--cine) 1.2s both;
  transition: color var(--t1) var(--cine), border-color var(--t1) var(--cine);
  user-select: none;
}
.cine-skip:hover { color: var(--tx0); border-color: rgba(233, 237, 244, .3); }
.cine-skip kbd {
  font-family: inherit; font-size: 10px;
  border: 1px solid var(--line); border-radius: 4px;
  padding: 1px 5px; margin-right: 6px;
}

/* === 30. 胶片颗粒与暗角（质感层，挂在 body 末尾的固定元素） === */
.grain {
  position: fixed; inset: -3%;
  z-index: 1500;
  pointer-events: none;
  opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 240px 240px;
  animation: grainDrift 90s linear infinite;
}
.vignette {
  position: fixed; inset: 0;
  z-index: 1400;
  pointer-events: none;
  background: radial-gradient(ellipse 130% 110% at 50% 42%, transparent 58%, rgba(4, 6, 10, .5) 100%);
}

/* === 31. 加载 spinner 通用小圆环 === */
.spin {
  display: inline-block; width: 14px; height: 14px;
  border: 2px solid rgba(233, 237, 244, .15);
  border-top-color: var(--gold);
  border-radius: 50%;
  animation: spin .8s linear infinite;
  vertical-align: -2px;
}

/* === 32. 三档强度（body 类由 JS 切换，localStorage 持久化） === */
/* 精简档：去颗粒、弱化暗角、大位移改纯淡入 */
body.cine-lite .grain { display: none; }
body.cine-lite .vignette { opacity: .35; }
body.cine-lite .panel.active > *,
body.cine-lite .card.will-reveal,
body.cine-lite .empty-state { animation-name: fadeIn; }
body.cine-lite .card.will-reveal { transform: none; }
body.cine-lite .cine-year,
body.cine-lite .cine-narr { animation-name: fadeIn; }
body.cine-lite .cine-final { animation-name: fadeIn; animation-duration: var(--t2); }
body.cine-lite body::before { animation: none; }

/* 关闭档：完全静态，但深色配色体系完整保留 */
body.cine-off .grain,
body.cine-off .vignette,
body.cine-off #cine-root { display: none !important; }
body.cine-off::before { animation: none; }
body.cine-off *,
body.cine-off *::before,
body.cine-off *::after {
  animation-duration: .01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .01ms !important;
}
body.cine-off .card.will-reveal { opacity: 1; transform: none; }
body.cine-off .toast-item { transition: none; }

/* === 33. 减少动态效果（无障碍）：保留透明度渐变，去位移与颗粒漂移 === */
@media (prefers-reduced-motion: reduce) {
  .grain { animation: none; }
  body::before { animation: none; }
  .panel.active > *,
  .empty-state,
  .retry-bar,
  .next-step { animation-name: fadeIn; }
  .card.will-reveal { transform: none; }
  .cine-year, .cine-narr, .cine-final { animation-name: fadeIn; }
  .step-bar .step.cur .dot { animation: none; }
  .prog-fill::after,
  .sk::after, .skeleton::after { animation: none; }
  html { scroll-behavior: auto; }
}

/* === 34. 响应式 <760px（L1-5） === */
@media (max-width: 760px) {
  header { padding: 0 14px; gap: 10px; }
  header .sub { display: none; }
  .logo .name { font-size: 15px; }
  main { padding: 18px 14px 48px; }

  .tabs { padding: 0 14px; gap: 18px; overflow-x: auto; scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .tab { padding: 12px 2px 11px; font-size: 13.5px; white-space: nowrap; }

  /* 卡片单列 */
  .grid { grid-template-columns: 1fr; }
  .plan-cards { grid-template-columns: 1fr; }
  .hl-grid { grid-template-columns: 1fr; }
  .card { padding: 18px 16px; border-radius: var(--r2); }
  .kv { grid-template-columns: repeat(2, 1fr); }

  /* 四步路线图压缩 */
  .roadmap { gap: 5px; padding: 14px 4px 0; }
  .rm-step span { display: none; }
  .rm-step { padding: 7px 11px; }

  /* 新步骤条压缩为圆点 */
  .step-bar { padding: 10px 12px; gap: 4px; }
  .step-bar .txt { display: none; }
  .step-bar .step { flex: none; }
  .step-bar .step + .step { padding-left: 12px; }
  .step-bar .step.cur .txt { display: block; position: absolute; left: 30px; right: 0; top: 50%; transform: translateY(-50%); }

  /* 筛选栏横向滚动 */
  .flt-bar {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .flt-bar::-webkit-scrollbar { display: none; }
  .flt-bar .chip { flex: none; }
  .flt-bar input[type="search"], .flt-bar .flt-kw { min-width: 120px; }

  /* 表格横滑（首列靠 sticky 表头已可，容器保证可滑） */
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  th, td { padding: 8px 9px; }

  /* 弹层近全屏 */
  .modal-mask { padding: 12px; align-items: flex-end; }
  .modal-card { width: 100%; padding: 20px; border-radius: var(--r3) var(--r3) var(--r2) var(--r2); }
  .modal-card .m-acts button { flex: 1; }

  /* 电影层移动端克制 */
  .cine-year { font-size: clamp(48px, 16vw, 84px); }
  .cine-narr { font-size: 16px; bottom: 14%; max-width: 88vw; padding: 8px 16px; }
  .cine-skip { right: 14px; bottom: 14px; }

  /* 触控目标 ≥40px */
  button { min-height: 40px; }
  .chip { padding: 7px 15px; }
  .run-item { padding: 13px 10px; }

  /* 表单纵排 */
  .form-row > input, .form-row > select { flex: 1 1 100%; }
  .form-row > button { flex: 1 1 auto; }

  .pnl { font-size: 20px; }
  .auth-box { margin: 12px auto 0; }
  .pay-channels { grid-template-columns: 1fr; }
}

/* ============================================================================
 * 等待剧场（cine-wait.js）：三幕式回测等待层
 * 层级：压页面（顶栏 60）、让 #cine-root(2000) 的揭晓压它
 * ========================================================================== */
#wait-theater {
  position: fixed; inset: 0; z-index: 1500;
  background: radial-gradient(120% 90% at 50% 30%, #101623 0%, var(--bg0) 62%);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .4s cubic-bezier(.16,.84,.3,1);
  overflow: hidden;
}
#wait-theater.on { opacity: 1; }
#wait-theater.wt-black { opacity: 0; background: #05080d; transition-duration: .42s; }

/* 背景 K 线剪影：缓慢横移出景深（两层错速） */
.wt-bg { position: absolute; inset: -10% -60%; pointer-events: none; opacity: .5; }
.wt-bg::before, .wt-bg::after {
  content: ''; position: absolute; inset: 0;
  background-image:
    linear-gradient(0deg, transparent 46%, rgba(90,120,160,.10) 46%, rgba(90,120,160,.10) 54%, transparent 54%),
    repeating-linear-gradient(90deg,
      transparent 0 26px, rgba(120,150,200,.07) 26px 34px, transparent 34px 68px,
      rgba(212,169,78,.05) 68px 76px, transparent 76px 120px);
  background-size: 100% 220px, 480px 320px;
  animation: wtPan 46s linear infinite;
}
.wt-bg::after { animation-duration: 23s; opacity: .45; transform: translateY(120px) scale(1.4); }
@keyframes wtPan { from { background-position: 0 0, 0 0; } to { background-position: 0 0, -480px 0; } }

/* 顶部金色进度线：全片唯一进度条，运镜锚点 */
.wt-line {
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: rgba(212,169,78,.14);
}
.wt-line-fill {
  height: 100%; width: 0;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold-hi));
  box-shadow: 0 0 12px rgba(212,169,78,.55);
  transition: width .5s cubic-bezier(.16,.84,.3,1);
}

/* 中央主视觉 */
.wt-act { position: relative; text-align: center; padding: 0 24px; max-width: 92vw; }
.wt-act-label {
  font-size: 13px; letter-spacing: 8px; color: var(--tx2);
  margin-bottom: 34px; user-select: none;
}
.wt-main { min-height: 120px; display: flex; align-items: center; justify-content: center; }
.wt-count { font-variant-numeric: tabular-nums; }
.wt-num {
  font-size: clamp(64px, 12vw, 108px); font-weight: 800; color: var(--tx0);
  text-shadow: 0 0 42px rgba(212,169,78,.22);
}
.wt-denom { font-size: clamp(20px, 3.4vw, 30px); color: var(--tx2); margin-left: 10px; }

/* 幕二日期牌：翻牌钟 */
.wt-datebox {
  background: rgba(18,23,31,.82); border: 1px solid rgba(212,169,78,.22);
  border-radius: 14px; padding: 26px 46px; position: relative;
  box-shadow: 0 18px 60px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.04);
  perspective: 600px;
}
.wt-datebox::after { /* 翻牌钟中缝 */
  content: ''; position: absolute; left: 12px; right: 12px; top: 50%;
  height: 1px; background: rgba(212,169,78,.14);
}
.wt-date {
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: clamp(40px, 7.5vw, 64px); font-weight: 700; color: var(--tx0);
  font-variant-numeric: tabular-nums; letter-spacing: 2px;
}
.wt-date.flip { animation: wtFlip .24s cubic-bezier(.16,.84,.3,1); }
@keyframes wtFlip {
  0% { transform: rotateX(72deg); opacity: .1; }
  100% { transform: rotateX(0); opacity: 1; }
}
.wt-main.wt-in { animation: wtRise .6s cubic-bezier(.16,.84,.3,1); }
@keyframes wtRise {
  0% { transform: translateY(46px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

.wt-sub {
  margin-top: 26px; font-size: clamp(15px, 2.2vw, 18px); font-weight: 600;
  color: var(--gold); font-variant-numeric: tabular-nums;
}
.wt-desc { margin-top: 10px; font-size: 13px; color: var(--tx2); }
.wt-trades {
  margin-top: 16px; font-size: 14px; color: var(--tx1);
  font-variant-numeric: tabular-nums; animation: fadeIn .4s ease;
}
.wt-finale {
  margin: 18px auto 0; display: inline-block; padding: 8px 22px;
  border: 1px solid rgba(212,169,78,.55); border-radius: 999px;
  color: var(--gold-hi); font-size: 14px; letter-spacing: 1px;
  background: rgba(212,169,78,.08);
  box-shadow: 0 0 24px rgba(212,169,78,.18);
  animation: wtPulse 1.6s ease-in-out infinite;
}
@keyframes wtPulse {
  0%, 100% { box-shadow: 0 0 14px rgba(212,169,78,.12); }
  50% { box-shadow: 0 0 34px rgba(212,169,78,.34); }
}

/* 定格一拍：时间凝固（日期牌轻微收光） */
#wait-theater.wt-hold .wt-date { text-shadow: 0 0 30px rgba(212,169,78,.35); }
#wait-theater.wt-hold .wt-date.flip { animation: none; }

/* 底部常驻：策略名 + 本金（始终提醒「这是你的钱在打这场仗」） */
.wt-foot {
  position: absolute; left: 26px; right: 26px; bottom: 22px;
  display: flex; justify-content: space-between; gap: 16px;
  font-size: 12.5px; color: var(--tx2); pointer-events: none;
}
.wt-foot-l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 70vw; }
.wt-foot-r { color: var(--gold); font-variant-numeric: tabular-nums; flex-shrink: 0; }

/* 收起：后台继续（任务照跑） */
.wt-collapse {
  position: absolute; top: 18px; right: 20px;
  background: rgba(26,33,44,.6); color: var(--tx1);
  border: 1px solid var(--line, rgba(255,255,255,.08));
  border-radius: 8px; padding: 7px 14px; font-size: 12.5px; cursor: pointer;
}
.wt-collapse:hover { color: var(--tx0); border-color: var(--gold-deep); }

/* 降级：影效·简——保留信息层，关掉背景动效与脉冲 */
body.cine-lite .wt-bg,
body.cine-lite .wt-finale { animation: none; }
body.cine-lite .wt-bg { opacity: .18; }
body.cine-lite .wt-date.flip { animation-name: fadeIn; }

/* ============================================================================
 * 风险解剖（策略点评内）：隔夜跳空 / 系统性追高
 * ========================================================================== */
.risk-block {
  margin: 10px 0 14px; padding: 14px 16px;
  background: linear-gradient(135deg, rgba(224,90,90,.07), rgba(224,90,90,.02) 55%, transparent);
  border: 1px solid rgba(224,90,90,.22);
  border-left: 3px solid var(--red);
  border-radius: 10px;
}
.risk-head {
  display: flex; align-items: center; gap: 8px;
  font-size: 14.5px; font-weight: 700; color: var(--red);
  margin-bottom: 10px; letter-spacing: .5px;
}
.risk-head .muted { color: var(--tx2); font-weight: 400; font-size: 12.5px; letter-spacing: 0; }
.risk-item { display: flex; gap: 12px; padding: 10px 0; border-top: 1px dashed rgba(224,90,90,.16); }
.risk-item:first-of-type { border-top: none; }
.risk-ic {
  flex-shrink: 0; width: 34px; height: 34px; border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  color: var(--gold-hi); background: rgba(212,169,78,.10);
  border: 1px solid rgba(212,169,78,.25);
}
.risk-item.high .risk-ic {
  color: #ff8a8a; background: rgba(224,90,90,.13);
  border-color: rgba(224,90,90,.4);
  box-shadow: 0 0 16px rgba(224,90,90,.18);
}
.risk-body { flex: 1; min-width: 0; }
.risk-title { font-weight: 700; font-size: 13.5px; color: var(--tx0); display: flex; align-items: center; gap: 8px; }
.risk-tag {
  font-size: 10.5px; font-weight: 700; letter-spacing: 1px;
  padding: 2px 8px; border-radius: 999px;
  color: var(--gold-hi); border: 1px solid rgba(212,169,78,.4); background: rgba(212,169,78,.08);
}
.risk-tag.high { color: #ff9a9a; border-color: rgba(224,90,90,.55); background: rgba(224,90,90,.12); }
.risk-body p { margin: 5px 0 0; font-size: 13px; line-height: 1.75; color: var(--tx1); }
.risk-adv { display: flex; gap: 7px; align-items: flex-start; color: var(--gold) !important; }
.risk-adv svg { flex-shrink: 0; margin-top: 4px; }
.risk-adv span { flex: 1; }
.risk-worst { margin-top: 12px; border-top: 1px dashed rgba(224,90,90,.16); padding-top: 10px; }
.risk-worst-title { font-size: 12.5px; font-weight: 600; color: var(--tx2); margin-bottom: 8px; letter-spacing: .5px; }
.risk-worst table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.risk-worst th {
  text-align: left; font-weight: 500; color: var(--tx2); font-size: 11.5px;
  padding: 4px 8px 6px 0; border-bottom: 1px solid var(--line-soft);
}
.risk-worst td { padding: 7px 8px 7px 0; border-bottom: 1px solid var(--line-soft); color: var(--tx1); vertical-align: top; line-height: 1.5; }
.risk-worst tr:last-child td { border-bottom: none; }
.risk-worst .muted { color: var(--tx2); font-size: 11px; }
.risk-num { color: #ff8a8a !important; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }