/* ============================================================
   展示看板 · 可读性增强
   目标：字体整体放大、减少装饰元素，保持一屏信息清晰
   ============================================================ */

/* ---------- 顶部 ---------- */
body.dashboard-body .brand-title { font-size: 19px; letter-spacing: 0.6px; }
body.dashboard-body .brand-sub,
body.dashboard-body .season-chip { display: none; }
body.dashboard-body .brand-logo { width: 38px; height: 38px; }
body.dashboard-body .clock-label { display: none; }
body.dashboard-body .clock { font-size: 18px; letter-spacing: 1.2px; }
body.dashboard-body .icon-btn { width: 40px; height: 40px; }
body.dashboard-body .icon-btn svg { width: 18px; height: 18px; }

/* ---------- 标题条 ---------- */
body.dashboard-body .board-strip {
  justify-content: flex-start;
  margin-bottom: 12px;
  padding-bottom: 10px;
}
body.dashboard-body .strip-title { font-size: 27px; letter-spacing: 0.4px; }
body.dashboard-body .strip-meta { margin-top: 6px; gap: 10px; font-size: 12px; }
body.dashboard-body .strip-meta b { font-size: 12px; }
body.dashboard-body #rangeLabel,
body.dashboard-body #rangeLabel + .dot-sep { display: none; }
body.dashboard-body .strip-ticker { display: none; }

/* ---------- 核心指标 ---------- */
body.dashboard-body .kpi {
  padding: 14px 18px 13px;
  border-radius: 14px;
}
body.dashboard-body .kpi::before,
body.dashboard-body .kpi::after,
body.dashboard-body .kpi-idx,
body.dashboard-body .kpi-label::before { display: none; }
body.dashboard-body .kpi-label {
  gap: 0;
  font-size: 12.5px;
  letter-spacing: 0.8px;
}
body.dashboard-body .kpi-value { margin: 8px 0 7px; font-size: 44px; }
body.dashboard-body .kpi-value small { font-size: 13px; }
body.dashboard-body .kpi-foot { font-size: 12px; letter-spacing: 0.2px; }

/* ---------- 面板标题 ---------- */
body.dashboard-body .board .panel { padding: 14px 18px 16px; }
body.dashboard-body .board .panel-head {
  align-items: center;
  margin-bottom: 10px;
}
body.dashboard-body .board .panel-head h2 { gap: 0; font-size: 20px; letter-spacing: 0.4px; }
body.dashboard-body .board .panel-head h2::before { display: none; }
body.dashboard-body .board .panel-head p { margin-top: 4px; font-size: 12px; letter-spacing: 0.2px; }
body.dashboard-body .board .panel-tag { display: none; }
@media (min-width: 1101px) {
  body.dashboard-body .v2-board { grid-template-rows: 258px minmax(0, 1fr); }
}

/* ---------- 双组对比 ---------- */
body.dashboard-body .v2-group { padding: 12px 14px; }
body.dashboard-body .v2g-code { width: 30px; height: 30px; font-size: 14px; border-radius: 8px; }
body.dashboard-body .v2g-head b { font-size: 18px; }
body.dashboard-body .v2g-rank { font-size: 11px; padding: 3px 8px; }
body.dashboard-body .v2g-main { margin-top: 8px; }
body.dashboard-body .v2g-main b { font-size: 46px; }
body.dashboard-body .v2g-main span { font-size: 13px; }
body.dashboard-body .v2g-bar { height: 5px; margin-top: 8px; }
body.dashboard-body .v2g-stats { gap: 18px; padding-top: 8px; font-size: 11.5px; }
body.dashboard-body .v2g-stats b { font-size: 16px; }

