body {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: #f0f0f0;
    overflow: hidden;
}

ol,
ul {
  list-style: none;
}

@font-face {
  font-display: swap;
  font-family: Mangueira Alt;
  font-style: normal;
  font-weight: 700;
  src: url(https://cdn.luckday.cn/static/font/mangueira-alt-bold.woff2) format("woff2");
}

.load {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ffffff;
  opacity: 1;
  filter: alpha(opacity=80);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.loading {
  font-weight: bold;
  letter-spacing: 2px;
  color: #000;
  animation: smoke-out 1s ease-in-out infinite alternate;
  text-shadow: 0 0 1px white;
  font-family: Mangueira Alt, sans-serif;
}

@keyframes smoke-out {
  100% {
    opacity: 0.08;
    filter: blur(5px);
    letter-spacing: 4px;
  }
}

.loading:before {
  content: "LuckDay";
  font-size: xx-large;
  color: #000;
}

.header {
    display: flex;
    width: 100%;
    position: absolute;
    top: 10px;
    height: 72px;
    justify-content: space-between;
}

#myCanvasContainer {
    position: relative;
    max-width: 500px;
    max-height: 500px;
    z-index: 2;
}

#myCanvas {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#tags {
    display: none; /* 隐藏原始标签列表，但保持功能 */
}

/* 背景canvas样式 */
#canvas {
  position: fixed;
  top: 0;
  left: 0;
  /* z-index: -1; */
}

#tags > ul > li > a {
    color: #fff;
    text-decoration: none;
}

#tags > ul > li > a:hover {
    color: #fff;
    text-decoration: none;
}

#start { 
  width: 80px;
  height: 70px;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #d1c7c7;
  font-size: 30px;
  font-weight: 700;
  text-transform: uppercase;
  border: 0;
  outline: 0;
  border-radius: 50%;
  background: linear-gradient(90deg, #9e9e9e, #f44336, #795548, #9e9e9e);
  background-size: 300%;
  -webkit-animation: flicker-7b33b2b6 2s infinite;
  background-color: #fff;
  box-shadow: 0 0 30px #fff;
  cursor: pointer;
  bottom: 0;
  animation: flicker-7b33b2b6 2s infinite;
  z-index: 6;
}

@keyframes flicker-7b33b2b6 {
    0% {
        background-position: 0%;
    }
    100% {
        background-position: 300%;
    }
}

/* 添加下拉框样式 */
.prize-select {
    /* position: absolute;
    top: 16px;
    right: 16px; */
    min-width: 130px;
    max-width: 210px;
    font-family: "Microsoft YaHei", sans-serif;
}

.selector {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 下拉框主体样式 */
#customPrizeSelect {
    position: relative;
    /* background: #ffffff; */
    /* border-radius: 4px; */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    z-index: 1000;
}

#customPrizeSelect > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 12px;
    color: #fff;
    background: #ffffff00;
    border-radius: 4px;
    transition: all 0.3s ease;
    border: 1px solid #fbdcad;
    text-decoration: none;
    position: relative;
}

#customPrizeSelect > a:hover {
    background: #f8f8f829;
}

/* 下拉框文字样式 */
.speech_bubble {
    font-size: 13px;
    color: #fbdcad;
}

/* 下拉箭头样式 */
.caret {
    position: absolute;
    right: 20px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #fbdcad;
    margin-left: 10px;
    transition: transform 0.3s ease;
}

/* 下拉选项容器样式 */
.prize-options {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #ffffff00;
    border-radius: 4px;
    border: 1px solid #fbdcad;  
    margin-top: 5px;
    padding: 2px 0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    display: none;
    z-index: 1000;
    max-height: 300px;
    overflow-y: auto;
}

/* 显示下拉选项 */
#customPrizeSelect.active .prize-options {
    display: block;
}

/* 旋转箭头 */
#customPrizeSelect.active .caret {
    transform: rotate(180deg);
}

/* 下拉选项样式 */
.prize-options li {
    list-style: none;
}

.prize-options li a {
    display: block;
    padding: 6px;
    margin: 4px;
    border-radius: 4px;
    font-size: 13px;
    color: #fbdcad;
    text-decoration: none;
    transition: all 0.2s ease;
    text-align: center;
}

.prize-options li a:hover {
    background: #42403a;
}

