/* =======================================================
走势图4套完整主题配色（批DEV200）
主题1:浅茶柔影(主推浅底) | 主题2:灰蓝静谧(深底夜间)
主题3:冷素雅灰(数据分析) | 主题4:暖金雅致(金色重点球)
球形数字球样式已写好，光源统一顶部高光，凸起立体效果
仅作用于 走势图.html（.trend-app/.trend-table/.view-tools
等选择器只存在于该页；主题类挂在 <html> 上）
====================================================== */

/* --------------------------
【主题1 浅茶柔影 - 浅底主推】
-------------------------- */
:root,
.theme-soft-tea {
  /* 4个分区背景，用于区分不同模块 A主 B交替 C统计 D侧边 */
  --bg-a: #F3F0E9;
  --bg-b: #EAE5DD;
  --bg-c: #E2DDD3;
  --bg-d: #D9D2C6;

  /* 球形号码球 */
  --ball-normal-bg: #FFFFFF;
  --ball-normal-text: #38342F;
  --ball-high-bg: #D86048;
  --ball-high-text: #FFFFFF;
  --ball-highlight: rgba(255,255,255,0.55);
  --ball-shadow: rgba(0,0,0,0.18);

  /* 走势图线条、网格、文字 */
  --line-main: #405A73;
  --grid-line: #D3CDC2;
  --axis-text: #706A61;
}

/* --------------------------
【主题2 灰蓝静谧 - 深色夜间】
-------------------------- */
.theme-quiet-blue {
  --bg-a: #2B333C;
  --bg-b: #343C47;
  --bg-c: #3C4652;
  --bg-d: #47515E;

  --ball-normal-bg: #4F5A68;
  --ball-normal-text: #E1E6ED;
  --ball-high-bg: #D1624A;
  --ball-high-text: #FFFFFF;
  --ball-highlight: rgba(255,255,255,0.38);
  --ball-shadow: rgba(0,0,0,0.35);

  --line-main: #83A8D0;
  --grid-line: #414B58;
  --axis-text: #A2ADBB;
}

/* --------------------------
【主题3 冷素雅灰 - 专业数据分析】
-------------------------- */
.theme-cold-gray {
  --bg-a: #F0F2F4;
  --bg-b: #E5E8EB;
  --bg-c: #D9DDE2;
  --bg-d: #CDD2D8;

  --ball-normal-bg: #FFFFFF;
  --ball-normal-text: #2D3742;
  --ball-high-bg: #3A72B8;
  --ball-high-text: #FFFFFF;
  --ball-highlight: rgba(255,255,255,0.58);
  --ball-shadow: rgba(0,0,0,0.16);

  --line-main: #596470;
  --grid-line: #D0D5DB;
  --axis-text: #6C7885;
}

/* --------------------------
【主题4 暖金雅致 - 金色重点球】
-------------------------- */
.theme-warm-gold {
  --bg-a: #F4F0E8;
  --bg-b: #EAE4D9;
  --bg-c: #DFD8C9;
  --bg-d: #D3C9B8;

  --ball-normal-bg: #FFFFFF;
  --ball-normal-text: #3A342C;
  --ball-high-bg: #C49648;
  --ball-high-text: #FFFFFF;
  --ball-highlight: rgba(255,255,255,0.52);
  --ball-shadow: rgba(80,60,20,0.20);

  --line-main: #635240;
  --grid-line: #D9D0BF;
  --axis-text: #7A6F5F;
}

/* --------------------------
球形号码球 通用样式，4套主题共用
直接 class="ball-num" 普通球；class="ball-num high" 重点高亮球
-------------------------- */
.ball-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 15px;
  background: var(--ball-normal-bg);
  color: var(--ball-normal-text);
  /* 上高光、下阴影，实现凸起球形 */
  box-shadow: inset 0 -4px 6px var(--ball-shadow), inset 0 4px 6px var(--ball-highlight);
}
.ball-num.high {
  background: var(--ball-high-bg);
  color: var(--ball-high-text);
}

/* =======================================================
批DEV200 映射层：走势图页现有元素挂到主题变量。
带 !important——React 样式表内联了多套硬编码配色，须整体压住。
主题类挂在 <html>，未挂类时 :root 默认=主题1，页面不裸奔。
====================================================== */
html[class*="theme-"] body,
html[class*="theme-"] .trend-app {
  background: var(--bg-a) !important;
  color: var(--axis-text) !important;
}

/* D 侧边：表头 + 期号/开奖号冻结列 */
html[class*="theme-"] .trend-table thead th,
html[class*="theme-"] .trend-table .sticky-period,
html[class*="theme-"] .trend-table .sticky-draw {
  background: var(--bg-d) !important;
  color: var(--axis-text) !important;
}

/* 主体数据区使用稳定底色，不按奇偶行交替。 */
html[class*="theme-"] .trend-table tbody td {
  background: var(--bg-a) !important;
  color: var(--axis-text) !important;
  border-color: var(--grid-line) !important;
}

/* C 统计区：表尾/统计标签 */
html[class*="theme-"] .trend-table tfoot td,
html[class*="theme-"] .trend-table tfoot th,
html[class*="theme-"] .stat-label {
  background: var(--bg-c) !important;
  color: var(--axis-text) !important;
}

/* 球形号码球：开奖号球=普通球，命中球=重点高亮球（两态制，统一顶光凸起） */
html[class*="theme-"] .trend-table .draw-ball {
  background-color: var(--ball-normal-bg) !important;
  background-image:
    radial-gradient(circle at 31% 24%, var(--ball-highlight) 0 13%, rgba(255, 255, 255, .16) 28%, transparent 52%),
    linear-gradient(145deg, rgba(255, 255, 255, .2), rgba(0, 0, 0, .18)) !important;
  color: var(--ball-normal-text) !important;
  box-shadow: inset 0 -4px 6px var(--ball-shadow), inset 0 4px 6px var(--ball-highlight) !important;
}
html[class*="theme-"] .trend-table .hit-ball {
  background-color: var(--group-ball, var(--ball-high-bg)) !important;
  background-image:
    radial-gradient(circle at 31% 24%, var(--ball-highlight) 0 13%, rgba(255, 255, 255, .16) 28%, transparent 52%),
    linear-gradient(145deg, rgba(255, 255, 255, .2), rgba(0, 0, 0, .18)) !important;
  color: var(--ball-high-text) !important;
  box-shadow: inset 0 -4px 6px var(--ball-shadow), inset 0 4px 6px var(--ball-highlight) !important;
}

/* 线条/网格/文字 */
html[class*="theme-"] .trend-table [class*="trend-line"],
html[class*="theme-"] .trend-table polyline,
html[class*="theme-"] .trend-table path {
  stroke: var(--line-main) !important;
}
html[class*="theme-"] .view-tools,
html[class*="theme-"] .view-tools label,
html[class*="theme-"] .command-row {
  color: var(--axis-text) !important;
}

/* 走势图页"主题"下拉（期数之前）沿用页内控件样式，仅补主题徽标色 */
.trend-theme-picker {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.trend-theme-picker::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--ball-high-bg);
  box-shadow: inset 0 2px 3px var(--ball-highlight), inset 0 -2px 3px var(--ball-shadow);
}

/* =======================================================
批DEV200补一（用户追加）：主题5~8
====================================================== */

/* --------------------------
【主题5 青雾浅境｜清新浅绿调，清爽不闷，长时间看不累眼】
-------------------------- */
.theme-green-fog {
  --bg-a: #EFF4F2;
  --bg-b: #E2EAE7;
  --bg-c: #D4DFDA;
  --bg-d: #C5D2CC;

  --ball-normal-bg: #FFFFFF;
  --ball-normal-text: #2A403B;
  --ball-high-bg: #38877A;
  --ball-high-text: #FFFFFF;
  --ball-highlight: rgba(255,255,255,0.55);
  --ball-shadow: rgba(20,60,50,0.16);

  --line-main: #346B62;
  --grid-line: #D1DDD9;
  --axis-text: #506E68;
}

/* --------------------------
【主题6 墨石深调｜深色冷灰，极简硬核数据分析，OLED省电】
-------------------------- */
.theme-dark-stone {
  --bg-a: #282A2D;
  --bg-b: #313438;
  --bg-c: #3A3D42;
  --bg-d: #44484D;

  --ball-normal-bg: #4A4E54;
  --ball-normal-text: #E3E5E8;
  --ball-high-bg: #995A44;
  --ball-high-text: #FFFFFF;
  --ball-highlight: rgba(255,255,255,0.35);
  --ball-shadow: rgba(0,0,0,0.38);

  --line-main: #909BA8;
  --grid-line: #383B40;
  --axis-text: #A9AEB4;
}

/* --------------------------
【主题7 薰衣草浅柔｜淡紫柔和款，视觉独特，区分度高，不艳】
-------------------------- */
.theme-lavender-soft {
  --bg-a: #F3F1F7;
  --bg-b: #E9E4F0;
  --bg-c: #DED8E7;
  --bg-d: #D1C5DD;

  --ball-normal-bg: #FFFFFF;
  --ball-normal-text: #373245;
  --ball-high-bg: #7258A0;
  --ball-high-text: #FFFFFF;
  --ball-highlight: rgba(255,255,255,0.55);
  --ball-shadow: rgba(45,30,80,0.17);

  --line-main: #5A4780;
  --grid-line: #DDD7E8;
  --axis-text: #696080;
}

/* --------------------------
【主题8 赤陶暖调｜暖红棕系，复古质感，重点球醒目但不刺眼】
-------------------------- */
.theme-terracotta {
  --bg-a: #F6EFEB;
  --bg-b: #EBDFD8;
  --bg-c: #DFCEC3;
  --bg-d: #D0BAAE;

  --ball-normal-bg: #FFFFFF;
  --ball-normal-text: #422F27;
  --ball-high-bg: #A85F44;
  --ball-high-text: #FFFFFF;
  --ball-highlight: rgba(255,255,255,0.53);
  --ball-shadow: rgba(70,35,20,0.20);

  --line-main: #704837;
  --grid-line: #E3D4CC;
  --axis-text: #7A5A4B;
}

/* =======================================================
批DEV200补二：表头指标列组颜色岔开 + 鼠标十字定位（随主题变量）
标记由 scripts/trend-chart-enhance.js 按指标组奇偶写入 data-col-parity
====================================================== */
html[class*="theme-"] .trend-table thead .metric-group[data-col-parity="0"],
html[class*="theme-"] .trend-table thead .metric-head[data-col-parity="0"] {
  background: var(--bg-d) !important;
}
html[class*="theme-"] .trend-table thead .metric-group[data-col-parity="1"],
html[class*="theme-"] .trend-table thead .metric-head[data-col-parity="1"] {
  background: color-mix(in srgb, var(--bg-d) 80%, var(--line-main)) !important;
}
/* 指标组边界竖线，强化"岔开"观感 */
html[class*="theme-"] .trend-table thead .metric-group {
  border-left: 2px solid color-mix(in srgb, var(--line-main) 55%, transparent) !important;
}

/* 十字定位遮罩：列竖带 + 行横带（pointer-events 穿透，置于粘性列/头之下） */
.tc-cross-col,
.tc-cross-row {
  position: absolute;
  pointer-events: none;
  z-index: 5;
  display: none;
}
.tc-cross-col {
  background: color-mix(in srgb, var(--line-main) 10%, transparent);
  border-left: 1px solid color-mix(in srgb, var(--line-main) 45%, transparent);
  border-right: 1px solid color-mix(in srgb, var(--line-main) 45%, transparent);
}
.tc-cross-row {
  background: color-mix(in srgb, var(--line-main) 8%, transparent);
  border-top: 1px solid color-mix(in srgb, var(--line-main) 45%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--line-main) 45%, transparent);
}

/* =======================================================
批DEV200补三（用户裁定）：快乐8每10号一段背景区分；3D 胆码与N位列组区分
====================================================== */
/* 快乐8：偶数段（2/4/6/8，即11-20、31-40…）加深一档，段界竖线 */
html[class*="theme-"] .trend-app .lotto-comprehensive-kl8 :is(.kl8-comprehensive-cell, .kl8-number-head):is(.kl8-band-2, .kl8-band-4, .kl8-band-6, .kl8-band-8) {
  background-image: linear-gradient(color-mix(in srgb, var(--line-main) 7%, transparent), color-mix(in srgb, var(--line-main) 7%, transparent)) !important;
}
html[class*="theme-"] .trend-app .lotto-comprehensive-kl8 td.kl8-comprehensive-cell:nth-child(10n+2) {
  box-shadow: inset 2px 0 0 color-mix(in srgb, var(--line-main) 50%, transparent) !important;
}
html[class*="theme-"] .trend-app .lotto-comprehensive-kl8 thead .kl8-number-head.kl8-band-1 {
  box-shadow: inset 2px 0 0 color-mix(in srgb, var(--line-main) 50%, transparent) !important;
}

/* 3D/数字彩：胆码组独档（表头混入重点球色），N位组保持交替 */
html[class*="theme-"] .trend-table thead .metric-group[data-col-parity="dan"],
html[class*="theme-"] .trend-table thead .metric-head[data-col-parity="dan"] {
  background: color-mix(in srgb, var(--bg-d) 72%, var(--ball-high-bg)) !important;
}
/* 数据行列组底色：胆码列组=重点球淡染，奇数组=线条主色淡染（半透明叠加，
   行条纹仍透出）；偶数组不加染保持基色 */
