/* 经营分析（真实数据看板）· 深空大屏主题 —— 设计令牌源自 docs/ops-design-review-2026-10-29/design-v2 定稿 */
#sOpsBoard { --bd-bg:#070B14; --bd-glass:rgba(15,23,42,0.55); --bd-glass-soft:rgba(15,23,42,0.35);
  --bd-stroke:rgba(148,163,184,0.24); --bd-stroke-soft:rgba(148,163,184,0.14); --bd-hi:rgba(255,255,255,0.06);
  --bd-cyan:#00E0FF; --bd-violet:#8B5CF6; --bd-blue:#3B82F6; --bd-amber:#FFB020;
  --bd-success:#00E676; --bd-danger:#FF4D6A; --bd-t1:#F1F5F9; --bd-t2:#94A3B8; --bd-t3:#64748B;
  --bd-num:"Rajdhani","DIN Alternate","Bahnschrift","Segoe UI",system-ui,sans-serif; }
#sOpsBoard.active { display:block; background:var(--bd-bg); border-radius:14px; padding:14px 16px; color:var(--bd-t1);
  overflow:hidden; position:relative;
  background-image:radial-gradient(920px 720px at 4% -6%, rgba(0,224,255,0.10), transparent 60%),
    radial-gradient(1040px 780px at 98% 104%, rgba(139,92,246,0.10), transparent 60%); }
#sOpsBoard *{ box-sizing:border-box; }
/* 流式响应布局：占满内容区宽度、随页面自然滚动（融入管理台），窄屏自动换行/堆叠 */
#opsBoardRoot{ display:flex; flex-direction:column; gap:10px; }

/* Rajdhani 数字字体（与设计稿一致，随包发布） */
@font-face{ font-family:'Rajdhani'; font-weight:500; font-display:swap;
  src:url('fonts/rajdhani-500.woff2') format('woff2'); }
@font-face{ font-family:'Rajdhani'; font-weight:600; font-display:swap;
  src:url('fonts/rajdhani-600.woff2') format('woff2'); }
@font-face{ font-family:'Rajdhani'; font-weight:700; font-display:swap;
  src:url('fonts/rajdhani-700.woff2') format('woff2'); }

/* 管理台全局表格样式隔离 */
#sOpsBoard .bd-table{ background:transparent; border-collapse:collapse; }
#sOpsBoard .bd-table th{ background:transparent; color:var(--bd-t3); border:none; }
#sOpsBoard .bd-table td{ background:transparent; color:var(--bd-t1); border-top:1px solid var(--bd-stroke-soft); }
#sOpsBoard .bd-table tbody tr:hover td{ background:rgba(0,224,255,0.05); }
#sOpsBoard .bd-table tbody tr{ background:transparent; }
#sOpsBoard .bd-table tbody tr:nth-child(odd), #sOpsBoard .bd-table tbody tr:nth-child(even){ background:transparent; }
#sOpsBoard .bd-table td:first-child, #sOpsBoard .bd-table th:first-child{ text-align:left; }

/* 顶栏 */
.bd-top{ display:flex; align-items:center; gap:14px; height:48px; padding:0 4px 8px;
  border-bottom:1px solid transparent;
  border-image:linear-gradient(90deg, rgba(0,224,255,0.55), rgba(139,92,246,0.35), transparent 82%) 1; }
.bd-logo{ width:34px; height:34px; border-radius:9px; display:grid; place-items:center;
  background:linear-gradient(135deg, rgba(0,224,255,0.18), rgba(139,92,246,0.18));
  border:1px solid var(--bd-stroke); color:var(--bd-cyan); font:700 18px var(--bd-num); }
.bd-title{ font-size:20px; font-weight:600; letter-spacing:2px; }
.bd-title small{ display:block; font-size:10px; letter-spacing:3px; color:var(--bd-t3); font-weight:400; }
.bd-live{ display:flex; align-items:center; gap:7px; font-size:11px; letter-spacing:2px; color:var(--bd-t2);
  border:1px solid var(--bd-stroke); border-radius:999px; padding:5px 12px; }
.bd-live i{ width:8px; height:8px; border-radius:50%; background:var(--bd-danger);
  box-shadow:0 0 10px var(--bd-danger); animation:bd-breath 2s ease-in-out infinite; }
@keyframes bd-breath{ 0%,100%{opacity:1} 50%{opacity:.35} }
.bd-top .bd-clock{ margin-left:auto; font:600 20px var(--bd-num); letter-spacing:1px; color:var(--bd-t1); font-variant-numeric:tabular-nums; }
.bd-date{ font-size:11px; color:var(--bd-t3); letter-spacing:1px; }
.bd-btn{ border:1px solid var(--bd-stroke); background:var(--bd-glass); color:var(--bd-t2); border-radius:9px;
  padding:7px 13px; font-size:12px; cursor:pointer; }
.bd-btn:hover{ color:var(--bd-cyan); border-color:rgba(0,224,255,0.4); }

/* 积累提示 */
.bd-phase{ font-size:11px; color:var(--bd-amber); letter-spacing:1px; padding:0 4px; }