/* 禁用选项样式 */
.prize-options li.disabled a {
    color: #c3c3c3;
    background: #e1e1e13d;
    cursor: not-allowed;
}

.prize-options li.disabled a:hover {
    background: #e1e1e13d;
}

/* 滚动条美化 */
.prize-options::-webkit-scrollbar {
    width: 6px;
}

.prize-options::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.prize-options::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}

.prize-options::-webkit-scrollbar-thumb:hover {
    background: #999;
}

/* 修改奖品展示样式 */
#prizeDisplay {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 28px;
    color: #fff;
    text-shadow: 0 0 10px rgba(255,255,255,0.8);
    z-index: 1000;
    text-align: center;
    min-height: 36px;
    pointer-events: none;
    width: 100%;
    max-width: 800px;
}

#prizeDisplay .prize-award {
    font-size: 38px;
    color: #83cfff;
    margin-bottom: 5px;
}

.winner-list {
  position: absolute;
  width: 100%;
  /* height: 100vh; */
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  top: 50%;
  color: rgb(255, 255, 255);
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
}

/* 不需要滚动时的样式 */
.winner-list.no-scroll .winner-content {
  position: absolute;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  color: rgb(255, 255, 255);
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  animation: none !important;  /* 确保没有动画 */
}

.no-scroll {
  height: 100vh !important;
}

/* 添加新的滚动容器 */
.winner-list.scrolling {
  position: absolute;
}

.winner-list.scrolling .winner-content {
  position: absolute;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  color: rgb(255, 255, 255);
  left: 50%;
}

/* 添加第一个和第二个内容块的特殊样式 */
.winner-list.scrolling .winner-content:first-child {
  transform: translate(-50%, 0);
  animation: firstScroll 20s linear infinite;
}

.winner-list.scrolling .winner-content:last-child {
  transform: translate(-50%, 100%);
  animation: secondScroll 20s linear infinite;
}

/* 鼠标悬停时暂停动画 */
#prizeResult:hover .winner-content {
  animation-play-state: paused;
}

@keyframes firstScroll {
  0% {
    transform: translate(-50%, 0);
  }

  100% {
    transform: translate(-50%, -100%);
  }
}

@keyframes secondScroll {
  0% {
    transform: translate(-50%, 100%);
  }

  100% {
    transform: translate(-50%, 0);
  }
}

.winner-item {
    font-size: 28px;
    color: #ffd700;
    text-shadow: 0 0 10px rgba(255,215,0,0.8);
    animation: fadeIn 0.5s ease-in;
    /* width: calc(33.33% - 20px); 每行显示3个，减去margin空间 */
    margin: 10px;
    display: inline-block;
}