html[class*="theme-"] .trend-table tbody .metric-cell[data-grp="dan"] {
  background-image: linear-gradient(color-mix(in srgb, var(--ball-high-bg) 9%, transparent), color-mix(in srgb, var(--ball-high-bg) 9%, transparent)) !important;
}
html[class*="theme-"] .trend-table tbody .metric-cell[data-grp="1"] {
  background-image: linear-gradient(color-mix(in srgb, var(--line-main) 6%, transparent), color-mix(in srgb, var(--line-main) 6%, transparent)) !important;
}

/* =======================================================
批DEV200补五（用户裁定改判）：数字最大且绝对禁止溢出——固定 28px 曾使
3D 球竖向溢出、快乐8命中球（.kl8-comprehensive-ball）未覆盖。字号改由
enhance.js 分组实测自适应（球高起步逐px收缩至内容完全装入，双向校验），
本层只保留字重。
====================================================== */
html[class*="theme-"] .trend-table .draw-ball,
html[class*="theme-"] .trend-table .hit-ball,
html[class*="theme-"] .trend-table .drop-value-ball {
  font-weight: 800 !important;
}

/* 批DEV200补五：胆码重复标记上标随球字号等比缩放（em 制），
   否则自适应收缩球字号时上标固定宽度撑出滚动溢出 */
html[class*="theme-"] .trend-table .hit-ball .hit-repeat-count,
html[class*="theme-"] .trend-table .draw-ball sup {
  font-size: 0.45em !important;
}
html[class*="theme-"] .trend-table .hit-ball .hit-repeat-count {
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  padding: 0 1px !important;
  line-height: 1 !important;
}
html[class*="theme-"] .trend-table .hit-ball .hit-repeat-count {
  position: absolute !important;
  right: 0 !important;
  left: auto !important;
  top: 0 !important;
}

/* =========================================================
批DEV200补七（用户最终版规格，替换补六变量——变量名不变映射层自动生效）：
号码走势图 最终版
球体沿用认可的球+字体配色；5列表格背景色相明显拉开；
球体业务：普通/相同重复红/直连蓝/斜连绿/掉号紫；球形高光凸起质感
========================================================= */
:root {
  /* ========== 表格5列单元格背景（色相明显区分，不再颜色接近） ========== */
  --col-period-bg: #F9E9CF;     /* 期号列：暖米橙 */
  --col-num-bg: #D6EAF8;        /* 号码主列：雾蓝 */
  --col-bigsmall-bg: #D4F2DE;   /* 大小列：薄荷绿 */
  --col-oddeven-bg: #FBD8C7;    /* 奇偶列：蜜桃橙 */
  --col-hotcold-bg: #E4D9F4;    /* 冷热列：薰衣草紫 */

  /* ========== 球体颜色（确认满意的球+字体搭配） ========== */
  /* 普通号码球 */
  --ball-normal-bg: #FFFFFF;
  --ball-normal-text: #252B33;

  /* 相同重复数字 - 红球 黄字 */
  --ball-same-num-bg: #D13B3B;
  --ball-same-num-text: #FFF4B8;

  /* 直连号 - 蓝球 白字 */
  --ball-continue-bg: #2E6FCF;
  --ball-continue-text: #FFFFFF;

  /* 斜连球 - 绿球 白字 */
  --ball-slant-cont-bg: #2FA56A;
  --ball-slant-cont-text: #FFFFFF;

  /* 掉号遗漏球 - 紫球 浅黄字 */
  --ball-miss-bg: #854FC2;
  --ball-miss-text: #FFF3C2;

  /* 球体统一高光阴影，模拟凸起圆球效果，请勿修改 */
  --ball-inner-top-highlight: rgba(255, 255, 255, 0.60);
  --ball-inner-bottom-shadow: rgba(0, 0, 0, 0.20);

  --table-border: #C8D2DC;
}

/* ========== 表格列样式，td单元格直接加class ========== */
.col-period    { background-color: var(--col-period-bg); }
.col-num       { background-color: var(--col-num-bg); }
.col-bigsmall  { background-color: var(--col-bigsmall-bg); }
.col-oddeven   { background-color: var(--col-oddeven-bg); }
.col-hotcold   { background-color: var(--col-hotcold-bg); }

/* ========== 球体公共基础样式 ========== */
.ball {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 100%;
  font-size: 18px;
  font-weight: 700;
  box-sizing: border-box;
  box-shadow: inset 0 -5px 7px var(--ball-inner-bottom-shadow),
              inset 0 5px 7px var(--ball-inner-top-highlight);
  border: 1px solid rgba(0,0,0,0.07);
}

.ball.normal     { background: var(--ball-normal-bg);     color: var(--ball-normal-text); }
.ball.same-num   { background: var(--ball-same-num-bg);   color: var(--ball-same-num-text); }
.ball.continue   { background: var(--ball-continue-bg);   color: var(--ball-continue-text); }
.ball.slant-cont { background: var(--ball-slant-cont-bg); color: var(--ball-slant-cont-text); }
.ball.miss       { background: var(--ball-miss-bg);       color: var(--ball-miss-text); }


/* =========================================================
批DEV200补六映射层：把走势图页现有状态类/列挂到上述业务配色
（.ball 体系按规格原样保留，供后续 HTML 直接使用；
  页面现有球沿用自适应字号与球径，仅换业务配色与统一光影）
========================================================= */
/* 开奖号球：按业务状态五色分档 + 统一顶光底影 */
html[class*="theme-"] .trend-table .draw-ball.is-normal {
  background-color: var(--ball-normal-bg) !important;
  color: var(--ball-normal-text) !important;
}
html[class*="theme-"] .trend-table .draw-ball.is-repeat {
  background-color: var(--ball-same-num-bg) !important;
  color: var(--ball-same-num-text) !important;
}
html[class*="theme-"] .trend-table .draw-ball.is-relation-consecutive {
  background-color: var(--ball-continue-bg) !important;
  color: var(--ball-continue-text) !important;
}
html[class*="theme-"] .trend-table .draw-ball.is-relation-diagonal {
  background-color: var(--ball-slant-cont-bg) !important;
  color: var(--ball-slant-cont-text) !important;
}
html[class*="theme-"] .trend-table .draw-ball.is-relation-drop {
  background-color: var(--ball-miss-bg) !important;
  color: var(--ball-miss-text) !important;
}
html[class*="theme-"] .trend-table .draw-ball {
  box-shadow: inset 0 -5px 7px var(--ball-inner-bottom-shadow),
              inset 0 5px 7px var(--ball-inner-top-highlight) !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
}
/* 掉号值球：有掉号=紫球，无掉号=普通 */
html[class*="theme-"] .trend-table .drop-value-ball.has-drop {
  background: var(--ball-miss-bg) !important;
  color: var(--ball-miss-text) !important;
}
/* 列底色：期号列/开奖号码列 */
html[class*="theme-"] .trend-table :is(td, th).sticky-period,
html[class*="theme-"] .trend-table .kl8-period-cell,
html[class*="theme-"] .trend-table .kl8-fixed-head {
  background: var(--col-period-bg) !important;
}
html[class*="theme-"] .trend-table :is(td, th).sticky-draw {
  background: var(--col-num-bg) !important;
}
/* 业务列底色（enhance.js 按组名挂 data-grp） */
html[class*="theme-"] .trend-table tbody .metric-cell[data-grp="bigsmall"],
html[class*="theme-"] .trend-table thead :is(.metric-group, .metric-head)[data-col-parity="bigsmall"] {
  background: var(--col-bigsmall-bg) !important;
}
html[class*="theme-"] .trend-table tbody .metric-cell[data-grp="oddeven"],
html[class*="theme-"] .trend-table thead :is(.metric-group, .metric-head)[data-col-parity="oddeven"] {
  background: var(--col-oddeven-bg) !important;
}
html[class*="theme-"] .trend-table tbody .metric-cell[data-grp="hotcold"],
html[class*="theme-"] .trend-table thead :is(.metric-group, .metric-head)[data-col-parity="hotcold"] {
  background: var(--col-hotcold-bg) !important;
}

/* =======================================================
批TGW-DEV264：统一语义色变量
React 指标组通过 inline var 引用这里的语义变量，主题切换时同步更新表头、
单元格和命中球；固定的业务关系色仍由 --ball-* 变量控制，避免不同主题下
同一种指标变成不可辨认的颜色。
======================================================= */
:root {
  --tc-dan-accent: #c62f3d;
  --tc-pos1-accent: #b87535;
  --tc-pos2-accent: #337fb1;
  --tc-pos3-accent: #2f8f69;
  --tc-pos4-accent: #aa782d;
  --tc-pos5-accent: #80679a;
  --tc-any2-accent: #c34354;
  --tc-any3-accent: #3d79ae;
  --tc-any4-accent: #3d8e68;
  --tc-any5-accent: #b47b32;
  --tc-drop-accent: #7656a6;
  --tc-negative-accent: #8a6d2d;
  --tc-default-accent: #516b70;
  --tc-dan-head: color-mix(in srgb, var(--tc-dan-accent) 18%, var(--bg-d));
  --tc-dan-tint: color-mix(in srgb, var(--tc-dan-accent) 9%, var(--bg-a));
  --tc-dan-hit: var(--tc-dan-tint);
  --tc-dan-text: var(--axis-text);
  --tc-dan-ball: var(--tc-dan-accent);
  --tc-pos1-head: color-mix(in srgb, var(--tc-pos1-accent) 18%, var(--bg-d));
  --tc-pos1-tint: color-mix(in srgb, var(--tc-pos1-accent) 9%, var(--bg-a));
  --tc-pos1-hit: var(--tc-pos1-tint);
  --tc-pos1-text: var(--axis-text);
  --tc-pos1-ball: var(--tc-pos1-accent);
  --tc-pos2-head: color-mix(in srgb, var(--tc-pos2-accent) 18%, var(--bg-d));
  --tc-pos2-tint: color-mix(in srgb, var(--tc-pos2-accent) 9%, var(--bg-a));
  --tc-pos2-hit: var(--tc-pos2-tint);
  --tc-pos2-text: var(--axis-text);
  --tc-pos2-ball: var(--tc-pos2-accent);
  --tc-pos3-head: color-mix(in srgb, var(--tc-pos3-accent) 18%, var(--bg-d));
  --tc-pos3-tint: color-mix(in srgb, var(--tc-pos3-accent) 9%, var(--bg-a));
  --tc-pos3-hit: var(--tc-pos3-tint);
  --tc-pos3-text: var(--axis-text);
  --tc-pos3-ball: var(--tc-pos3-accent);
  --tc-pos4-head: color-mix(in srgb, var(--tc-pos4-accent) 18%, var(--bg-d));
  --tc-pos4-tint: color-mix(in srgb, var(--tc-pos4-accent) 9%, var(--bg-a));
  --tc-pos4-hit: var(--tc-pos4-tint);
  --tc-pos4-text: var(--axis-text);
  --tc-pos4-ball: var(--tc-pos4-accent);
  --tc-pos5-head: color-mix(in srgb, var(--tc-pos5-accent) 18%, var(--bg-d));
  --tc-pos5-tint: color-mix(in srgb, var(--tc-pos5-accent) 9%, var(--bg-a));
  --tc-pos5-hit: var(--tc-pos5-tint);
  --tc-pos5-text: var(--axis-text);
  --tc-pos5-ball: var(--tc-pos5-accent);
  --tc-any2-head: color-mix(in srgb, var(--tc-any2-accent) 18%, var(--bg-d));
  --tc-any2-tint: color-mix(in srgb, var(--tc-any2-accent) 9%, var(--bg-a));
  --tc-any2-hit: var(--tc-any2-tint);
  --tc-any2-text: var(--axis-text);
  --tc-any2-ball: var(--tc-any2-accent);
  --tc-any3-head: color-mix(in srgb, var(--tc-any3-accent) 18%, var(--bg-d));
  --tc-any3-tint: color-mix(in srgb, var(--tc-any3-accent) 9%, var(--bg-a));
  --tc-any3-hit: var(--tc-any3-tint);
  --tc-any3-text: var(--axis-text);
  --tc-any3-ball: var(--tc-any3-accent);
  --tc-any4-head: color-mix(in srgb, var(--tc-any4-accent) 18%, var(--bg-d));
  --tc-any4-tint: color-mix(in srgb, var(--tc-any4-accent) 9%, var(--bg-a));
  --tc-any4-hit: var(--tc-any4-tint);
  --tc-any4-text: var(--axis-text);
  --tc-any4-ball: var(--tc-any4-accent);
  --tc-any5-head: color-mix(in srgb, var(--tc-any5-accent) 18%, var(--bg-d));
  --tc-any5-tint: color-mix(in srgb, var(--tc-any5-accent) 9%, var(--bg-a));
  --tc-any5-hit: var(--tc-any5-tint);
  --tc-any5-text: var(--axis-text);
  --tc-any5-ball: var(--tc-any5-accent);
  --tc-drop-head: color-mix(in srgb, var(--tc-drop-accent) 18%, var(--bg-d));
  --tc-drop-tint: color-mix(in srgb, var(--tc-drop-accent) 9%, var(--bg-a));
  --tc-drop-hit: var(--tc-drop-tint);
  --tc-drop-text: var(--axis-text);
  --tc-drop-ball: var(--tc-drop-accent);
  --tc-negative-head: color-mix(in srgb, var(--tc-negative-accent) 18%, var(--bg-d));
  --tc-negative-tint: color-mix(in srgb, var(--tc-negative-accent) 9%, var(--bg-a));
  --tc-negative-hit: var(--tc-negative-tint);
  --tc-negative-text: var(--axis-text);
  --tc-negative-ball: var(--tc-negative-accent);
  --tc-default-head: color-mix(in srgb, var(--tc-default-accent) 18%, var(--bg-d));
  --tc-default-tint: color-mix(in srgb, var(--tc-default-accent) 9%, var(--bg-a));
  --tc-default-hit: var(--tc-default-tint);
  --tc-default-text: var(--axis-text);
  --tc-default-ball: var(--tc-default-accent);
}

