/* 数字大屏：高级通透蓝黑科技驾驶舱 */
#digital-display-screen.dds-root {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  color: #eaf6ff;
  background: linear-gradient(180deg, #1A3558 0%, #132A48 42%, #0E213A 100%) !important;
  font-family: "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
  box-sizing: border-box;
}
#digital-display-screen.dds-root:fullscreen,
#digital-display-screen.dds-root:-webkit-full-screen,
#digital-display-screen.dds-root:-moz-full-screen,
#digital-display-screen.dds-root:-ms-fullscreen {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  margin: 0 !important;
  background: linear-gradient(180deg, #1A3558 0%, #132A48 42%, #0E213A 100%);
}
#digital-display-screen .dds-scale-viewport {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
#digital-display-screen .dds-scale-stage {
  position: relative;
  flex-shrink: 0;
  will-change: transform;
  overflow: hidden;
}
#digital-display-screen *,
#digital-display-screen *::before,
#digital-display-screen *::after {
  box-sizing: border-box;
}
#digital-display-screen .dds-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}
#digital-display-screen .dds-bg .bg-base {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 42% at 50% -8%, rgba(80, 170, 240, 0.1), transparent 60%),
    linear-gradient(180deg, #1B375C 0%, #152E4C 48%, #0F2440 100%);
}
/* 粒子科技氛围层：光晕 / 扫描线 / 光束 / 节点 / 粒子 / 上升微光 */
#digital-display-screen .dds-bg .bg-aurora {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
#digital-display-screen .dds-bg .bg-aurora .orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(48px);
  opacity: 0.22;
  will-change: transform, opacity;
  animation-name: ddsAuroraDrift;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}
#digital-display-screen .dds-bg .bg-aurora .o1 {
  width: 42vw;
  height: 42vw;
  left: -8%;
  top: 8%;
  background: radial-gradient(circle, rgba(70, 180, 255, 0.45) 0%, rgba(70, 180, 255, 0) 70%);
  animation-duration: 22s;
  animation-delay: 0s;
}
#digital-display-screen .dds-bg .bg-aurora .o2 {
  width: 36vw;
  height: 36vw;
  right: -6%;
  top: 28%;
  background: radial-gradient(circle, rgba(120, 150, 255, 0.38) 0%, rgba(120, 150, 255, 0) 70%);
  animation-duration: 28s;
  animation-delay: -6s;
  opacity: 0.18;
}
#digital-display-screen .dds-bg .bg-aurora .o3 {
  width: 30vw;
  height: 30vw;
  left: 28%;
  bottom: -10%;
  background: radial-gradient(circle, rgba(80, 230, 210, 0.32) 0%, rgba(70, 200, 220, 0) 70%);
  animation-duration: 26s;
  animation-delay: -12s;
  opacity: 0.16;
}
#digital-display-screen .dds-bg .bg-aurora .o4 {
  width: 24vw;
  height: 24vw;
  right: 18%;
  bottom: 12%;
  background: radial-gradient(circle, rgba(100, 200, 255, 0.34) 0%, rgba(100, 200, 255, 0) 70%);
  animation-duration: 20s;
  animation-delay: -3s;
  opacity: 0.2;
}
#digital-display-screen .dds-bg .bg-nodes {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
#digital-display-screen .dds-bg .bg-nodes .node {
  position: absolute;
  width: 5px;
  height: 5px;
  margin: -2px 0 0 -2px;
  border-radius: 50%;
  background: rgba(140, 220, 255, 0.55);
  box-shadow: 0 0 8px rgba(100, 210, 255, 0.35);
  opacity: 0.35;
  animation-name: ddsNodePulse;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}
#digital-display-screen .dds-bg .bg-nodes .node::after {
  content: '';
  position: absolute;
  inset: -5px;
  border: 1px solid rgba(130, 210, 255, 0.28);
  border-radius: 50%;
  opacity: 0.5;
}
#digital-display-screen .dds-bg .bg-particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
#digital-display-screen .dds-bg .bg-particles i {
  position: absolute;
  border-radius: 50%;
  background: rgba(190, 230, 255, 0.55);
  opacity: 0.28;
  animation-name: ddsParticleDrift, ddsParticleTwinkle;
  animation-timing-function: ease-in-out, ease-in-out;
  animation-iteration-count: infinite, infinite;
}
#digital-display-screen .dds-bg .bg-particles i.sz-0 {
  width: 2px;
  height: 2px;
}
#digital-display-screen .dds-bg .bg-particles i.sz-1 {
  width: 2.5px;
  height: 2.5px;
  opacity: 0.32;
}
#digital-display-screen .dds-bg .bg-particles i.sz-2 {
  width: 3px;
  height: 3px;
  opacity: 0.36;
  box-shadow: 0 0 5px rgba(130, 220, 255, 0.3);
}
#digital-display-screen .dds-bg .bg-particles-header {
  z-index: 1;
}
#digital-display-screen .dds-bg .bg-particles-header i {
  opacity: 0.42;
}
#digital-display-screen .dds-bg .bg-particles-header i.sz-0 {
  width: 2px;
  height: 2px;
}
#digital-display-screen .dds-bg .bg-particles-header i.sz-1 {
  width: 2.5px;
  height: 2.5px;
  opacity: 0.48;
}
#digital-display-screen .dds-bg .bg-particles-header i.sz-2 {
  width: 3.5px;
  height: 3.5px;
  opacity: 0.52;
  box-shadow: 0 0 8px rgba(150, 230, 255, 0.4);
}
#digital-display-screen .dds-bg .bg-particles-pies {
  z-index: 1;
}
#digital-display-screen .dds-bg .bg-particles-pies i {
  opacity: 0.4;
}
#digital-display-screen .dds-bg .bg-particles-pies i.sz-0 {
  width: 2px;
  height: 2px;
}
#digital-display-screen .dds-bg .bg-particles-pies i.sz-1 {
  width: 2.5px;
  height: 2.5px;
  opacity: 0.46;
}
#digital-display-screen .dds-bg .bg-particles-pies i.sz-2 {
  width: 3.5px;
  height: 3.5px;
  opacity: 0.5;
  box-shadow: 0 0 7px rgba(140, 220, 255, 0.38);
}
#digital-display-screen .dds-inner {
  position: relative;
  z-index: 1;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 12px 16px 14px;
  overflow: hidden;
  --dds-design-h: 1080px;
  --dds-inner-pad: 26px;
  --dds-top-chrome: 108px;
  --dds-rank-h: 450px;
  --dds-trend-row-h: 310px;
  --dds-section-gap: 12px;
  --dds-first-screen-h: calc(var(--dds-design-h) - var(--dds-top-chrome) - var(--dds-inner-pad));
}
#digital-display-screen .dds-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  flex-shrink: 0;
  padding: 6px 4px 10px;
  border-bottom: 1px solid rgba(120, 200, 255, 0.18);
  position: relative;
}
#digital-display-screen .dds-header::after {
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(140, 230, 255, 0.55), rgba(180, 150, 255, 0.35), transparent);
  box-shadow: 0 0 10px rgba(100, 210, 255, 0.35);
  /* animation: ddsBreath 4.8s ease-in-out infinite; */
}
#digital-display-screen .dds-header .header-deco {
  width: 88px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