/* ---------- 市场专员榜 ---------- */
body.dashboard-body .v2-board .panel-people .rank-row {
  grid-template-columns: 30px minmax(0, 1fr) minmax(60px, 1fr) 54px 58px;
  gap: 10px;
  padding: 6px 8px;
}
body.dashboard-body .rank-no { font-size: 15px; }
body.dashboard-body .rank-who b { font-size: 15px; }
body.dashboard-body .rank-who span { font-size: 11px; }
body.dashboard-body .rank-bar { height: 5px; }
body.dashboard-body .rank-conv { font-size: 10.5px; }
body.dashboard-body .rank-val b { font-size: 16px; }
body.dashboard-body .rank-val span { font-size: 10.5px; }

/* ---------- 最新店长 ---------- */
body.dashboard-body .board table.dt { font-size: 13px; }
body.dashboard-body .board table.dt thead th {
  padding: 9px 10px;
  font-size: 10.5px;
  letter-spacing: 0.8px;
}
body.dashboard-body .board table.dt tbody td { padding: 9px 10px; }
body.dashboard-body .panel-latest table.dt th:nth-child(1) { width: 9%; }
body.dashboard-body .panel-latest table.dt th:nth-child(2) { width: 16%; }
body.dashboard-body .panel-latest table.dt th:nth-child(3) { width: 24%; }
body.dashboard-body .panel-latest table.dt th:nth-child(4) { width: 12%; }
body.dashboard-body .panel-latest table.dt th:nth-child(5) { width: 9%; }
body.dashboard-body .panel-latest table.dt th:nth-child(6) { width: 15%; }
body.dashboard-body .panel-latest table.dt th:nth-child(7) { width: 15%; }
body.dashboard-body .panel-latest .tag { padding: 2px 8px; font-size: 10.5px; }
body.dashboard-body .progress-tag { height: 24px; padding: 0 9px; font-size: 10.5px; }

/* ---------- 实时动态 ---------- */
body.dashboard-body .board .feed-row { padding: 9px 5px; gap: 10px; }
body.dashboard-body .board .feed-ico { width: 26px; height: 26px; font-size: 10px; }
body.dashboard-body .board .feed-title { font-size: 13px; }
body.dashboard-body .board .feed-meta { display: flex; margin-top: 3px; font-size: 10.5px; }
body.dashboard-body .board .feed-date { font-size: 10.5px; }

/* ---------- 空状态 ---------- */
body.dashboard-body .empty-rich b,
body.dashboard-body .feed-empty b { font-size: 15px; }
body.dashboard-body .empty-rich span,
body.dashboard-body .feed-empty span { font-size: 12px; }

/* ---------- 中等屏幕 ---------- */
@media (max-width: 1399px) {
  body.dashboard-body .strip-title { font-size: 25px; }
  body.dashboard-body .kpi-value { font-size: 40px; }
}

/* ---------- 较矮大屏 ---------- */
@media (min-width: 1400px) and (max-height: 950px) {
  body.dashboard-body .v2-board { grid-template-rows: 252px minmax(0, 1fr); }
}

/* ---------- 窄屏表格 ---------- */
@media (max-width: 620px) {
  body.dashboard-body .panel-latest table.dt th:nth-child(1) { width: 17%; }
  body.dashboard-body .panel-latest table.dt th:nth-child(2) { width: 33%; }
  body.dashboard-body .panel-latest table.dt th:nth-child(3) { width: 28%; }
  body.dashboard-body .panel-latest table.dt th:nth-child(6) { width: 22%; }
}
@media (max-width: 560px) {
  body.dashboard-body .panel-latest table.dt th:nth-child(1) { width: 22%; }
  body.dashboard-body .panel-latest table.dt th:nth-child(2) { width: 45%; }
  body.dashboard-body .panel-latest table.dt th:nth-child(6) { width: 33%; }
}


/* ============================================================
   2026-10 精简版：只保留两项核心指标、市场专员榜、龙虎榜
   ============================================================ */

body.dashboard-body .kpi-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
body.dashboard-body .kpi {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 154px;
  padding: 22px 30px 20px;
  border-radius: 16px;
}
body.dashboard-body .kpi-label { font-size: 14.5px; letter-spacing: 1px; }
body.dashboard-body .kpi-value { margin: 8px 0 8px; font-size: 64px; }
body.dashboard-body .kpi-value small { font-size: 16px; }
body.dashboard-body .kpi-foot { font-size: 13px; }