/* 四套推荐搭配：浅底、冷蓝、暖金和墨色，仅切换语义强调色，保持业务含义稳定。 */
.theme-soft-tea {
  --tc-dan-accent: #bd3548; --tc-pos1-accent: #ad6f2d; --tc-pos2-accent: #2f78a8;
  --tc-pos3-accent: #2f8967; --tc-pos4-accent: #a7732b; --tc-pos5-accent: #765c95;
  --tc-any2-accent: #b84c5a; --tc-any3-accent: #3a78a8; --tc-any4-accent: #34815f;
  --tc-any5-accent: #a36d2c; --tc-drop-accent: #7653a0; --tc-negative-accent: #8c6a25;
}
.theme-quiet-blue {
  --tc-dan-accent: #ff6977; --tc-pos1-accent: #e6ae61; --tc-pos2-accent: #67b5ef;
  --tc-pos3-accent: #61d39e; --tc-pos4-accent: #f1c36d; --tc-pos5-accent: #bd9ee8;
  --tc-any2-accent: #f38a99; --tc-any3-accent: #7ec4f2; --tc-any4-accent: #78d9ab;
  --tc-any5-accent: #e6b777; --tc-drop-accent: #b790ef; --tc-negative-accent: #e7c16c;
}
.theme-cold-gray {
  --tc-dan-accent: #c63b4e; --tc-pos1-accent: #a86d33; --tc-pos2-accent: #357fbd;
  --tc-pos3-accent: #2f936a; --tc-pos4-accent: #aa782d; --tc-pos5-accent: #785fa1;
  --tc-any2-accent: #bb4c5d; --tc-any3-accent: #397db7; --tc-any4-accent: #348b68;
  --tc-any5-accent: #a67635; --tc-drop-accent: #7858a4; --tc-negative-accent: #8b6c2d;
}
.theme-warm-gold,
.theme-terracotta {
  --tc-dan-accent: #b93642; --tc-pos1-accent: #aa6b2b; --tc-pos2-accent: #3978a4;
  --tc-pos3-accent: #398364; --tc-pos4-accent: #a77429; --tc-pos5-accent: #78588e;
  --tc-any2-accent: #b44852; --tc-any3-accent: #3a76a3; --tc-any4-accent: #3c7d5e;
  --tc-any5-accent: #a66d2c; --tc-drop-accent: #745199; --tc-negative-accent: #916b2a;
}
.theme-green-fog {
  --tc-dan-accent: #b8324a; --tc-pos1-accent: #a8662b; --tc-pos2-accent: #317daf;
  --tc-pos3-accent: #258b67; --tc-pos4-accent: #9e702d; --tc-pos5-accent: #745896;
  --tc-any2-accent: #b24758; --tc-any3-accent: #337caf; --tc-any4-accent: #328261;
  --tc-any5-accent: #9d6b2d; --tc-drop-accent: #71509b; --tc-negative-accent: #886923;
}
.theme-dark-stone {
  --tc-dan-accent: #ff697a; --tc-pos1-accent: #e4ac60; --tc-pos2-accent: #73b9ee;
  --tc-pos3-accent: #67d3a0; --tc-pos4-accent: #f0c46d; --tc-pos5-accent: #c5a5ee;
  --tc-any2-accent: #f28c9c; --tc-any3-accent: #7dc2f0; --tc-any4-accent: #7adbb2;
  --tc-any5-accent: #e5b879; --tc-drop-accent: #b892ec; --tc-negative-accent: #e7bf69;
}
.theme-lavender-soft {
  --tc-dan-accent: #b73752; --tc-pos1-accent: #a76d34; --tc-pos2-accent: #397ab0;
  --tc-pos3-accent: #328a69; --tc-pos4-accent: #a97432; --tc-pos5-accent: #7556a1;
  --tc-any2-accent: #b64b62; --tc-any3-accent: #3d7db0; --tc-any4-accent: #398466;
  --tc-any5-accent: #a77035; --tc-drop-accent: #73529d; --tc-negative-accent: #8c6c2e;
}

/* 统一覆盖跨度次数、胆推动、定位差等旧表格，保证主题不只作用在综合表。 */
html[class*="theme-"] .trend-shell,
html[class*="theme-"] .command-panel,
html[class*="theme-"] .drawing-panel,
html[class*="theme-"] .legacy-scroll,
html[class*="theme-"] .table-scroll {
  background: var(--bg-a) !important;
  border-color: color-mix(in srgb, var(--line-main) 35%, var(--bg-d)) !important;
}
html[class*="theme-"] .command-panel,
html[class*="theme-"] .drawing-panel {
  color: var(--axis-text) !important;
}
html[class*="theme-"] .command-button,
html[class*="theme-"] .switch-button,
html[class*="theme-"] .special-button,
html[class*="theme-"] .digit-button {
  color: var(--axis-text) !important;
  background: var(--bg-a) !important;
  border-color: color-mix(in srgb, var(--line-main) 32%, var(--bg-d)) !important;
}
html[class*="theme-"] .command-button.is-toggle-active,
html[class*="theme-"] .switch-button.is-active,
html[class*="theme-"] .special-button.is-active,
html[class*="theme-"] .digit-button.is-active {
  color: var(--ball-high-text) !important;
  background: var(--ball-high-bg) !important;
  border-color: var(--ball-high-bg) !important;
}
html[class*="theme-"] .legacy-material-table {
  color: var(--axis-text) !important;
  background: var(--bg-a) !important;
}
html[class*="theme-"] .legacy-material-table th,
html[class*="theme-"] .legacy-material-table td {
  border-color: color-mix(in srgb, var(--line-main) 25%, var(--bg-d)) !important;
}
html[class*="theme-"] .legacy-material-table thead th {
  color: var(--axis-text) !important;
  background: var(--bg-d) !important;
}
html[class*="theme-"] .legacy-material-table tbody td,
html[class*="theme-"] .legacy-material-table tbody th {
  color: var(--axis-text) !important;
  background: var(--bg-a) !important;
}
html[class*="theme-"] .legacy-material-table tfoot th,
html[class*="theme-"] .legacy-material-table tfoot td {
  color: var(--axis-text) !important;
  background: var(--bg-c) !important;
}
html[class*="theme-"] .legacy-material-table :is(.legacy-date-head, .legacy-date-cell, .legacy-period-head, .legacy-period-cell, .legacy-draw-head, .legacy-draw-cell) {
  background: var(--bg-d) !important;
}
html[class*="theme-"] .legacy-material-table .legacy-hit,
html[class*="theme-"] .legacy-material-table .push-result {
  color: var(--ball-high-text) !important;
  background: var(--ball-high-bg) !important;
}
html[class*="theme-"] .legacy-material-table .legacy-miss {
  color: color-mix(in srgb, var(--axis-text) 62%, transparent) !important;
  background: var(--bg-a) !important;
}
html[class*="theme-"] .legacy-material-table .legacy-group-head,
html[class*="theme-"] .legacy-material-table .legacy-relation-head,
html[class*="theme-"] .legacy-material-table .push-head {
  color: var(--axis-text) !important;
  background: color-mix(in srgb, var(--line-main) 16%, var(--bg-d)) !important;
}
html[class*="theme-"] .legacy-material-table :is(.legacy-draw-ball, .compact-draw-ball).is-normal {
  color: var(--ball-normal-text) !important;
  background: var(--ball-normal-bg) !important;
  border-color: color-mix(in srgb, var(--line-main) 42%, var(--bg-d)) !important;
}
html[class*="theme-"] .legacy-material-table :is(.legacy-draw-ball, .compact-draw-ball).is-repeat {
  color: var(--ball-high-text) !important;
  background: var(--ball-same-num-bg) !important;
}
html[class*="theme-"] .legacy-material-table :is(.legacy-cell-ball, .push-number-ball, .push-mark, .span-group-ball).legacy-cell-ball,
html[class*="theme-"] .legacy-material-table :is(.legacy-cell-ball, .push-number-ball, .push-mark, .span-group-ball) {
  color: var(--ball-high-text) !important;
  background: var(--ball-high-bg) !important;
}
html[class*="theme-"] .legacy-material-table .drop-value-ball.has-drop,
html[class*="theme-"] .legacy-material-table .span-relation-ball {
  color: var(--ball-miss-text) !important;
  background: var(--ball-miss-bg) !important;
}

/* =======================================================
20260927 · 全图表新配色
语义固定：日期琥珀、期号天蓝、开奖号薄荷绿；命中用彩色球，遗漏统一浅灰蓝。
所有表格视图共用这一层，主题下拉只改变同一语义色的明度与冷暖，不改变业务含义。
======================================================= */
html[class*="theme-"] {
  --bg-a: #f6f9fb;
  --bg-b: #edf3f6;
  --bg-c: #e3edf2;
  --bg-d: #d5e2e8;
  --axis-text: #243844;
  --line-main: #3e6274;
  --grid-line: #c4d3db;
  --date-col-bg: #fff1d8;
  --period-col-bg: #e1efff;
  --draw-col-bg: #e2f5ed;
  --separator: #567b8a;
  --ball-normal-bg: #ffffff;
  --ball-normal-text: #263943;
  --ball-high-bg: #d85a69;
  --ball-high-text: #ffffff;
  --ball-same-num-bg: #e05a4f;
  --ball-same-num-text: #ffffff;
  --ball-continue-bg: #2b7fbe;
  --ball-continue-text: #ffffff;
  --ball-slant-cont-bg: #2e956f;
  --ball-slant-cont-text: #ffffff;
  --ball-miss-bg: #8053b4;
  --ball-miss-text: #ffffff;
  --ball-highlight: rgba(255, 255, 255, .62);
  --ball-shadow: rgba(21, 48, 60, .2);
  --tc-dan-accent: #d34f61;
  --tc-pos1-accent: #bd8130;
  --tc-pos2-accent: #2f78b8;
  --tc-pos3-accent: #2d8b68;
  --tc-pos4-accent: #b6623c;
  --tc-pos5-accent: #71599b;
  --tc-any2-accent: #ad5b86;
  --tc-any3-accent: #2b858f;
  --tc-any4-accent: #748b40;
  --tc-any5-accent: #986c3e;
  --tc-drop-accent: #8053b4;
  --tc-negative-accent: #667b88;
  --tc-default-accent: #4d6974;
}

html[class*="theme-"] body,
html[class*="theme-"] .trend-app,
html[class*="theme-"] .trend-main,
html[class*="theme-"] .trend-shell,
html[class*="theme-"] .command-panel,
html[class*="theme-"] .drawing-panel,
html[class*="theme-"] .table-scroll,
html[class*="theme-"] .legacy-scroll {
  color: var(--axis-text) !important;
  background: var(--bg-a) !important;
}
html[class*="theme-"] .command-panel,
html[class*="theme-"] .drawing-panel {
  border-color: var(--grid-line) !important;
}
html[class*="theme-"] .command-button,
html[class*="theme-"] .switch-button,
html[class*="theme-"] .special-button,
html[class*="theme-"] .digit-button,
html[class*="theme-"] .view-tools select,
html[class*="theme-"] .special-select {
  color: #284653 !important;
  background: #eaf3f6 !important;
  border-color: #81a5b2 !important;
  box-shadow: inset 0 -2px 0 rgba(49, 91, 108, .16), 0 1px 0 rgba(255, 255, 255, .8) !important;
}
html[class*="theme-"] .command-button:hover,
html[class*="theme-"] .switch-button:hover,
html[class*="theme-"] .special-button:hover,
html[class*="theme-"] .digit-button:hover {
  color: #173642 !important;
  background: #d7ebf2 !important;
}
html[class*="theme-"] .command-button.is-toggle-active,
html[class*="theme-"] .switch-button.is-active,
html[class*="theme-"] .special-button.is-active,
html[class*="theme-"] .digit-button.is-active,
html[class*="theme-"] .segmented button.is-active,
html[class*="theme-"] .zoom-tools button.is-active {
  color: #ffffff !important;
  background: #d34f61 !important;
  border-color: #a93648 !important;
}