.winner-name {
    text-align: center;
    line-height: 30px;
    color: #000;
    box-shadow: rgba(0, 0, 0, 0.8) 0px 5px 10px;
    background: #fff;
    border-radius: 10px;
    padding: 6px 18px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.winner-prize {
    color: #ffd700;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 添加右侧布局样式 */
.right {
  display: flex;
  align-items: center;
  gap: 20px;  /* 元素之间的间距 */
  margin-right: 20px;
}

.right > div {
  display: flex;
  align-items: center;
  gap: 10px;  /* 文字和数字之间的间距 */
}

.participant-count {
  font-size: 16px;
  color: #333;
}

.play-user {
  margin: 0 20px;
}

.play-user, .participant-count {
    color: #f7e30f;
    font-size: 18px;
}

.prize-title {
  color: #fbdcad;
}

.prize-select {
  display: flex;
  align-items: center;
}

.paly-select {
  display: flex;
  align-items: center;
}

.selector {
  width: 100%;
}

.logo-name, .header-info {
  background-image: -webkit-linear-gradient(left, #3498db, #f47920 10%, #d71345 20%, #f7acbc 30%, #ffd400 40%, #3498db 50%, #f47920 60%, #d71345 70%, #f7acbc 80%, #ffd400 90%, #3498db);
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  background-size: 200% 100%;
  animation: logo-name 5s infinite linear;
  font-size: 30px;
  font-family: fantasy;
}

.header-info {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: 20px;
}

.header-info > i {
  font-size: 72px;
}

@keyframes logo-name {
  0% {
    background-position: 0 0
  }

  to {
    background-position: -100% 0
  }
}

@font-face {
  font-family: 'icomoon';
  src: url('../fonts/icomoon.eot?9wlqx1');
  src: url('../fonts/icomoon.eot?9wlqx1#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?9wlqx1') format('truetype'),
    url('../fonts/icomoon.woff?9wlqx1') format('woff'),
    url('../fonts/icomoon.svg?9wlqx1#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^='icon-'],
[class*=' icon-'] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-logo:before {
  content: '\e900';
}
.settings-content {
  display: flex;
}
.settings-item {
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  width: max-content;
  align-items: center;
  cursor: pointer;
}
.settings-title, .settings-value {
  color: #fff;
  display: inline-block;
  /* padding: 8px; */
}

.settings-title {
  opacity: 0.6;
  width: 24px;
  height: 24px;
  padding: 3px;
  text-align: center;
  border-radius: 50%;
  background-color: #000000b3;
}

.settings-title > svg {
  width: 20px;
  height: 20px;
}

.settings-value {
  font-size: 13px;
  color: rgb(233, 213, 171);
}

.settings-button {
  position: absolute;
  right: 0;
  top: -34px;
  height: 34px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 42px;
  border-width: 1px 1px 0px;
  border-style: solid solid solid;
  border-color: rgba(255, 255, 255, 0.7) rgba(255, 255, 255, 0.7) rgba(255, 255, 255, 0.7);
  border-image: initial;
  border-bottom: 0px;
  border-radius: 40px 40px 0px 0px;
  background: rgba(255, 255, 255, 0.5);
  color: #FFF;
}

.settings-panel {
  position: fixed;
  right: 0px;
  bottom: -65px;
  width: auto;
  height: 65px;
  background-color: rgba(0, 0, 0, 0.463);
  border-radius: 20px 0px 0 0;
  transition: all 0.3s ease;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
  z-index: 6;
}

.settings-button:hover~.settings-panel,
.settings-panel:hover {
    bottom: 0;
}

/* 设置图标的过渡动画 */
.settings-button svg {
  transition: transform 0.3s ease;
}

/* 当面板处于上移状态时，旋转图标 */
.settings-panel:hover svg, .settings-button:hover svg {
  transform: rotate(180deg);
}

.settings-title > svg {
  transform: none !important;
}

.modal, .settings-modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

.modal-content {
  margin: 5% auto;
  padding: 20px;
  border-radius: 4px;
  width: 60%;
  max-width: 500px;
  position: relative;
  box-shadow: rgb(169, 163, 155) 0px 0px 200px;
  background: rgba(0, 0, 0, 0.2);
  color: #c7c7c7;
}

.el-upload__text > em {
  color: yellow
}

.modal-content h2 {
  color: #fdd835;
  margin: 0 0 0 12px;
  text-align: center;
}

.close {
  position: absolute;
  right: 20px;
  top: 10px;
  font-size: 28px;
  color: #b7b7b7;
  cursor: pointer;
}

.upload-setting {
  display: flex;
  justify-content: space-between;
  padding: 0 20px;
}

.upload-container,
.download-template {
  margin: 40px 0;
}

.upload-container {
  width: 200px;
  height: 200px;
}

.upload-area {
  border: 2px dashed #e5e5e5;
  border-radius: 4px;
  padding: 20px;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
}

.upload-area:hover {
  border-color: yellow;
}

.upload-area.dragover {
  border-color: #dcd21c;
  background-color: rgba(33, 150, 243, 0.1);
}

.upload-text {
  color: #e5e5e5;
}

.upload-text:hover {
  color: #fbdcad;
}

.upload-hint {
  font-size: 12px;
  /* color: #999; */
  margin-top: 8px;
}

.upload-status {
  margin-top: 10px;
  padding: 10px;
  display: none;
  position: absolute;
}

.upload-status.success {
  color: #fdd835;
  display: block;
}

.upload-status.error {
  background-color: #efe96e;
  color: #c62828;
  display: block;
  border-radius: 12px;
}

.modal-buttons {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.modal-button {
  display: flex;
  padding: 8px 16px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.3s ease;
}

.modal-button.confirm {
  background-color: #f9a825f5;
  color: white;
}

.modal-button.confirm:hover {
  background-color: dda602;
}

.modal-button.cancel {
  background-color: #e0e0e0;
  color: #333;
}

.modal-button.cancel:hover {
  background-color: #bdbdbd;
}

@media (max-width: 767px) {
  .right > div {
    flex-direction: column;
  }
  #prizeDisplay {
    top: 14%;
  }
  .prize-title {
    display: none;
  }

  #prizeDisplay {
      z-index: 0;
  }
  .settings-content {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .settings-button:hover~.settings-panel, .settings-panel:hover {
    height: auto;
  }
  .upload-setting {
      flex-direction: column;
  }
  .header-info {
    margin-left: 0px;
    gap: 0px;
  }

  .left {
    display: flex;
  }
  .header-info > i {
    font-size: 52px;
  }
  .right {
    margin-right: 0px;
  }
}

.settings-modal {
  z-index: 1999;
}

.logo-upload { 
    height: 160px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 1px dashed;
    border-radius: 4px;
    cursor: pointer;
}

.logo-upload:hover {
  border-color: yellow;
}

.upload-input {
  display: none;
}

.flex {
  display: flex;
}

.logo-setting {
  margin: 30px 10px
}

.logo-upload-title { 
  color: #f6df06;
  margin-bottom: 12px;
  font-size: 16px
}

.bg-setting > img { 
  display: none;
}

.luck-code-body {
  margin: 20px 0;
  padding: 0 20px 20px 20px;
}

.luck-code-body > .el-input {
  position: relative;
  font-size: 13px;
  display: inline-flex;
  height: 32px;
  width: 100%;
  line-height: 32px;
  box-sizing: border-box;
}

.luck-code-header {
  text-align: left;
  cursor: default;
  display: flex;
  align-items: center;
  padding: 20px;
  flex-direction: column;
}
.luck-code-title {
  color: #f6df06;
  font-size: 16px;
}

#codeInput {
  color: #fff;
  background: #3d3c3cb0;
  border-radius: 4px;
  width: 100%;
  border: none;
  text-align: center;
}

.luck-code-footer {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 0 20px;
}

input:focus-visible {
  outline: none;
}

.header-info > img {
  height: 72px;
  filter: drop-shadow(10px 10px 5px rgba(0, 0, 0, 0.5));
}

.luck-bg, .luck-bg-logo {
  position: absolute;
  width: 100%;
  height: 100%;
}

.luck-bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(circle at center, rgba(255, 255, 255, 0.5) 0%, rgb(0 0 0 / 20%) 100%);
  mix-blend-mode: multiply;
  pointer-events: none;
}

.luck-bg-logo {
  display: none;
}

.luck-bg-logo img {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  filter: drop-shadow(10px 10px 5px rgba(0, 0, 0, 0.5));
}

.reset-options {
  margin: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.reset-item {
  margin: 15px;
  display: flex;
  align-items: center;
}

.reset-item input[type="checkbox"] {
  margin-right: 10px;
  width: 16px;
  height: 16px;
}

.reset-item label {
  font-size: 14px;
  cursor: pointer;
}

.reset-msg {
  color: rgb(243 168 70);
  text-align: center;
}

#resetModal .modal-content {
  max-width: 500px;
  padding: 20px 0;
}

#resetModal h2 {
  margin: 0;
  padding-bottom: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
}

#resetModal h2 svg {
  margin-right: 8px;
}

#resetModal .modal-buttons {
  justify-content: center;
}