#digital-display-screen .dds-header .header-deco .deco-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(120, 220, 255, 0.75));
}
#digital-display-screen .dds-header .header-deco.right .deco-line {
  background: linear-gradient(90deg, rgba(120, 220, 255, 0.75), transparent);
}
#digital-display-screen .dds-header .pulse-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #5ef0ff;
  box-shadow: 0 0 10px rgba(94, 240, 255, 0.85);
  /* animation: ddsPulseDot 2.2s ease-in-out infinite; */
  flex-shrink: 0;
}
#digital-display-screen .dds-header .header-deco.right .pulse-dot {
  background: #c4a8ff;
  box-shadow: 0 0 10px rgba(180, 150, 255, 0.8);
  /* animation-delay: 1.1s; */
}
#digital-display-screen .dds-header .header-main {
  flex: 1;
  text-align: center;
  min-width: 0;
}
#digital-display-screen .dds-header .title-with-lights {
  margin: 0;
  display: inline-flex;
  justify-content: center;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 0 0.12em;
  font-size: 28px;
  font-weight: 800;
  color: #f5fbff;
  text-shadow: 0 0 18px rgba(100, 210, 255, 0.4), 0 0 36px rgba(140, 140, 255, 0.18);
}
#digital-display-screen .dds-header .title-char {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
}
#digital-display-screen .dds-header .title-char em {
  font-style: normal;
  line-height: 1.1;
}
#digital-display-screen .dds-header .title-light {
  display: block;
  width: 14px;
  height: 2px;
  margin-bottom: 5px;
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(120, 220, 255, 0.25), #8ae8ff, rgba(180, 150, 255, 0.4));
  box-shadow: 0 0 8px rgba(120, 220, 255, 0.55), 0 0 14px rgba(140, 180, 255, 0.28);
  animation: ddsTitleLightPulse 2.8s ease-in-out infinite;
}
#digital-display-screen .dds-header .title-divider {
  display: flex;
  justify-content: center;
  margin: 6px auto 0;
}
#digital-display-screen .dds-header .title-divider span {
  width: 160px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(140, 230, 255, 0.7), rgba(190, 160, 255, 0.45), transparent);
}
#digital-display-screen .dds-header .header-sub {
  margin: 6px 0 0;
  font-size: 12px;
  color: #9ec8e8;
  letter-spacing: 0.04em;
}
#digital-display-screen .dds-header .header-right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  margin-right: 20px;
}
#digital-display-screen .dds-header .header-action-btn {
  padding: 6px 14px;
  border: 1px solid rgba(120, 220, 255, 0.45);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(50, 120, 180, 0.4), rgba(40, 70, 130, 0.35));
  font-size: 15px;
  font-weight: 700;
  color: #f0faff;
  cursor: pointer;
  outline: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: all 0.2s ease;
  flex-shrink: 0;
  margin: 0;
  line-height: 1.2;
  white-space: nowrap;
  font-family: "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  box-shadow: inset 0 1px 0 rgba(220, 250, 255, 0.22), 0 0 14px rgba(80, 200, 255, 0.18);
  backdrop-filter: blur(8px);
}
#digital-display-screen .dds-header .header-action-btn i { font-size: 14px;
}
#digital-display-screen .dds-header .header-action-btn i.is-loading {
  animation: ddsRefreshSpin 0.8s linear infinite;
}
#digital-display-screen .dds-header .header-action-btn:hover:not(:disabled) {
  border-color: rgba(160, 240, 255, 0.7);
  color: #ffffff;
  box-shadow: 0 0 18px rgba(90, 220, 255, 0.32), inset 0 1px 0 rgba(230, 250, 255, 0.3);
}
#digital-display-screen .dds-header .header-action-btn:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}
#digital-display-screen .dds-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow: hidden;
  padding-right: 2px;
}
#digital-display-screen .dds-screen-main {
  flex: 1;
  min-height: 0;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: var(--dds-section-gap);
  padding-bottom: 0;
}
#digital-display-screen .dds-screen-first {
  flex: 1;
  min-height: 0;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: var(--dds-section-gap);
}
#digital-display-screen .row-rank {
  flex: 450 1 0;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