/* 日期、期号、开奖号固定列的三色识别。 */
html[class*="theme-"] .trend-table .sticky-left,
html[class*="theme-"] .trend-table .date-head,
html[class*="theme-"] .legacy-material-table :is(.legacy-date-head, .legacy-date-cell) {
  color: #7b5a1d !important;
  background: var(--date-col-bg) !important;
}
html[class*="theme-"] .trend-table :is(.sticky-period, .period-head),
html[class*="theme-"] .legacy-material-table :is(.legacy-period-head, .legacy-period-cell),
html[class*="theme-"] .kl8-comprehensive-table :is(.kl8-period-head-cell, .kl8-period-cell) {
  color: #1f608a !important;
  background: var(--period-col-bg) !important;
}
html[class*="theme-"] .trend-table :is(.sticky-draw, .draw-head),
html[class*="theme-"] .legacy-material-table :is(.legacy-draw-head, .legacy-draw-cell),
html[class*="theme-"] .kl8-comprehensive-table :is(.kl8-draw-head-cell, .kl8-draw-cell) {
  color: #236b55 !important;
  background: var(--draw-col-bg) !important;
}

/* 数字彩综合表：胆码与1-5位使用稳定、明显不同的浅色分区。 */
html[class*="theme-"] .trend-table thead :is(.metric-group, .metric-head) {
  color: var(--group-text) !important;
  background: var(--group-head) !important;
  border-color: var(--grid-line) !important;
}
html[class*="theme-"] .trend-table thead :is(.metric-group, .metric-head)[data-col-parity] {
  color: var(--group-text) !important;
  background: var(--group-head) !important;
}
html[class*="theme-"] .trend-table tbody .metric-cell {
  color: var(--group-text) !important;
  background: var(--group-tint) !important;
  border-color: var(--grid-line) !important;
}
html[class*="theme-"] .trend-table tbody .metric-cell[data-grp] {
  color: var(--group-text) !important;
  background: var(--group-tint) !important;
}
html[class*="theme-"] .trend-table tbody .metric-cell.is-hit {
  background: var(--group-hit) !important;
}
html[class*="theme-"] .trend-table tbody .metric-cell.is-hit[data-grp] {
  background: var(--group-hit) !important;
}
html[class*="theme-"] .trend-table .indicator-hit {
  background: var(--group-ball) !important;
  color: #ffffff !important;
}
html[class*="theme-"] .trend-table .difference-cell {
  background: #eee9fb !important;
}
html[class*="theme-"] .trend-table .difference-cell.is-hit {
  background: #e0d4f5 !important;
}
html[class*="theme-"] .trend-table .drop-cell {
  background: #eee8f8 !important;
}