#resetModal .modal-button {
  margin-left: 10px;
  padding: 8px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

#resetModal .cancel {
  background-color: #f5f5f5;
  color: #666;
}

#resetModal .confirm {
  background-color: #d36d4f;
  color: #fff;
}

/* 自定义复选框样式 */
.reset-item input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* 创建自定义复选框 */
.reset-item {
  position: relative;
  padding-left: 35px;
  margin: 15px;
  cursor: pointer;
  font-size: 14px;
  user-select: none;
  display: flex;
  align-items: center;
}

/* 自定义复选框的框 */
.reset-item label:before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  border: 2px solid #ddd;
  border-radius: 3px;
  background-color: transparent;
  transition: all 0.3s ease;
}

/* 自定义复选框的勾 */
.reset-item label:after {
  content: '';
  position: absolute;
  left: 6px;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  width: 6px;
  height: 12px;
  border: solid #f6df06;  /* 黄色的勾 */
  border-width: 0 2px 2px 0;
  opacity: 0;
  transition: all 0.3s ease;
}

/* 选中状态的样式 */
.reset-item input[type="checkbox"]:checked + label:before {
  border-color: #f6df06;
  background-color: #9c9c9c66;
}

.reset-item input[type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: translateY(-75%) rotate(45deg);
}

/* 悬停状态的样式 */
.reset-item:hover label:before {
  border-color: #f6df06;
}