#digital-display-screen .row-rank .panel-table {
  flex: 1;
  height: 100%;
  min-height: 0;
  max-height: none;
  overflow: hidden;
}
#digital-display-screen .row-bottom {
  flex: 310 1 0;
  height: auto;
  min-height: 0;
  max-height: none;
  min-width: 0;
  display: grid;
  grid-template-columns: 26fr 37fr 37fr;
  gap: 12px;
}
#digital-display-screen .dds-body::-webkit-scrollbar { width: 6px;
}
#digital-display-screen .dds-body::-webkit-scrollbar-thumb {
  background: rgba(120, 200, 255, 0.35);
  border-radius: 4px;
}
#digital-display-screen .row-rank .table-stack {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
#digital-display-screen .row-rank .table-wrap.hxg-table-wrap {
  flex: 1;
  min-height: 0;
  overflow-x: auto;
  overflow-y: auto;
}
#digital-display-screen .row-rank .table-head-freeze {
  overflow: hidden;
}
#digital-display-screen .row-bottom .panel-trend,
#digital-display-screen .row-bottom .panel-map {
  flex: 1;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
#digital-display-screen .row-bottom .panel-pies {
  flex: 0.95;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
#digital-display-screen .pie-col {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
#digital-display-screen .panel {
  position: relative;
  border-radius: 14px;
  /* 默认采用原 hover 边框/光晕样式 */
  background: linear-gradient(
    150deg,
    rgba(80, 155, 220, 0.012) 0%,
    rgba(48, 100, 165, 0.006) 40%,
    rgba(70, 85, 160, 0.01) 100%
  );
  border: 1px solid rgba(170, 245, 255, 0.7);
  box-shadow:
    0 0 0 1px rgba(180, 160, 255, 0.12),
    0 0 26px rgba(80, 220, 255, 0.16),
    0 0 40px rgba(150, 120, 255, 0.08),
    inset 0 1px 0 rgba(240, 252, 255, 0.14);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  isolation: isolate;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
  /* 边框呼吸先关掉
  animation: ddsPanelBreath 4.2s ease-in-out infinite;
  */
}
#digital-display-screen .panel.enter-up {
  /* 入场动画先关，便于看静态效果
  animation: ddsEnterUp 0.75s cubic-bezier(0.22, 0.8, 0.28, 1) both;
  */
}
#digital-display-screen .enter-up {
  /* animation: ddsEnterUp 0.75s cubic-bezier(0.22, 0.8, 0.28, 1) both; */
}
/* 单卡关闭扫光/呼吸（全局已关，暂留备用）
#digital-display-screen .panel.no-bg-fx {
  animation: ddsEnterUp 0.75s cubic-bezier(0.22, 0.8, 0.28, 1) both;
}
#digital-display-screen .panel.no-bg-fx::after {
  display: none;
}
#digital-display-screen .panel.no-bg-fx::before {
  animation: none;
  opacity: 0.7;
}
*/
#digital-display-screen .panel-table {
  border-color: rgba(170, 245, 255, 0.72);
  box-shadow:
    0 0 0 1px rgba(180, 160, 255, 0.18),
    0 0 26px rgba(80, 220, 255, 0.22),
    0 0 40px rgba(150, 120, 255, 0.12),
    inset 0 1px 0 rgba(240, 252, 255, 0.32);
  min-width: 0;
  padding: 6px 6px;
}
#digital-display-screen .panel-table .panel-head {
  margin-bottom: 4px;
  gap: 6px;
}
#digital-display-screen .panel-table .panel-head h2 {
  font-size: 14px;
  letter-spacing: 0.02em;
  margin: 0 0 0 8px;
}
#digital-display-screen .panel-table .head-actions {
  gap: 6px;
}
#digital-display-screen .panel-table .search-box input {
  width: 120px;
  padding: 0 44px 0 8px;
}
#digital-display-screen .panel-table .more-btn {
  padding: 0 8px;
}
#digital-display-screen .panel-pies { border-color: rgba(185, 200, 255, 0.72);
}
/* hover：更艳亮的青蓝边框与光晕 */
#digital-display-screen .panel:hover {
  border-color: rgba(90, 255, 255, 0.95);
  background: linear-gradient(
    150deg,
    rgba(90, 190, 255, 0.03) 0%,
    rgba(55, 130, 210, 0.018) 40%,
    rgba(100, 120, 220, 0.022) 100%
  );
  box-shadow:
    0 0 0 1px rgba(160, 255, 255, 0.22),
    0 0 18px rgba(60, 255, 250, 0.28),
    0 0 36px rgba(80, 220, 255, 0.22),
    0 0 52px rgba(140, 160, 255, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}