/* 遗漏数字统一字体与浅色；0 与其他遗漏值同样处理。 */
html[class*="theme-"] .trend-table :is(.miss-value, .omission-value),
html[class*="theme-"] .legacy-material-table :is(.miss-value, .omission-value),
html[class*="theme-"] .kl8-comprehensive-table .kl8-omission-value {
  color: #81959e !important;
  font-family: "Cascadia Mono", "Microsoft YaHei", monospace !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

/* 旧式跨度/胆推动表：每个业务区使用自己的浅底，命中球仍保持高饱和。 */
html[class*="theme-"] .legacy-material-table {
  color: var(--axis-text) !important;
  background: var(--bg-a) !important;
}
html[class*="theme-"] .legacy-material-table th,
html[class*="theme-"] .legacy-material-table td {
  border-color: var(--grid-line) !important;
}
html[class*="theme-"] .legacy-material-table tbody .legacy-cell {
  color: #536d77 !important;
  background: var(--bg-a) !important;
}
html[class*="theme-"] .legacy-material-table .legacy-group-head,
html[class*="theme-"] .legacy-material-table .legacy-relation-head,
html[class*="theme-"] .legacy-material-table .push-head {
  color: #294957 !important;
  background: var(--bg-d) !important;
}
html[class*="theme-"] .legacy-material-table .legacy-hit {
  color: #31434d !important;
  background: color-mix(in srgb, var(--ball-high-bg) 13%, var(--bg-a)) !important;
}
html[class*="theme-"] .legacy-material-table :is(.legacy-cell-ball, .push-number-ball, .push-mark, .span-group-ball) {
  color: #ffffff !important;
  background: var(--ball-high-bg) !important;
  border-color: color-mix(in srgb, var(--ball-high-bg) 70%, #334d58) !important;
}
html[class*="theme-"] .span-material-table .legacy-tone-1 { background: #fbe4e7 !important; }
html[class*="theme-"] .span-material-table .legacy-tone-2 { background: #e3f0fb !important; }
html[class*="theme-"] .span-material-table .legacy-tone-3 { background: #e1f4eb !important; }
html[class*="theme-"] .span-material-table .legacy-tone-4 { background: #fef1d6 !important; }
html[class*="theme-"] .span-material-table .legacy-cell.legacy-hit.legacy-tone-1 { background: #f5cbd1 !important; }
html[class*="theme-"] .span-material-table .legacy-cell.legacy-hit.legacy-tone-2 { background: #c9e1f4 !important; }
html[class*="theme-"] .span-material-table .legacy-cell.legacy-hit.legacy-tone-3 { background: #bee7d4 !important; }
html[class*="theme-"] .span-material-table .legacy-cell.legacy-hit.legacy-tone-4 { background: #f4d69d !important; }
html[class*="theme-"] .span-material-table .span-group-ball.legacy-tone-1 { background: #d34f61 !important; }
html[class*="theme-"] .span-material-table .span-group-ball.legacy-tone-2 { background: #2f78b8 !important; }
html[class*="theme-"] .span-material-table .span-group-ball.legacy-tone-3 { background: #2d8b68 !important; }
html[class*="theme-"] .span-material-table .span-group-ball.legacy-tone-4 { background: #bd8130 !important; }

/* 胆推动各区：底色与球色同语义，避免整张表都是同一种红色。 */
html[class*="theme-"] .push-material-table .push-zone-count { background: #e5f1f6 !important; }
html[class*="theme-"] .push-material-table .push-zone-group { background: #f0e8fa !important; }
html[class*="theme-"] .push-material-table .push-zone-position { background: #e2f4ec !important; }
html[class*="theme-"] .push-material-table .push-zone-large { background: #f8efd8 !important; }
html[class*="theme-"] .push-material-table .push-zone-middle { background: #e6f4ec !important; }
html[class*="theme-"] .push-material-table .push-zone-small { background: #fbe7df !important; }
html[class*="theme-"] .push-material-table .push-zone-permutation { background: #e9eef8 !important; }
html[class*="theme-"] .push-material-table .push-zone-parity { background: #f7e6f2 !important; }
html[class*="theme-"] .push-material-table .push-zone-size { background: #e9f3de !important; }
html[class*="theme-"] .push-material-table .push-zone-sum { background: #fff0d3 !important; }
html[class*="theme-"] .push-material-table .push-zone-tail { background: #fff3da !important; }
html[class*="theme-"] .push-material-table .push-zone-span { background: #e5f0f5 !important; }
html[class*="theme-"] .push-material-table .legacy-cell.legacy-hit { background: color-mix(in srgb, var(--ball-high-bg) 12%, var(--bg-a)) !important; }
html[class*="theme-"] .push-material-table .push-zone-position .push-number-ball { background: #2d8b68 !important; }
html[class*="theme-"] .push-material-table .push-zone-large .push-number-ball { background: #bd8130 !important; }
html[class*="theme-"] .push-material-table .push-zone-middle .push-number-ball { background: #4d9b73 !important; }
html[class*="theme-"] .push-material-table .push-zone-small .push-number-ball { background: #b6623c !important; }
html[class*="theme-"] .push-material-table .push-zone-group .push-mark { background: #71599b !important; }
html[class*="theme-"] .push-material-table .push-zone-permutation .push-mark { background: #2f78b8 !important; }
html[class*="theme-"] .push-material-table .push-zone-parity .push-mark { background: #ad5b86 !important; }
html[class*="theme-"] .push-material-table .push-zone-size .push-mark { background: #748b40 !important; }
html[class*="theme-"] .push-material-table .push-zone-sum .push-mark,
html[class*="theme-"] .push-material-table .push-zone-span .push-mark { background: #986c3e !important; }
html[class*="theme-"] .push-material-table .push-disappearing { background: #ffe9a8 !important; color: #765718 !important; }

/* 快乐8：每10个号码一段，八段色相明显区分；主区/副区仍保持不同球色。 */
html[class*="theme-"] .kl8-comprehensive-table .kl8-band-1 { background: #fbe4e7 !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-band-2 { background: #e3f0fb !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-band-3 { background: #e1f4eb !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-band-4 { background: #fef1d6 !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-band-5 { background: #eee8fb !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-band-6 { background: #fbe7df !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-band-7 { background: #e0f2f4 !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-band-8 { background: #edf3dc !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-number-section-head { background: #d5e2e8 !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-ball.is-primary { background: #2f8790 !important; border-color: #236771 !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-ball.is-secondary { background: #527dc0 !important; border-color: #355b96 !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-draw-ball.is-primary { background: #d34f61 !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-draw-ball.is-secondary { background: #527dc0 !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-ball.is-relation-consecutive,
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-draw-ball.is-relation-consecutive { background: #2e956f !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-ball.is-relation-diagonal,
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-draw-ball.is-relation-diagonal { background: #bd8130 !important; }
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-ball.is-relation-drop,
html[class*="theme-"] .kl8-comprehensive-table .kl8-comprehensive-draw-ball.is-relation-drop { background: #8053b4 !important; }

/* 定位差/掉号与十期分隔线。 */
html[class*="theme-"] .difference-table .difference-ball { background: #71599b !important; border-color: #56417f !important; }
html[class*="theme-"] .drop-value-ball.has-drop { background: #8053b4 !important; border-color: #5d3b8d !important; color: #ffffff !important; }
html[class*="theme-"] table tbody tr.is-ten-period-boundary > :is(td, th) {
  border-bottom: 2px solid var(--separator) !important;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .8) !important;
}

/* 主题差异放在全局覆盖之后，确保下拉切换仍有可见反馈。 */
html[class~="theme-soft-tea"] {
  --bg-a: #f6f9fb; --bg-b: #edf3f6; --bg-c: #e3edf2; --bg-d: #d5e2e8;
  --axis-text: #243844; --line-main: #3e6274; --grid-line: #c4d3db;
  --tc-dan-accent: #c94459; --tc-pos1-accent: #a86b2e; --tc-pos2-accent: #2e79b7;
  --tc-pos3-accent: #2d8b68; --tc-pos4-accent: #b6613e; --tc-pos5-accent: #745899;
  --tc-drop-accent: #8053b4; --ball-high-bg: #d85a69;
}
html[class~="theme-quiet-blue"] {
  --bg-a: #eef6fb; --bg-b: #e2eef7; --bg-c: #d7e7f1; --bg-d: #c6dbe8;
  --axis-text: #1f3f50; --line-main: #396b87; --grid-line: #b8cfdd;
  --tc-dan-accent: #b94d72; --tc-pos1-accent: #aa7c35; --tc-pos2-accent: #2b76a9;
  --tc-pos3-accent: #2d8c75; --tc-pos4-accent: #b6654c; --tc-pos5-accent: #725a9e;
  --tc-drop-accent: #7250a5; --ball-high-bg: #c64f70;
}
html[class~="theme-cold-gray"] {
  --bg-a: #f2f5f7; --bg-b: #e8eef1; --bg-c: #dce5e9; --bg-d: #cbd8de;
  --axis-text: #2d3c43; --line-main: #536d79; --grid-line: #c1cdd2;
  --tc-dan-accent: #b9495b; --tc-pos1-accent: #9c6f36; --tc-pos2-accent: #36769a;
  --tc-pos3-accent: #37826e; --tc-pos4-accent: #a75d46; --tc-pos5-accent: #6f5c91;
  --tc-drop-accent: #765a9e; --ball-high-bg: #c55363;
}
html[class~="theme-warm-gold"] {
  --bg-a: #fbf7ef; --bg-b: #f5eee1; --bg-c: #eee3d0; --bg-d: #e3d3b9;
  --axis-text: #4b3a2b; --line-main: #8a6a45; --grid-line: #d7c5a8;
  --tc-dan-accent: #bc4c51; --tc-pos1-accent: #a87025; --tc-pos2-accent: #37799d;
  --tc-pos3-accent: #378368; --tc-pos4-accent: #a95f35; --tc-pos5-accent: #78558d;
  --tc-drop-accent: #7953a0; --ball-high-bg: #cb5a59;
}
html[class~="theme-green-fog"] {
  --bg-a: #f2f8f4; --bg-b: #e6f1ea; --bg-c: #d8e9df; --bg-d: #c6ddcf;
  --axis-text: #274439; --line-main: #46765f; --grid-line: #bad1c3;
  --tc-dan-accent: #b94d5d; --tc-pos1-accent: #a37535; --tc-pos2-accent: #317ba0;
  --tc-pos3-accent: #287d60; --tc-pos4-accent: #aa6541; --tc-pos5-accent: #715992;
  --tc-drop-accent: #70519a; --ball-high-bg: #c65363;
}
html[class~="theme-dark-stone"] {
  --bg-a: #263842; --bg-b: #2e4651; --bg-c: #38515d; --bg-d: #45626d;
  --axis-text: #eaf4f7; --line-main: #8bb5c9; --grid-line: #5e7d89;
  --date-col-bg: #5f5136; --period-col-bg: #274f68; --draw-col-bg: #275949;
  --separator: #9bc4d3; --tc-dan-accent: #ff7887; --tc-pos1-accent: #edb35e;
  --tc-pos2-accent: #70bff0; --tc-pos3-accent: #65d5a1; --tc-pos4-accent: #f0b178;
  --tc-pos5-accent: #c3a5ee; --tc-drop-accent: #b38aeb; --ball-high-bg: #dc5c70;
  --ball-normal-bg: #314b57; --ball-normal-text: #eff8fa;
}
html[class~="theme-lavender-soft"] {
  --bg-a: #f8f5fb; --bg-b: #f0eaf7; --bg-c: #e6ddf0; --bg-d: #d9cde6;
  --axis-text: #41344b; --line-main: #765b86; --grid-line: #d0c2dc;
  --tc-dan-accent: #bb4f6b; --tc-pos1-accent: #a9753a; --tc-pos2-accent: #397cb0;
  --tc-pos3-accent: #33856b; --tc-pos4-accent: #aa6546; --tc-pos5-accent: #7857a1;
  --tc-drop-accent: #75529e; --ball-high-bg: #c85871;
}
html[class~="theme-terracotta"] {
  --bg-a: #fbf3ef; --bg-b: #f5e7e0; --bg-c: #edd8cf; --bg-d: #e3c6b9;
  --axis-text: #503b35; --line-main: #91604f; --grid-line: #dbc0b4;
  --tc-dan-accent: #bf4f52; --tc-pos1-accent: #a87131; --tc-pos2-accent: #3c7897;
  --tc-pos3-accent: #3a826d; --tc-pos4-accent: #b05f3c; --tc-pos5-accent: #7d5a8c;
  --tc-drop-accent: #7b5696; --ball-high-bg: #ce5b5c;
}

/* 最终优先级层：固定列与特殊业务区压过旧版主题映射。 */
html[class*="theme-"] .trend-table :is(.date-head, .sticky-left.date-cell) {
  background-color: var(--date-col-bg) !important;
}
html[class*="theme-"] .trend-table :is(.period-head, .sticky-period.period-cell) {
  background-color: var(--period-col-bg) !important;
}
html[class*="theme-"] .trend-table :is(.draw-head, .sticky-draw.draw-cell) {
  background-color: var(--draw-col-bg) !important;
}
html[class*="theme-"] .legacy-material-table :is(.legacy-date-head, .legacy-date-cell) {
  background-color: var(--date-col-bg) !important;
}
html[class*="theme-"] .legacy-material-table :is(.legacy-period-head, .legacy-period-cell) {
  background-color: var(--period-col-bg) !important;
}
html[class*="theme-"] .legacy-material-table :is(.legacy-draw-head, .legacy-draw-cell) {
  background-color: var(--draw-col-bg) !important;
}
html[class*="theme-"] .kl8-comprehensive-table :is(.kl8-period-head-cell, .kl8-period-cell) {
  background-color: var(--period-col-bg) !important;
}
html[class*="theme-"] .kl8-comprehensive-table :is(.kl8-draw-head-cell, .kl8-draw-cell) {
  background-color: var(--draw-col-bg) !important;
}

/* 重否/连否使用不同色相，定位差四个分区也保持独立识别。 */
html[class*="theme-"] .trend-table :is(.metric-group, .metric-head, .metric-cell)[data-group-key="重否"] {
  color: #2f5873 !important;
  background-color: #e3eff8 !important;
}
html[class*="theme-"] .trend-table .metric-cell.is-hit[data-group-key="重否"] {
  background-color: #c8deef !important;
}
html[class*="theme-"] .trend-table [data-group-key="重否"] .indicator-hit {
  background: #3e7ca4 !important;
}
html[class*="theme-"] .trend-table :is(.metric-group, .metric-head, .metric-cell)[data-group-key="连否"] {
  color: #7b3f58 !important;
  background-color: #f8e9ef !important;
}
html[class*="theme-"] .trend-table .metric-cell.is-hit[data-group-key="连否"] {
  background-color: #efcbd8 !important;
}
html[class*="theme-"] .trend-table [data-group-key="连否"] .indicator-hit {
  background: #b24d72 !important;
}
html[class*="theme-"] .difference-table :is(.metric-group, .metric-head, .metric-cell)[data-group-key="不定位差"] {
  color: #604a8b !important;
  background-color: #eee9fb !important;
}
html[class*="theme-"] .difference-table :is(.metric-group, .metric-head, .metric-cell)[data-group-key="1位差"] {
  color: #2e6387 !important;
  background-color: #e4f0fa !important;
}
html[class*="theme-"] .difference-table :is(.metric-group, .metric-head, .metric-cell)[data-group-key="2位差"] {
  color: #2f725e !important;
  background-color: #e4f4ed !important;
}
html[class*="theme-"] .difference-table :is(.metric-group, .metric-head, .metric-cell)[data-group-key="3位差"] {
  color: #8a6030 !important;
  background-color: #f9f0de !important;
}
html[class*="theme-"] .difference-table .metric-cell.is-hit[data-group-key="不定位差"] { background-color: #dfd3f4 !important; }
html[class*="theme-"] .difference-table .metric-cell.is-hit[data-group-key="1位差"] { background-color: #cce3f3 !important; }
html[class*="theme-"] .difference-table .metric-cell.is-hit[data-group-key="2位差"] { background-color: #c9e8d9 !important; }
html[class*="theme-"] .difference-table .metric-cell.is-hit[data-group-key="3位差"] { background-color: #f0d9a9 !important; }

/* 旧版 data-col-parity/data-grp 规则更具体，补上 thead/tbody 保证特殊区最终生效。 */
html[class*="theme-"] .trend-table thead .metric-group[data-group-key="重否"],
html[class*="theme-"] .trend-table thead .metric-head[data-group-key="重否"],
html[class*="theme-"] .trend-table tbody .metric-cell[data-group-key="重否"] {
  color: #2f5873 !important;
  background-color: #e3eff8 !important;
}
html[class*="theme-"] .trend-table tbody .metric-cell.is-hit[data-group-key="重否"] { background-color: #c8deef !important; }
html[class*="theme-"] .trend-table thead .metric-group[data-group-key="连否"],
html[class*="theme-"] .trend-table thead .metric-head[data-group-key="连否"],
html[class*="theme-"] .trend-table tbody .metric-cell[data-group-key="连否"] {
  color: #7b3f58 !important;
  background-color: #f8e9ef !important;
}
html[class*="theme-"] .trend-table tbody .metric-cell.is-hit[data-group-key="连否"] { background-color: #efcbd8 !important; }
html[class*="theme-"] .difference-table thead .metric-group[data-group-key="不定位差"],
html[class*="theme-"] .difference-table thead .metric-head[data-group-key="不定位差"],
html[class*="theme-"] .difference-table tbody .metric-cell[data-group-key="不定位差"] { background-color: #eee9fb !important; }
html[class*="theme-"] .difference-table thead .metric-group[data-group-key="1位差"],
html[class*="theme-"] .difference-table thead .metric-head[data-group-key="1位差"],
html[class*="theme-"] .difference-table tbody .metric-cell[data-group-key="1位差"] { background-color: #e4f0fa !important; }
html[class*="theme-"] .difference-table thead .metric-group[data-group-key="2位差"],
html[class*="theme-"] .difference-table thead .metric-head[data-group-key="2位差"],
html[class*="theme-"] .difference-table tbody .metric-cell[data-group-key="2位差"] { background-color: #e4f4ed !important; }
html[class*="theme-"] .difference-table thead .metric-group[data-group-key="3位差"],
html[class*="theme-"] .difference-table thead .metric-head[data-group-key="3位差"],
html[class*="theme-"] .difference-table tbody .metric-cell[data-group-key="3位差"] { background-color: #f9f0de !important; }
html[class*="theme-"] .difference-table tbody .metric-cell.is-hit[data-group-key="不定位差"] { background-color: #dfd3f4 !important; }
html[class*="theme-"] .difference-table tbody .metric-cell.is-hit[data-group-key="1位差"] { background-color: #cce3f3 !important; }
html[class*="theme-"] .difference-table tbody .metric-cell.is-hit[data-group-key="2位差"] { background-color: #c9e8d9 !important; }
html[class*="theme-"] .difference-table tbody .metric-cell.is-hit[data-group-key="3位差"] { background-color: #f0d9a9 !important; }

/* 跨度表的1-5位开奖号球按位置固定色相，重复号只降低明度，不再被普通球白底覆盖。 */
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-1 { background-color: #d34f61 !important; border-color: #a93648 !important; }
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-2 { background-color: #2f78b8 !important; border-color: #205c91 !important; }
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-3 { background-color: #2d8b68 !important; border-color: #20664d !important; }
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-4 { background-color: #bd8130 !important; border-color: #8f5e1f !important; }
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-5 { background-color: #71599b !important; border-color: #56417f !important; }
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-1.is-repeat { background-color: #a93648 !important; }
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-2.is-repeat { background-color: #205c91 !important; }
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-3.is-repeat { background-color: #20664d !important; }
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-4.is-repeat { background-color: #8f5e1f !important; }
html[class*="theme-"] .span-material-table .legacy-draw-ball.position-5.is-repeat { background-color: #56417f !important; }

/* 十字线叠加在单元格上时，球体仍保留统一的立体高光。 */
html[class*="theme-"] .trend-app :is(.draw-ball, .hit-ball, .legacy-draw-ball, .legacy-cell-ball, .push-number-ball, .drop-value-ball, .span-group-ball, .kl8-comprehensive-ball, .kl8-comprehensive-draw-ball, .kl8-prediction-ball, .prediction-ball) {
  background-image: radial-gradient(circle at 31% 24%, var(--ball-highlight) 0 13%, rgba(255, 255, 255, .16) 28%, transparent 52%), linear-gradient(145deg, rgba(255, 255, 255, .2), rgba(0, 0, 0, .18)) !important;
}

/* 取消隔行深浅：每个业务区整列使用自己的统一底色。 */
html[class*="theme-"] .trend-table tbody tr .metric-cell:not(.difference-cell) {
  filter: none !important;
  background: var(--group-tint) !important;
}
html[class*="theme-"] .trend-table tbody tr .metric-cell:not(.difference-cell)[data-grp] {
  background: var(--group-tint) !important;
}
html[class*="theme-"] .difference-table tbody tr .metric-cell[data-group-key="不定位差"] { background: #eee9fb !important; }
html[class*="theme-"] .difference-table tbody tr .metric-cell[data-group-key="1位差"] { background: #e4f0fa !important; }
html[class*="theme-"] .difference-table tbody tr .metric-cell[data-group-key="2位差"] { background: #e4f4ed !important; }
html[class*="theme-"] .difference-table tbody tr .metric-cell[data-group-key="3位差"] { background: #f9f0de !important; }
html[class*="theme-"] .difference-table tbody tr .metric-cell.is-hit[data-group-key="不定位差"] { background: #dfd3f4 !important; }
html[class*="theme-"] .difference-table tbody tr .metric-cell.is-hit[data-group-key="1位差"] { background: #cce3f3 !important; }
html[class*="theme-"] .difference-table tbody tr .metric-cell.is-hit[data-group-key="2位差"] { background: #c9e8d9 !important; }
html[class*="theme-"] .difference-table tbody tr .metric-cell.is-hit[data-group-key="3位差"] { background: #f0d9a9 !important; }

/* 跨度表：1-4 区块列不随行号变深变浅。 */
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-tone-1 { background: #fbe4e7 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-tone-2 { background: #e3f0fb !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-tone-3 { background: #e1f4eb !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-tone-4 { background: #fef1d6 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-hit.legacy-tone-1 { background: #f5cbd1 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-hit.legacy-tone-2 { background: #c9e1f4 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-hit.legacy-tone-3 { background: #bee7d4 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-hit.legacy-tone-4 { background: #f4d69d !important; }
html[class*="theme-"] .span-material-table thead th.span-category-parity { background: #cbdfe1 !important; }
html[class*="theme-"] .span-material-table thead th.span-category-odd { background: #e5cbd0 !important; }
html[class*="theme-"] .span-material-table thead th.span-category-even { background: #cfe3d5 !important; }
html[class*="theme-"] .span-material-table thead th.span-category-consecutive { background: #e7d8ad !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.span-category-parity,
html[class*="theme-"] .span-material-table tfoot .legacy-stat-cell.span-category-parity { background: #dce9e8 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.span-category-odd,
html[class*="theme-"] .span-material-table tfoot .legacy-stat-cell.span-category-odd { background: #f0dfe3 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.span-category-even,
html[class*="theme-"] .span-material-table tfoot .legacy-stat-cell.span-category-even { background: #e1efe5 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.span-category-consecutive,
html[class*="theme-"] .span-material-table tfoot .legacy-stat-cell.span-category-consecutive { background: #f3e6c2 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-hit.span-category-parity { background: #dce9e8 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-hit.span-category-odd { background: #f0dfe3 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-hit.span-category-even { background: #e1efe5 !important; }
html[class*="theme-"] .span-material-table tbody tr .legacy-cell.legacy-hit.span-category-consecutive { background: #f3e6c2 !important; }

/* 胆推动表：每个 push-zone 整列稳定着色，命中只保留轻微语义染色。 */
html[class*="theme-"] .push-material-table tbody tr .push-zone-count { background: #e5f1f6 !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-group { background: #f0e8fa !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-position { background: #e2f4ec !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-large { background: #f8efd8 !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-middle { background: #e6f4ec !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-small { background: #fbe7df !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-permutation { background: #e9eef8 !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-parity { background: #f7e6f2 !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-size { background: #e9f3de !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-sum { background: #fff0d3 !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-tail { background: #fff3da !important; }
html[class*="theme-"] .push-material-table tbody tr .push-zone-span { background: #e5f0f5 !important; }
html[class*="theme-"] .push-material-table tbody tr .legacy-cell.legacy-hit { background: color-mix(in srgb, var(--ball-high-bg) 12%, var(--bg-a)) !important; }

/* 快乐8与乐透：八个号码段及主副区列保持固定色，不使用隔行滤镜。 */
html[class*="theme-"] .kl8-comprehensive-table tbody tr .kl8-comprehensive-cell { filter: none !important; }
html[class*="theme-"] .kl8-comprehensive-table tbody tr .kl8-band-1 { background: #fbe4e7 !important; }
html[class*="theme-"] .kl8-comprehensive-table tbody tr .kl8-band-2 { background: #e3f0fb !important; }
html[class*="theme-"] .kl8-comprehensive-table tbody tr .kl8-band-3 { background: #e1f4eb !important; }
html[class*="theme-"] .kl8-comprehensive-table tbody tr .kl8-band-4 { background: #fef1d6 !important; }
html[class*="theme-"] .kl8-comprehensive-table tbody tr .kl8-band-5 { background: #eee8fb !important; }
html[class*="theme-"] .kl8-comprehensive-table tbody tr .kl8-band-6 { background: #fbe7df !important; }
html[class*="theme-"] .kl8-comprehensive-table tbody tr .kl8-band-7 { background: #e0f2f4 !important; }
html[class*="theme-"] .kl8-comprehensive-table tbody tr .kl8-band-8 { background: #edf3dc !important; }

/* 20260927 · 全图表数字球统一规格与双色球蓝号上层。 */
html[class*="theme-"] .trend-app :is(
  .draw-ball,
  .hit-ball,
  .compact-draw-ball,
  .legacy-draw-ball,
  .legacy-cell-ball,
  .push-number-ball,
  .drop-value-ball,
  .span-group-ball,
  .kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball,
  .kl8-prediction-ball,
  .prediction-ball
) {
  box-sizing: border-box !important;
  width: 23px !important;
  min-width: 23px !important;
  height: 23px !important;
  min-height: 23px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  background-image:
    radial-gradient(circle at 31% 24%, rgba(255, 255, 255, .72) 0 13%, rgba(255, 255, 255, .16) 28%, transparent 52%),
    linear-gradient(145deg, rgba(255, 255, 255, .2), rgba(0, 0, 0, .18)) !important;
  box-shadow: inset 2px 2px 2px rgba(255, 255, 255, .46), inset -2px -3px 3px rgba(0, 0, 0, .31), 0 2px 3px rgba(20, 36, 40, .3) !important;
}
html[class*="theme-"] .trend-app .lotto-comprehensive-ssq .kl8-comprehensive-cell.is-secondary {
  position: relative !important;
  z-index: 12 !important;
}
html[class*="theme-"] .trend-app .lotto-comprehensive-ssq :is(.kl8-comprehensive-ball, .kl8-comprehensive-draw-ball).is-secondary {
  position: relative !important;
  z-index: 13 !important;
}
html[class*="theme-"] .trend-app .lotto-comprehensive-ssq .lotto-fold-lines {
  z-index: 3 !important;
}

/* KL8 theme color rules use a more specific background shorthand; repeat the
   ball class so the shared highlight layer remains effective for every state. */
html[class*="theme-"] .trend-app .kl8-comprehensive-table :is(
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball,
  .kl8-prediction-ball.kl8-prediction-ball
) {
  background-image:
    radial-gradient(circle at 31% 24%, rgba(255, 255, 255, .72) 0 13%, rgba(255, 255, 255, .16) 28%, transparent 52%),
    linear-gradient(145deg, rgba(255, 255, 255, .2), rgba(0, 0, 0, .18)) !important;
  box-shadow: inset 2px 2px 2px rgba(255, 255, 255, .46), inset -2px -3px 3px rgba(0, 0, 0, .31), 0 2px 3px rgba(20, 36, 40, .3) !important;
}

/* KL8 连号使用暖琥珀色，和主区蓝绿色保持足够对比。 */
html[class*="theme-"] .trend-app .kl8-comprehensive-table :is(
  .kl8-comprehensive-ball.is-relation-consecutive,
  .kl8-comprehensive-draw-ball.is-relation-consecutive
) {
  background-color: #c98225 !important;
  border-color: #915c12 !important;
  color: #fffaf0 !important;
  box-shadow: 0 0 0 2px rgba(145, 92, 18, .3), inset 2px 2px 2px rgba(255, 255, 255, .42), inset -2px -3px 3px rgba(75, 39, 5, .3) !important;
}

/* 胆推动消失数使用稳定的亮黄色球，不随行透明度变化。 */
html[class*="theme-"] .trend-app .push-material-table .push-number-ball.is-disappearing {
  background-color: #ffdf24 !important;
  border-color: #ae7b00 !important;
  color: #3d2d00 !important;
  opacity: 1 !important;
  box-shadow: 0 0 0 1px rgba(174, 123, 0, .42), inset 2px 2px 2px rgba(255, 255, 255, .62), inset -2px -3px 3px rgba(117, 79, 0, .28) !important;
}

/* 统一按钮禁用态；业务区按列保持稳定底色。 */
html[class*="theme-"] .trend-app :is(.switch-button, .command-button)[disabled] {
  cursor: not-allowed !important;
  opacity: .42 !important;
  filter: saturate(.3) !important;
  transform: none !important;
}
html[class*="theme-"] .trend-app .push-material-table tbody tr {
  opacity: 1 !important;
}

/* 关系按钮同时驱动数字彩统计命中球，开奖号码与统计保持同一语义色。 */
html[class*="theme-"] .trend-app .trend-table .hit-ball.is-relation-consecutive {
  background-color: var(--ball-continue-bg) !important;
  color: var(--ball-continue-text) !important;
  border-color: color-mix(in srgb, var(--ball-continue-bg) 72%, #24343a) !important;
}
html[class*="theme-"] .trend-app .trend-table .hit-ball.is-relation-diagonal {
  background-color: var(--ball-slant-cont-bg) !important;
  color: var(--ball-slant-cont-text) !important;
  border-color: color-mix(in srgb, var(--ball-slant-cont-bg) 72%, #24343a) !important;
}
html[class*="theme-"] .trend-app .trend-table .hit-ball.is-relation-drop {
  background-color: var(--ball-miss-bg) !important;
  color: var(--ball-miss-text) !important;
  border-color: color-mix(in srgb, var(--ball-miss-bg) 72%, #24343a) !important;
}

/* 快乐8连号/斜连采用高对比暖色与紫红色，避免两态接近难辨。 */
html[class*="theme-"] .trend-app .kl8-comprehensive-table :is(
  .kl8-comprehensive-ball.is-relation-diagonal,
  .kl8-comprehensive-draw-ball.is-relation-diagonal
) {
  background-color: #b04c9c !important;
  border-color: #762d6d !important;
  color: #fff7ff !important;
  box-shadow: 0 0 0 2px rgba(118, 45, 109, .3), inset 2px 2px 2px rgba(255, 255, 255, .42), inset -2px -3px 3px rgba(65, 16, 58, .3) !important;
}

/* 双色球/大乐透分区线：分区起点与半区分界同时作用于表头和每一行。 */
html[class*="theme-"] .trend-app :is(.kl8-number-head, .kl8-comprehensive-cell).is-zone-start,
html[class*="theme-"] .trend-app :is(.kl8-number-head, .kl8-comprehensive-cell).is-zone-split {
  border-left: 2px solid color-mix(in srgb, var(--line-main) 78%, #1d3743) !important;
}
html[class*="theme-"] .trend-app .lotto-comprehensive-ssq :is(.kl8-number-head, .kl8-comprehensive-cell)[data-zone="blue"][data-number="9"],
html[class*="theme-"] .trend-app .lotto-comprehensive-dlt :is(.kl8-number-head, .kl8-comprehensive-cell)[data-zone="back"][data-number="7"] {
  border-left: 2px solid #3276a2 !important;
}

/* 20260927 · 走势图最终语义层：乐透旧的每十列分隔只属于快乐8，
   双色球/大乐透仅使用 React 生成的 is-zone-start/is-zone-split 边界。 */
html[class*="theme-"] .trend-app .lotto-comprehensive-kl8 :is(
  .kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball,
  .kl8-prediction-ball
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #505d64 !important;
  border-color: #27343a !important;
  color: #f3f7f8 !important;
}

/* 快乐8三种关系使用高亮黄、亮绿、亮红，且开奖号码与统计命中球同色。 */
html[class*="theme-"] .trend-app .lotto-comprehensive-kl8 :is(
  .kl8-comprehensive-ball.is-relation-consecutive,
  .kl8-comprehensive-draw-ball.is-relation-consecutive
) {
  background-color: #ffdf24 !important;
  border-color: #b98200 !important;
  color: #342700 !important;
  box-shadow: 0 0 0 2px rgba(185, 130, 0, .34), inset 2px 2px 2px rgba(255, 255, 255, .55), inset -2px -3px 3px rgba(107, 73, 0, .28) !important;
}
html[class*="theme-"] .trend-app .lotto-comprehensive-kl8 :is(
  .kl8-comprehensive-ball.is-relation-diagonal,
  .kl8-comprehensive-draw-ball.is-relation-diagonal
) {
  background-color: #35e66b !important;
  border-color: #087b3e !important;
  color: #073820 !important;
  box-shadow: 0 0 0 2px rgba(8, 123, 62, .3), inset 2px 2px 2px rgba(255, 255, 255, .48), inset -2px -3px 3px rgba(4, 67, 31, .28) !important;
}
html[class*="theme-"] .trend-app .lotto-comprehensive-kl8 :is(
  .kl8-comprehensive-ball.is-relation-drop,
  .kl8-comprehensive-draw-ball.is-relation-drop
) {
  background-color: #ff3d4d !important;
  border-color: #a91525 !important;
  color: #fff8f8 !important;
  box-shadow: 0 0 0 2px rgba(169, 21, 37, .3), inset 2px 2px 2px rgba(255, 255, 255, .44), inset -2px -3px 3px rgba(95, 8, 19, .3) !important;
}

/* 福彩3D/排列3/排列5的日期、期号、开奖号码采用统一灰黑偏蓝语义，
   重号不再按位置变色；关系按钮打开时仍由关系色覆盖开奖号码球。 */
html[class*="theme-"] .trend-app :is(
  .trend-table[data-lottery="fc3d"],
  .trend-table[data-lottery="pl3"],
  .trend-table[data-lottery="pl5"],
  .legacy-material-table[data-lottery="fc3d"],
  .legacy-material-table[data-lottery="pl3"],
  .legacy-material-table[data-lottery="pl5"]
) :is(
  .date-head,
  .period-head,
  .draw-head,
  .legacy-date-head,
  .legacy-period-head,
  .legacy-draw-head
) {
  background: #405761 !important;
  color: #f2f6f7 !important;
}
html[class*="theme-"] .trend-app :is(
  .trend-table[data-lottery="fc3d"],
  .trend-table[data-lottery="pl3"],
  .trend-table[data-lottery="pl5"],
  .legacy-material-table[data-lottery="fc3d"],
  .legacy-material-table[data-lottery="pl3"],
  .legacy-material-table[data-lottery="pl5"]
) :is(
  .date-cell,
  .period-cell,
  .draw-cell,
  .legacy-date-cell,
  .legacy-period-cell,
  .legacy-draw-cell
) {
  background: #dce5e8 !important;
  color: #334952 !important;
}
html[class*="theme-"] .trend-app :is(
  .trend-table[data-lottery="fc3d"],
  .trend-table[data-lottery="pl3"],
  .trend-table[data-lottery="pl5"],
  .legacy-material-table[data-lottery="fc3d"],
  .legacy-material-table[data-lottery="pl3"],
  .legacy-material-table[data-lottery="pl5"]
) :is(
  .draw-ball.is-normal,
  .draw-ball.is-repeat,
  .legacy-draw-ball.is-normal,
  .legacy-draw-ball.is-repeat,
  .compact-draw-ball.is-normal,
  .compact-draw-ball.is-repeat
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #505d64 !important;
  border-color: #27343a !important;
  color: #f3f7f8 !important;
}

/* 双色球与大乐透副区蓝球始终压在折叠线之上。 */
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) .kl8-comprehensive-cell.is-secondary {
  position: relative !important;
  z-index: 12 !important;
}
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) :is(.kl8-comprehensive-ball, .kl8-comprehensive-draw-ball).is-secondary {
  position: relative !important;
  z-index: 13 !important;
}

/* 双色球/大乐透默认主区为红球、副区为蓝球；关系态开启时由关系色覆盖。 */
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) :is(
  .kl8-comprehensive-ball.is-primary,
  .kl8-comprehensive-draw-ball.is-primary
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #d44757 !important;
  border-color: #9e2939 !important;
  color: #fff8f8 !important;
}
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) :is(
  .kl8-comprehensive-ball.is-secondary,
  .kl8-comprehensive-draw-ball.is-secondary
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #3f80c2 !important;
  border-color: #225990 !important;
  color: #f7fbff !important;
}

/* 所有彩种关系态统一沿用快乐8的最终语义色。该规则必须位于主题层末尾，
   覆盖各彩种旧的黄橙/紫色定义，同时保留双色球与大乐透未激活时的红蓝球。 */
html[class*="theme-"] body .trend-app :is(.trend-table, .legacy-material-table, .kl8-comprehensive-table) :is(
  .draw-ball.is-relation-consecutive,
  .hit-ball.is-relation-consecutive,
  .legacy-draw-ball.is-relation-consecutive,
  .compact-draw-ball.is-relation-consecutive,
  .kl8-comprehensive-ball.is-relation-consecutive,
  .kl8-comprehensive-draw-ball.is-relation-consecutive
) {
  background-color: #ffdf24 !important;
  border-color: #b98200 !important;
  color: #342700 !important;
  box-shadow: 0 0 0 2px rgba(185, 130, 0, .34), inset 2px 2px 2px rgba(255, 255, 255, .55), inset -2px -3px 3px rgba(107, 73, 0, .28) !important;
}
html[class*="theme-"] body .trend-app :is(.trend-table, .legacy-material-table, .kl8-comprehensive-table) :is(
  .draw-ball.is-relation-diagonal,
  .hit-ball.is-relation-diagonal,
  .legacy-draw-ball.is-relation-diagonal,
  .compact-draw-ball.is-relation-diagonal,
  .kl8-comprehensive-ball.is-relation-diagonal,
  .kl8-comprehensive-draw-ball.is-relation-diagonal
) {
  background-color: #35e66b !important;
  border-color: #087b3e !important;
  color: #073820 !important;
  box-shadow: 0 0 0 2px rgba(8, 123, 62, .3), inset 2px 2px 2px rgba(255, 255, 255, .48), inset -2px -3px 3px rgba(4, 67, 31, .28) !important;
}
html[class*="theme-"] body .trend-app :is(.trend-table, .legacy-material-table, .kl8-comprehensive-table) :is(
  .draw-ball.is-relation-drop,
  .hit-ball.is-relation-drop,
  .legacy-draw-ball.is-relation-drop,
  .compact-draw-ball.is-relation-drop,
  .kl8-comprehensive-ball.is-relation-drop,
  .kl8-comprehensive-draw-ball.is-relation-drop
) {
  background-color: #ff3d4d !important;
  border-color: #a91525 !important;
  color: #fff8f8 !important;
  box-shadow: 0 0 0 2px rgba(169, 21, 37, .3), inset 2px 2px 2px rgba(255, 255, 255, .44), inset -2px -3px 3px rgba(95, 8, 19, .3) !important;
}

/* 统一轻度凸起：降低高光、内阴影和外投影，避免鼠标经过时产生跳位感。 */
html[class*="theme-"] .trend-app :is(
  .draw-ball,
  .hit-ball,
  .compact-draw-ball,
  .legacy-draw-ball,
  .legacy-cell-ball,
  .push-number-ball,
  .drop-value-ball,
  .span-group-ball,
  .kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball,
  .kl8-prediction-ball,
  .prediction-ball
) {
  background-image: radial-gradient(circle at 34% 28%, rgba(255, 255, 255, .34) 0 8%, rgba(255, 255, 255, .08) 20%, transparent 44%), linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(0, 0, 0, .07)) !important;
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .24), inset -1px -1px 1px rgba(0, 0, 0, .12), 0 1px 1px rgba(20, 36, 40, .12) !important;
  transform: none !important;
  transition: none !important;
}
html[class*="theme-"] .trend-app .kl8-number-cell.is-hit.is-focus {
  transform: none !important;
}

/* 双色球/大乐透默认主区与副区提高饱和度；关系态由上方统一黄绿红规则接管。 */
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) :is(
  .kl8-comprehensive-ball.is-primary,
  .kl8-comprehensive-draw-ball.is-primary
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #e53950 !important;
  border-color: #a8182e !important;
  color: #fff8f8 !important;
}
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) :is(
  .kl8-comprehensive-ball.is-secondary,
  .kl8-comprehensive-draw-ball.is-secondary
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #1769c2 !important;
  border-color: #0b4f9d !important;
  color: #f7fbff !important;
}

/* 移动端图表区域占满剩余视口，横向内容仍由表格滚动容器完整承载。 */
@media (max-width: 760px) {
  html, body, #root, .trend-app { min-height: 100%; }
  .trend-app { min-height: 100dvh; }
  .trend-app .trend-main { min-height: 100dvh; display: flex; flex-direction: column; padding: 4px; }
  .trend-app .command-panel { flex: 0 0 auto; }
  .trend-app .trend-shell:not(.relation-shell) { flex: 1 1 auto; min-height: 0; height: auto; }
  .trend-app .trend-shell:not(.relation-shell) > :is(.table-scroll, .legacy-scroll, .kl8-comprehensive-scroll) { height: 100%; max-height: none; }
}

/* 语义分离：区分线标记形态分区，折叠线只由 SVG 连线开关控制。 */
html[class*="theme-"] .trend-app table.partition-lines-on :is(.is-group-start, .is-zone-start, .is-zone-split, .legacy-section-start) {
  border-left: 2px solid #426f82 !important;
}
html[class*="theme-"] .trend-app table:not(.partition-lines-on) :is(.is-group-start, .is-zone-start, .is-zone-split, .legacy-section-start) {
  border-left-width: 0 !important;
}

/* 旧主题层曾以更高优先级写入强高光；用重复球类选择器收敛为轻高光。 */
html[class*="theme-"] .trend-app .kl8-comprehensive-table :is(
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball,
  .kl8-prediction-ball.kl8-prediction-ball
) {
  background-image: radial-gradient(circle at 34% 28%, rgba(255, 255, 255, .28) 0 7%, rgba(255, 255, 255, .06) 18%, transparent 42%), linear-gradient(145deg, rgba(255, 255, 255, .07), rgba(0, 0, 0, .06)) !important;
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .2), inset -1px -1px 1px rgba(0, 0, 0, .1), 0 1px 1px rgba(20, 36, 40, .1) !important;
  transform: none !important;
  transition: none !important;
}

/* 双色球/大乐透使用明确的正红、正蓝，避免高光把球面冲淡。 */
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) :is(
  .kl8-comprehensive-ball.kl8-comprehensive-ball.is-primary,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball.is-primary
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #f00024 !important;
  background-image: linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(118, 0, 20, .12)) !important;
  border-color: #b4001e !important;
  color: #fff !important;
}
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) :is(
  .kl8-comprehensive-ball.kl8-comprehensive-ball.is-secondary,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball.is-secondary
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #005fe8 !important;
  background-image: linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(0, 35, 125, .14)) !important;
  border-color: #003f9e !important;
  color: #fff !important;
}

/* 掉号次数：1次黄、2次绿、3次及以上红；统计球与开奖号码共用等级。 */
html[class*="theme-"] .trend-app :is(.drop-value-ball.drop-count-1, .is-relation-drop.is-relation-drop-level-1) {
  background-color: #ffdf24 !important;
  border-color: #a87800 !important;
  color: #3d2d00 !important;
}
html[class*="theme-"] .trend-app :is(.drop-value-ball.drop-count-2, .is-relation-drop.is-relation-drop-level-2) {
  background-color: #35e66b !important;
  border-color: #087b3e !important;
  color: #063820 !important;
}
html[class*="theme-"] .trend-app :is(.drop-value-ball.drop-count-3, .is-relation-drop.is-relation-drop-level-3) {
  background-color: #ff3d4d !important;
  border-color: #b31325 !important;
  color: #fff !important;
}
html[class*="theme-"] .trend-app table .is-relation-drop.is-relation-drop-level-1 {
  background-color: #ffdf24 !important;
  border-color: #a87800 !important;
  color: #3d2d00 !important;
}
html[class*="theme-"] .trend-app table .is-relation-drop.is-relation-drop-level-2 {
  background-color: #35e66b !important;
  border-color: #087b3e !important;
  color: #063820 !important;
}
html[class*="theme-"] .trend-app table .is-relation-drop.is-relation-drop-level-3 {
  background-color: #ff3d4d !important;
  border-color: #b31325 !important;
  color: #fff !important;
}
html[class*="theme-"] .trend-app table :is(
  .hit-ball.hit-ball,
  .draw-ball.draw-ball,
  .legacy-draw-ball.legacy-draw-ball,
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-relation-drop.is-relation-drop-level-1 {
  background-color: #ffdf24 !important;
  border-color: #a87800 !important;
  color: #3d2d00 !important;
}
html[class*="theme-"] .trend-app table :is(
  .hit-ball.hit-ball,
  .draw-ball.draw-ball,
  .legacy-draw-ball.legacy-draw-ball,
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-relation-drop.is-relation-drop-level-2 {
  background-color: #35e66b !important;
  border-color: #087b3e !important;
  color: #063820 !important;
}
html[class*="theme-"] .trend-app table :is(
  .hit-ball.hit-ball,
  .draw-ball.draw-ball,
  .legacy-draw-ball.legacy-draw-ball,
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-relation-drop.is-relation-drop-level-3 {
  background-color: #ff3d4d !important;
  border-color: #b31325 !important;
  color: #fff !important;
}
/* 关系态掉号始终使用亮红色；统计掉号球再按1/2/3次显示黄/绿/红等级。 */
html[class*="theme-"] .trend-app table :is(
  .hit-ball.hit-ball,
  .draw-ball.draw-ball,
  .legacy-draw-ball.legacy-draw-ball,
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-relation-drop.is-relation-drop-level-1 {
  background-color: #ff3d4d !important;
  border-color: #b31325 !important;
  color: #fff !important;
}
html[class*="theme-"] .trend-app table :is(
  .hit-ball.hit-ball,
  .draw-ball.draw-ball,
  .legacy-draw-ball.legacy-draw-ball,
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-relation-drop.is-relation-drop-level-2 {
  background-color: #ff3d4d !important;
  border-color: #b31325 !important;
  color: #fff !important;
}

/* 蓝号折叠线独立加粗并保持在号码球下方。 */
html[class*="theme-"] .trend-app .lotto-fold-lines .lotto-fold-line-blue {
  stroke: #005fe8 !important;
  stroke-width: 2.2 !important;
  opacity: .9 !important;
}

/* 表头网格线统一加深，保证合并表头、分组表头和固定表头都能清楚对齐。 */
html[class*="theme-"] .trend-app :is(.trend-table, .legacy-material-table) thead th {
  border-right: 1px solid #657b85 !important;
  border-bottom: 1px solid #607782 !important;
  box-shadow: inset -1px 0 rgba(31, 57, 67, .34), inset 0 -1px rgba(31, 57, 67, .28) !important;
}
html[class*="theme-"] .trend-app :is(.trend-table, .legacy-material-table) thead th:first-child {
  border-left: 1px solid #657b85 !important;
}

/* 数字彩开奖号码：普通球保持轻凸灰蓝，重复数字统一使用最红色。 */
html[class*="theme-"] .trend-app :is(
  .trend-table[data-lottery="fc3d"],
  .trend-table[data-lottery="pl3"],
  .trend-table[data-lottery="pl5"],
  .legacy-material-table[data-lottery="fc3d"],
  .legacy-material-table[data-lottery="pl3"],
  .legacy-material-table[data-lottery="pl5"]
) :is(.draw-ball, .legacy-draw-ball, .compact-draw-ball).is-normal:not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #505d64 !important;
  border-color: #344950 !important;
  color: #f4f8f8 !important;
}
html[class*="theme-"] .trend-app :is(
  .trend-table[data-lottery="fc3d"],
  .trend-table[data-lottery="pl3"],
  .trend-table[data-lottery="pl5"],
  .legacy-material-table[data-lottery="fc3d"],
  .legacy-material-table[data-lottery="pl3"],
  .legacy-material-table[data-lottery="pl5"]
) :is(.draw-ball, .legacy-draw-ball, .compact-draw-ball).is-repeat:not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #ff152c !important;
  border-color: #b3001c !important;
  color: #fff !important;
}

/* 数字彩胆码：正常胆码为蓝球，重复胆码沿用最红重复色。 */
html[class*="theme-"] .trend-app :is(
  .trend-table[data-lottery="fc3d"],
  .trend-table[data-lottery="pl3"],
  .trend-table[data-lottery="pl5"]
) td[data-group-key="胆码"] .hit-ball:not(.is-dan-repeat):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #176fc1 !important;
  border-color: #0b4c8c !important;
  color: #fff !important;
}
html[class*="theme-"] .trend-app :is(
  .trend-table[data-lottery="fc3d"],
  .trend-table[data-lottery="pl3"],
  .trend-table[data-lottery="pl5"]
) td[data-group-key="胆码"] .hit-ball.is-dan-repeat:not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #ff152c !important;
  border-color: #b3001c !important;
  color: #fff !important;
}

/* 掉号 1 次为灰黑球；2 次绿色、3 次红色由上一层语义规则保留。 */
html[class*="theme-"] .trend-app .trend-table .drop-value-ball.drop-value-ball.drop-count-1 {
  background-color: #505d64 !important;
  border-color: #27343a !important;
  color: #f3f7f8 !important;
}

/* 旧主题层使用重复类名提高了选择器权重，这里保持同等重复类名并置于最终覆盖层。 */
html[class*="theme-"] body .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) :is(
  .kl8-comprehensive-ball.kl8-comprehensive-ball.is-primary,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball.is-primary
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #505d64 !important;
  border-color: #27343a !important;
  color: #f3f7f8 !important;
}

/* 最新颜色规则：连号与斜连对调，掉号仍保持独立亮红语义。 */
html[class*="theme-"] body .trend-app table :is(
  .draw-ball.draw-ball,
  .hit-ball.hit-ball,
  .legacy-draw-ball.legacy-draw-ball,
  .compact-draw-ball.compact-draw-ball,
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-relation-consecutive {
  background-color: #35e66b !important;
  border-color: #087b3e !important;
  color: #063820 !important;
}
html[class*="theme-"] body .trend-app table :is(
  .draw-ball.draw-ball,
  .hit-ball.hit-ball,
  .legacy-draw-ball.legacy-draw-ball,
  .compact-draw-ball.compact-draw-ball,
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-relation-diagonal {
  background-color: #ffdf24 !important;
  border-color: #a87800 !important;
  color: #3d2d00 !important;
}

/* 双色球红球区、 大乐透前区改用3D开奖号码的灰黑球；蓝球保留正蓝。 */
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) :is(
  .kl8-comprehensive-ball.is-primary,
  .kl8-comprehensive-draw-ball.is-primary
):not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #505d64 !important;
  border-color: #27343a !important;
  color: #f3f7f8 !important;
}

/* 3D/排列3/排列5开奖号码统一轻凸微亮，避免强高光造成视觉跳动。 */
html[class*="theme-"] .trend-app :is(
  .trend-table[data-lottery="fc3d"],
  .trend-table[data-lottery="pl3"],
  .trend-table[data-lottery="pl5"],
  .legacy-material-table[data-lottery="fc3d"],
  .legacy-material-table[data-lottery="pl3"],
  .legacy-material-table[data-lottery="pl5"]
) :is(.draw-ball, .legacy-draw-ball, .compact-draw-ball, .hit-ball) {
  background-image: radial-gradient(circle at 34% 28%, rgba(255, 255, 255, .22) 0 7%, rgba(255, 255, 255, .06) 18%, transparent 42%), linear-gradient(145deg, rgba(255, 255, 255, .06), rgba(0, 0, 0, .06)) !important;
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .16), inset -1px -1px 1px rgba(0, 0, 0, .1), 0 1px 1px rgba(20, 36, 40, .1) !important;
  transform: none !important;
  transition: none !important;
}

/* 双色球/大乐透折叠线统一覆盖整个表格；蓝区线单独使用正蓝并置于球体下方。 */
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) .lotto-fold-lines {
  z-index: 3 !important;
  pointer-events: none !important;
  overflow: visible !important;
}
html[class*="theme-"] .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) .lotto-fold-lines .lotto-fold-line-blue {
  stroke: #005fe8 !important;
  stroke-width: 2.4 !important;
  opacity: .92 !important;
}

/* 大乐透前区 1/6/11、后区 1/7 分区线明确锁定在对应号码列。 */
html[class*="theme-"] .trend-app .lotto-comprehensive-dlt.partition-lines-on :is(
  .kl8-number-head[data-zone="front"][data-number="1"],
  .kl8-number-head[data-zone="front"][data-number="6"],
  .kl8-number-head[data-zone="front"][data-number="11"],
  .kl8-number-head[data-zone="back"][data-number="1"],
  .kl8-number-head[data-zone="back"][data-number="7"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="1"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="6"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="11"],
  .kl8-comprehensive-cell[data-zone="back"][data-number="1"],
  .kl8-comprehensive-cell[data-zone="back"][data-number="7"]
) {
  border-left: 2px solid #426f82 !important;
}

/* 胆推动 0-9 统计球统一使用蓝色，消失数字保持亮黄色。 */
html[class*="theme-"] body .trend-app .push-material-table .push-zone-count .push-number-ball:not(.is-disappearing) {
  background-color: #176fc1 !important;
  border-color: #0d4f96 !important;
  color: #f5fbff !important;
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .24), inset -1px -1px 1px rgba(0, 38, 92, .2) !important;
}
html[class*="theme-"] body .trend-app .push-material-table .push-zone-count .push-number-ball.is-disappearing {
  background-color: #ffdf24 !important;
  border-color: #a87800 !important;
  color: #3d2d00 !important;
  opacity: 1 !important;
}

/* 掉号开奖号码：相邻两期任意位置相同数字使用猪肝红；胆码使用粉红，均区别于重复号码正红。 */
html[class*="theme-"] body .trend-app table :is(
  .hit-ball.hit-ball,
  .draw-ball.draw-ball,
  .legacy-draw-ball.legacy-draw-ball,
  .compact-draw-ball.compact-draw-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-relation-drop.is-relation-drop.is-relation-drop {
  background-color: #7f2f3b !important;
  border-color: #571d29 !important;
  color: #fff7f8 !important;
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .2), inset -1px -1px 1px rgba(40, 0, 8, .25) !important;
}
html[class*="theme-"] body .trend-app .trend-table td[data-group-key="胆码"] :is(
  .hit-ball.hit-ball,
  .prediction-ball.prediction-ball
).is-relation-drop.is-relation-drop.is-relation-drop {
  background-color: #e9799a !important;
  border-color: #ad496a !important;
  color: #4c1428 !important;
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .34), inset -1px -1px 1px rgba(92, 19, 43, .18) !important;
}

/* 折叠线必须高于单元格背景、低于号码球；蓝号线独立使用正蓝。 */
html[class*="theme-"] body .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) .lotto-fold-lines {
  z-index: 8 !important;
  pointer-events: none !important;
}
html[class*="theme-"] body .trend-app :is(.lotto-comprehensive-ssq, .lotto-comprehensive-dlt) .lotto-fold-lines .lotto-fold-line-blue {
  stroke: #005fe8 !important;
  stroke-width: 2.8 !important;
  opacity: .96 !important;
}

/* 大乐透前区边界锁定在 1、6、11 列，保证表头与每一行完整贯通。 */
html[class*="theme-"] body .trend-app .lotto-comprehensive-dlt.partition-lines-on :is(
  .kl8-number-head[data-zone="front"][data-number="1"],
  .kl8-number-head[data-zone="front"][data-number="6"],
  .kl8-number-head[data-zone="front"][data-number="11"],
  .kl8-number-head[data-zone="back"][data-number="1"],
  .kl8-number-head[data-zone="back"][data-number="7"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="1"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="6"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="11"],
  .kl8-comprehensive-cell[data-zone="back"][data-number="1"],
  .kl8-comprehensive-cell[data-zone="back"][data-number="7"]
) {
  border-left: 2px solid #426f82 !important;
  box-shadow: inset 2px 0 #426f82 !important;
}

/* 折叠线是表格兄弟节点，必须覆盖单元格底色但保持号码球在最上层；开关关闭时由 React 清空 SVG。 */
html[class*="theme-"] body .trend-app .lotto-comprehensive-stage .lotto-fold-lines {
  z-index: 14 !important;
  pointer-events: none !important;
  display: block !important;
  overflow: visible !important;
}
html[class*="theme-"] body .trend-app .lotto-comprehensive-stage .lotto-fold-lines .lotto-fold-line-blue {
  stroke: #005fe8 !important;
  stroke-width: 3.2 !important;
  opacity: 1 !important;
  vector-effect: non-scaling-stroke !important;
}
html[class*="theme-"] body .trend-app .lotto-comprehensive-stage :is(
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
) {
  position: relative !important;
  z-index: 15 !important;
}
html[class*="theme-"] body .trend-app .lotto-comprehensive-stage .kl8-comprehensive-table thead th {
  z-index: 20 !important;
}
html[class*="theme-"] body .trend-app .lotto-comprehensive-stage .kl8-comprehensive-table thead .kl8-fixed-head {
  z-index: 22 !important;
}

/* 双色球与大乐透掉号开奖号码使用最高饱和红色，覆盖掉号的通用猪肝红统计色。 */
html[class*="theme-"] body .trend-app :is(
  .lotto-comprehensive-ssq.lotto-comprehensive-ssq,
  .lotto-comprehensive-dlt.lotto-comprehensive-dlt
) .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball.is-relation-drop.is-relation-drop.is-relation-drop.is-relation-drop {
  background-color: #ff152c !important;
  border-color: #b30018 !important;
  color: #fff !important;
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .26), inset -1px -2px 2px rgba(86, 0, 11, .24), 0 0 0 1px rgba(179, 0, 24, .25) !important;
}

/* 统一细线标准：所有走势图折叠线采用 3D 胆推动的 2px 线宽。 */
html[class*="theme-"] body .trend-app :is(.trend-lines, .legacy-fold-lines, .lotto-fold-lines) line {
  stroke-width: 2px !important;
  stroke-linecap: round !important;
}
html[class*="theme-"] body .trend-app .lotto-comprehensive-stage .lotto-fold-lines {
  z-index: 14 !important;
  opacity: .92 !important;
}
html[class*="theme-"] body .trend-app .lotto-comprehensive-stage .lotto-fold-lines .lotto-fold-line-blue {
  stroke-width: 2px !important;
  opacity: .92 !important;
}

/* 区分线与胆推动分组线统一为 1px 淡线，取消 2px 边框叠加内阴影造成的粗线。 */
html[class*="theme-"] body .trend-app table.partition-lines-on :is(
  .is-group-start,
  .is-zone-start,
  .is-zone-split,
  .legacy-section-start
) {
  border-left: 1px solid #789099 !important;
  box-shadow: none !important;
}
html[class*="theme-"] body .trend-app .push-material-table :is(th, td) {
  border-right: 1px solid #b9c8cd !important;
  border-bottom: 1px solid #c1cdd0 !important;
}
html[class*="theme-"] body .trend-app .push-material-table.partition-lines-on .legacy-section-start {
  border-left: 1px solid #789099 !important;
  box-shadow: none !important;
}

/* 大乐透前区按 5 个号码完整分区，后区按 6 个号码分区。 */
html[class*="theme-"] body .trend-app .lotto-comprehensive-dlt.partition-lines-on :is(
  .kl8-number-head[data-zone="front"][data-number="1"],
  .kl8-number-head[data-zone="front"][data-number="6"],
  .kl8-number-head[data-zone="front"][data-number="11"],
  .kl8-number-head[data-zone="front"][data-number="16"],
  .kl8-number-head[data-zone="front"][data-number="21"],
  .kl8-number-head[data-zone="front"][data-number="26"],
  .kl8-number-head[data-zone="front"][data-number="31"],
  .kl8-number-head[data-zone="back"][data-number="1"],
  .kl8-number-head[data-zone="back"][data-number="7"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="1"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="6"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="11"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="16"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="21"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="26"],
  .kl8-comprehensive-cell[data-zone="front"][data-number="31"],
  .kl8-comprehensive-cell[data-zone="back"][data-number="1"],
  .kl8-comprehensive-cell[data-zone="back"][data-number="7"]
) {
  border-left: 1px solid #789099 !important;
  box-shadow: none !important;
}

/* 大乐透后区两个开奖号码固定按小号、大号显示并使用两种蓝色。 */
html[class*="theme-"] body .trend-app .lotto-comprehensive-dlt :is(
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-secondary-small:not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #2b8fd8 !important;
  border-color: #12649f !important;
  color: #f7fcff !important;
}
html[class*="theme-"] body .trend-app .lotto-comprehensive-dlt :is(
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-secondary-large:not(.is-relation-consecutive):not(.is-relation-diagonal):not(.is-relation-drop) {
  background-color: #005fe8 !important;
  border-color: #003f9e !important;
  color: #fff !important;
}

/* 双色球/大乐透掉号：同区上一期同号时，开奖号码球与统计命中球统一亮红。 */
html[class*="theme-"] body .trend-app :is(
  .lotto-comprehensive-ssq.lotto-comprehensive-ssq,
  .lotto-comprehensive-dlt.lotto-comprehensive-dlt
) :is(
  .kl8-comprehensive-ball.kl8-comprehensive-ball,
  .kl8-comprehensive-draw-ball.kl8-comprehensive-draw-ball
).is-relation-drop.is-relation-drop.is-relation-drop.is-relation-drop {
  background-color: #ff152c !important;
  border-color: #b30018 !important;
  color: #fff !important;
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .26), inset -1px -2px 2px rgba(86, 0, 11, .24), 0 0 0 1px rgba(179, 0, 24, .25) !important;
}

/* 福彩3D/排列3/排列5掉号开奖号码与胆码掉号共用粉红色。 */
html[class*="theme-"] body .trend-app :is(
  .trend-table[data-lottery="fc3d"],
  .trend-table[data-lottery="pl3"],
  .trend-table[data-lottery="pl5"],
  .legacy-material-table[data-lottery="fc3d"],
  .legacy-material-table[data-lottery="pl3"],
  .legacy-material-table[data-lottery="pl5"]
) :is(.draw-ball, .legacy-draw-ball, .compact-draw-ball).is-relation-drop.is-relation-drop.is-relation-drop {
  background-color: #e9799a !important;
  border-color: #ad496a !important;
  color: #4c1428 !important;
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, .34), inset -1px -1px 1px rgba(92, 19, 43, .18) !important;
}