@charset "UTF-8";
/* r78 提速版:面板(.q78)的全部时长 / 速度集中在 herostage-r78.js 文件顶部的参数表 TIM;本文件与 c3 段里的 --q-t1/2/3 等只是回落值。 */
/* 首屏右侧主视觉 r72 · 规则里的智能体 · 配 herostage-r72.js(取代 r71,不可同载)
   一个画面讲三件事,图里没有一个字:
     ① 智能体 = 圆。来单是玻璃珠,沿三层纵深涌向漏斗,穿过核(多层半透明壳 + 经纬晶格 + 扫光)后被点亮;
     ② 规则没覆盖的一单(青色虚环珠)沿一条弧线交给旁边的方(责任方),盖章一次后回到通道继续;
     ③ 每成交一单,台账栏里亮一行 —— 逐笔留痕。
   圆 = 机器,方 = 人;颜色失效时形状仍分得出来。行情板是另一块板,压在通道下缘,与图只并置、不连线。
   一个光源:右上。同一套材质语言:玻璃 / 板岩 / 金属细边。深色 = 第二套层级(发光、亮边),不是浅色反相。
   动画只用 transform / opacity(JS 的 WAAPI,24s 超周期);filter 只落在静态层。颜色全部取自 brand/tokens-*.css 与三个品牌色,
   没有新品牌色,槽位名一个未改。 */

html.h70-on .hstage { display: none !important; }
/* 首屏背景与主体一体:站点底层那张"短横线"画布与右上的大光斑,在首屏范围内由本层盖住,换成汇向主体的光轨与渐隐网格 */
/* 旧首屏的底图、光束、光斑从第一帧就不画(此前要等本文件的脚本执行、加上 h70-on 才摘,点 logo 回首页时会先闪一下旧动效) */
.hero .hero__bg { background: var(--c-canvas); }
.hero .hlx-beam, .hero .hlx-amb { display: none !important; }
.hero .hlx-edge, .hero .hero__bg::before, .hero .hero__bg::after { display: none !important; }

.hero .hero__img { display: none !important; }

.h70 {
  --h70-k: 1;
  --h70-r: 36px;
  --bw: 320px;
  --as: 1;
  --oy: 76px;

  --p-a: #0CA6A6;
  --p-b: #0C74A6;
  --p-c: #0C42A6;

  --h70-ink: var(--c-text);
  --h70-ink2: var(--c-text-2);
  --h70-ink3: var(--c-text-3);
  --h70-hair: color-mix(in srgb, var(--c-text) 10%, transparent);
  --h70-hair2: color-mix(in srgb, var(--c-text) 15%, transparent);
  --h70-up: var(--sem-up);
  --h70-down: var(--sem-down);

  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-inline-end: var(--h70-r);
  pointer-events: none;
  font-family: var(--font-sans);
  color: var(--h70-ink);
}