#digital-display-screen .panel > * { position: relative; z-index: 2;
}
/* 顶部高光线：保留静态，呼吸动画先关 */
#digital-display-screen .panel::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(180, 245, 255, 0.9), rgba(190, 170, 255, 0.55), transparent);
  opacity: 0.7;
  /* animation: ddsBreath 4.5s ease-in-out infinite; */
  z-index: 5;
  pointer-events: none;
  box-shadow: 0 0 14px rgba(120, 230, 255, 0.45);
}
/* 卡片扫光先关掉
#digital-display-screen .panel::after {
  content: "";
  position: absolute;
  left: -42%;
  top: 0;
  width: 42%;
  height: 100%;
  background: linear-gradient(
    108deg,
    transparent 0%,
    rgba(150, 230, 255, 0.01) 36%,
    rgba(200, 245, 255, 0.16) 50%,
    rgba(170, 160, 255, 0.08) 58%,
    transparent 100%
  );
  animation: ddsPanelSweep 4.8s ease-in-out infinite;
  pointer-events: none;
  z-index: 4;
  mix-blend-mode: screen;
}
#digital-display-screen .panel-map::after { animation-delay: 0.2s; }
#digital-display-screen .panel-trend::after { animation-delay: 1.0s; }
#digital-display-screen .panel-table:nth-of-type(1)::after { animation-delay: 0.5s; }
#digital-display-screen .panel-table:nth-of-type(2)::after { animation-delay: 1.6s; }
#digital-display-screen .panel-pies::after { animation-delay: 2.2s; }
*/
#digital-display-screen .enter-up { /* animation: ddsEnterUp 0.75s cubic-bezier(0.22, 0.8, 0.28, 1) both; */
}
#digital-display-screen .chart-box {
  position: relative;
  flex: 1;
  min-height: 120px;
  width: 100%;
}
#digital-display-screen .chart-box::after {
  content: "";
  position: absolute;
  inset: 10% 12%;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(100, 200, 255, 0.03), transparent 70%);
  pointer-events: none;
  z-index: 0;
  /* animation: ddsChartHalo 4.8s ease-in-out infinite; */
}
#digital-display-screen .chart-box > canvas,
#digital-display-screen .chart-box > div {
  position: relative;
  z-index: 1;
}
#digital-display-screen .panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
  flex-shrink: 0;
}
#digital-display-screen .panel-head h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  color: #f2faff;
  letter-spacing: 0.04em;
  white-space: nowrap;
  text-shadow:
    0 1px 2px rgba(6, 20, 40, 0.65),
    0 0 12px rgba(120, 210, 255, 0.35);
}
#digital-display-screen .panel-head .legend {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: #ffffff;
}
#digital-display-screen .panel-head .legend .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  margin-right: 4px;
}
#digital-display-screen .panel-head .legend .dot.hxg {
  background: #3dff9a;
  box-shadow: 0 0 6px rgba(61, 255, 154, 0.7);
}
#digital-display-screen .panel-head .legend .dot.skl {
  background: #4cc9ff;
  box-shadow: 0 0 6px rgba(76, 201, 255, 0.7);
}
#digital-display-screen .head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
#digital-display-screen .search-box { position: relative;
}
#digital-display-screen .search-box input {
  height: 28px;
  width: 148px;
  border-radius: 6px;
  border: 1px solid rgba(120, 210, 255, 0.28);
  background: linear-gradient(180deg, rgba(18, 48, 88, 0.55), rgba(12, 36, 68, 0.42));
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #e8f6ff;
  padding: 0 48px 0 10px;
  font-size: 12px;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(200, 240, 255, 0.12);
}
#digital-display-screen .search-box input::-moz-placeholder { color: rgba(150, 190, 220, 0.72);
}
#digital-display-screen .search-box input::placeholder { color: rgba(150, 190, 220, 0.72);
}
#digital-display-screen .search-box input:focus {
  border-color: rgba(110, 220, 255, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(220, 250, 255, 0.14),
    0 0 0 1px rgba(100, 210, 255, 0.22),
    0 0 10px rgba(80, 190, 255, 0.18);
}
#digital-display-screen .search-box i {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #8ec8e8;
  font-size: 13px;
  cursor: pointer;
  pointer-events: auto;
}
#digital-display-screen .search-box .search-submit {
  right: 8px;
}
#digital-display-screen .search-box .search-clear {
  right: 28px;
  font-size: 12px;
  color: rgba(160, 200, 230, 0.85);
}
#digital-display-screen .search-box i:hover {
  color: #c8f0ff;
}
#digital-display-screen .search-box .search-clear:hover {
  color: #ffffff;
}
#digital-display-screen .more-btn {
  height: 28px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid rgba(120, 210, 255, 0.32);
  background: linear-gradient(180deg, rgba(24, 70, 120, 0.5), rgba(14, 48, 90, 0.4));
  color: #b8e6ff;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  cursor: pointer;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(200, 240, 255, 0.1);
}
#digital-display-screen .more-btn:hover {
  color: #e8f9ff;
  border-color: rgba(130, 230, 255, 0.55);
  background: linear-gradient(180deg, rgba(36, 100, 160, 0.62), rgba(20, 70, 120, 0.5));
  box-shadow:
    inset 0 1px 0 rgba(220, 250, 255, 0.14),
    0 0 10px rgba(80, 190, 255, 0.16);
}
#digital-display-screen .more-btn:active {
  background: linear-gradient(180deg, rgba(18, 60, 110, 0.55), rgba(12, 42, 80, 0.48));
}
#digital-display-screen .store-filter {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: #c8e8ff;
  padding: 2px 8px;
  border-radius: 8px;
  border: 1px solid rgba(130, 200, 255, 0.35);
  background: rgba(40, 90, 140, 0.35);
}
#digital-display-screen .map-box { min-height: 110px;
}
#digital-display-screen .trend-chart { min-height: 110px;
}
#digital-display-screen .pie-chart { min-height: 180px;
}
#digital-display-screen .table-stack {
  flex: 1;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#digital-display-screen .table-head-freeze {
  flex-shrink: 0;
  overflow: hidden;
  position: relative;
  z-index: 3;
  background: rgba(14, 40, 72, 0.42);
  box-sizing: border-box;
}
#digital-display-screen .table-wrap {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
}
#digital-display-screen .table-wrap::-webkit-scrollbar { width: 4px; height: 4px;
}
#digital-display-screen .table-wrap::-webkit-scrollbar-thumb {
  background: rgba(120, 200, 255, 0.4);
  border-radius: 4px;
}
#digital-display-screen .rank-table {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 13px;
  border: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#digital-display-screen .rank-table th,