body.dashboard-body .board .panel-head h2 { font-size: 22px; }
body.dashboard-body .board .panel-head p { font-size: 12.5px; }

body.dashboard-body .board.v2-board {
  grid-template-columns: 1fr;
  grid-template-rows: minmax(0, 1fr) 280px;
  grid-template-areas:
    "people"
    "duel";
}
body.dashboard-body .v2-board .panel-people { grid-area: people; }
body.dashboard-body .v2-board .panel-duel { grid-area: duel; }

/* 市场专员榜：默认展示前 20 名，四列五行铺满 */
body.dashboard-body .v2-board .panel-people .rank-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(5, minmax(0, 1fr));
  grid-auto-flow: column;
  column-gap: 18px;
  row-gap: 0;
  height: 100%;
}
body.dashboard-body .v2-board .panel-people .rank-row {
  grid-template-columns: 24px minmax(0, 1fr) 52px 56px;
  gap: 8px;
  padding: 6px 10px;
}
body.dashboard-body .v2-board .panel-people .rank-row:nth-child(n+9) { display: grid; }
body.dashboard-body .v2-board .panel-people .rank-bar { display: none; }
body.dashboard-body .v2-board .panel-people .rank-no { font-size: 15px; }
body.dashboard-body .v2-board .panel-people .rank-who { gap: 6px; }
body.dashboard-body .v2-board .panel-people .rank-who b { font-size: 20px; }
body.dashboard-body .v2-board .panel-people .rank-who span { font-size: 11px; }
body.dashboard-body .v2-board .panel-people .rank-val b { font-size: 18px; }
body.dashboard-body .v2-board .panel-people .rank-val span { font-size: 11px; }
body.dashboard-body .v2-board .panel-people .rank-conv { font-size: 11px; }

/* 龙虎榜：全宽放到底部 */
body.dashboard-body .v2-board .panel-duel .panel-body {
  display: flex;
  overflow: hidden;
}
body.dashboard-body .v2-groups { width: 100%; flex: 1; height: 100%; gap: 18px; }
body.dashboard-body .v2-group { padding: 14px 20px; }
body.dashboard-body .v2g-code { width: 34px; height: 34px; font-size: 15px; }
body.dashboard-body .v2g-head b { font-size: 20px; }
body.dashboard-body .v2g-rank { font-size: 12px; padding: 3px 9px; }
body.dashboard-body .v2g-main { margin-top: 8px; }
body.dashboard-body .v2g-main b { font-size: 52px; }
body.dashboard-body .v2g-main span { font-size: 14px; }
body.dashboard-body .v2g-bar { height: 6px; margin-top: 9px; }
body.dashboard-body .v2g-stats { gap: 24px; padding-top: 9px; font-size: 12.5px; }
body.dashboard-body .v2g-stats b { font-size: 18px; }

@media (max-width: 1100px) {
  body.dashboard-body .board.v2-board {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    grid-template-areas:
      "people"
      "duel";
  }
  body.dashboard-body .v2-board .panel-duel { min-height: 280px; }
  body.dashboard-body .v2-board .panel-people .rank-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    grid-auto-flow: row;
    grid-auto-rows: minmax(52px, auto);
    height: auto;
  }
  body.dashboard-body .v2-board .panel-people .rank-row { min-height: 52px; }
}

@media (max-width: 620px) {
  body.dashboard-body .v2-board .panel-people .rank-list {
    grid-template-columns: 1fr;
    grid-auto-rows: minmax(50px, auto);
  }
  body.dashboard-body .v2-board .panel-people .rank-who span { display: none; }
}

@media (max-width: 620px) {
  body.dashboard-body .kpi-grid { gap: 10px; }
  body.dashboard-body .kpi { min-height: 0; padding: 16px 18px 15px; }
  body.dashboard-body .kpi-label { font-size: 12.5px; }
  body.dashboard-body .kpi-value { font-size: 46px; margin: 6px 0; }
  body.dashboard-body .kpi-value small { font-size: 13px; }
  body.dashboard-body .kpi-foot { font-size: 12px; }
}