/* ── 深色:第二套层级。深底上发光的核、发亮的玻璃边、一道从右上射入的体积光 ───────────── */
html[data-theme="dark"] .h70 {
  --a-hi: #EAF4FF;
  --a-mid: var(--c-primary-600);
  --a-lo: color-mix(in srgb, var(--p-c) 78%, #000);
  --a-glow: color-mix(in srgb, var(--c-primary-600) 62%, transparent);
  --a-halo: color-mix(in srgb, var(--c-primary-600) 40%, transparent);
  --a-ex: var(--p-a);
  --a-bead: var(--c-primary-600);
  --a-line: rgba(176, 212, 255, .46);
  --a-node: #CFE6FF;
  --a-node-halo: rgba(120, 175, 255, .28);
  --a-shadow: -10px 16px 26px -10px rgba(0, 0, 0, .55);
  --a-trail: rgba(130, 188, 255, .78);
  /* 漏斗玻璃 */
  --a-sw0: rgba(120, 170, 240, .12); --a-sw1: rgba(150, 200, 255, .20); --a-sw2: rgba(214, 236, 255, .42);
  --a-si0: rgba(6, 14, 34, .62); --a-si1: rgba(18, 42, 92, .42); --a-si2: rgba(44, 96, 180, .30);
  --a-sr0: rgba(255, 255, 255, .96); --a-sr1: rgba(190, 226, 255, .58); --a-sr2: rgba(150, 200, 255, .20);
  --a-sl0: rgba(196, 228, 255, .74); --a-sl1: rgba(170, 214, 255, .34); --a-sl2: rgba(150, 200, 255, .10);
  --a-sh0: rgba(150, 200, 255, .22); --a-sh1: rgba(224, 242, 255, .72); --a-sh2: rgba(255, 255, 255, .96);
  --a-sm0: rgba(70, 124, 214, .38); --a-sm1: rgba(5, 10, 26, .78);
  --a-ss0: rgba(190, 226, 255, .5); --a-ss1: rgba(190, 226, 255, .1);
  --a-lipb: rgba(170, 212, 255, .34);
  --a-lipfi: rgba(200, 230, 255, .30);
  --a-el: rgba(160, 205, 255, .34);
  --a-eir: rgba(160, 205, 255, .22);
  --a-fh: rgba(255, 255, 255, .5);
  --a-sock: rgba(190, 226, 255, .5);
  /* 氛围 */
  --a-pool: color-mix(in srgb, var(--c-primary-600) 26%, transparent);
  --a-pool2: color-mix(in srgb, var(--p-a) 9%, transparent);
  --a-grid: rgba(150, 192, 255, .075);
  --a-cone: rgba(196, 226, 255, .08);
  --a-sry0: rgba(170, 212, 255, .30); --a-sry1: rgba(170, 212, 255, .10); --a-sry2: rgba(170, 212, 255, 0);
  --a-pk: rgba(200, 230, 255, .62);
  --a-bb1: rgba(255, 255, 255, .7); --a-bb2: rgba(150, 196, 255, .26); --a-bbe: rgba(196, 224, 255, .42);
  --a-bk: rgba(170, 210, 255, .13); --a-bke: rgba(190, 222, 255, .26);
  --a-dot: rgba(196, 224, 255, .66);
  --a-beam: rgba(226, 242, 255, .40);
  /* 珠 */
  --a-t0a: rgba(255, 255, 255, .55); --a-t0b: rgba(190, 220, 255, .14); --a-t0c: rgba(120, 170, 240, .10);
  --a-t0e: rgba(186, 218, 255, .72);
  /* 核 */
  --a-sh1a: rgba(214, 234, 255, .30); --a-sh1b: rgba(86, 144, 242, .22); --a-sh1c: rgba(20, 54, 138, .44); --a-sh1d: rgba(8, 20, 64, .62);
  --a-sh1e: rgba(166, 208, 255, .42);
  --a-sh2a: rgba(156, 204, 255, .30); --a-sh2b: rgba(34, 84, 206, .32); --a-sh2c: rgba(10, 30, 100, .44);
  --a-sh2e: rgba(176, 218, 255, .34);
  --a-mer: rgba(176, 218, 255, .62);
  --a-lat: rgba(176, 218, 255, .30);
  --a-nuc1: #FFFFFF; --a-nuc2: #A6CCFF; --a-nuc3: #3E7CF2;
  --a-nuc-glow: rgba(110, 170, 255, .75);
  --a-core-shadow: 0 0 46px -6px var(--a-glow), -10px 18px 26px -12px rgba(0, 0, 0, .5);
  --a-sw-a: rgba(190, 226, 255, .22); --a-sw-b: rgba(255, 255, 255, .55);
  /* 板岩 */
  --a-ssb0: #526B7C; --a-ssb1: #30444F; --a-ssb2: #1B2A33;
  --a-ssp0: rgba(255, 255, 255, .15); --a-ssp1: rgba(255, 255, 255, .025);
  --a-sse0: color-mix(in srgb, var(--c-human) 96%, #fff); --a-sse1: color-mix(in srgb, var(--c-human) 54%, transparent); --a-sse2: color-mix(in srgb, var(--c-human) 34%, transparent);
  --a-engr: rgba(0, 0, 0, .5); --a-engr-h: rgba(255, 255, 255, .15);
  --a-slab-lit: color-mix(in srgb, var(--c-human) 36%, transparent);
  --a-slab-ink: color-mix(in srgb, var(--c-human) 78%, transparent);
  --a-seal1: color-mix(in srgb, var(--c-human) 40%, #fff); --a-seal2: var(--c-human);
  --a-seal-ink: #1C1303;
  /* 台账 */
  --a-led-bg: rgba(255, 255, 255, .05); --a-led-e: rgba(176, 212, 255, .26);
  --a-lr: rgba(176, 212, 255, .20);
  --a-bead-glow: color-mix(in srgb, var(--c-primary-600) 60%, transparent);
  /* 行情板:近不透明的墨面渐变(不用 backdrop-filter),右上受光 */
  --q-g0: color-mix(in srgb, var(--c-surface) 93%, #fff);
  --q-g1: color-mix(in srgb, var(--c-surface) 82%, var(--c-canvas));
  --q-g2: color-mix(in srgb, var(--c-surface) 58%, var(--c-canvas));
  --q-sheen: radial-gradient(120% 80% at 100% 0%, rgba(176, 212, 255, .10), rgba(176, 212, 255, 0) 56%);
  --q-rim-hi: rgba(255, 255, 255, .55);
  --q-rim-lo: rgba(255, 255, 255, .07);
  --q-shadow: -10px 18px 30px -14px rgba(0, 0, 0, .58), 0 1px 0 rgba(255, 255, 255, .03) inset;
  --q-hair: rgba(244, 246, 246, .085);
  --q-tag-bg: rgba(255, 255, 255, .045);
  --q-tag-bd: rgba(255, 255, 255, .13);
  --q-up-bg: linear-gradient(color-mix(in srgb, var(--sem-up) 8%, transparent), color-mix(in srgb, var(--sem-up) 8%, transparent)), rgba(4, 8, 12, .58);
  --q-down-bg: linear-gradient(color-mix(in srgb, var(--sem-down) 8%, transparent), color-mix(in srgb, var(--sem-down) 8%, transparent)), rgba(4, 8, 12, .58);
  --q-flat-bg: rgba(6, 12, 16, .30);
  --q-flash-up: color-mix(in srgb, var(--sem-up) 12%, transparent);
  --q-flash-down: color-mix(in srgb, var(--sem-down) 13%, transparent);
  --lab-sh: 0 0 10px var(--c-canvas), 0 0 3px var(--c-canvas);
}
/* ── 浅色:白玻璃 + 深蓝核,无辉光,靠投影、亮边与细线站住 ───────────── */
html[data-theme="light"] .h70 {
  --a-hi: color-mix(in srgb, #fff 78%, var(--p-b));
  --a-mid: var(--c-agent);
  --a-lo: color-mix(in srgb, var(--c-agent) 62%, #000);
  --a-glow: color-mix(in srgb, var(--c-agent) 30%, transparent);
  --a-halo: color-mix(in srgb, var(--c-agent) 14%, transparent);
  --a-ex: var(--p-a);
  --a-bead: var(--c-agent);
  --a-line: rgba(12, 66, 166, .42);
  --a-node: var(--c-agent);
  --a-node-halo: rgba(12, 66, 166, .14);
  --a-shadow: -10px 18px 26px -12px rgba(12, 66, 166, .40);
  --a-trail: rgba(12, 66, 166, .55);
  --a-sw0: rgba(255, 255, 255, .70); --a-sw1: rgba(236, 244, 255, .82); --a-sw2: rgba(255, 255, 255, .96);
  --a-si0: rgba(196, 214, 244, .62); --a-si1: rgba(226, 237, 252, .62); --a-si2: rgba(248, 251, 255, .82);
  --a-sr0: rgba(255, 255, 255, 1); --a-sr1: rgba(255, 255, 255, .94); --a-sr2: rgba(255, 255, 255, .7);
  --a-sl0: rgba(12, 66, 166, .46); --a-sl1: rgba(12, 66, 166, .22); --a-sl2: rgba(12, 66, 166, .08);
  --a-sh0: rgba(12, 66, 166, .16); --a-sh1: rgba(12, 66, 166, .36); --a-sh2: rgba(255, 255, 255, 1);
  --a-sm0: rgba(150, 182, 232, .62); --a-sm1: rgba(86, 124, 190, .5);
  --a-ss0: rgba(255, 255, 255, .9); --a-ss1: rgba(255, 255, 255, .3);
  --a-lipb: rgba(12, 66, 166, .26);
  --a-lipfi: rgba(12, 66, 166, .22);
  --a-el: rgba(12, 66, 166, .30);
  --a-eir: rgba(12, 66, 166, .14);
  --a-fh: rgba(255, 255, 255, .95);
  --a-sock: rgba(12, 66, 166, .42);
  --a-pool: color-mix(in srgb, var(--p-b) 11%, transparent);
  --a-pool2: color-mix(in srgb, var(--p-a) 5%, transparent);
  --a-grid: rgba(12, 66, 166, .06);
  --a-cone: rgba(255, 255, 255, .85);
  --a-sry0: rgba(12, 66, 166, .24); --a-sry1: rgba(12, 66, 166, .10); --a-sry2: rgba(12, 66, 166, 0);
  --a-pk: rgba(12, 66, 166, .72);
  --a-bb1: rgba(255, 255, 255, .95); --a-bb2: rgba(12, 66, 166, .14); --a-bbe: rgba(12, 66, 166, .30);
  --a-bk: rgba(255, 255, 255, .55); --a-bke: rgba(12, 66, 166, .14);
  --a-dot: rgba(12, 66, 166, .30);
  --a-beam: rgba(255, 255, 255, .92);
  --a-t0a: rgba(255, 255, 255, .98); --a-t0b: rgba(214, 228, 250, .62); --a-t0c: rgba(12, 66, 166, .10);
  --a-t0e: rgba(12, 66, 166, .36);
  --a-sh1a: rgba(120, 156, 228, .92); --a-sh1b: rgba(12, 66, 166, .90); --a-sh1c: rgba(8, 44, 118, .94); --a-sh1d: rgba(5, 28, 80, .97);
  --a-sh1e: rgba(255, 255, 255, .55);
  --a-sh2a: rgba(110, 150, 230, .42); --a-sh2b: rgba(12, 52, 150, .5); --a-sh2c: rgba(4, 24, 76, .6);
  --a-sh2e: rgba(255, 255, 255, .34);
  --a-mer: rgba(214, 232, 255, .72);
  --a-lat: rgba(214, 232, 255, .36);
  --a-nuc1: #FFFFFF; --a-nuc2: #CFE0FF; --a-nuc3: #5D8BE0;
  --a-nuc-glow: rgba(255, 255, 255, .0);
  --a-core-shadow: -10px 20px 28px -12px rgba(12, 66, 166, .46), 0 2px 5px rgba(12, 66, 166, .18);
  --a-sw-a: rgba(255, 255, 255, .34); --a-sw-b: rgba(255, 255, 255, .86);
  --a-ssb0: #FFFFFF; --a-ssb1: #E8EDF4; --a-ssb2: #C6CFDC;
  --a-ssp0: rgba(255, 255, 255, .9); --a-ssp1: rgba(255, 255, 255, .25);
  --a-sse0: var(--c-human); --a-sse1: color-mix(in srgb, var(--c-human) 72%, transparent); --a-sse2: color-mix(in srgb, var(--c-human) 46%, transparent);
  --a-engr: rgba(70, 86, 110, .46); --a-engr-h: rgba(255, 255, 255, .95);
  --a-slab-lit: color-mix(in srgb, var(--c-human) 20%, transparent);
  --a-slab-ink: color-mix(in srgb, var(--c-human) 80%, transparent);
  --a-seal1: color-mix(in srgb, var(--c-human) 50%, #fff); --a-seal2: var(--c-human);
  --a-seal-ink: #1C1303;
  --a-led-bg: rgba(255, 255, 255, .7); --a-led-e: rgba(12, 66, 166, .20);
  --a-lr: rgba(12, 66, 166, .14);
  --a-bead-glow: color-mix(in srgb, var(--c-agent) 30%, transparent);
  --q-g0: #FFFFFF;
  --q-g1: #FBFCFE;
  --q-g2: color-mix(in srgb, #fff 90%, var(--c-canvas));
  --q-sheen: radial-gradient(130% 90% at 100% 0%, rgba(255, 255, 255, .95), rgba(255, 255, 255, 0) 60%);
  --q-rim-hi: rgba(255, 255, 255, 1);
  --q-rim-lo: rgba(12, 66, 166, .17);
  --q-shadow: -10px 18px 30px -16px rgba(12, 66, 166, .34), 0 1px 2px rgba(12, 66, 166, .10), 0 0 0 1px rgba(12, 66, 166, .04);
  --q-hair: rgba(12, 28, 60, .085);
  --q-tag-bg: rgba(12, 66, 166, .05);
  --q-tag-bd: rgba(12, 66, 166, .16);
  --q-up-bg: color-mix(in srgb, var(--sem-up) 8%, transparent);
  --q-down-bg: color-mix(in srgb, var(--sem-down) 7%, transparent);
  --q-flat-bg: rgba(12, 28, 60, .05);
  --q-flash-up: color-mix(in srgb, var(--sem-up) 9%, transparent);
  --q-flash-down: color-mix(in srgb, var(--sem-down) 8%, transparent);
  --lab-sh: 0 0 8px #fff, 0 0 3px #fff;
}

.h70__scene {
  position: relative;
  display: flex;
  flex-direction: column;
  inline-size: calc(420px * var(--as));
  transform: scale(var(--h70-k));
  transform-origin: 100% 50%;
}
.h70[data-ready="1"] .h70__scene { animation: h70-in .8s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes h70-in { from { opacity: 0; transform: translateY(12px) scale(var(--h70-k)); } }

/* ── ① 主视觉 ────────────────────────────────────────────────── */
.a70 {
  position: relative;
  flex: none;
  inline-size: calc(420px * var(--as));
  block-size: calc(350px * var(--as));
}
.a70__in {
  position: absolute;
  inset: 0 auto auto 0;
  inline-size: 420px;
  block-size: 350px;
  transform-origin: 0 0;
  scale: var(--as);
}
.a70__in > *, .a70__atm > *, .a70__fore > * { position: absolute; }
.a70__atm, .a70__fore { inset: 0; pointer-events: none; }

/* 氛围 */
.a70__pool {
  left: -150px; top: -100px; width: 680px; height: 600px;
  background:
    radial-gradient(250px 230px at 340px 292px, var(--a-pool), transparent 74%),
    radial-gradient(190px 160px at 560px 190px, var(--a-pool2), transparent 72%);
}
.a70__grid {
  left: -420px; top: -310px; width: 1260px; height: 880px;
  background-image:
    linear-gradient(var(--a-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--a-grid) 1px, transparent 1px);
  background-size: 30px 30px;
  background-position: 0 0;
  -webkit-mask-image: radial-gradient(ellipse 330px 300px at 610px 502px, #000 0, rgba(0, 0, 0, .55) 42%, transparent 100%);
          mask-image: radial-gradient(ellipse 330px 300px at 610px 502px, #000 0, rgba(0, 0, 0, .55) 42%, transparent 100%);
}
.a70__cone {
  left: -80px; top: -130px; width: 640px; height: 560px;
  background: linear-gradient(222deg, var(--a-cone), transparent 62%);
  clip-path: polygon(540px 20px, 640px 60px, 300px 520px, 120px 430px);
  -webkit-mask-image: radial-gradient(ellipse 330px 300px at 390px 300px, #000 0, transparent 100%);
          mask-image: radial-gradient(ellipse 330px 300px at 390px 300px, #000 0, transparent 100%);
}
.a70__rays { left: 0; top: 0; overflow: visible; }
.a70-sry0 { stop-color: var(--a-sry0); } .a70-sry1 { stop-color: var(--a-sry1); } .a70-sry2 { stop-color: var(--a-sry2); }
.a70__pk {
  left: 0; top: -.5px; width: 30px; height: 1px; border-radius: 1px;
  background: linear-gradient(90deg, transparent, var(--a-pk));
  transform-origin: 0 50%;
  opacity: 0;
  will-change: transform, opacity;
}
.a70__bb {
  left: -9px; top: -9px; width: 18px; height: 18px; border-radius: 50%;
  background: radial-gradient(circle at 62% 32%, var(--a-bb1), var(--a-bb2) 62%, transparent 100%);
  box-shadow: inset 0 0 0 1px var(--a-bbe);
  opacity: 0;
  will-change: transform, opacity;
}

/* 漏斗 / 通道 */
.a70__svg { left: 0; top: 0; overflow: visible; }
html[data-theme="dark"] .a70__svg--b { filter: drop-shadow(0 0 16px color-mix(in srgb, var(--c-primary-600) 20%, transparent)); }
html[data-theme="light"] .a70__svg--b { filter: drop-shadow(-8px 14px 12px rgba(12, 66, 166, .20)); }
.a70-sw0 { stop-color: var(--a-sw0); } .a70-sw1 { stop-color: var(--a-sw1); } .a70-sw2 { stop-color: var(--a-sw2); }
.a70-si0 { stop-color: var(--a-si0); } .a70-si1 { stop-color: var(--a-si1); } .a70-si2 { stop-color: var(--a-si2); }
.a70-sr0 { stop-color: var(--a-sr0); } .a70-sr1 { stop-color: var(--a-sr1); } .a70-sr2 { stop-color: var(--a-sr2); }
.a70-sl0 { stop-color: var(--a-sl0); } .a70-sl1 { stop-color: var(--a-sl1); } .a70-sl2 { stop-color: var(--a-sl2); }
.a70-sh0 { stop-color: var(--a-sh0); } .a70-sh1 { stop-color: var(--a-sh1); } .a70-sh2 { stop-color: var(--a-sh2); }
.a70-sm0 { stop-color: var(--a-sm0); } .a70-sm1 { stop-color: var(--a-sm1); }
.a70-ss0 { stop-color: var(--a-ss0); } .a70-ss1 { stop-color: var(--a-ss1); }
.a70__wall { fill: url(#a70-gw); }
.a70__wall--s { opacity: .92; }
.a70__int { fill: url(#a70-gi); }
.a70__mouth { fill: url(#a70-gm); }
.a70__lip, .a70__e-r, .a70__e-l, .a70__e-il, .a70__e-ir, .a70__fh { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.a70__lip--b { stroke: var(--a-lipb); stroke-width: 1.2; }
.a70__lip--f { stroke: url(#a70-gh); stroke-width: 2; }
.a70__lip--fi { stroke: var(--a-lipfi); stroke-width: .8; }
.a70__e-r { stroke: url(#a70-gr); stroke-width: 1.7; }
.a70__e-l { stroke: var(--a-el); stroke-width: 1; }
.a70__e-il { stroke: url(#a70-gl); stroke-width: 1.3; }
.a70__e-ir { stroke: var(--a-eir); stroke-width: .8; }
.a70__fh { stroke: var(--a-fh); stroke-width: 1; }
.a70__fh--2 { stroke-width: .8; opacity: .7; }
.a70__sock { fill: none; stroke: var(--a-sock); stroke-width: 1.1; }
.a70__sock--i { stroke-width: .8; opacity: .7; }
.a70__beam {
  left: 100px; top: 10px; width: 190px; height: 150px;

  will-change: opacity;
}
.a70__ap {
  left: -2px; top: -2px; width: 4px; height: 4px; border-radius: 50%;
  background: var(--a-pk);
  box-shadow: 0 0 8px 2px var(--a-node-halo);
  opacity: 0;
  will-change: transform, opacity;
}
.a70__hull { left: 134px; top: 96px; width: 112px; height: 210px; pointer-events: none; }
.a70__hull--m { left: 89px; top: 0; width: 202px; height: 100px; }

/* 智能体核 */
.a70__core { width: 0; height: 0; }
.a70__core > i, .cb-glb > *, .cb-glb { position: absolute; }
.a70__core > i { border-radius: 50%; }
.cb-halo {
  left: -112px; top: -112px; width: 224px; height: 224px;
  background: radial-gradient(circle, var(--a-glow) 0, color-mix(in srgb, var(--a-glow) 36%, transparent) 38%, transparent 68%);
  will-change: transform, opacity;
}
html[data-theme="light"] .cb-halo { background: radial-gradient(circle, var(--a-glow) 0, transparent 64%); }
.cb-sh1 {
  left: -56px; top: -56px; width: 112px; height: 112px;
  background: radial-gradient(circle at 66% 26%, var(--a-sh1a) 0, var(--a-sh1b) 34%, var(--a-sh1c) 72%, var(--a-sh1d) 100%);
  box-shadow: inset 0 0 0 1px var(--a-sh1e), inset 0 -16px 26px -10px rgba(2, 8, 30, .5), var(--a-core-shadow);
  will-change: transform;
}
.cb-sh2 {
  left: -41px; top: -41px; width: 82px; height: 82px;
  background: radial-gradient(circle at 58% 34%, var(--a-sh2a), var(--a-sh2b) 58%, var(--a-sh2c) 100%);
  box-shadow: inset 0 0 0 1px var(--a-sh2e), inset 0 0 14px rgba(150, 200, 255, .12);
  will-change: transform;
}
.cb-glb { left: -50px; top: -50px; width: 100px; height: 100px; transform: rotate(18deg); }
.cb-mer { left: 0; top: 0; width: 100px; height: 100px; will-change: transform, opacity; }
.cb-mer svg, .cb-lat { display: block; width: 100px; height: 100px; overflow: visible; }
.cb-lat { position: absolute; left: 0; top: 0; }
.cb-mer circle, .cb-lat ellipse { fill: none; stroke: var(--a-mer); stroke-width: 1; }
.cb-lat ellipse { stroke: var(--a-lat); }
.cb-lat ellipse:first-child { stroke: var(--a-mer); opacity: .75; }
.cb-spark {
  left: 48px; top: 48px; width: 4px; height: 4px; border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 6px 1px var(--a-nuc-glow);
  will-change: transform, opacity;
}
html[data-theme="light"] .cb-spark { box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .35); }
.cb-nuc {
  left: -14px; top: -14px; width: 28px; height: 28px;
  background: radial-gradient(circle at 50% 50%, var(--a-nuc1) 0, var(--a-nuc2) 38%, var(--a-nuc3) 100%);
  box-shadow: 0 0 18px 2px var(--a-nuc-glow), inset 0 0 0 1px rgba(255, 255, 255, .5);
  will-change: transform, opacity;
}
.cb-nuc2 { left: -4px; top: -4px; width: 8px; height: 8px; background: #fff; box-shadow: 0 0 8px 2px rgba(255, 255, 255, .9); }
html[data-theme="light"] .cb-nuc2 { box-shadow: none; }

.a70__core--f { z-index: 3; }
.cf-gloss {
  left: -56px; top: -56px; width: 112px; height: 112px; border-radius: 50%;
  background:
    radial-gradient(ellipse 34px 18px at 71% 19%, rgba(255, 255, 255, .5), transparent 100%),
    radial-gradient(circle at 70% 24%, rgba(255, 255, 255, .16) 0, transparent 40%);
}
.cf-gloss::before {
  content: "";
  position: absolute; inset: 0; border-radius: 50%; padding: 1.5px;
  background: linear-gradient(222deg, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .0) 46%, rgba(160, 205, 255, .0) 60%, rgba(150, 200, 255, .38) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
.cf-sweep {
  left: -52px; top: -52px; width: 104px; height: 104px; border-radius: 50%;
  background: conic-gradient(from 0deg, transparent 0deg 292deg, var(--a-sw-a) 346deg, var(--a-sw-b) 358.6deg, transparent 360deg);
  -webkit-mask-image: radial-gradient(circle, transparent 0 24%, #000 34%, rgba(0,0,0,.5) 66%, transparent 96%);
          mask-image: radial-gradient(circle, transparent 0 24%, #000 34%, rgba(0,0,0,.5) 66%, transparent 96%);
  will-change: transform, opacity;
}
.cf-sweep--2 {
  left: -38px; top: -38px; width: 76px; height: 76px;
  background: conic-gradient(from 90deg, transparent 0deg 300deg, var(--a-sw-a) 352deg, var(--a-sw-b) 359deg, transparent 360deg);
  opacity: .8;
}
.cf-bounce {
  left: -56px; top: -56px; width: 112px; height: 112px; border-radius: 50%;
  background: radial-gradient(circle at 26% 84%, rgba(120, 190, 255, .22), transparent 38%);
}
html[data-theme="light"] .cf-bounce { background: radial-gradient(circle at 26% 84%, rgba(255, 255, 255, .26), transparent 38%); }

/* 来单:玻璃珠。未处理 = 通透的玻璃(只有一道亮弧);已执行 = 内部点亮的蓝;青色虚环 = 规则没覆盖的一单 */
.a70__t { left: 0; top: 0; width: 34px; height: 34px; margin: -17px 0 0 -17px; opacity: 0; will-change: transform, opacity; }
.a70__t > i { position: absolute; border-radius: 50%; }
.a70__tr {
  left: 50%; top: 50%; width: 52px; height: 6px; margin: -3px 0 0 0;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--a-trail), transparent);
  transform-origin: 0 50%;
  opacity: 0;
  will-change: transform, opacity;
}
.a70__t0 {
  inset: 0;
  background: radial-gradient(circle at 66% 28%, var(--a-t0a) 0, var(--a-t0b) 42%, var(--a-t0c) 100%);
  box-shadow: inset 0 0 0 1.3px var(--a-t0e), inset -2px -3px 6px rgba(0, 0, 0, .14);
}
.a70__t0::after, .a70__t1::after {
  content: "";
  position: absolute; inset: 3px; border-radius: 50%;
  border: 1.5px solid transparent;
  border-top-color: rgba(255, 255, 255, .9);
  border-right-color: rgba(255, 255, 255, .38);
  transform: rotate(-6deg);
}
.a70__t1 {
  inset: 0; opacity: 0;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .9) 0, rgba(255, 255, 255, 0) 24%),
    radial-gradient(circle at 64% 30%, var(--a-hi) 0, var(--a-mid) 44%, var(--a-lo) 100%);
  box-shadow: 0 0 14px -2px var(--a-glow), inset 0 -3px 6px rgba(0, 0, 0, .2), inset 0 0 0 1px rgba(255, 255, 255, .3);
  will-change: opacity;
}
.a70__tx {
  inset: 0; opacity: 0;
  background: radial-gradient(circle at 64% 30%, color-mix(in srgb, var(--a-ex) 40%, transparent), color-mix(in srgb, var(--a-ex) 10%, transparent) 72%);
  box-shadow: inset 0 0 0 2.4px var(--a-ex), 0 0 16px -2px color-mix(in srgb, var(--a-ex) 70%, transparent);
  will-change: opacity;
}
.a70__tx::before {
  content: "";
  position: absolute; inset: -6px; border-radius: 50%;
  border: 1.5px dashed color-mix(in srgb, var(--a-ex) 82%, transparent);
}

/* 责任方:倒角的方。板岩 + 磨砂内板 + 金属细边;右上受光 */
.a70__slab { width: 96px; height: 96px; }
.sl-svg { display: block; position: absolute; left: 0; top: 0; overflow: visible; will-change: transform; filter: drop-shadow(-8px 14px 10px rgba(0, 0, 0, .0)); }
html[data-theme="dark"] .sl-svg { filter: drop-shadow(-8px 14px 12px rgba(0, 0, 0, .5)); }
html[data-theme="light"] .sl-svg { filter: drop-shadow(-8px 14px 11px rgba(12, 66, 166, .30)); }
.a70-ssb0 { stop-color: var(--a-ssb0); } .a70-ssb1 { stop-color: var(--a-ssb1); } .a70-ssb2 { stop-color: var(--a-ssb2); }
.a70-ssp0 { stop-color: var(--a-ssp0); } .a70-ssp1 { stop-color: var(--a-ssp1); }
.a70-sse0 { stop-color: var(--a-sse0); } .a70-sse1 { stop-color: var(--a-sse1); } .a70-sse2 { stop-color: var(--a-sse2); }
.sl-body { fill: url(#a70-sb); }
.sl-brush { fill: #fff; opacity: .13; }
html[data-theme="light"] .sl-brush { fill: #5a6a82; opacity: .12; }
.sl-plate { fill: url(#a70-sp); stroke: rgba(255, 255, 255, .14); stroke-width: .8; }
html[data-theme="light"] .sl-plate { stroke: rgba(12, 66, 166, .14); }
.sl-eng { fill: var(--a-engr); }
.sl-eng--d { opacity: .7; }
.sl-eng-h { fill: var(--a-engr-h); }
.sl-eng-h:nth-child(n) { mix-blend-mode: normal; }
.sl-name { fill: none; stroke: var(--a-sse1); stroke-width: 1; }
.sl-rv { fill: var(--a-engr-h); stroke: var(--a-engr); stroke-width: .6; }
.sl-edge { fill: none; stroke: url(#a70-se); stroke-width: 1.3; stroke-linejoin: round; }
.sl-hi { fill: none; stroke: rgba(255, 255, 255, .55); stroke-width: 1; stroke-linecap: round; }
html[data-theme="light"] .sl-hi { stroke: #fff; }
.sl-clip { position: absolute; inset: 0; overflow: hidden; clip-path: polygon(14px 0, 90px 0, 96px 6px, 96px 82px, 82px 96px, 6px 96px, 0 90px, 0 14px); pointer-events: none; }
.sl-lit {
  position: absolute; inset: 0; opacity: 0;
  background: radial-gradient(circle at 74% 24%, var(--a-slab-lit), transparent 70%), var(--a-slab-lit);
  will-change: opacity;
}
.sl-scan {
  position: absolute; left: 0; top: -4px; width: 26px; height: 108px; opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .5), transparent);
  will-change: transform, opacity;
}
html[data-theme="light"] .sl-scan { background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--c-human) 34%, transparent), transparent); }
.sl-lb { position: absolute; height: 5px; border-radius: 2px; background: var(--a-slab-ink); opacity: 0; will-change: opacity; box-shadow: 0 0 8px -1px var(--a-slab-lit); }
.sl-seal {
  position: absolute; left: 46px; top: 48px; width: 36px; height: 36px; opacity: 0;
  clip-path: polygon(7px 0, 29px 0, 36px 7px, 36px 29px, 29px 36px, 7px 36px, 0 29px, 0 7px);
  background: linear-gradient(145deg, var(--a-seal1), var(--a-seal2));
  will-change: transform, opacity;
}
.sl-seal svg { position: absolute; inset: 0; }
.sl-seal path { fill: none; stroke: var(--a-seal-ink); stroke-width: 3.6; stroke-linecap: round; stroke-linejoin: round; }
.sl-ring {
  position: absolute; left: 46px; top: 48px; width: 36px; height: 36px; box-sizing: border-box; opacity: 0;
  border: 1.6px solid var(--a-sse0); border-radius: 8px;
  will-change: transform, opacity;
}

/* 台账栏:一格一笔,成交即亮 */
.a70__led {
  border-radius: 9px;
  background: linear-gradient(222deg, rgba(255, 255, 255, .10), transparent 60%), var(--a-led-bg);
  box-shadow: inset 0 0 0 1px var(--a-led-e), inset 0 1px 0 rgba(255, 255, 255, .22);
}
html[data-theme="light"] .a70__led { box-shadow: inset 0 0 0 1px var(--a-led-e), 0 8px 14px -8px rgba(12, 66, 166, .3); }
.led-win {
  position: absolute; inset: 7px 8px; overflow: hidden;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 78%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 78%, transparent 100%);
}
.led-rows { position: absolute; left: 0; top: -2px; right: 0; will-change: transform; }
.lr { position: relative; display: flex; align-items: center; gap: 6px; height: 5px; margin-bottom: 6px; }
.lr > i { display: block; border-radius: 2px; height: 5px; }
.lr-n { width: 5px; background: var(--a-lr); flex: none; }
.lr-b { background: var(--a-lr); }
.lr-l {
  position: absolute; left: 0; right: 0; top: 0; opacity: 0; border-radius: 2px;
  background: linear-gradient(90deg, var(--a-bead), color-mix(in srgb, var(--a-bead) 40%, transparent));
  box-shadow: 0 0 10px -1px var(--a-bead-glow);
  will-change: opacity;
}

/* 前景:虚焦光斑 + 微粒 */
.a70__fore .a70__bk {
  border-radius: 50%;
  background: radial-gradient(circle, var(--a-bk) 0, color-mix(in srgb, var(--a-bk) 70%, transparent) 50%, transparent 72%);
  will-change: transform, opacity;
}
.a70__dot { border-radius: 50%; background: var(--a-dot); will-change: transform, opacity; }

/* 标注:细线 + 铭牌字。文字不随画布缩放;位置与线长随画布走 */
.a70__ann { position: absolute; inset: 0; pointer-events: none; }
.a70__lab {
  position: absolute;
  left: calc(var(--lx) * 1px * var(--as));
  top: calc(var(--ly) * 1px * var(--as) - 24px);
  width: calc(var(--lw) * 1px * var(--as));
  height: 24px;
}
.a70__lt {
  position: absolute; left: 0; top: 0;
  display: inline-flex; align-items: center; gap: 8px;
  block-size: 20px;
  font-size: 13.6px; font-weight: 500; line-height: 1; letter-spacing: .01em; white-space: nowrap;
  color: var(--h70-ink);
  text-shadow: var(--lab-sh);
}
.a70__lab--owner .a70__lt { left: auto; right: 0; }
.a70__g { display: block; flex: none; }
.a70__g--c { inline-size: 9px; block-size: 9px; border-radius: 50%; background: var(--a-mid); box-shadow: 0 0 8px var(--a-glow); }
.a70__g--s { inline-size: 8px; block-size: 8px; border-radius: 1.5px; background: var(--c-human); }
.a70__g--b { inline-size: 13px; block-size: 6px; border-radius: 3px; background: var(--a-bead); }
.a70__ld { position: absolute; left: 0; right: 0; top: 23px; height: 1px; background: var(--a-line); }
.a70__ld::after {
  content: ""; position: absolute; top: -2.5px; width: 6px; height: 6px; border-radius: 50%;
  background: var(--a-node); box-shadow: 0 0 0 3px var(--a-node-halo);
}
.a70__lab--agent .a70__ld { background: linear-gradient(90deg, transparent, var(--a-line) 28%); }
.a70__lab--agent .a70__ld::after { right: -2px; }
.a70__lab--log .a70__ld { background: linear-gradient(90deg, var(--a-line) 70%, transparent); }
.a70__lab--log .a70__ld::after { left: -2px; }
.a70__lab--owner .a70__ld { background: linear-gradient(90deg, transparent, var(--a-line) 34%); }
.a70__lab--owner .a70__ld::after { display: none; }
.a70__dn {
  position: absolute; top: 24px; left: calc((358 - 232) * 1px * var(--as));
  width: 1px; height: calc(6px * var(--as)); background: var(--a-line);
}
.a70__dn::after {
  content: ""; position: absolute; left: -2.5px; bottom: -3px; width: 6px; height: 6px; border-radius: 1.5px;
  background: var(--c-human); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-human) 24%, transparent);
}
.a70__tl--short { display: none; }
.h70:lang(en) .a70__tl--long { display: none; }
.h70:lang(en) .a70__tl--short { display: inline; }
.h70:lang(en)[data-wide] .a70__tl--long { display: inline; }
.h70:lang(en)[data-wide] .a70__tl--short { display: none; }

/* flow(窄屏):单块,不放整屏氛围;只留核、通道、责任人、台账 */
.h70[data-tier="flow"] .a70__grid, .h70[data-tier="flow"] .a70__cone, .h70[data-tier="flow"] .a70__rays { display: none; }
.h70[data-tier="flow"] { overflow-x: clip; }
/* ── ② 报价与下单面板 r78(取代 r77,不可同载)────────────────────────────
   同一块玻璃,三个场景轮换:a 行情滚动(主场景,占时 ≥ 65%)→ b 下单 → c 指令处理(受理→核对→执行→留痕,全自动、全圆形节点)。
   任一时刻只一个主角;底部是两行安静的留痕与一行脚注。
   两个字重(400 / 600)、数字等宽、次要信息 60% 不透明;动效统一一条缓动,只用 transform / opacity。 */
.h70 {
  /* 时长的唯一来源是 JS 文件顶部的参数表 TIM;这里是回落值(必须一致),JS 建面板时会把表里的值写到 .q78 上 */
  --q-ease: cubic-bezier(.2, .8, .2, 1);
  --q-t1: 90ms; --q-t2: 180ms; --q-t3: 320ms; --q-fade: 320ms; --q-hop: 220ms;
  --q-acc: var(--c-primary-600);
  --q-cur-fill: #fff;
}
html[data-theme="dark"] .h70 {
  --q-acc: color-mix(in srgb, var(--c-primary-600) 82%, #fff);
  --q-glass: linear-gradient(168deg, rgba(40, 58, 70, .86) 0%, rgba(24, 37, 46, .93) 62%, rgba(20, 31, 38, .96) 100%);
  --q-spot: radial-gradient(70% 46% at 92% 0%, rgba(176, 212, 255, .17), rgba(176, 212, 255, 0) 72%);
  --q-edge: inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 0 0 1px rgba(255, 255, 255, .06), inset 0 -1px 0 rgba(0, 0, 0, .28);
  --q-lift: 0 34px 56px -26px rgba(0, 0, 0, .72), 0 14px 22px -14px rgba(5, 12, 20, .55), 0 0 0 .5px rgba(0, 0, 0, .5);
  --q-sub: rgba(255, 255, 255, .055);
  --q-sub-bd: rgba(255, 255, 255, .11);
  --q-sub-hi: rgba(255, 255, 255, .09);
  --q-line: rgba(255, 255, 255, .13);
  --q-up: #4FBF9A;
  --q-dn: #D98F86;
  --q-agent: color-mix(in srgb, var(--c-agent) 52%, #fff);
  --q-lit: rgba(150, 200, 255, .95);
  --q-nbg: #1d2d37;
  --q-glow: rgba(120, 180, 255, .5);
  --q-cur-halo: rgba(190, 220, 255, .34);
  --q-cur-edge: rgba(8, 18, 28, .55);
}
html[data-theme="light"] .h70 {
  --q-acc: var(--c-primary-600);
  --q-glass: linear-gradient(168deg, rgba(255, 255, 255, .94) 0%, rgba(250, 252, 255, .93) 58%, rgba(243, 247, 253, .94) 100%);
  --q-spot: radial-gradient(70% 46% at 92% 0%, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0) 72%);
  --q-edge: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(255, 255, 255, .7), inset 0 -1px 0 rgba(12, 66, 166, .07);
  --q-lift: 0 34px 56px -28px rgba(12, 66, 166, .36), 0 14px 24px -16px rgba(12, 40, 100, .22), 0 0 0 .5px rgba(12, 66, 166, .14);
  --q-sub: rgba(255, 255, 255, .7);
  --q-sub-bd: rgba(12, 66, 166, .12);
  --q-sub-hi: rgba(12, 66, 166, .06);
  --q-line: rgba(12, 40, 100, .16);
  --q-up: #1E7F59;
  --q-dn: #B0584F;
  --q-agent: var(--c-agent);
  --q-lit: rgba(12, 66, 166, .9);
  --q-nbg: #fff;
  --q-glow: rgba(12, 66, 166, .26);
  --q-cur-halo: rgba(12, 66, 166, .16);
  --q-cur-edge: rgba(12, 40, 100, .34);
}

.q78 {
  position: relative;
  z-index: 2;
  align-self: flex-end;
  inline-size: var(--bw);
  block-size: var(--ph);
  box-sizing: border-box;
  margin: calc(-1 * var(--oy) * var(--as)) 0 0;
  padding: var(--pad) var(--pad) 0;
  border-radius: 24px;
  isolation: isolate;
  contain: layout style;
  color: var(--h70-ink);
  background: var(--q-glass);
  box-shadow: var(--q-edge), var(--q-lift);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "zero" 0;
  font-weight: 400;
  -webkit-backdrop-filter: blur(var(--q-blur, 14px)) saturate(1.25);
          backdrop-filter: blur(var(--q-blur, 14px)) saturate(1.25);
}
html[data-theme="light"] .q78,
.h70[data-bf="0"] .q78 { -webkit-backdrop-filter: none; backdrop-filter: none; }
.q78::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: var(--q-spot); pointer-events: none; z-index: 0; }
.q78 > * { position: relative; z-index: 1; }
.q78 i, .q78 u { font-style: normal; text-decoration: none; }
.q78 b { font-weight: 600; }
.q78__2 { opacity: .6; }

/* 标记点:圆 */
.q78__mk { display: block; flex: none; inline-size: 8px; block-size: 8px; box-sizing: border-box; border-radius: 50%; background: var(--q-agent); }

/* 表头:一行,安静 */
.q78__hd { display: flex; align-items: baseline; justify-content: space-between; block-size: 24px; font-size: 13px; line-height: 24px; letter-spacing: .02em; }
.q78__hd b { color: var(--h70-ink); }
.q78__hd span { opacity: .6; }

/* 舞台:恒高,三个场景叠放,只做 opacity / transform 过渡 */
.q78__st { position: relative; block-size: var(--sh); margin-block-start: 8px; }
.q78__sc { position: absolute; inset: 0; opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity var(--q-t1) var(--q-ease), transform var(--q-t1) var(--q-ease), visibility 0s linear var(--q-t1); }
.q78__st[data-s="a"] .q78__sA, .q78__st[data-s="b"] .q78__sB, .q78__st[data-s="c"] .q78__sC { opacity: 1; visibility: visible; transform: none; transition: opacity var(--q-t2) var(--q-ease) var(--q-t1), transform var(--q-t2) var(--q-ease) var(--q-t1), visibility 0s; }
.q78__st[data-s="b"] .q78__sA, .q78__st[data-s="c"] .q78__sA { transform: translateY(-6px); }

/* ── a · 行情滚动:代码 / 迷你折线 / 价格 / 涨跌;上下渐隐 ── */
.q78__view { position: absolute; inset: 0; overflow: hidden; contain: layout paint style;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 var(--fade, 28px), #000 calc(100% - var(--fade, 28px)), transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 var(--fade, 28px), #000 calc(100% - var(--fade, 28px)), transparent 100%); }
.q78__track { position: absolute; inset: 0 0 auto 0; block-size: 100%; will-change: transform; }
.q78__row { position: absolute; inset: 0 0 auto 0; block-size: 34px; display: grid; grid-template-columns: minmax(0, 1fr) var(--spk-w, 64px) var(--px-w, 78px) var(--ch-w, 60px); align-items: center; column-gap: var(--rg, 14px); box-sizing: border-box; }
.q78__row::before { content: ""; position: absolute; inset: 2px -10px; border-radius: 10px; background: var(--q-sub-hi); box-shadow: inset 0 0 0 1px var(--q-sub-bd); opacity: 0; transition: opacity var(--q-t1) var(--q-ease); }
.q78__row.is-hov::before, .q78__row.is-focus::before { opacity: 1; }
.q78__spk { display: block; position: relative; inline-size: var(--spk-w, 64px); block-size: 16px; overflow: visible; color: var(--h70-ink3); }
.q78__spk[data-dir="up"] { color: var(--q-up); }
.q78__spk[data-dir="dn"] { color: var(--q-dn); }
.q78__spk .l { fill: none; stroke: currentColor; stroke-opacity: .55; stroke-width: 1; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.q78__spk .a { fill: currentColor; fill-opacity: .08; stroke: none; }
.q78__spk .e { fill: currentColor; fill-opacity: .8; }
.q78__row.is-focus .q78__spk .l, .q78__row.is-hov .q78__spk .l { stroke-opacity: .85; }
.q78__code i { opacity: .55; }
.q78__code { position: relative; min-inline-size: 0; overflow: hidden; font-size: 13px; line-height: 1; letter-spacing: .03em; color: var(--h70-ink2); white-space: nowrap; }
.q78__row.is-focus .q78__code, .q78__row.is-hov .q78__code { color: var(--h70-ink); }
.q78__px { position: relative; justify-self: end; font-size: 15px; line-height: 1; color: var(--h70-ink); white-space: nowrap; }
.q78 b { transition: color var(--q-fade) var(--q-ease); }
.q78 b.u3, .q78 b.u2, .q78 span.u3, .q78 span.u2 { color: var(--q-up); transition-duration: 0s; }
.q78 b.d3, .q78 b.d2, .q78 span.d3, .q78 span.d2 { color: var(--q-dn); transition-duration: 0s; }
.q78__big span { transition: color var(--q-fade) var(--q-ease); }
.h70[data-still] .q78 b, .h70[data-still] .q78 span { transition: none !important; }
.q78__chg { position: relative; justify-self: end; font-size: 13px; line-height: 1; white-space: nowrap; color: var(--h70-ink3); opacity: .86; }
.q78__chg[data-dir="up"] { color: var(--q-up); }
.q78__chg[data-dir="dn"] { color: var(--q-dn); }

/* ── b · 下单:选中品种成主角 ── */
.q78__sB { display: flex; flex-direction: column; justify-content: center; }
.q78__bh { display: flex; align-items: center; gap: 12px; block-size: 24px; font-size: 13px; line-height: 1; }
.q78__fcode { color: var(--h70-ink); letter-spacing: .03em; white-space: nowrap; }
.q78__fchg { color: var(--h70-ink3); white-space: nowrap; }
.q78__fchg[data-dir="up"] { color: var(--q-up); }
.q78__fchg[data-dir="dn"] { color: var(--q-dn); }
.q78__lot { margin-inline-start: auto; display: flex; align-items: center; gap: 4px; }
.q78__cl { opacity: .6; margin-inline-end: 4px; }
.q78__stp { position: relative; isolation: isolate; display: grid; place-items: center; inline-size: 24px; block-size: 24px; border-radius: 50%; box-sizing: border-box; box-shadow: inset 0 0 0 1px var(--q-sub-bd); font-size: 15px; line-height: 1; color: var(--h70-ink2); }
.q78__stp::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%; background: var(--q-sub-hi); opacity: 0; transition: opacity var(--q-t1) var(--q-ease); }
.q78__stp.is-hov::before { opacity: 1; }
.q78__stp.is-hov { color: var(--h70-ink); }
.q78__lots { min-inline-size: 36px; text-align: center; color: var(--h70-ink); }
.q78__big { margin-block: 4px 16px; font-size: 40px; line-height: 48px; letter-spacing: -.01em; font-weight: 400; color: var(--h70-ink); white-space: nowrap; }
.q78__big span { font-weight: 400; }
.q78__btns { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.q78__qb { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 8px; block-size: 48px; padding-inline: 16px; box-sizing: border-box; border-radius: 14px; overflow: hidden; background: var(--q-sub); box-shadow: inset 0 1px 0 var(--q-sub-hi), inset 0 0 0 1px var(--q-sub-bd); transform-origin: 50% 60%; }
.q78__qb::before { content: ""; position: absolute; inset: 0; background: var(--q-sub-hi); opacity: 0; transition: opacity var(--q-t1) var(--q-ease); pointer-events: none; }
.q78__qb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, var(--q-sub-hi), transparent 60%); pointer-events: none; }
.q78__qb.is-hov::before { opacity: 1; }
.q78__ql { position: relative; z-index: 1; font-size: 13px; line-height: 1; letter-spacing: .04em; color: var(--h70-ink2); }
.q78__qb[data-k="buy"] .q78__ql { color: var(--q-acc); }
.q78__qp { position: relative; z-index: 1; font-size: 15px; line-height: 1; color: var(--h70-ink); white-space: nowrap; }
.q78__prs { position: absolute; inset: 0; background: var(--q-sub-hi); opacity: 0; pointer-events: none; }

/* ── c · 指令处理链:这一段最精致 ── */
.q78__sC { display: flex; flex-direction: column; justify-content: space-between; }
.q78__rc { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; block-size: 24px; font-size: 13px; line-height: 24px; }
.q78__rcs { flex: 1 1 auto; min-inline-size: 0; color: var(--h70-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.q78__rct { flex: none; opacity: 0; transition: opacity var(--q-t2) var(--q-ease); color: var(--q-up); }
.q78__rc.is-fill .q78__rct { opacity: .9; }
.q78__rcp { flex: none; font-size: 15px; color: var(--h70-ink); white-space: nowrap; }
.q78__cap { position: absolute; left: 0; top: calc(var(--ly) + 38px); font-size: 13px; line-height: 16px; letter-spacing: .02em; white-space: nowrap; color: var(--h70-ink2); opacity: 0; will-change: transform, opacity; }
.q78__ch { position: relative; block-size: calc(var(--sh) - 24px - 8px); }
.q78__lane { position: absolute; left: 14px; right: 14px; top: var(--ly); block-size: 2px; border-radius: 1px; background: var(--q-line); }
.q78__lit { position: absolute; left: 0; top: 0; inline-size: 100%; block-size: 100%; border-radius: 1px; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, var(--q-agent), var(--q-lit)); transition: transform var(--q-hop) linear; }
.q78__lit::after { content: ""; position: absolute; inset: -3px 0; background: inherit; filter: blur(5px); opacity: .55; }
.q78__spark { position: absolute; left: 0; top: -3px; inline-size: 56px; block-size: 8px; margin-inline-start: -28px; border-radius: 4px; background: radial-gradient(closest-side, var(--q-lit), transparent); opacity: 0; will-change: transform, opacity; }
.q78__nd { position: absolute; top: var(--ly); inline-size: 0; block-size: 0; }
.q78__nd .q78__mk { position: absolute; left: -7px; top: -6px; inline-size: 14px; block-size: 14px; background: var(--q-nbg); box-shadow: inset 0 0 0 1.5px var(--q-line); }
.q78__nd .q78__mk::after { content: ""; position: absolute; inset: 3px; border-radius: inherit; background: var(--q-agent); opacity: 0; transform: scale(.2); transition: opacity var(--q-t2) var(--q-ease), transform var(--q-t2) var(--q-ease); }
.q78__nd::before { content: ""; position: absolute; left: -17px; top: -16px; inline-size: 34px; block-size: 34px; border-radius: 50%; background: radial-gradient(closest-side, var(--q-glow), transparent); opacity: 0; transform: scale(.5); transition: opacity var(--q-t2) var(--q-ease), transform var(--q-t2) var(--q-ease); }
.q78__nd::after { content: ""; position: absolute; left: -11px; top: -10px; inline-size: 22px; block-size: 22px; box-sizing: border-box; border-radius: 50%; border: 1px solid var(--q-agent); opacity: 0; transform: scale(.6); transition: opacity var(--q-t2) var(--q-ease), transform var(--q-t2) var(--q-ease); }
.q78__nl { position: absolute; top: 18px; left: 0; transform: translateX(-50%); font-size: 13px; line-height: 16px; white-space: nowrap; color: var(--h70-ink); opacity: .55; transition: opacity var(--q-t2) var(--q-ease); }
.q78__nd.is-on .q78__mk::after { opacity: 1; transform: scale(1); }
.q78__nd.is-on::before { opacity: 1; transform: scale(1); }
.q78__nd.is-on .q78__nl { opacity: 1; }
.q78__nd.is-cur::after { opacity: .75; transform: scale(1); }

/* 留痕:两行安静小字 + 一行脚注 */
.q78__lg { position: relative; margin-block-start: 16px; block-size: 48px; overflow: hidden; contain: layout paint; opacity: .62; }
.q78__fr { position: absolute; inset: 0 0 auto 0; block-size: 24px; display: grid; grid-template-columns: 8px 68px 1fr auto; align-items: center; column-gap: 12px; font-size: 13px; line-height: 1; opacity: 0; }
.q78__ft0 { color: var(--h70-ink2); }
.q78__fc { color: var(--h70-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.q78__fd { color: var(--h70-ink2); }
.q78__fd[data-dir="buy"] { color: var(--q-up); }
.q78__fd[data-dir="sell"] { color: var(--q-dn); }
.q78__ft { block-size: 24px; display: flex; align-items: center; font-size: 13px; letter-spacing: .04em; color: var(--h70-ink3); opacity: .94; white-space: nowrap; }

/* ── 光标:自绘,软白实心指针 + 极淡外晕;点击 = 一圈扩散的细环 ── */
.q78__cur { position: absolute; left: 0; top: 0; z-index: 7; inline-size: 0; block-size: 0; pointer-events: none; will-change: transform; }
.q78__cs { position: absolute; left: -3px; top: -2px; display: block; inline-size: 18px; block-size: 22px; transform-origin: 3px 2px; filter: drop-shadow(0 0 7px var(--q-cur-halo)) drop-shadow(0 1px 1.5px rgba(5, 14, 26, .32)); }
.q78__cs svg { display: block; }
.q78__cur.is-rest .q78__cs { animation: q78-breath 3.6s var(--q-ease) infinite; }
@keyframes q78-breath { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-1px, -1.5px); } }
.q78__cur { transition: opacity var(--q-t2, 140ms) var(--q-ease, cubic-bezier(.2,.8,.2,1)); }
.h70[data-tier="slim"] .q78__cur.is-rest, .h70[data-tier="xs"] .q78__cur.is-rest, .h70[data-tier="flow"] .q78__cur.is-rest { opacity: 0; }
.h70[data-still="fill"] .q78__cur, .h70[data-still="list"] .q78__cur { display: none; }
.q78__ring { position: absolute; left: 0; top: 0; z-index: 6; inline-size: 36px; block-size: 36px; box-sizing: border-box; border-radius: 50%; border: 1px solid var(--q-acc); opacity: 0; pointer-events: none; }

/* ── 档位:恒高(同一档内三个场景不变高)── */
.h70 { --spk-w: 64px; --bw: 384px; --ph: 352px; --pad: 24px; --sh: 184px; --ly: 78px; --vis: 6; --fade: 28px; --dots: 0; }
.h70[data-tier="compact"] { --as: .9; --bw: 364px; --pad: 22px; }
.h70[data-tier="slim"]    { --spk-w: 36px; --px-w: 68px; --ch-w: 54px; --rg: 10px; --as: .72; --bw: 304px; --ph: 316px; --pad: 20px; --sh: 168px; --ly: 82px; --vis: 5; --fade: 24px; }
.h70[data-tier="xs"]      { --spk-w: 0px; --px-w: 68px; --ch-w: 54px; --rg: 10px; --as: .72; --bw: 268px; --ph: 316px; --pad: 20px; --sh: 168px; --ly: 82px; --vis: 5; --fade: 24px; }
.h70[data-tier="slim"] .q78__big, .h70[data-tier="xs"] .q78__big { font-size: 36px; margin-block-end: 12px; }
.h70[data-tier="xs"] .q78__qb { padding-inline: 12px; }
.h70[data-tier="slim"] .q78__ft, .h70[data-tier="xs"] .q78__ft { display: none; }
.h70[data-tier="slim"] .q78 , .h70[data-tier="xs"] .q78 { --ph: 296px; }

/* flow:放不下就落回文案下面,单块 */
.h70[data-tier="flow"] {
  --spk-w: 48px; --as: .8; --bw: min(384px, calc(100vw - 32px)); --ph: 304px; --pad: 20px; --sh: 168px; --ly: 82px; --vis: 5; --fade: 24px;
  position: relative; inset: auto; z-index: 0; display: flex; justify-content: center; padding: 0 16px; margin-block: 40px 20px;
}
.h70[data-tier="flow"] .q78__ft { display: none; }
.h70[data-tier="flow"] .h70__scene { transform: none; animation: none; }
.h70[data-tier="flow"] .q78 { align-self: center; }
@media (max-width: 820px) {
  .h70 { --dots: 1; }
  .h70 .q78__nl { display: none; }
  .h70 .q78__lot .q78__cl { display: none; }
  .h70 .q78__fr { grid-template-columns: 8px 64px 1fr; }
  .h70 .q78__fd { display: none; }
}
@media (min-width: 1024px) { .h70[data-tier="flow"] { margin-block: -24px 8px; } }

.h70[data-run="0"] *, .h70[data-run="0"] *::before, .h70[data-run="0"] *::after { animation-play-state: paused !important; }

@media (prefers-reduced-motion: reduce) {
  .h70__scene { animation: none !important; }
  .q78__cur.is-rest .q78__cs { animation: none !important; }
  .q78__sc, .q78__lit, .q78__nd .q78__mk, .q78__nd::after { transition: none !important; }
}

.h70[data-lod] .a70__pk,
.h70[data-lod] .a70__bb,
.h70[data-lod] .a70__bk,
.h70[data-lod] .a70__dot { visibility: hidden; }

.h70[data-tier="xs"] .q78__spk { display: none; }
.h70[data-tier="xs"] .q78__row { grid-template-columns: minmax(0, 1fr) var(--px-w, 78px) var(--ch-w, 60px); }