#digital-display-screen .rank-table td {
  margin: 0;
  padding: 0;
  text-align: center;
  white-space: nowrap;
  border: none;
  box-sizing: border-box;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.45;
}
#digital-display-screen .rank-table td.col-core,
#digital-display-screen .rank-table td.col-soft {
  overflow: hidden;
  text-overflow: ellipsis;
}
#digital-display-screen .rank-table .col-store,
#digital-display-screen .rank-table .store-cell {
  padding: 9px 4px 9px 8px;
  overflow: visible;
  text-overflow: clip;
}
#digital-display-screen .rank-table .main-head th.col-store {
  text-align: center;
  padding: 7px 4px;
}
#digital-display-screen .rank-table .store-cell {
  text-align: left;
}
#digital-display-screen .rank-table .col-room,
#digital-display-screen .rank-table th.col-room {
  width: 4.2%;
  max-width: 4.2%;
  padding-left: 2px;
  padding-right: 2px;
  text-align: center;
  white-space: nowrap;
}
#digital-display-screen .rank-table .main-head th.col-metric {
  padding: 7px 0;
  letter-spacing: 0;
}
#digital-display-screen .rank-table .sub-head th {
  padding: 6px 0;
}
#digital-display-screen .rank-table td.col-core,
#digital-display-screen .rank-table td.col-soft {
  padding: 8px 0;
}
#digital-display-screen .rank-table td.col-month-history,
#digital-display-screen .rank-table .sub-head th.col-month-history {
  padding-left: 8px;
  padding-right: 8px;
}
#digital-display-screen .rank-table .sub-head th.col-month-history {
  padding-top: 6px;
  padding-bottom: 6px;
}
#digital-display-screen .rank-table td.col-month-history {
  padding-top: 8px;
  padding-bottom: 8px;
}
/* 仅在指标板块交界处保留竖向分割线（如现金业绩当月 | 客流总量历史月） */
#digital-display-screen .rank-table .col-group-end {
  border-right: 1px solid rgba(130, 210, 245, 0.28) !important;
}
#digital-display-screen .rank-table thead th {
  border: none !important;
  border-right: none !important;
  box-shadow: none;
  text-shadow: none;
}
#digital-display-screen .rank-table .main-head th.col-group-end,
#digital-display-screen .rank-table .sub-head th.col-group-end {
  border-right: 1px solid rgba(130, 210, 245, 0.28) !important;
}
#digital-display-screen .rank-table .main-head th {
  color: #9ad8f5;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  background: linear-gradient(180deg, rgba(40, 100, 170, 0.22), rgba(20, 60, 120, 0.1));
  text-shadow: 0 1px 2px rgba(4, 20, 40, 0.45);
}
#digital-display-screen .rank-table .main-head .col-store,
#digital-display-screen .rank-table .main-head .col-metric {
  color: #9ad8f5;
}
#digital-display-screen .rank-table .main-head th.is-sortable {
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  text-align: center;
}
#digital-display-screen .rank-table .main-head th.is-sortable .rank-sort-head {
  width: 120px;
  min-width: 120px;
  max-width: 120px;
  height: 26px;
  min-height: 26px;
  box-sizing: border-box;
}
#digital-display-screen .rank-table .main-head th.is-sortable .rank-sort-label {
  width: 100%;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}
