/* ============================================================
   section-spread-table.css — 裸点差（客户 2026-09：直接采用参考站
   rs-* 组件 CSS + 等价布局子集；配色映射 G 令牌）
   ============================================================ */
.lf-spread {
  position: relative;
  padding-block: var(--section-pad-lg) var(--section-pad);
}
.rs-wrap{background:
    radial-gradient(60% 80% at 0 0,rgba(29,158,111,0.16),transparent 60%),
    radial-gradient(56% 74% at 100% 100%,rgba(222,98,72,0.16),transparent 62%),
    linear-gradient(180deg,rgba(255,255,255,0.05),transparent 30%),
    linear-gradient(150deg,var(--pri2) 0%,var(--deep) 34%,var(--dark) 62%,var(--pri) 130%);border:1px solid rgba(47,191,143,0.22);border-radius:2rem;position:relative;overflow:hidden;box-shadow:inset 0 1px rgba(255,255,255,0.07),0 40px 80px -24px rgba(8,18,20,0.5),0 0 0 1px rgba(0,0,0,0.4)}
.rs-deco-grid{z-index:0;background-image:linear-gradient(rgba(29,158,111,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(29,158,111,0.05) 1px,transparent 1px);background-size:40px 40px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(80% 70%,black,transparent 80%);mask-image:radial-gradient(80% 70%,black,transparent 80%)}
.rs-deco-orb{filter:blur(40px);z-index:0;pointer-events:none;border-radius:9999px;position:absolute}
.rs-deco-orb-1{background:radial-gradient(circle,rgba(29,158,111,0.35),transparent 65%);width:320px;height:320px;animation:7s ease-in-out infinite lf-orb-float;top:-100px;left:-80px}
.rs-deco-orb-2{background:radial-gradient(circle,rgba(222,98,72,0.22),transparent 65%);width:280px;height:280px;animation:9s ease-in-out infinite reverse lf-orb-float;bottom:-80px;right:-60px}
.rs-section-tag{letter-spacing:.04em;color:var(--up-hi);background:rgba(29,158,111,0.12);border:1px solid rgba(29,158,111,0.28);border-radius:9999px;align-items:center;gap:.45rem;padding:.35rem .75rem;font-size:.72rem;font-weight:600;display:inline-flex}
.rs-section-dot{background:var(--up-hi);border-radius:9999px;width:6px;height:6px;animation:2s ease-in-out infinite lf-dot-pulse;box-shadow:0 0 8px var(--up-hi)} /* 循环动画 ≥1.9s 防频闪（Stage A P-09） */
.rs-section-sub{color:rgba(255,255,255,0.55);font-size:.78rem}
.rs-source{letter-spacing:.1em;color:rgba(255,255,255,0.4);font-family:var(--num-font); /* 归 G 数字栈（Stage A P-08，IBM Plex Mono 自托管） */font-size:.66rem;font-weight:600}
.rs-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(155deg,rgba(255,255,255,0.045),rgba(255,255,255,0.016));border:1px solid rgba(255,255,255,0.08);border-radius:1rem;padding:1.15rem 1.25rem;transition:transform .4s cubic-bezier(.22,1,.36,1),border-color .4s,background .4s;position:relative;overflow:hidden}
.rs-card:before{content:"";border-radius:inherit;-webkit-mask-composite:xor;opacity:.4;pointer-events:none;-webkit-mask-composite:xor;-webkit-mask-source-type:auto,auto;-webkit-mask-composite:xor;-webkit-mask-source-type:auto,auto;background:linear-gradient(135deg,rgba(47,191,143,0.4),transparent 40%,rgba(222,98,72,0.3));padding:1px;transition:opacity .4s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(black 0 0),linear-gradient(black 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}
.rs-card:hover{background:linear-gradient(155deg,rgba(255,255,255,0.07),rgba(255,255,255,0.024));border-color:rgba(47,191,143,0.25);transform:translateY(-4px)}
.rs-card:hover:before{opacity:1}
.rs-symbol{color:var(--text-inverse);letter-spacing:-.01em;font-family:var(--num-font); /* 归 G 数字栈（Stage A P-08，IBM Plex Mono 自托管） */font-size:1rem;font-weight:700}
.rs-cat{color:var(--up-hi);background:rgba(29,158,111,0.15);border:1px solid rgba(29,158,111,0.2);border-radius:.3rem;padding:.12rem .45rem;font-size:.66rem;font-weight:500}
.rs-live{letter-spacing:.08em;color:var(--up-hi);align-items:center;gap:.35rem;font-family:var(--num-font); /* 归 G 数字栈（Stage A P-08，IBM Plex Mono 自托管） */font-size:.62rem;font-weight:700;display:inline-flex}
.rs-live-dot{background:var(--up-hi);border-radius:9999px;width:6px;height:6px;position:relative}
.rs-live-dot:after{content:"";background:rgba(47,191,143,0.4);border-radius:9999px;animation:2s ease-in-out infinite lf-dot-pulse;position:absolute;inset:-3px} /* 循环动画 ≥1.9s 防频闪（Stage A P-09） */
.rs-price{background:rgba(0,0,0,0.22);border:1px solid rgba(255,255,255,0.04);border-radius:.6rem;padding:.6rem .75rem;transition:background .3s}
.rs-price-label{letter-spacing:.04em;color:rgba(255,255,255,0.45);margin-bottom:.2rem;font-size:.62rem;font-weight:600}
.rs-price-value{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-family:var(--num-font); /* 归 G 数字栈（Stage A P-08，IBM Plex Mono 自托管） */font-size:1.3rem;font-weight:700;transition:color .3s,text-shadow .3s}
.rs-price-bid .rs-price-value{color:var(--up-hi)}
.rs-price-ask .rs-price-value{color:var(--acc-hi)}
.rs-price.is-up .rs-price-value{color:var(--up-hi);text-shadow:0 0 12px rgba(47,191,143,0.6)}
.rs-price.is-down .rs-price-value{color:var(--acc-hi);text-shadow:0 0 12px rgba(222,98,72,0.6)}
.rs-price.is-up{background:rgba(47,191,143,0.08)}
.rs-price.is-down{background:rgba(222,98,72,0.08)}
.rs-spread-label{color:rgba(255,255,255,0.55);font-size:.72rem}
.rs-spread-value{color:var(--acc);font-family:var(--num-font); /* 归 G 数字栈（Stage A P-08，IBM Plex Mono 自托管） */font-size:.92rem;font-weight:700}
.rs-spread-unit{color:rgba(200,67,43,0.55);margin-inline-start:.2rem;font-size:.62rem;font-weight:500} /* logical 属性 RTL 镜像（Stage A P-06） */
.rs-btn{cursor:pointer;background:0 0;border:1px solid;border-radius:.55rem;justify-content:center;align-items:center;gap:.4rem;padding:.5rem;min-height:44px;font-size:.82rem;font-weight:600;transition:transform .2s,background .2s,box-shadow .2s;display:inline-flex} /* min-height ≥44px 触摸目标（Stage A P-01 / CHK-B11） */
.rs-btn-arrow{font-size:.6rem}
.rs-btn-buy{color:var(--up-hi);border-color:rgba(47,191,143,0.4)}
.rs-btn-buy:hover{background:var(--up-hi)1f;border-color:rgba(47,191,143,0.7);transform:translateY(-1px);box-shadow:0 4px 12px -2px rgba(47,191,143,0.4)}
.rs-btn-sell{color:var(--acc-hi);border-color:rgba(222,98,72,0.4)}
.rs-btn-sell:hover{background:var(--acc-hi)1f;border-color:rgba(222,98,72,0.7);transform:translateY(-1px);box-shadow:0 4px 12px -2px rgba(222,98,72,0.4)}
.rs-spark{opacity:.5;width:70px;height:18px;transition:opacity .3s;position:absolute;bottom:.6rem;right:.75rem;color:var(--up-hi)}
.rs-card:hover .rs-spark{opacity:.85}
.rs-eyebrow{letter-spacing:.16em;color:var(--acc-hi);margin-bottom:.85rem;font-family:var(--num-font); /* 归 G 数字栈（Stage A P-08，IBM Plex Mono 自托管） */font-size:.7rem;font-weight:700;display:inline-block}
.rs-title{letter-spacing:-.02em;color:var(--text-inverse);font-size:clamp(1.9rem,4vw,2.6rem);font-weight:800;line-height:1.1}
.rs-title-accent{-webkit-text-fill-color:transparent;background:var(--acc) 0 0/200%;-webkit-background-clip:text;background-clip:text;animation:4s infinite lf-grad-shift;display:inline-block;position:relative}
.rs-title-accent:after{content:"";opacity:.6;background:linear-gradient(90deg,transparent,var(--acc-hi),transparent);height:2px;position:absolute;bottom:-4px;left:0;right:0}
.rs-audience-tag{color:rgba(255,255,255,0.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:9999px;align-items:center;padding:.35rem .8rem;font-size:.76rem;font-weight:500;transition:color var(--duration-slow),background-color var(--duration-slow),border-color var(--duration-slow);display:inline-flex} /* 去 transition:all（Stage A P-07） */
.rs-audience-tag:hover{color:var(--acc);background:var(--acc)14;border-color:var(--acc)66}
.rs-desc{color:rgba(255,255,255,0.68);margin-top:1.25rem;font-size:.92rem;line-height:1.7}
.rs-list{list-style:none;padding:0;margin:1.25rem 0 0;flex-direction:column;gap:.6rem;display:flex}
.rs-list li{color:rgba(255,255,255,0.68);align-items:center;gap:.55rem;font-size:.85rem;display:flex}
.rs-list svg{color:var(--up-hi);flex-shrink:0}
.rs-cta{color:var(--text-inverse);cursor:pointer;background:linear-gradient(135deg,var(--acc-hi) 0%,var(--acc) 100%);border:none;border-radius:9999px;align-self:flex-start;align-items:center;gap:.5rem;padding:.85rem 1.8rem;font-size:1rem;font-weight:700;text-decoration:none;transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s,gap .3s;display:inline-flex;position:relative;box-shadow:0 8px 20px -4px rgba(222,98,72,0.5),inset 0 0 0 1px rgba(255,255,255,0.1)}
.rs-cta:before{content:"";z-index:-1;opacity:0;filter:blur(8px);background:linear-gradient(135deg,var(--acc),var(--acc-hi),var(--acc));border-radius:9999px;transition:opacity .3s;position:absolute;inset:-2px}
.rs-cta:hover{gap:.85rem;transform:translateY(-2px)scale(1.02);box-shadow:0 14px 32px -6px rgba(222,98,72,0.65),inset 0 0 0 1px rgba(255,255,255,0.15)}
.rs-cta:hover:before{opacity:.8;animation:2s infinite lf-grad-shift}

/* ---------- Tailwind 布局子集（参考站代码需要；仅作用本区） ---------- */
.lf-spread .relative { position: relative; }
.lf-spread .grid { display: grid; }
.lf-spread .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.lf-spread .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lf-spread .flex { display: flex; }
.lf-spread .flex-col { flex-direction: column; }
.lf-spread .flex-wrap { flex-wrap: wrap; }
.lf-spread .items-center { align-items: center; }
.lf-spread .justify-between { justify-content: space-between; }
.lf-spread .justify-center { justify-content: center; }
.lf-spread .justify-end { justify-content: flex-end; }
.lf-spread .gap-2 { gap: 0.5rem; }
.lf-spread .gap-2\.5 { gap: 0.625rem; }
.lf-spread .gap-3 { gap: 0.75rem; }
.lf-spread .gap-4 { gap: 1rem; }
.lf-spread .gap-8 { gap: 2rem; }
.lf-spread .p-7 { padding: 1.75rem; }
.lf-spread .mb-5 { margin-block-end: 1.25rem; }
.lf-spread .mt-3 { margin-block-start: 0.75rem; }
.lf-spread .mt-4 { margin-block-start: 1rem; }
.lf-spread .mt-5 { margin-block-start: 1.25rem; }
.lf-spread .mt-7 { margin-block-start: 1.75rem; }
.lf-spread .px-2 { padding-inline: 0.5rem; }
.lf-spread .text-xs { font-size: 0.75rem; }
.lf-spread .leading-relaxed { line-height: 1.7; }
.lf-spread .text-slate-400 { color: var(--ink-2); } /* #5F6A6E 客户 2026-09 */

@media (min-width: 640px) {
  .lf-spread .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
  .lf-spread .md\:p-10 { padding: 2.5rem; }
}

@media (min-width: 1024px) {
  .lf-spread .lg\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .lf-spread .lg\:col-span-3 { grid-column: span 3 / span 3; }
  .lf-spread .lg\:col-span-2 { grid-column: span 2 / span 2; }
  .lf-spread .lg\:pl-6 { padding-inline-start: 1.5rem; }
  .lf-spread .lg\:gap-10 { gap: 2.5rem; }
}

/* ---------- lf-rise 入场（参考站） ---------- */
.lf-rise { animation: 0.8s var(--ease) both lf-rise-kf; }

@keyframes lf-rise-kf {
  0% { opacity: 0; transform: translateY(28px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes lf-dot-pulse { 0%, 100% { opacity: 0.25; transform: scale(0.85); } 50% { opacity: 1; transform: scale(1.1); } }
@keyframes lf-grad-shift { 0% { background-position: 0% 50%; } 100% { background-position: 200% 50%; } }
@keyframes lf-rs-orb { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(14px, 18px) scale(1.06); } }

@media (prefers-reduced-motion: reduce) {
  .lf-spread *, .lf-rise { animation: none !important; transition: none !important; }
}


/* CTA 箭头：inline-flex 居中，消除 inline svg 的基线偏移 */
.rs-cta-arrow{display:inline-flex;align-items:center;justify-content:center}
.rs-cta-arrow svg{display:block}

/* 首张卡片点差数字的闪动效果（客户 2026-09）：与 .rs-price-ask 的动效时间一致 ——
   同为 color/text-shadow 的 .3s 过渡 + 同款朱砂辉光，切换节奏由脚本的 380ms/随机间隔控制 */
.rs-spread-value {
  transition: color .3s, text-shadow .3s;
}

.rs-spread-value.is-flash {
  color: var(--acc-hi);
  text-shadow: 0 0 12px rgba(222, 98, 72, 0.6);
}

@media (prefers-reduced-motion: reduce) {
  .rs-spread-value { transition: none; }
}
