controller-v2/client/src/components/festival/christmas.css

/* modern 与 legacy 共用；只装饰圣诞组件，不改变音量条的几何与交互。 */
.cyan-slider.cyan-slider--no-thumb::-webkit-slider-thumb {
  background: transparent;
  box-shadow: none;
}

.cyan-slider.cyan-slider--no-thumb::-moz-range-thumb {
  background: transparent;
  box-shadow: none;
}

.festival-santa-thumb {
  width: 44px;
  height: 44px;
  /* 解除 preflight 的 img max-width 限制：滑轨右端时绝对定位容器可用宽度极小，否则圣诞老人被压缩 */
  max-width: none;
  object-fit: contain;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.5));
}

.festival-bell {
  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.5));
}

.festival-bell-dim {
  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.5)) saturate(0.7);
}

/* 占位与原喇叭保持 24px 一致，大小铃铛仅在视觉层变化。 */
.festival-bell-slot {
  display: block;
  position: relative;
  width: 24px;
  height: 24px;
  pointer-events: none;
}

.festival-bell-slot > img {
  position: absolute;
  max-width: none;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* 装饰层限于卡片顶部；所有子元素穿透点击且不进入辅助技术阅读顺序。 */
.christmas-card-decoration {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 42px;
  z-index: 1;
  pointer-events: none;
  user-select: none;
}

.christmas-card-decoration * {
  pointer-events: none;
}

.christmas-card-snow {
  position: absolute;
  top: 0;
  height: auto;
}

.christmas-card-snow-left {
  left: 3px;
  width: 70px;
}

.christmas-card-snow-right {
  right: 3px;
  width: 54px;
}

/* 圣诞横幅：墨绿雪景中的暖金手写花体。 */
.festival-greeting--christmas {
  background: #061a13;
}

.christmas-greeting-text {
  font-family: "Snell Roundhand", "Savoye LET", "Segoe Script", "Brush Script MT", cursive;
  font-size: 64px;
  font-style: italic;
  letter-spacing: 0.5px;
  color: #ffe6a0;
  text-shadow:
    0 0 2px #fff6d5,
    0 0 6px rgba(255, 191, 63, 0.9),
    0 0 15px rgba(228, 139, 30, 0.65),
    0 2px 2px #63310b;
}

.christmas-card-lights {
  position: absolute;
  top: 1px;
  left: 18px;
  right: 46px;
  height: 18px;
}

.christmas-card-wire {
  display: block;
  width: 100%;
  height: 18px;
}

.christmas-card-light {
  position: absolute;
  width: 1px;
  height: 3px;
  background: #8c744b;
}

.christmas-card-bulb {
  position: absolute;
  top: 2px;
  left: -2px;
  width: 5px;
  height: 7px;
  border-radius: 2px 2px 50% 50%;
  background: radial-gradient(ellipse at 45% 35%, #fff8df, #f3c56d 65%, #c18b3e);
  box-shadow: 0 0 5px 1px rgba(245, 192, 92, 0.3);
}

.christmas-card-sprig {
  position: absolute;
  top: 0;
  right: 2px;
  width: 44px;
  height: 40px;
}