#digital-display-screen .rank-table .rank-sort-head {
  --rank-sort-scan-duration: 5.2s;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  min-width: 120px;
  max-width: 120px;
  height: 26px;
  min-height: 26px;
  box-sizing: border-box;
  white-space: nowrap;
  padding: 4px 10px;
  border-radius: 8px;
  border: 1px solid transparent;
  color: rgba(210, 228, 245, 0.72);
  overflow: hidden;
  isolation: isolate;
  background-size: 100% 100%, 260% 260%;
  animation: ddsRankSortBorderFlow 9s linear infinite;
  transition:
    box-shadow 0.25s ease,
    filter 0.25s ease,
    background 0.25s ease,
    color 0.25s ease;
}
#digital-display-screen .rank-table .rank-sort-btn-bg,
#digital-display-screen .rank-table .rank-sort-btn-scan {
  position: absolute;
  pointer-events: none;
}
#digital-display-screen .rank-table .rank-sort-btn-bg {
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), transparent 50%);
  z-index: 0;
  opacity: 0.55;
}
#digital-display-screen .rank-table .rank-sort-btn-scan {
  top: -20%;
  left: -45%;
  width: 36%;
  height: 140%;
  background: linear-gradient(
    105deg,
    transparent 0%,
    rgba(255, 255, 255, 0.015) 38%,
    rgba(160, 230, 255, 0.1) 50%,
    rgba(255, 255, 255, 0.02) 62%,
    transparent 100%
  );
  transform: skewX(-22deg);
  opacity: 0.6;
  z-index: 1;
  animation: ddsRankSortScanSweep var(--rank-sort-scan-duration) linear infinite;
}
#digital-display-screen .rank-table .rank-sort-label {
  position: relative;
  z-index: 2;
  width: 100%;
  padding: 0 14px;
  box-sizing: border-box;
  line-height: 1.2;
  font-weight: 600;
  text-align: center;
  color: inherit;
  text-shadow: none;
}
#digital-display-screen .rank-table .rank-sort-dir {
  position: absolute;
  right: 8px;
  top: 50%;
  z-index: 2;
  display: inline-block;
  width: 12px;
  min-width: 12px;
  font-size: 12px;
  font-weight: 700;
  color: inherit;
  line-height: 1;
  text-align: center;
  opacity: 0.9;
  text-shadow: none;
  transform: translateY(-50%);
}
#digital-display-screen .rank-table .rank-sort-head:not(.is-active) .rank-sort-dir {
  visibility: hidden;
}
#digital-display-screen .rank-table .rank-sort-head:not(.is-active) {
  color: rgba(210, 228, 245, 0.85);
  background:
    linear-gradient(165deg, rgba(14, 40, 70, 0.62), rgba(6, 20, 40, 0.78)) padding-box,
    linear-gradient(
      125deg,
      rgba(0, 210, 240, 0.55) 0%,
      rgba(90, 130, 220, 0.45) 40%,
      rgba(140, 90, 200, 0.42) 70%,
      rgba(0, 200, 230, 0.5) 100%
    ) border-box;
  box-shadow:
    inset 0 1px 0 rgba(180, 235, 255, 0.12),
    inset 0 -3px 10px rgba(0, 0, 0, 0.3),
    0 0 10px rgba(0, 190, 240, 0.22);
}
#digital-display-screen .rank-table .main-head th.is-sortable:hover .rank-sort-head:not(.is-active) {
  --rank-sort-scan-duration: 2.4s;
  filter: brightness(1.05);
}
#digital-display-screen .rank-table .main-head th.is-sortable:hover .rank-sort-head:not(.is-active) .rank-sort-btn-scan {
  opacity: 0.72;
}
#digital-display-screen .rank-table .main-head th.is-sortable:active .rank-sort-head:not(.is-active) {
  filter: brightness(0.96);
  box-shadow:
    inset 0 2px 8px rgba(0, 0, 0, 0.42),
    0 0 4px rgba(0, 160, 220, 0.1);
}
#digital-display-screen .rank-table .main-head th.is-sortable:active .rank-sort-head:not(.is-active) .rank-sort-btn-scan {
  opacity: 0.2;
  animation-play-state: paused;
}
#digital-display-screen .rank-table .rank-sort-head.is-active {
  --rank-sort-scan-duration: 3.4s;
  color: #ffffff;
  background:
    linear-gradient(
      155deg,
      rgba(18, 150, 190, 0.92) 0%,
      rgba(12, 95, 165, 0.94) 42%,
      rgba(28, 70, 150, 0.95) 100%
    ) padding-box,
    linear-gradient(
      125deg,
      rgba(120, 255, 255, 1) 0%,
      rgba(90, 190, 255, 1) 28%,
      rgba(190, 130, 255, 1) 55%,
      rgba(70, 255, 220, 1) 78%,
      rgba(80, 240, 255, 1) 100%
    ) border-box;
  background-size: 100% 100%, 260% 260%;
  filter: none;
  box-shadow:
    inset 0 1px 0 rgba(230, 255, 255, 0.28),
    inset 0 0 22px rgba(80, 230, 255, 0.2),
    inset 0 -3px 12px rgba(0, 20, 50, 0.35),
    0 0 12px rgba(0, 220, 255, 0.42),
    0 0 26px rgba(70, 160, 255, 0.28);
}
#digital-display-screen .rank-table .rank-sort-head.is-active .rank-sort-btn-bg {
  opacity: 1;
  background:
    radial-gradient(85% 110% at 50% 45%, rgba(100, 240, 255, 0.28), transparent 70%),
    linear-gradient(180deg, rgba(200, 250, 255, 0.14), transparent 55%);
}
#digital-display-screen .rank-table .rank-sort-head.is-active .rank-sort-btn-scan {
  opacity: 0.78;
  background: linear-gradient(
    105deg,
    transparent 0%,
    rgba(255, 255, 255, 0.04) 36%,
    rgba(200, 255, 255, 0.32) 50%,
    rgba(255, 255, 255, 0.04) 64%,
    transparent 100%
  );
  animation: ddsRankSortScanSweep var(--rank-sort-scan-duration) linear infinite;
  animation-play-state: running;
}
#digital-display-screen .rank-table .rank-sort-head.is-active .rank-sort-label,
#digital-display-screen .rank-table .rank-sort-head.is-active .rank-sort-dir {
  color: #ffffff;
  font-weight: 700;
  text-shadow:
    0 0 1px rgba(255, 255, 255, 0.85),
    0 0 12px rgba(190, 250, 255, 0.55);
}
#digital-display-screen .rank-table .main-head th.is-sortable:hover .rank-sort-head.is-active {
  --rank-sort-scan-duration: 3.4s;
  filter: brightness(1.05);
  box-shadow:
    inset 0 1px 0 rgba(235, 255, 255, 0.3),
    inset 0 0 24px rgba(90, 235, 255, 0.22),
    inset 0 -3px 12px rgba(0, 20, 50, 0.32),
    0 0 14px rgba(0, 230, 255, 0.48),
    0 0 28px rgba(70, 170, 255, 0.32);
}
#digital-display-screen .rank-table .main-head th.is-sortable:active .rank-sort-head.is-active {
  filter: brightness(0.97);
  box-shadow:
    inset 0 2px 10px rgba(0, 20, 40, 0.4),
    inset 0 0 14px rgba(60, 210, 255, 0.12),
    0 0 10px rgba(0, 200, 255, 0.28);
}
#digital-display-screen .rank-table .main-head th.is-sortable:active .rank-sort-head.is-active .rank-sort-btn-scan {
  opacity: 0.55;
  animation-play-state: running;
}
#digital-display-screen .rank-table .main-head th.is-sort-active {
  background: transparent;
}
#digital-display-screen .rank-table .sub-head th {
  font-size: 12px;
  font-weight: 600;
  color: #5dffb0;
  background: transparent;
  border-bottom: 1px solid rgba(150, 230, 255, 0.42) !important;
  box-shadow: none;
}
#digital-display-screen .rank-table tbody td {
  border-bottom: 1px solid rgba(110, 170, 210, 0.06);
}
#digital-display-screen .rank-table tbody tr:nth-child(odd) {
  background: rgba(18, 48, 88, 0.1);
}
#digital-display-screen .rank-table tbody tr:nth-child(even) {
  background: transparent;
}
#digital-display-screen .rank-table tbody tr:hover {
  background: rgba(70, 170, 220, 0.12);
  box-shadow: inset 0 0 0 1px rgba(130, 220, 255, 0.28), 0 0 10px rgba(70, 190, 255, 0.08);
}
#digital-display-screen .rank-table .store-cell {
  color: #f2f8fc;
  font-weight: 600;
  font-size: 13px;
  text-shadow: 0 1px 2px rgba(4, 18, 40, 0.55);
}
#digital-display-screen .rank-table .store-rank-cell {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  vertical-align: middle;
}
#digital-display-screen .rank-table .store-rank-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  margin: 0 2px 0 0;
  border-radius: 5px;
  box-sizing: border-box;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  color: rgba(200, 220, 240, 0.72);
  background: rgba(20, 50, 90, 0.45);
  border: 1px solid rgba(100, 160, 210, 0.22);
}
#digital-display-screen .rank-table .store-rank-no.is-top {
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 10, 30, 0.45);
}
#digital-display-screen .rank-table .store-rank-no.rank-1 {
  background: linear-gradient(160deg, rgba(255, 210, 80, 0.95), rgba(220, 140, 30, 0.92));
  border-color: rgba(255, 220, 120, 0.85);
  box-shadow:
    0 0 10px rgba(255, 190, 60, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
#digital-display-screen .rank-table .store-rank-no.rank-2 {
  background: linear-gradient(160deg, rgba(200, 215, 230, 0.95), rgba(130, 150, 175, 0.9));
  border-color: rgba(220, 235, 250, 0.8);
  box-shadow:
    0 0 10px rgba(170, 190, 220, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
#digital-display-screen .rank-table .store-rank-no.rank-3 {
  background: linear-gradient(160deg, rgba(230, 160, 100, 0.95), rgba(180, 100, 50, 0.9));
  border-color: rgba(255, 190, 140, 0.75);
  box-shadow:
    0 0 10px rgba(220, 140, 70, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.28);
}
#digital-display-screen .rank-table .store-cell .el-tooltip {
  display: inline-block;
  max-width: none;
  min-width: 0;
}
#digital-display-screen .rank-table .store-text {
  display: inline-block;
  width: auto;
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
  cursor: default;
  color: #f2f8fc;
}
#digital-display-screen .rank-table .num {
  display: block;
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
  text-shadow: 0 1px 2px rgba(4, 18, 40, 0.4);
}
#digital-display-screen .rank-table td.col-month-current,
#digital-display-screen .rank-table .sub-head th.col-month-current {
  overflow: visible;
  text-overflow: clip;
  padding-left: 1px;
  padding-right: 2px;
}
#digital-display-screen .rank-table td.col-month-current .num {
  display: inline;
  white-space: nowrap;
}
#digital-display-screen .rank-table .rank-metric-cell {
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  flex-wrap: nowrap;
  white-space: nowrap;
  line-height: 1.35;
  text-align: center;
  max-width: none;
}
#digital-display-screen .rank-table .rank-metric-val,
#digital-display-screen .rank-table .rank-ratio {
  display: inline;
  white-space: nowrap;
}
#digital-display-screen .rank-table .rank-ratio {
  font-size: inherit;
  font-weight: inherit;
  font-variant-numeric: inherit;
  line-height: inherit;
  text-shadow: inherit;
  margin-left: 2px;
  white-space: nowrap;
}
#digital-display-screen .rank-table .rank-ratio.is-up {
  color: #3dff9a;
}
#digital-display-screen .rank-table .rank-ratio.is-down {
  color: #ff6b7a;
}
#digital-display-screen .rank-table .rank-ratio.is-flat {
  color: #c8e4f8;
}
#digital-display-screen .rank-table td.col-month-history .num {
  color: #ffffff;
}
#digital-display-screen .rank-table tbody tr:hover td.col-month-history .num {
  color: #ffffff;
}
#digital-display-screen .rank-table td.col-month-current .rank-metric-val {
  color: #ffffff;
}
#digital-display-screen .rank-table tbody tr:hover td.col-month-current .rank-metric-val {
  color: #ffffff;
}
#digital-display-screen .rank-table .col-core .num {
  color: #9ee8ff;
}
#digital-display-screen .rank-table .col-soft .num {
  color: #f5f8fb;
}
#digital-display-screen .rank-table tbody tr:hover .col-core .num {
  color: #b8f0ff;
}
#digital-display-screen .rank-table tbody tr:hover .col-soft .num {
  color: #ffffff;
}
#digital-display-screen .rank-table tbody tr:hover .store-cell,
#digital-display-screen .rank-table tbody tr:hover .store-text {
  color: #ffffff;
}
#digital-display-screen .rank-table .rank-empty {
  padding: 18px 8px;
  text-align: center;
  color: rgba(200, 220, 240, 0.7);
  font-size: 13px;
  font-weight: 400;
}
@keyframes ddsRankSortBorderFlow {
0% { background-position: 0% 0%, 0% 50%;
}
50% { background-position: 0% 0%, 100% 50%;
}
100% { background-position: 0% 0%, 0% 50%;
}
}
@keyframes ddsRankSortScanSweep {
0% { transform: translateX(0) skewX(-22deg);
}
100% { transform: translateX(420%) skewX(-22deg);
}
}
@keyframes ddsRefreshSpin {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
@keyframes ddsEnterUp {
from { opacity: 0; transform: translateY(22px);
}
to { opacity: 1; transform: translateY(0);
}
}
@keyframes ddsNodePulse {
0%, 100% { opacity: 0.22; transform: scale(0.85);
}
50% { opacity: 0.48; transform: scale(1.15);
}
}
@keyframes ddsFloat {
0%, 100% { transform: translate3d(0, 0, 0); opacity: 0.28;
}
50% { transform: translate3d(6px, -12px, 0); opacity: 0.9;
}
}
@keyframes ddsParticleDrift {
0%, 100% { transform: translate3d(0, 0, 0);
}
25% { transform: translate3d(10px, -16px, 0);
}
50% { transform: translate3d(-6px, -28px, 0);
}
75% { transform: translate3d(12px, -10px, 0);
}
}
@keyframes ddsParticleTwinkle {
0%, 100% { opacity: 0.16;
}
40% { opacity: 0.38;
}
70% { opacity: 0.24;
}
}
@keyframes ddsTitleLightPulse {
0%, 100% { opacity: 0.55; transform: scaleX(0.88);
}
50% { opacity: 1; transform: scaleX(1);
}
}
@keyframes ddsBreath {
0%, 100% { opacity: 0.4;
}
50% { opacity: 0.95;
}
}
@keyframes ddsPulseDot {
0%, 100% { transform: scale(0.85); opacity: 0.55;
}
50% { transform: scale(1.15); opacity: 1;
}
}
@keyframes ddsAuroraDrift {
0%, 100% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.16;
}
35% {
    transform: translate3d(4%, -3%, 0) scale(1.08);
    opacity: 0.28;
}
65% {
    transform: translate3d(-3%, 4%, 0) scale(0.94);
    opacity: 0.2;
}
}
@keyframes ddsBeamSweep {
0% { transform: translateX(0); opacity: 0.18;
}
45% { opacity: 0.55;
}
100% { transform: translateX(280%); opacity: 0.2;
}
}
@keyframes ddsDustRise {
0% { top: 105%; opacity: 0;
}
15% { opacity: 0.35;
}
85% { opacity: 0.2;
}
100% { top: -10%; opacity: 0;
}
}
/* 边框呼吸 / 扫光 keyframes 先关掉，需要时取消注释
@keyframes ddsPanelBreath {
  0%, 100% {
    box-shadow:
      0 0 0 1px rgba(160, 140, 255, 0.1),
      0 0 18px rgba(70, 190, 255, 0.14),
      0 0 34px rgba(130, 110, 255, 0.06),
      0 10px 28px rgba(10, 40, 70, 0.22),
      inset 0 1px 0 rgba(230, 250, 255, 0.22),
      inset 0 0 30px rgba(80, 170, 255, 0.05);
    border-color: rgba(130, 230, 255, 0.36);
  }
  50% {
    box-shadow:
      0 0 0 1px rgba(170, 160, 255, 0.16),
      0 0 30px rgba(80, 210, 255, 0.28),
      0 0 48px rgba(140, 120, 255, 0.12),
      0 10px 28px rgba(10, 40, 70, 0.22),
      inset 0 1px 0 rgba(240, 252, 255, 0.34),
      inset 0 0 34px rgba(90, 190, 255, 0.1);
    border-color: rgba(160, 240, 255, 0.58);
  }
}
@keyframes ddsPanelSweep {
  0% { transform: translateX(0); opacity: 0; }
  10% { opacity: 0.75; }
  42% { opacity: 0.4; }
  68% { opacity: 0; }
  100% { transform: translateX(280%); opacity: 0; }
}
*/
@keyframes ddsChartHalo {
0%, 100% { opacity: 0.3; transform: scale(0.96);
}
50% { opacity: 0.65; transform: scale(1.04);
}
}