@media (max-width: 560px) {
  body.dashboard-body .v2-board .panel-people .rank-row {
    grid-template-columns: 24px minmax(0, 1fr) 48px 54px;
    gap: 6px;
    padding: 6px 8px;
    min-height: 50px;
  }
}


/* ============================================================
   看板动效增强：入场、数字、卡片、榜单与光效
   ============================================================ */

@keyframes kpiRise {
  from { opacity: 0; transform: translateY(16px) scale(0.975); }
  to { opacity: 1; transform: none; }
}
@keyframes kpiNumberIn {
  0% { opacity: 0; transform: translateY(6px) scale(0.92); }
  60% { opacity: 1; transform: translateY(0) scale(1.025); }
  100% { opacity: 1; transform: none; }
}
@keyframes groupRise {
  from { opacity: 0; transform: translateY(18px) scale(0.985); }
  to { opacity: 1; transform: none; }
}
@keyframes championBadge {
  0%, 100% { box-shadow: 0 0 0 0 rgba(242, 198, 109, 0); }
  50% { box-shadow: 0 0 0 5px rgba(242, 198, 109, 0.08), 0 0 18px rgba(242, 198, 109, 0.18); }
}
@keyframes barShine {
  0%, 62% { transform: translateX(-120%); }
  88%, 100% { transform: translateX(120%); }
}
@keyframes headLine {
  from { transform: scaleX(0); opacity: 0; }
  to { transform: scaleX(1); opacity: 1; }
}

/* KPI 入场、数字弹入、单次扫光 */
body.dashboard-body .kpi {
  animation: kpiRise 0.62s cubic-bezier(0.2, 0.8, 0.2, 1) backwards !important;
}
body.dashboard-body .kpi:nth-child(2) { animation-delay: 0.09s !important; }
body.dashboard-body .kpi-value {
  animation: kpiNumberIn 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) 0.12s backwards;
}
/* 双组卡片入场与悬停 */
body.dashboard-body .v2-group {
  animation: groupRise 0.58s cubic-bezier(0.2, 0.8, 0.2, 1) backwards;
  transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease;
}
body.dashboard-body .v2-group:nth-child(2) { animation-delay: 0.1s; }
body.dashboard-body .v2-group:hover {
  transform: translateY(-3px);
  border-color: rgba(var(--accent-rgb), 0.28);
  box-shadow: 0 18px 36px -30px rgba(10, 30, 60, 0.65);
}
body.dashboard-body .v2g-rank.is-champion {
  animation: championBadge 3.2s ease-in-out infinite;
}
body.dashboard-body .v2g-bar i {
  position: relative;
  overflow: hidden;
}
body.dashboard-body .v2g-bar i::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
  transform: translateX(-120%);
  animation: barShine 4s ease-in-out infinite;
}

/* 榜单逐行入场后保留悬停位移 */
body.dashboard-body .rank-row {
  animation: rowIn 0.38s ease backwards;
  transition: background 0.2s ease, transform 0.2s ease;
}
body.dashboard-body .rank-row:hover { transform: translateX(3px); }

/* 面板标题下划线展开、面板悬停 */
body.dashboard-body .board .panel {
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
body.dashboard-body .board .panel:hover {
  border-color: rgba(var(--accent-rgb), 0.22);
  box-shadow: 0 22px 50px -42px rgba(10, 30, 60, 0.6);
}
body.dashboard-body .board .panel-head h2 {
  position: relative;
  padding-bottom: 3px;
}
body.dashboard-body .board .panel-head h2::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, var(--accent), transparent);
  transform-origin: left center;
  animation: headLine 0.8s 0.25s ease-out both;
}