/* 确保文字垂直居中 */
.reset-item label {
  margin: 0;
  cursor: pointer;
  color: #c7c7c7;
}

#prizeResult {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70vw;
  /* height: 100vh; */
  z-index: 5;
}

#start:disabled {
  /* opacity: 0.5; */
  cursor: not-allowed;
  /* animation: none !important; */
}

.prize-options li.disabled {
  /* opacity: 0.5; */
  cursor: not-allowed;
}

.prize-options li.disabled a {
  /* pointer-events: none; */
  /* color: #999; */
}

/* 二维码样式 */
.qrcode-container {
  position: fixed;
  right: -400px;
  top: 50%;
  transform: translate(0, -50%);
  width: 200px;
  transition: right 0.3s ease;
  cursor: move;
  z-index: 1000;
}

.qrcode-container.show {
  right: 20px;
  transform: translate(0, -50%);
}

.qrcode-content {
  width: 100%;
  height: 100%;
}

.qrcode-content img {
  width: 100%;
  height: auto;
  border-radius: 5px;
}

.settings-qrcode svg {
  margin-right: 2px;
}

.settings-fullscreen svg {
  margin-right: 2px;
}

/* 全屏时的样式调整 */
:fullscreen {
  background: #000;
}

.message {
  background: #f8d4d4;
  padding: 0 20px;
  border-radius: 10px;
  color: #db2828;
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2000;
}

#user-list li a {
  background-color: rgba(255, 229, 0, 0.3);
  /* 半透明的黄色背景 */
  border-radius: 5px;
  padding: 5px 10px;
  color: #333;
  text-decoration: none;
  display: inline-block;
}

#user-list li a:hover {
  background-color: rgba(255, 229, 0, 0.5);
  /* 悬停时背景色加深 */
}

.statistics-panel {
    position: fixed;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    /* background: rgba(0, 0, 0, 0.6); */
    background-color: #a58c5152;
    border-radius: 10px;
    /* padding: 20px; */
    /* min-width: 200px; */
    max-width: 300px;
    color: #fff;
    z-index: 999;
}
.panel-scrollbar::-webkit-scrollbar {
  width: 8px;
  height: 5px;
  border-radius: 8px;
}

.panel-scrollbar::-webkit-scrollbar-thumb:horizontal {
  width: 8px;
  border-radius: 8px;
  opacity: 0;
  transition: opacity 0.3s;
    /* 平滑过渡效果 */
}

.panel-scrollbar::-webkit-scrollbar-thumb:vertical {
  height: 8px;
  border-radius: 8px;
  opacity: 0;
  transition: opacity 0.3s;
    /* 平滑过渡效果 */
}

.panel-scrollbar:hover::-webkit-scrollbar-thumb:vertical {
  height: 8px;
  background-color: #acacac99;
  border-radius: 8px;
  opacity: 1;
  transition: opacity 0.3s;
    /* 平滑过渡效果 */
}

.statistics-header {
    text-align: center;
    text-align: center;
    background: #a0864a87;
    padding: 12px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.prize-name {
    font-size: 18px;
    color: #ffd700;
    margin-bottom: 5px;
}

.prize-progress {
    font-size: 14px;
    color: #fff;
}

.winners-tmp-list {
    max-height: 60vh;
    overflow-y: auto;
}

.statistics-winner {
    padding: 8px;
    /* background: rgba(255, 255, 255, 0.1); */
    border-radius: 5px;
    transition: all 0.3s ease;
}

.statistics-winner:hover {
    background: rgba(255, 255, 255, 0.2);
}

/* 修改现有的winner-item样式 */
.winner-item {
    transition: all 0.3s ease;
}

.taobao-code>div {
  margin: 10px 0;
}

.taobao-code>img {
  width: 130px;
}