/* 门店列 tooltip：挂载 body，需独立 popper-class */
.dds-store-tooltip.el-tooltip__popper {
  background: linear-gradient(180deg, rgba(24, 62, 108, 0.97), rgba(12, 38, 72, 0.99));
  border: 1px solid rgba(130, 210, 245, 0.42);
  border-radius: 8px;
  padding: 8px 12px;
  color: #e8f6ff;
  font-size: 12px;
  line-height: 1.45;
  letter-spacing: 0.02em;
  max-width: 300px;
  box-shadow:
    0 0 0 1px rgba(100, 200, 255, 0.12),
    0 6px 20px rgba(4, 20, 45, 0.55),
    0 0 14px rgba(70, 190, 255, 0.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.dds-store-tooltip.el-tooltip__popper[x-placement^="top"] .popper__arrow {
  border-top-color: rgba(130, 210, 245, 0.42);
}
.dds-store-tooltip.el-tooltip__popper[x-placement^="top"] .popper__arrow::after {
  border-top-color: rgba(18, 50, 88, 0.97);
}
.dds-store-tooltip.el-tooltip__popper[x-placement^="bottom"] .popper__arrow {
  border-bottom-color: rgba(130, 210, 245, 0.42);
}
.dds-store-tooltip.el-tooltip__popper[x-placement^="bottom"] .popper__arrow::after {
  border-bottom-color: rgba(12, 38, 72, 0.99);
}