/* KPI 带：自动换行（宽屏 6 卡一行，窄屏 3/2 卡） */
.bd-kpis{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; }
@media (max-width:1240px){ .bd-kpis{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px){ .bd-kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.bd-kpi{ background:var(--bd-glass); backdrop-filter:blur(18px) saturate(140%); border:1px solid var(--bd-stroke);
  border-radius:14px; padding:13px 16px 10px; position:relative; overflow:hidden;
  box-shadow:inset 0 1px 0 var(--bd-hi), 0 8px 32px rgba(0,0,0,0.45); }
.bd-kpi .lab{ font-size:12px; letter-spacing:1.6px; color:var(--bd-t2); white-space:nowrap; }
.bd-kpi .lab em{ font-style:normal; color:var(--bd-t3); letter-spacing:2px; }
.bd-kpi .val{ font:600 40px/1.15 var(--bd-num); font-variant-numeric:tabular-nums; margin-top:5px;
  text-shadow:0 0 18px rgba(0,224,255,0.35); white-space:nowrap; }
.bd-kpi.amber .val{ text-shadow:0 0 18px rgba(255,176,32,0.35); }
.bd-kpi .delta{ font-size:12px; margin-left:8px; font-family:var(--bd-num); }
.bd-kpi .delta.up{ color:var(--bd-success); } .bd-kpi .delta.down{ color:var(--bd-danger); }
.bd-kpi .sub{ margin-top:4px; font-size:11px; color:var(--bd-t3); }
.bd-kpi canvas,.bd-kpi svg.spark{ position:absolute; right:14px; bottom:12px; opacity:.85; }

/* 三列主体：窄屏自动堆叠 */
.bd-main{ display:grid; grid-template-columns:minmax(260px,24%) 1fr minmax(260px,24%); gap:12px; align-items:stretch; }
@media (max-width:1240px){ .bd-main{ grid-template-columns:1fr 1fr; }
  .bd-main .bd-col:nth-child(3){ grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; align-items:stretch; } }
@media (max-width:900px){ .bd-main{ grid-template-columns:1fr; }
  .bd-main .bd-col:nth-child(3){ grid-template-columns:1fr; } }
.bd-col{ display:flex; flex-direction:column; gap:12px; min-width:0; }
/* 列内卡片常态弹性：填满本列高（grid 行高=最高列），富余留在卡框内部（内容贴卡顶），
   列内卡片首尾相接无裸露背景——嵌入态/全屏铺满态/全屏缩放态三形态通用 */
.bd-main > .bd-col > .bd-card{ flex:1 1 auto; min-height:0; display:flex; flex-direction:column; }
/* 中列三卡（趋势/热播TOP5/转化漏斗）同步等高：仅多列布局（≥900px）启用——
   <900px 单列堆叠态下列高=内容自适应，flex-basis 0 会把三卡压成只剩标题的细条，恢复自然高度 */
@media (min-width:900px){ .bd-main > .bd-col:nth-child(2) > .bd-card{ flex:1 1 0; } }
@media (min-width:900px){ .bd-main > .bd-col:nth-child(3) > .bd-card{ flex-shrink:0; }
  .bd-main > .bd-col:nth-child(3) > .bd-countries-card{ flex-shrink:1; } }
/* 全屏态右列三卡恢复可压缩：全屏列高预算较小，shrink 0 会使右列内容总高超预算
   （列溢出顶高整板=底部截掉+溢出翻转触发 RO=趋势反复重绘）；全屏 --fs 微缩负责把内容压回不失真 */
#sOpsBoard:fullscreen .bd-main > .bd-col:nth-child(3) > .bd-card{ flex-shrink:1; min-height:0; }
.bd-main > .bd-col > .bd-card > *{ flex:0 0 auto; }
.bd-card{ background:var(--bd-glass); backdrop-filter:blur(18px) saturate(140%); border:1px solid var(--bd-stroke);
  border-radius:14px; padding:13px 16px; box-shadow:inset 0 1px 0 var(--bd-hi), 0 8px 32px rgba(0,0,0,0.45);
  position:relative; min-width:0; }
.bd-card .c-head{ display:flex; align-items:baseline; gap:8px; margin-bottom:9px; }
.bd-card .c-head h3{ margin:0; font-size:13px; font-weight:600; letter-spacing:1px; color:var(--bd-t1); }
.bd-card .c-head .en{ font-size:10px; letter-spacing:2px; color:var(--bd-t3); }
.bd-card .c-head .hint{ margin-left:auto; font-size:10px; color:var(--bd-t3); letter-spacing:1px; }

/* 左列 */
.bd-online .val{ font:600 42px/1.1 var(--bd-num); color:var(--bd-cyan); text-shadow:0 0 22px rgba(0,224,255,0.4); }
.bd-online .sub{ display:flex; gap:10px 22px; margin-top:8px; font-size:11px; color:var(--bd-t3); flex-wrap:wrap; }
.bd-online .sub b{ color:var(--bd-success); font-family:var(--bd-num); }
.bd-gauges{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px; text-align:center; }
.bd-gauge svg{ width:100%; max-width:86px; }
.bd-gauge .num{ font:600 22px var(--bd-num); font-variant-numeric:tabular-nums; margin-top:-34px; }
.bd-gauge .lab{ font-size:10px; color:var(--bd-t3); margin-top:26px; letter-spacing:1px; }
.bd-map-wrap{ position:relative; flex:1 1 auto; min-height:0; display:flex; }
/* cover 填满卡片可用高：地图按高放大、仅裁左右洋区，世界主陆完整（修「上部折叠/下部留空」） */
.bd-map-wrap svg{ width:100%; height:100%; }
.bd-map-wrap svg{ width:100%; display:block; }
.bd-map-wrap .map-dots circle{ fill:rgba(125,211,232,0.38); }
.bd-map-wrap .map-grid line{ stroke:rgba(148,163,184,0.14); }
.bd-pin-label{ position:absolute; transform:translate(-50%,-50%); pointer-events:none;
  background:rgba(7,11,20,0.8); border:1px solid var(--bd-stroke); border-radius:8px;
  padding:3px 8px; font:600 12px var(--bd-num); color:var(--bd-cyan); white-space:nowrap; font-variant-numeric:tabular-nums; }
.bd-pin-label .code{ color:var(--bd-t3); font-size:10px; margin-right:5px; letter-spacing:1px; }
@keyframes pin-pulse{ 0%,100%{opacity:.95} 50%{opacity:.5} }
.pin-pulse{ animation:pin-pulse 4s ease-in-out infinite; }

/* 中列 */
.bd-trend svg{ width:100%; display:block; }
/* 趋势图容器弹性占满卡片（fill/全屏铺满态纵坐标真实拉高）；下限防压扁 */
.bd-main > .bd-col > .bd-card > .bd-trend-body{ flex:1 1 auto; min-height:150px; }
.bd-trend-body svg{ height:100%; }
.bd-legend{ display:flex; gap:16px; font-size:10px; color:var(--bd-t2); margin-bottom:6px; }
.bd-legend i{ display:inline-block; width:14px; height:3px; vertical-align:middle; margin-right:5px; border-radius:2px; }
.bd-top-list{ display:flex; flex-direction:column; }
.bd-top-row{ display:flex; align-items:center; gap:12px; padding:5px 2px; border-bottom:1px solid var(--bd-stroke-soft); }
.bd-top-row:last-child{ border-bottom:none; }
.bd-rank{ width:22px; height:22px; border-radius:6px; display:grid; place-items:center;
  font:700 12px var(--bd-num); color:var(--bd-t2); border:1px solid var(--bd-stroke); }
.bd-rank.r1{ color:#FFD75E; border-color:rgba(255,215,94,0.55); box-shadow:0 0 10px rgba(255,215,94,0.25); }
.bd-rank.r2{ color:#CBD5E1; border-color:rgba(203,213,225,0.45); }
.bd-rank.r3{ color:#F0A868; border-color:rgba(240,168,104,0.45); }
.bd-top-row .t{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.bd-top-row .t small{ display:block; color:var(--bd-t3); font-size:10px; }
.bd-top-row .n{ font:600 14px var(--bd-num); color:var(--bd-t2); font-variant-numeric:tabular-nums; }
.bd-funnel .row{ display:grid; grid-template-columns:52px 1fr 58px; gap:10px; align-items:center; margin:5px 0; }
.bd-funnel .lab{ font-size:11px; color:var(--bd-t2); }
.bd-funnel .bar{ height:13px; border-radius:0 7px 7px 0; background:linear-gradient(90deg, var(--bd-cyan), var(--bd-violet));
  box-shadow:0 0 12px rgba(0,224,255,0.18); min-width:3px; }
.bd-funnel .pct{ font:600 12px var(--bd-num); color:var(--bd-t2); text-align:right; font-variant-numeric:tabular-nums; }
.bd-funnel .pct.warn{ color:var(--bd-amber); }
.bd-funnel .bar.over{ background:linear-gradient(90deg, var(--bd-amber), var(--bd-violet)); }

/* 右列 */
.bd-donut-wrap{ display:flex; gap:14px; align-items:center; }
.bd-donut-center{ font:600 15px var(--bd-num); fill:var(--bd-t1); }
.bd-legend-col{ flex:1; display:flex; flex-direction:column; gap:7px; font-size:11px; color:var(--bd-t2); }
.bd-legend-col .row{ display:flex; align-items:center; gap:7px; }
.bd-legend-col .sw{ width:9px; height:9px; border-radius:3px; }
.bd-legend-col .pct{ margin-left:auto; font:600 12px var(--bd-num); color:var(--bd-t1); font-variant-numeric:tabular-nums; }
.bd-coin{ margin-top:12px; border-top:1px solid var(--bd-stroke-soft); padding-top:9px;
  display:flex; flex-direction:column; gap:5px; font-size:11px; color:var(--bd-t2); }
.bd-coin .row{ display:flex; justify-content:space-between; }
.bd-coin b{ color:var(--bd-amber); font:600 12px var(--bd-num); font-variant-numeric:tabular-nums; }

/* 内容资产/流量结构/弃剧点/投放/待接入 */
.bd-status{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.bd-status .st{ font-size:11px; padding:3px 9px; border-radius:999px; border:1px solid var(--bd-stroke); color:var(--bd-t2); }
.bd-status .st.ok{ color:var(--bd-success); border-color:rgba(0,230,118,0.35); }
.bd-status .st.warn{ color:var(--bd-amber); border-color:rgba(255,176,32,0.4); }
.bd-status .st.bad{ color:var(--bd-danger); border-color:rgba(255,77,106,0.4); }
.bd-asset-rows{ display:flex; flex-direction:column; gap:5px; font-size:11px; color:var(--bd-t2); }
.bd-asset-rows .row{ display:flex; justify-content:space-between; }
.bd-asset-rows b{ color:var(--bd-t1); font:600 12px var(--bd-num); font-variant-numeric:tabular-nums; }
.bd-mini2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; font-size:11px; }
.bd-mini2 .mini-t{ font-size:10px; letter-spacing:1.4px; color:var(--bd-t3); margin-bottom:5px; }
.bd-mini2 .row{ display:flex; justify-content:space-between; padding:3px 0; color:var(--bd-t2); border-top:1px solid var(--bd-stroke-soft); }
.bd-mini2 b{ color:var(--bd-t1); font-family:var(--bd-num); }
.bd-mini2 .row.mut{ color:var(--bd-t3); }
.bd-tts{ margin-top:9px; font-size:11px; color:var(--bd-t2); }
.bd-tts b{ color:var(--bd-cyan); font:600 13px var(--bd-num); font-variant-numeric:tabular-nums; }
.bd-form{ margin-top:11px; border-top:1px solid var(--bd-stroke-soft); padding-top:10px;
  display:grid; grid-template-columns:1fr 1fr 1.2fr auto; gap:7px; align-items:center; }
.bd-form select, .bd-form input{ background:rgba(7,11,20,0.7); border:1px solid var(--bd-stroke); border-radius:8px;
  color:var(--bd-t1); padding:6px 8px; font-size:12px; min-width:0; }
.bd-form input[type=date]{ color-scheme:dark; }
.bd-form .bd-form-msg{ grid-column:1 / -1; font-size:10px; color:var(--bd-t3); min-height:12px; }
.bd-pending{ display:flex; flex-direction:column; gap:7px; font-size:12px; color:var(--bd-t2); }
.bd-pending .row{ display:flex; justify-content:space-between; align-items:center; }
.bd-pending b{ font:600 11px var(--bd-num); color:var(--bd-t3); letter-spacing:1px; }
.bd-ret-ext{ margin-top:8px; font-size:11px; color:var(--bd-t2); display:flex; justify-content:space-between; }
.bd-paynote{ margin-top:9px; font-size:11px; color:var(--bd-t2); display:flex; justify-content:space-between; }
.bd-ret-ext .na, .bd-paynote .na{ color:var(--bd-t3); font-size:10px; }
.bd-table{ width:100%; border-collapse:collapse; font-size:12px; }
.bd-table th{ font-size:10px; letter-spacing:1.4px; color:var(--bd-t3); text-align:right; font-weight:400; padding:3px 2px; }
.bd-table th:first-child{ text-align:left; }
.bd-table td{ padding:4px 2px; text-align:right; font-family:var(--bd-num); font-variant-numeric:tabular-nums;
  color:var(--bd-t1); border-top:1px solid var(--bd-stroke-soft); }
.bd-table td:first-child{ text-align:left; font-family:inherit; color:var(--bd-t2); }
.bd-pay .big{ font:600 44px/1.1 var(--bd-num); text-align:center; margin:6px 0 2px; font-variant-numeric:tabular-nums; }
.bd-pay .big.good{ color:var(--bd-success); } .bd-pay .big.bad{ color:var(--bd-danger); }
.bd-pay .cap{ text-align:center; font-size:10px; letter-spacing:2px; color:var(--bd-t3); }
.bd-pay .rows{ margin-top:12px; font-size:12px; color:var(--bd-t2); display:flex; flex-direction:column; gap:6px; }
.bd-pay .rows .row{ display:flex; justify-content:space-between; }
.bd-pay .rows b{ color:var(--bd-t1); font-family:var(--bd-num); }
.bd-pay .rows .na{ color:var(--bd-t3); }

/* flex-start：防默认 stretch 把 boardRoot 高度钉成视口高、缩放分母（scrollHeight）失真裁掉底带；
   border-box：inset:0+padding 12 不外扩出视口（board.css 自身防御，不依赖宿主页全局规则） */
#sOpsBoard:fullscreen{ box-sizing:border-box; position:fixed; inset:0; width:100vw; height:100vh; max-height:none; border-radius:0; padding:12px; overflow:hidden; z-index:999; display:flex; justify-content:center; align-items:flex-start; background:var(--bd-bg); }
#sOpsBoard:fullscreen #opsBoardRoot{ width:1560px; margin:0; padding:14px 16px; }
#sOpsBoard:fullscreen #opsBoardRoot{ gap:8px; }
#sOpsBoard:fullscreen .bd-kpi{ padding:11px 16px 9px; }
#sOpsBoard:fullscreen .bd-phase{ line-height:1.4; }
/* 全屏铺满态（内容放得下视口时由 JS 挂 fs-fill）：宽度撑满+卡片本体弹性增高吃掉富余高度，
   列内卡片首尾相接无裸露空隙（富余留在卡框内部，内容贴卡顶）；
   规则须位于 :fullscreen 定宽规则之后以胜出同特异性 */
#sOpsBoard.fs-fill #opsBoardRoot{ width:100% !important; height:100% !important; box-sizing:border-box; transform:none !important; }
#sOpsBoard:fullscreen .bd-main{ flex:1 1 auto; min-height:0; }
#sOpsBoard.fs-fill .bd-main{ flex:1 1 auto; min-height:0; }
#sOpsBoard.fs-fill.fs-overflow{ overflow-y:auto; justify-content:flex-start; }
#sOpsBoard.fs-fill.fs-overflow #opsBoardRoot{ height:auto !important; min-height:100%; }
.bd-strip{ overflow:hidden; border:1px solid var(--bd-stroke); border-radius:14px; background:var(--bd-glass-soft);
  backdrop-filter:blur(14px) saturate(130%); }
.bd-strip-inner{ display:inline-flex; gap:0; white-space:nowrap; animation:bd-marquee 40s linear infinite; padding:12px 0; }
.bd-strip:hover .bd-strip-inner{ animation-play-state:paused; }
@keyframes bd-marquee{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
.bd-strip .item{ display:inline-flex; align-items:baseline; gap:8px; padding:0 26px; border-right:1px solid var(--bd-stroke-soft); font-size:12px; color:var(--bd-t2); }
.bd-strip .item b{ font:600 16px var(--bd-num); color:var(--bd-t1); font-variant-numeric:tabular-nums; }
.bd-strip .item b.good{ color:var(--bd-success); } .bd-strip .item b.warn{ color:var(--bd-amber); }

/* 营收构成卡：净收入（X3 未接入）原位行 */
.bd-mix-net{ display:flex; justify-content:space-between; align-items:baseline; margin-top:10px; padding:8px 2px 0;
  border-top:1px solid var(--bd-stroke-soft); font-size:11px; color:var(--bd-t2); letter-spacing:0.5px; }
.bd-mix-net b{ font:400 12px var(--bd-num); color:var(--bd-t3); }

/* 空态/错误 */
.bd-empty{ padding:60px 0; text-align:center; color:var(--bd-t3); font-size:13px; letter-spacing:1px; }
.bd-empty b{ color:var(--bd-t1); }

/* 全屏模式 */

/* 投放录入模态（X1a） */
.bd-modal{ position:fixed; inset:0; z-index:1000; background:rgba(2,6,14,0.62); display:flex; align-items:center; justify-content:center; }
.bd-modal-box{ background:#0B1220; border:1px solid rgba(148,163,184,0.25); border-radius:14px; padding:20px 22px; width:520px; max-width:92vw; box-shadow:0 18px 60px rgba(0,0,0,0.55); }
.bd-modal-box .c-head{ margin-bottom:14px; }
.bd-form{ grid-template-columns:1fr 1fr 1.2fr auto; }

/* 无障碍：系统开启减少动效时降级为静态最终帧（spec 动效契约；countUp 在 JS 侧同款降级） */
@media (prefers-reduced-motion: reduce){
  #sOpsBoard *, #sOpsBoard *::before, #sOpsBoard *::after{ animation: none !important; transition: none !important; }
}

/* ============ 设计稿对齐批（v20261102）追加样式 ============ */

/* KPI foot：左注释 + 右 spark（设计稿形态）；spark 从绝对定位迁入 foot 流式布局 */
.bd-kpi .foot{ display:flex; justify-content:space-between; align-items:flex-end; margin-top:auto; padding-top:6px;
  font-size:10px; color:var(--bd-t3); letter-spacing:0.5px; }
.bd-kpi .foot .spark{ position:static; opacity:.9; }
.bd-kpi{ display:flex; flex-direction:column; }

/* KPI 主值与环比箭头同行紧贴（设计稿 delta 位置） */
.bd-kpi .valrow{ display:flex; align-items:baseline; gap:8px; }
.bd-kpi .valrow .delta{ font-size:12px; font-family:var(--bd-num); }

/* 氛围层：40px 网格线 + 噪点（spec 氛围层契约） */
#sOpsBoard::before{ content:''; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background:linear-gradient(rgba(148,163,184,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(148,163,184,0.05) 1px, transparent 1px);
  background-size:40px 40px; }
#sOpsBoard::after{ content:''; position:absolute; inset:0; pointer-events:none; opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"); }
#sOpsBoard{ position:relative; }
#sOpsBoard > *{ position:relative; z-index:1; }

/* 卡片 HUD 四角标（设计稿左列卡形态，统一到全部卡） */
.bd-card{ position:relative; }
.bd-card::before, .bd-card::after{ content:''; position:absolute; width:10px; height:10px; pointer-events:none; opacity:.45; }
.bd-card::before{ top:-1px; left:-1px; border-top:1px solid rgba(0,224,255,0.55); border-left:1px solid rgba(0,224,255,0.55); }
.bd-card::after{ bottom:-1px; right:-1px; border-bottom:1px solid rgba(0,224,255,0.55); border-right:1px solid rgba(0,224,255,0.55); }

/* 营收卡外发光 / 实时在线光晕（设计稿 glow） */
.bd-kpi.amber{ box-shadow:0 0 34px rgba(255,176,32,0.12); }
.bd-online .val{ text-shadow:0 0 26px rgba(0,224,255,0.55); }

/* LIVE 徽章：设计稿红调描边 */
.bd-live{ border:1px solid rgba(255,77,106,0.45); color:#FF8FA3; border-radius:999px; padding:4px 12px; background:rgba(255,77,106,0.08); }

/* 趋势图例：入卡片头右侧（设计稿形态） */
.bd-legend{ margin-left:auto; display:inline-flex; gap:14px; align-items:center; font-size:10px; color:var(--bd-t2); }
.bd-legend span{ display:inline-flex; align-items:center; gap:5px; }
.bd-legend i{ display:inline-block; width:10px; height:3px; border-radius:2px; }
.bd-legend em{ font-style:normal; color:var(--bd-t3); }
.bd-card.bd-trend .c-head .hint{ display:none; }

/* 实时在线：三段位（较昨日同时段 | 峰值 | 时间）设计稿底部形态 */
.bd-online .tri{ display:flex; justify-content:space-between; gap:8px; margin-top:auto; padding-top:8px;
  border-top:1px solid var(--bd-stroke-soft); font-size:10px; color:var(--bd-t3); flex-wrap:wrap; }
.bd-online .tri b{ color:var(--bd-t2); font-family:var(--bd-num); }
.bd-online .tri .bd-rt-time{ color:var(--bd-cyan); font-family:var(--bd-num); }
.bd-card.bd-online{ display:flex; flex-direction:column; }

/* 用户规模仪表：数值移到弧下方（设计稿形态，替换负 margin 叠弧） */
.bd-gauge .num{ margin-top:6px; }

/* 支付健康：渐变半环仪表盘（设计稿形态） */
.bd-pay-gauge{ position:relative; text-align:center; margin:6px auto 2px; max-width:190px; }
.bd-pay-gauge svg{ width:100%; display:block; }
.bd-pay-num{ font:600 30px/1 var(--bd-num); color:var(--bd-t1); margin-top:-34px; font-variant-numeric:tabular-nums; }
.bd-pay-cap{ font-size:9px; letter-spacing:2px; color:var(--bd-t3); margin-top:6px; }

/* TOP5：封面占位（渐变+缩写）与 PLAYS 量级形态 */
.bd-cover{ width:24px; height:32px; border-radius:4px; flex:0 0 24px; display:flex; align-items:center; justify-content:center;
  font:700 9px var(--bd-num); color:rgba(255,255,255,0.85); letter-spacing:0.5px;
  background:linear-gradient(160deg, rgba(0,224,255,0.35), rgba(139,92,246,0.45)); border:1px solid rgba(148,163,184,0.25); }
.bd-top-row .n small{ display:block; font-size:8px; letter-spacing:1.5px; color:var(--bd-t3); font-weight:400; }
.bd-top-row .t small{ color:var(--bd-t3); }

/* 分国家：国家全名 + 码 */
.bd-table td small{ color:var(--bd-t3); font-size:10px; margin-left:4px; }

/* 滚动带：值旁环比 pt 形态 */
.bd-strip .item .pt{ font-size:10px; font-family:var(--bd-num); margin-left:4px; }
.bd-strip .item .pt.up{ color:var(--bd-success); } .bd-strip .item .pt.down{ color:var(--bd-danger); }

/* ============ 全屏饱满度（用户口径：居中显示+动态字体大小） ============ */
/* 动态字号因子：按视口宽/设计宽与视口高/设计高取小者（高度是约束维），clamp 封顶防超大屏过夸张 */
/* --fs 由 board.js 在进入铺满态时按视口计算写入（数值可靠，不依赖 CSS 嵌套 calc 解析） */
/* 卡内内容垂直居中：c-head 贴顶，其余内容块 margin-block auto 均分剩余空间（行距拉开显饱满） */
#sOpsBoard:fullscreen .bd-main > .bd-col > .bd-card > :not(.c-head){ margin-block: auto; }
/* 动态字号：核心数值/标题/文本随 --fs 放大 */
#sOpsBoard:fullscreen .bd-kpi .val{ font-size: calc(40px * var(--fs)); }
#sOpsBoard:fullscreen .bd-kpi .lab{ font-size: calc(11px * var(--fs)); }
#sOpsBoard:fullscreen .bd-kpi .sub{ font-size: calc(11px * var(--fs)); }
#sOpsBoard:fullscreen .bd-kpi .foot{ font-size: calc(10px * var(--fs)); }
#sOpsBoard:fullscreen .bd-kpi .delta{ font-size: calc(12px * var(--fs)); }
#sOpsBoard:fullscreen .bd-online .val{ font-size: calc(38px * var(--fs)); }
#sOpsBoard:fullscreen .bd-online .sub{ font-size: calc(11px * var(--fs)); }
#sOpsBoard:fullscreen .bd-online .tri{ font-size: calc(10px * var(--fs)); }
#sOpsBoard:fullscreen .bd-card .c-head h3{ font-size: calc(14px * var(--fs)); }
#sOpsBoard:fullscreen .bd-card .c-head .en,
#sOpsBoard:fullscreen .bd-card .c-head .hint{ font-size: calc(10px * var(--fs)); }
#sOpsBoard:fullscreen .bd-legend{ font-size: calc(10px * var(--fs)); }
#sOpsBoard:fullscreen .bd-top-row .t{ font-size: calc(13px * var(--fs)); }
#sOpsBoard:fullscreen .bd-top-row .t small{ font-size: calc(10px * var(--fs)); }
#sOpsBoard:fullscreen .bd-top-row .n{ font-size: calc(14px * var(--fs)); }
#sOpsBoard:fullscreen .bd-top-row .n small{ font-size: calc(8px * var(--fs)); }
#sOpsBoard:fullscreen .bd-funnel .row{ font-size: calc(12px * var(--fs)); }
#sOpsBoard:fullscreen .bd-table{ font-size: calc(12px * var(--fs)); }
#sOpsBoard:fullscreen .bd-pay-gauge .bd-pay-num{ font-size: calc(30px * var(--fs)); }
#sOpsBoard:fullscreen .bd-pay-gauge .bd-pay-cap{ font-size: calc(9px * var(--fs)); }
#sOpsBoard:fullscreen .bd-pay .rows{ font-size: calc(12px * var(--fs)); }
#sOpsBoard:fullscreen .bd-mix-net{ font-size: calc(11px * var(--fs)); }
#sOpsBoard:fullscreen .bd-strip .item{ font-size: calc(12px * var(--fs)); }
#sOpsBoard:fullscreen .bd-strip .item b{ font-size: calc(16px * var(--fs)); }

/* TOP5 封面图（真实封面；失败回退差异化渐变占位） */
.bd-cover-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:4px; }
.bd-cover{ position:relative; overflow:hidden; }

/* ==== 批4 嵌入贴合态（fs-fit）字号镜像：与 :fullscreen 同款缩放 ==== */
#sOpsBoard.fs-fit #opsBoardRoot { width:1560px; margin:0; padding:14px 16px; }
#sOpsBoard.fs-fit #opsBoardRoot { gap:8px; }
#sOpsBoard.fs-fit .bd-kpi { padding:11px 16px 9px; }
#sOpsBoard.fs-fit .bd-phase { line-height:1.4; }
#sOpsBoard.fs-fit .bd-main { flex:1 1 auto; min-height:0; }
#sOpsBoard.fs-fit .bd-main > .bd-col > .bd-card > :not(.c-head) { margin-block: auto; }
#sOpsBoard.fs-fit .bd-kpi .val { font-size: calc(40px * var(--fs)); }
#sOpsBoard.fs-fit .bd-kpi .lab { font-size: calc(11px * var(--fs)); }
#sOpsBoard.fs-fit .bd-kpi .sub { font-size: calc(11px * var(--fs)); }
#sOpsBoard.fs-fit .bd-kpi .foot { font-size: calc(10px * var(--fs)); }
#sOpsBoard.fs-fit .bd-kpi .delta { font-size: calc(12px * var(--fs)); }
#sOpsBoard.fs-fit .bd-online .val { font-size: calc(38px * var(--fs)); }
#sOpsBoard.fs-fit .bd-online .sub { font-size: calc(11px * var(--fs)); }
#sOpsBoard.fs-fit .bd-online .tri { font-size: calc(10px * var(--fs)); }
#sOpsBoard.fs-fit .bd-card .c-head h3 { font-size: calc(14px * var(--fs)); }
#sOpsBoard.fs-fit .bd-card .c-head .en,
#sOpsBoard:fullscreen .bd-card .c-head .hint { font-size: calc(10px * var(--fs)); }
#sOpsBoard.fs-fit .bd-legend { font-size: calc(10px * var(--fs)); }
#sOpsBoard.fs-fit .bd-funnel .row { font-size: calc(12px * var(--fs)); }
#sOpsBoard.fs-fit .bd-table { font-size: calc(12px * var(--fs)); }
#sOpsBoard.fs-fit .bd-pay-gauge .bd-pay-num { font-size: calc(30px * var(--fs)); }
#sOpsBoard.fs-fit .bd-pay-gauge .bd-pay-cap { font-size: calc(9px * var(--fs)); }
#sOpsBoard.fs-fit .bd-pay .rows { font-size: calc(12px * var(--fs)); }
#sOpsBoard.fs-fit .bd-mix-net { font-size: calc(11px * var(--fs)); }
#sOpsBoard.fs-fit .bd-strip .item { font-size: calc(12px * var(--fs)); }
#sOpsBoard.fs-fit .bd-strip .item b { font-size: calc(16px * var(--fs)); }

/* ==== 用户互动卡（六互动指标 2×3 网格，自滚动带迁入避免重复） ==== */
.bd-engage-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px; align-content:center; }
.bd-engage .eg{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  padding:9px 4px; border-radius:10px; background:var(--bd-glass-soft); border:1px solid var(--bd-stroke-soft); }
.bd-engage .eg b{ font:600 17px var(--bd-num); color:var(--bd-t1); font-variant-numeric:tabular-nums; letter-spacing:0.3px; }
.bd-engage .eg b small{ font:400 11px var(--bd-num); color:var(--bd-t3); }
.bd-engage .eg span{ font-size:10px; color:var(--bd-t3); letter-spacing:0.5px; white-space:nowrap; }
#sOpsBoard.fs-fit .bd-engage .eg b{ font-size: calc(17px * var(--fs)); }
#sOpsBoard.fs-fit .bd-engage .eg b small{ font-size: calc(11px * var(--fs)); }
#sOpsBoard.fs-fit .bd-engage .eg span{ font-size: calc(10px * var(--fs)); }

/* ==== 指标卡（TOP5/漏斗）密度因子：--mk 由 JS 按实测盒高/自然高设定（0.8~1.45），
   行距/字号/封面/条高 calc 跟随卡片高度；卡体弹性占满+space-evenly 垂直均布（用户口径垂直居中） ==== */
.bd-card{ --mk:1; }
.bd-main > .bd-col > .bd-card > .bd-metric-body{ flex:1 1 auto; min-height:0; display:flex; flex-direction:column; justify-content:safe space-evenly; }
.bd-top-row{ padding:calc(5px*var(--mk)) 2px; gap:calc(12px*var(--mk)); }
.bd-top-row .t{ font-size:calc(13px*var(--mk)); }
.bd-top-row .t small{ font-size:calc(10px*var(--mk)); }
.bd-top-row .n{ font-size:calc(14px*var(--mk)); }
.bd-rank{ width:calc(22px*var(--mk)); height:calc(22px*var(--mk)); font-size:calc(12px*var(--mk)); }
.bd-cover{ width:calc(24px*var(--mk)); height:calc(32px*var(--mk)); flex-basis:calc(24px*var(--mk)); font-size:calc(9px*var(--mk)); }
.bd-funnel .row{ margin:calc(5px*var(--mk)) 0; gap:calc(10px*var(--mk)); }
.bd-funnel .lab{ font-size:calc(11px*var(--mk)); }
.bd-funnel .bar{ height:calc(13px*var(--mk)); }
.bd-funnel .pct{ font-size:calc(12px*var(--mk)); }
/* 分国家表：卡内滚动（可变列表拿右列剩余高度，行多不撑破相邻卡） */
.bd-countries-scroll{ flex:1 1 auto; min-height:0; overflow-y:auto; }
/* 全屏态趋势体固定设计高：切断「趋势高→内容高→fill/scale 判定→再重绘」反馈振荡环 */

/* ==== 指标说明弹窗 + 逐指标气泡（数据源 ops-metric-dict.js） ==== */
.bd-dict-btn{ margin-right:8px; }
.bd-dict-modal{ position:fixed; inset:0; z-index:1200; }
.bd-dict-mask{ position:absolute; inset:0; background:rgba(2,6,14,0.66); }
.bd-dict-panel{ position:absolute; left:50%; top:6vh; transform:translateX(-50%); width:min(860px,94vw); max-height:88vh;
  display:flex; flex-direction:column; background:#0B1220; border:1px solid rgba(148,163,184,0.28); border-radius:14px;
  box-shadow:0 24px 70px rgba(0,0,0,0.6); overflow:hidden; }
.bd-dict-head{ display:flex; align-items:center; gap:12px; padding:14px 18px; border-bottom:1px solid rgba(148,163,184,0.18); }
.bd-dict-head h3{ margin:0; font-size:16px; color:#F1F5F9; letter-spacing:1px; }
.bd-dict-head h3 small{ font-weight:400; font-size:11px; color:#64748B; margin-left:8px; }
.bd-dict-search{ flex:1; margin-left:auto; background:rgba(15,23,42,0.8); border:1px solid rgba(148,163,184,0.3); border-radius:8px;
  color:#E2E8F0; padding:7px 12px; font-size:12px; outline:none; width:220px; }
.bd-dict-search:focus{ border-color:rgba(0,224,255,0.6); }
.bd-dict-close{ background:none; border:none; color:#94A3B8; font-size:22px; line-height:1; cursor:pointer; padding:0 4px; }
.bd-dict-close:hover{ color:#F1F5F9; }
.bd-dict-body{ overflow-y:auto; padding:6px 18px 20px; }
.bd-dict-sec{ margin-top:14px; }
.bd-dict-sec h3{ margin:0 0 6px; font-size:13px; color:#00E0FF; letter-spacing:2px; font-weight:600;
  border-left:3px solid #00E0FF; padding-left:8px; }
.bd-dict-item{ padding:8px 10px; border-radius:8px; }
.bd-dict-item:hover{ background:rgba(0,224,255,0.05); }
.bd-dict-item .n{ font-size:13px; color:#F1F5F9; font-weight:600; }
.bd-dict-item .n small{ color:#64748B; font-weight:400; margin-left:8px; letter-spacing:1px; }
.bd-dict-item .d{ font-size:12px; color:#CBD5E1; margin-top:2px; line-height:1.5; }
.bd-dict-item .c{ font-size:12px; color:#94A3B8; margin-top:2px; }
.bd-dict-item .c b, .bd-dict-item .meta b{ color:#00E0FF; font-weight:600; margin-right:4px; }
.bd-dict-item .meta{ display:flex; flex-wrap:wrap; gap:4px 16px; font-size:11px; color:#64748B; margin-top:2px; }
.bd-dict-item .meta .note{ color:#FFB020; }

.bd-md-tip{ position:fixed; z-index:1300; max-width:340px; background:#0B1220; border:1px solid rgba(0,224,255,0.45);
  border-radius:10px; padding:10px 12px; box-shadow:0 12px 40px rgba(0,0,0,0.55); pointer-events:auto; }
.bd-md-tip .n{ font-size:13px; font-weight:700; color:#00E0FF; }
.bd-md-tip .n small{ color:#64748B; font-weight:400; margin-left:6px; }
.bd-md-tip .d{ font-size:12px; color:#E2E8F0; margin-top:4px; line-height:1.5; }
.bd-md-tip .c{ font-size:11px; color:#94A3B8; margin-top:4px; line-height:1.4; }
.bd-md-tip .c b{ color:#00E0FF; }
.bd-md-tip .meta{ font-size:10px; color:#64748B; margin-top:4px; display:flex; justify-content:space-between; gap:10px; }
/* 逐指标提示视觉：虚线底+help 光标 */
.has-dict[data-md]{ cursor:help; text-decoration:underline dashed rgba(0,224,255,0.4); text-underline-offset:3px; }
.has-dict[data-md]:hover{ border-bottom-color:rgba(0,224,255,0.8); }
.has-dict-sec[data-md-sec]{ transition:box-shadow 0.2s; }

/* TOP5 溢出修复：列表在卡内滚动（不撑破卡边界） */
.bd-main > .bd-col > .bd-card > .bd-top-list{ flex:1 1 auto; min-height:0; overflow-y:auto; }
/* 缩放贴合态：趋势固定参考高且垂直居中（fill 态趋势 flex 填满，由 JS 内联控制） */
#sOpsBoard.fs-scale .bd-trend-body{ justify-content:center; }
/* 趋势 svg 高度强制等于容器（preserveAspectRatio=none 设计为拉伸；容器 flex 定高）——
   字体 settle 改变容器高时 svg 自动跟随，消除 JS 测高收敛的残差与波次 */
.bd-trend-body svg{ height:100% !important; }
/* 全屏时弹窗/气泡挂 section 内部——#id > * 氛围层规则（relative+z1）会压过类级 fixed，
   用同链高特异性固定回 position:fixed（inset/坐标由类规则与内联样式提供） */
#sOpsBoard > .bd-dict-modal, #sOpsBoard > .bd-md-tip{ position:fixed !important; }
/* 逐指标 ⓘ 信息图标：点击 → 该指标说明气泡 */
.md-ico{ display:inline-block; width:13px; height:13px; line-height:12px; border-radius:50%;
  border:1px solid rgba(0,224,255,0.55); color:#00E0FF; font:italic 700 9px/12px Georgia,serif;
  text-align:center; margin-left:5px; cursor:help; vertical-align:middle; user-select:none; }
.md-ico:hover{ background:rgba(0,224,255,0.15); }
/* KPI 卡内容居中（用户口径：指标展示居中更直观；foot/spark 布局不受影响） */
.bd-kpi{ text-align:center; }

/* 看板内滚动条深色化（全局米色滑块为浅色主题设计，漏进深色卡=刺眼亮条，2026-11-04 用户实锤 TOP5 竖条） */
#sOpsBoard ::-webkit-scrollbar{ width:6px; height:6px; }
#sOpsBoard ::-webkit-scrollbar-track{ background:transparent; }
#sOpsBoard ::-webkit-scrollbar-thumb{ background:rgba(148,163,184,0.28); border-radius:6px; border:none; }
#sOpsBoard ::-webkit-scrollbar-thumb:hover{ background:rgba(148,163,184,0.45); }
#sOpsBoard{ scrollbar-width:thin; scrollbar-color:rgba(148,163,184,0.28) transparent; }
/* TOP5 临界溢出消除：行 4×47+46=232 vs 弹性可得 229 差 3px 即出滚动条 → 末行底垫 5→1px 省 4px 免滚动 */
#sOpsBoard .bd-top-row:last-child{ padding-bottom:1px; }