/* 手动关闭动效时，连 !important 的 KPI 入场也停止 */
html.motion-off body.dashboard-body .kpi,
html.motion-off body.dashboard-body .kpi::after,
html.motion-off body.dashboard-body .kpi-value {
  animation: none !important;
}
@media (prefers-reduced-motion: reduce) {
  html body.dashboard-body .kpi,
  html body.dashboard-body .kpi::after,
  html body.dashboard-body .kpi-value,
  html body.dashboard-body .v2-group,
  html body.dashboard-body .v2g-bar i::after,
  html body.dashboard-body .v2g-rank.is-champion,
  html body.dashboard-body .rank-row,
  html body.dashboard-body .board .panel-head h2::after {
    animation: none !important;
  }
}

/* ============================================================
   常驻展示动效：环境光、指标流光、标题呼吸点、数字呼吸
   ============================================================ */

.aurora {
  position: fixed;
  inset: -12%;
  z-index: 0;
  pointer-events: none;
  opacity: 0.85;
  background:
    radial-gradient(closest-side, rgba(79, 141, 255, 0.15), transparent 72%) 8% 18% / 46% 46% no-repeat,
    radial-gradient(closest-side, rgba(58, 217, 242, 0.10), transparent 72%) 88% 28% / 42% 42% no-repeat,
    radial-gradient(closest-side, rgba(120, 96, 255, 0.08), transparent 72%) 52% 96% / 52% 52% no-repeat;
  animation: auroraDrift 26s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes auroraDrift {
  0% { transform: translate3d(-1%, 0, 0) scale(1); }
  100% { transform: translate3d(2%, -1.5%, 0) scale(1.06); }
}
html[data-theme="light"] .aurora { opacity: 0.6; }

/* KPI 顶部流动光带 */
body.dashboard-body .kpi::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 16%;
  right: 16%;
  height: 2px;
  opacity: 0.8;
  background: linear-gradient(90deg, transparent, rgba(79, 141, 255, 0.85), rgba(58, 217, 242, 0.55), transparent);
  background-size: 220% 100%;
  animation: kpiEdge 5.6s linear infinite;
  pointer-events: none;
}
body.dashboard-body .kpi:nth-child(2)::before { animation-delay: 2.2s; }
@keyframes kpiEdge {
  from { background-position: 200% 0; }
  to { background-position: -200% 0; }
}

/* 面板标题呼吸点 */
body.dashboard-body .board .panel-head h2::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  flex: none;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(var(--accent-rgb), 0.09), 0 0 14px rgba(var(--accent-rgb), 0.4);
  animation: panelDot 3.2s ease-in-out infinite;
}
@keyframes panelDot {
  0%, 100% { transform: scale(1); opacity: 0.75; }
  50% { transform: scale(1.45); opacity: 1; }
}

/* 组别大数字呼吸 */
body.dashboard-body .v2g-main b {
  transform-origin: left bottom;
  animation: groupNumberBreathe 4.8s ease-in-out infinite;
}
@keyframes groupNumberBreathe {
  0%, 100% { transform: scale(1); text-shadow: 0 0 0 rgba(255, 255, 255, 0); }
  50% { transform: scale(1.025); text-shadow: 0 0 18px rgba(255, 255, 255, 0.08); }
}

/* 面板顶部扫描线加强 */
body.dashboard-body .board .panel::after {
  height: 2px;
  width: 32%;
  opacity: 0.78;
  animation-duration: 8s;
}

html.motion-off .aurora,
html.motion-off body.dashboard-body .kpi::before,
html.motion-off body.dashboard-body .board .panel-head h2::before,
html.motion-off body.dashboard-body .v2g-main b,
html.motion-off body.dashboard-body .board .panel::after {
  animation: none !important;
}
@media (prefers-reduced-motion: reduce) {
  html body.dashboard-body .aurora,
  html body.dashboard-body .kpi::before,
  html body.dashboard-body .board .panel-head h2::before,
  html body.dashboard-body .v2g-main b,
  html body.dashboard-body .board .panel::after {
    animation: none !important;
  }
}
