
/* 2026-10-20：组件保留原排版；整页顶部偏移不进入业务布局，内部上下留白统一由 Inner 承担。 */
.mueusbd {
  width: 100%;
  min-width: 0;
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  --theme_color: #e60012;
  color: #222;
  box-sizing: border-box;
}

.mueusbd:is(.rtlAr, .rtlAr *) {
  direction: rtl;
}

.mueusbd *,
.mueusbd *::before,
.mueusbd *::after {
  box-sizing: border-box;
}

.mueusbd .mueusbd__inner {
  width: 100%;
  max-width: var(--custom-content-max-width);
  margin-left: auto;
  margin-right: auto;
  padding-top: var(--padding_tb, 0rem);
  padding-bottom: var(--padding_tb, 0rem);
  padding-left: var(--padding_lr);
  padding-right: var(--padding_lr);
}

.mueusbd .mueusbd__grid {
  display: grid;

  min-width: 0;
}

.mueusbd .mueusbd__card {
  --item-base-background: #fff;
  position: relative;
  display: block;
  overflow: hidden;
  min-width: 0;
  border: 2px solid var(--item-border-color, #eff0f0);
  background: var(--item-background, var(--item-base-background));
  color: #222;
  text-align: center;
  text-decoration: none;
  transition: border-color .3s ease, box-shadow .3s ease;
}

.mueusbd .mueusbd__card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: color-mix(in srgb, var(--theme_color) 0%, transparent);
  box-shadow: none;
  mix-blend-mode: multiply;
  transition: background-color .3s ease, box-shadow .3s ease;
}

.mueusbd .mueusbd__media {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 598 / 433;
  background: var(--surface-color, #f4f4f4);
  background-image: var(--surface-image, none);
  background-position: var(--surface-position, center);
  background-size: var(--surface-size, cover);
  background-repeat: var(--surface-repeat, no-repeat);
}

.mueusbd .mueusbd__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: var(--image-fit, cover);
  object-position: center;
  transition: transform .3s ease;
}

.mueusbd .mueusbd__body {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: flex-start;

  background: var(--surface-color, #fff);
  background-image: var(--surface-image, none);
  background-position: var(--surface-position, center);
  background-size: var(--surface-size, cover);
  background-repeat: var(--surface-repeat, no-repeat);
  transition: background-color .3s ease;
}

.mueusbd .mueusbd__circle {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 31px;
  height: 31px;
  overflow: hidden;
  border-radius: 999px;
  transition: width .3s ease, height .3s ease, margin .3s ease, background-color .3s ease;
}

.mueusbd .mueusbd__circle .yiyingbaoicon {
  display: block;
  width: var(--icon-size, 16px);
  overflow: hidden;
  font-size: var(--icon-size, 16px);
  line-height: var(--icon-size, 16px);
  transition: width .3s ease, color .3s ease;
}

.mueusbd .mueusbd__circle--enter {
  width: 0;
  height: 0;
  --icon-base-background: #fff;
  --icon-base-color: var(--theme_color);
  background: var(--icon-background, var(--icon-base-background));
  color: var(--icon-color, var(--icon-base-color));
}

.mueusbd .mueusbd__circle--enter .yiyingbaoicon {
  width: 0;
}

.mueusbd .mueusbd__circle--default {
  margin-left: 10px;
  --icon-base-background: #424242;
  --icon-base-color: #fff;
  background: var(--icon-background, var(--icon-base-background));
  color: var(--icon-color, var(--icon-base-color));
}

.mueusbd .mueusbd__content {
  min-width: 0;
  margin: 0 auto 0 0;
  text-align: left;
  transition: margin .3s ease;
}

.mueusbd .mueusbd__name {
  display: -webkit-box;

  max-height: 48px;
  overflow: hidden;

  color: var(--text-color, var(--text-base-color));

  font-weight: var(--text-weight);

  letter-spacing: var(--text-letter-spacing);
  text-transform: var(--text-transform);
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  transition: color .3s ease;
}

.mueusbd .mueusbd__card:focus {
  outline: none;
}

.mueusbd .mueusbd__card:focus-visible {
  outline: 2px solid var(--theme_color);
  outline-offset: 3px;
}

@media (min-width: 1024px) {
  .mueusbd .mueusbd__card:hover,
.mueusbd .mueusbd__card:active {
    border-color: var(--theme_color);
    box-shadow: 0 21px 29px 0 color-mix(in srgb, var(--theme_color) 28%, transparent);
  }

.mueusbd .mueusbd__card:hover::before,
.mueusbd .mueusbd__card:active::before {
    background: var(--item-hover-background, var(--theme_color));
    box-shadow: 0 21px 29px 0 color-mix(in srgb, var(--theme_color) 28%, transparent);
  }

.mueusbd .mueusbd__card:hover .mueusbd__image,
.mueusbd .mueusbd__card:active .mueusbd__image {
    transform: scale(1.1);
  }

.mueusbd .mueusbd__card:hover .mueusbd__body,
.mueusbd .mueusbd__card:active .mueusbd__body {
    background: transparent;
  }

.mueusbd .mueusbd__card:hover .mueusbd__circle--enter,
.mueusbd .mueusbd__card:active .mueusbd__circle--enter {
    width: 31px;
    height: 31px;
  }

.mueusbd .mueusbd__card:hover .mueusbd__circle--enter .yiyingbaoicon,
.mueusbd .mueusbd__card:active .mueusbd__circle--enter .yiyingbaoicon {
    width: var(--icon-size, 16px);
  }

.mueusbd .mueusbd__card:hover .mueusbd__circle--default,
.mueusbd .mueusbd__card:active .mueusbd__circle--default {
    width: 0;
    height: 0;
    margin-left: 0;
  }

.mueusbd .mueusbd__card:hover .mueusbd__circle--default .yiyingbaoicon,
.mueusbd .mueusbd__card:active .mueusbd__circle--default .yiyingbaoicon {
    width: 0;
  }

.mueusbd .mueusbd__card:hover .mueusbd__content,
.mueusbd .mueusbd__card:active .mueusbd__content {
    margin-left: 25px;
  }

.mueusbd .mueusbd__card:hover .mueusbd__name,
.mueusbd .mueusbd__card:active .mueusbd__name {
    color: var(--text-hover-color, #fff);
  }
}

@media (max-width: 1495px) and (min-width: 1280px) {
  .mueusbd .mueusbd__name {
    max-height: 44px;

  }

.mueusbd .mueusbd__circle {
    width: 26px;
    height: 26px;
  }

.mueusbd .mueusbd__circle--enter {
    width: 0;
    height: 0;
  }

.mueusbd .mueusbd__circle .yiyingbaoicon {
    width: var(--icon-size, 16px);
    font-size: var(--icon-size, 16px);
    line-height: var(--icon-size, 16px);
  }

.mueusbd .mueusbd__circle--enter .yiyingbaoicon {
    width: 0;
  }
}

@media (max-width: 1279px) and (min-width: 1024px) {
  .mueusbd .mueusbd__name {
    max-height: 36px;

  }

.mueusbd .mueusbd__circle {
    width: 22px;
    height: 22px;
  }

.mueusbd .mueusbd__circle--enter {
    width: 0;
    height: 0;
  }

.mueusbd .mueusbd__circle--default {
    margin-left: 6px;
  }

.mueusbd .mueusbd__circle .yiyingbaoicon {
    width: var(--icon-size, 16px);
    font-size: var(--icon-size, 16px);
    line-height: var(--icon-size, 16px);
  }
}

@media (max-width: 1023px) and (min-width: 768px) {
  .mueusbd .mueusbd__name {
    max-height: 32px;

  }

.mueusbd .mueusbd__circle {
    width: 20px;
    height: 20px;
  }

.mueusbd .mueusbd__circle--enter {
    width: 0;
    height: 0;
  }

.mueusbd .mueusbd__circle--default {
    margin-left: 5px;
  }

.mueusbd .mueusbd__circle .yiyingbaoicon {
    width: var(--icon-size, 16px);
    font-size: var(--icon-size, 16px);
    line-height: var(--icon-size, 16px);
  }
}

@media (max-width: 767px) {
  .mueusbd {
    text-align: center;
  }

.mueusbd .mueusbd__inner {
    padding-left: 1rem;
    padding-right: 1rem;
  }

.mueusbd .mueusbd__name {
    max-height: 30px;

  }

.mueusbd .mueusbd__circle {
    width: auto;
    height: auto;
  }

.mueusbd .mueusbd__circle--enter {
    width: 0;
    height: 0;
  }

.mueusbd .mueusbd__circle--default {
    margin-left: 5px;
  }

.mueusbd .mueusbd__circle .yiyingbaoicon {
    width: var(--icon-size, 16px);
    font-size: var(--icon-size, 16px);
    line-height: var(--icon-size, 16px);
  }
}

.mueusbd:dir(rtl) .mueusbd__content,
.mueusbd:is([lang|="ar"], [lang|="ar"] *) .mueusbd__content {
  margin-right: 0;
  margin-left: auto;
  text-align: right;
}

.mueusbd:dir(rtl) .mueusbd__circle--default,
.mueusbd:is([lang|="ar"], [lang|="ar"] *) .mueusbd__circle--default {
  margin-right: 10px;
  margin-left: 0;
}

@media (min-width: 1024px) {
  .mueusbd:dir(rtl) .mueusbd__card:hover .mueusbd__content,
.mueusbd:dir(rtl) .mueusbd__card:active .mueusbd__content,
.mueusbd:is([lang|="ar"], [lang|="ar"] *) .mueusbd__card:hover .mueusbd__content,
.mueusbd:is([lang|="ar"], [lang|="ar"] *) .mueusbd__card:active .mueusbd__content {
    margin-right: 25px;
    margin-left: auto;
  }

.mueusbd:dir(rtl) .mueusbd__card:hover .mueusbd__circle--default,
.mueusbd:dir(rtl) .mueusbd__card:active .mueusbd__circle--default,
.mueusbd:is([lang|="ar"], [lang|="ar"] *) .mueusbd__card:hover .mueusbd__circle--default,
.mueusbd:is([lang|="ar"], [lang|="ar"] *) .mueusbd__card:active .mueusbd__circle--default {
    margin-right: 0;
    margin-left: 0;
  }
}

@media (max-width: 1023px) {
  .mueusbd:dir(rtl) .mueusbd__circle--default,
.mueusbd:is([lang|="ar"], [lang|="ar"] *) .mueusbd__circle--default {
    margin-right: 5px;
    margin-left: 0;
  }
}


.mueusbd .sheet-watermark-wrap {position: relative; text-align: center; margin-bottom: 48px;}

.mueusbd .sheet-watermark-bg {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -55%); font-size: var(--text-current-size); font-weight: var(--text-weight); color: var(--text-color, var(--text-base-color)); letter-spacing: var(--text-letter-spacing); text-transform: var(--text-transform); white-space: nowrap; pointer-events: none; z-index: 1; user-select: none;}

.mueusbd .sheet-watermark-content {position: relative; z-index: 2;}

.mueusbd .sheet-section-title {font-size: var(--text-current-size); font-weight: var(--text-weight); color: var(--text-color, var(--text-base-color)); letter-spacing: var(--text-letter-spacing); text-transform: var(--text-transform); margin: 0px 0px 12px; line-height: var(--text-line-height);}

.mueusbd .sheet-section-subtitle {font-size: var(--text-current-size); color: var(--text-color, var(--text-base-color)); max-width: 780px; margin: 0px auto; line-height: var(--text-line-height);}

.mueusbd .mueusbd__card:hover,
.mueusbd .mueusbd__card:active {border-color: rgb(230, 0, 18) !important; box-shadow: rgba(230, 0, 18, 0.28) 0px 21px 29px 0px !important;}

.mueusbd .mueusbd__card:hover::before,
.mueusbd .mueusbd__card:active::before {background: var(--item-hover-background, var(--theme_color)) !important; box-shadow: rgba(230, 0, 18, 0.28) 0px 21px 29px 0px !important;}

.mueusbd .mueusbd__card:hover .mueusbd__name,
.mueusbd .mueusbd__card:active .mueusbd__name {color: var(--text-hover-color, rgb(255, 255, 255)) !important;}

.mueusbd .mueusbd__card:hover .mueusbd__circle--enter,
.mueusbd .mueusbd__card:active .mueusbd__circle--enter {background: var(--icon-hover-background, #fff) !important; color: var(--icon-hover-color, var(--icon-color)) !important;}

.mueusbd .mueusbd__grid {display: grid !important; grid-template-columns: repeat(var(--mueusbd-columns, 4), minmax(0px, 1fr)) !important; row-gap: var(--mueusbd-row-gap, 20px) !important; column-gap: var(--mueusbd-column-gap, 20px) !important; align-items: stretch !important; width: 100% !important;}

.mueusbd .mueusbd__card {border-radius: 6px; display: flex !important; flex-direction: column !important; height: 100% !important;}

.mueusbd .mueusbd__media {aspect-ratio: var(--image-ratio, 16 / 11) !important; border-radius: var(--image-shape, 0px);}

.mueusbd .mueusbd__body {padding: 22px 18px !important; flex-grow: 1 !important; display: flex !important; align-items: center !important;}

.mueusbd .mueusbd__name {font-size: var(--text-paint-size, var(--text-current-size)) !important; line-height: var(--text-line-height) !important; margin-bottom: 8px !important; min-height: 44px !important;}
@media (max-width: 1200px) {
  .mueusbd .mueusbd__grid {grid-template-columns: repeat(var(--mueusbd-columns-tablet, 2), minmax(0px, 1fr)) !important; row-gap: var(--mueusbd-row-gap, 20px) !important; column-gap: var(--mueusbd-column-gap, 20px) !important;}}
@media (max-width: 640px) {
  .mueusbd .mueusbd__grid {grid-template-columns: repeat(var(--mueusbd-columns-mobile, 1), minmax(0px, 1fr)) !important; row-gap: var(--mueusbd-row-gap, 20px) !important; column-gap: var(--mueusbd-column-gap, 20px) !important;}}

.mueusbd .mueusbd__summary {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: var(--text-current-size); line-height: var(--text-line-height); color: var(--text-color, var(--text-base-color)); margin-top: 6px; font-weight: var(--text-weight); text-transform: var(--text-transform); text-align: var(--text-align);}

.mueusbd .mueusbd__card:hover .mueusbd__summary {color: var(--text-hover-color, rgb(51, 65, 85));}

@media (max-width: 768px) {
  .mueusbd .mueusbd__inner { padding-bottom: var(--padding_tb, 0rem); } }

/* 2026-10-21：在原文字载体消费设计；标签切换只清除新增的浏览器段落外边距，不改变原排版间距。 */
.mueusbd .sheet-watermark-bg {
  --text-base-color: rgba(226, 232, 240, 0.55);
  font-family: var(--text-font, inherit);
  font-size: var(--text-current-size);
  font-weight: var(--text-weight);
  font-style: var(--text-style);
  text-decoration: var(--text-decoration);
  line-height: var(--text-line-height);
  letter-spacing: var(--text-letter-spacing);
  text-align: var(--text-align);
  text-transform: var(--text-transform);
}
.mueusbd .sheet-watermark-bg { margin: 0; }
.mueusbd .sheet-watermark-bg:hover {
  color: var(--text-hover-color);
  font-size: var(--text-hover-size);
  font-family: var(--text-hover-font);
  font-weight: var(--text-hover-weight);
  font-style: var(--text-hover-style);
  text-decoration: var(--text-hover-decoration);
}

.mueusbd .sheet-section-title {
  --text-base-color: #111827;
  font-family: var(--text-font, inherit);
  font-size: var(--text-current-size);
  font-weight: var(--text-weight);
  font-style: var(--text-style);
  text-decoration: var(--text-decoration);
  line-height: var(--text-line-height);
  letter-spacing: var(--text-letter-spacing);
  text-align: var(--text-align);
  text-transform: var(--text-transform);
}
.mueusbd .sheet-section-title:hover {
  color: var(--text-hover-color);
  font-size: var(--text-hover-size);
  font-family: var(--text-hover-font);
  font-weight: var(--text-hover-weight);
  font-style: var(--text-hover-style);
  text-decoration: var(--text-hover-decoration);
}

.mueusbd .sheet-section-subtitle {
  --text-base-color: #59677b;
  font-family: var(--text-font, inherit);
  font-size: var(--text-current-size);
  font-weight: var(--text-weight);
  font-style: var(--text-style);
  text-decoration: var(--text-decoration);
  line-height: var(--text-line-height);
  letter-spacing: var(--text-letter-spacing);
  text-align: var(--text-align);
  text-transform: var(--text-transform);
}
.mueusbd .sheet-section-subtitle:hover {
  color: var(--text-hover-color);
  font-size: var(--text-hover-size);
  font-family: var(--text-hover-font);
  font-weight: var(--text-hover-weight);
  font-style: var(--text-hover-style);
  text-decoration: var(--text-hover-decoration);
}

.mueusbd .mueusbd__name {
  --text-base-color: #222;
  --text-paint-size: var(--text-current-size);
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
  font-family: var(--text-font, inherit);
  font-size: var(--text-current-size);
  font-weight: var(--text-weight);
  font-style: var(--text-style);
  text-decoration: var(--text-decoration);
  line-height: var(--text-line-height);
  letter-spacing: var(--text-letter-spacing);
  text-align: var(--text-align);
  text-transform: var(--text-transform);
}
.mueusbd .mueusbd__card:hover .mueusbd__name,
.mueusbd .mueusbd__card:active .mueusbd__name {
  --text-paint-size: var(--text-hover-size);
  color: var(--text-hover-color);
  font-size: var(--text-hover-size);
  font-family: var(--text-hover-font);
  font-weight: var(--text-hover-weight);
  font-style: var(--text-hover-style);
  text-decoration: var(--text-hover-decoration);
}

.mueusbd .mueusbd__summary {
  --text-base-color: rgb(100, 116, 139);
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  font-family: var(--text-font, inherit);
  font-size: var(--text-current-size);
  font-weight: var(--text-weight);
  font-style: var(--text-style);
  text-decoration: var(--text-decoration);
  line-height: var(--text-line-height);
  letter-spacing: var(--text-letter-spacing);
  text-align: var(--text-align);
  text-transform: var(--text-transform);
}
.mueusbd .mueusbd__card:hover .mueusbd__summary {
  color: var(--text-hover-color);
  font-size: var(--text-hover-size);
  font-family: var(--text-hover-font);
  font-weight: var(--text-hover-weight);
  font-style: var(--text-hover-style);
  text-decoration: var(--text-hover-decoration);
}

.mueusbd .mueusbd__circle > img {
  display: block;
  width: var(--icon-size, 16px);
  height: var(--icon-size, 16px);
  object-fit: contain;
  overflow: hidden;
  transition: width .3s ease;
}
.mueusbd .mueusbd__circle--enter > img { width: 0; }
.mueusbd .mueusbd__card:hover .mueusbd__circle--default,
.mueusbd .mueusbd__card:active .mueusbd__circle--default {
  background: var(--icon-hover-background, var(--icon-background));
}
@media (min-width: 1024px) {
  .mueusbd .mueusbd__card:hover .mueusbd__circle--enter > img,
  .mueusbd .mueusbd__card:active .mueusbd__circle--enter > img { width: var(--icon-size, 16px); }
  .mueusbd .mueusbd__card:hover .mueusbd__circle--default > img,
  .mueusbd .mueusbd__card:active .mueusbd__circle--default > img { width: 0; }
}
/* 2026-09-18：固定平台结构配置消费；接到 Demo 已有 Root/Inner，不新增包装或作用于内部独立背景。 */
.mueusbd-component[data-style-section] {
  background-color: var(--ac-root-background-color, transparent);
  background-image: var(--ac-root-background-image, none);
  background-position: var(--ac-root-background-position, center);
  background-size: var(--ac-root-background-size, cover);
  background-repeat: var(--ac-root-background-repeat, no-repeat);
  margin-top: var(--ac-root-margin-tb, 0rem);
  margin-bottom: var(--ac-root-margin-tb, 0rem);
}

.mueusbd-component[data-style-section] > .mueusbd-component__inner {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--custom-content-max-width);
  margin-left: auto;
  margin-right: auto;
  padding-top: var(--padding_tb, 0rem);
  padding-bottom: var(--padding_tb, 0rem);
  padding-left: var(--padding_lr);
  padding-right: var(--padding_lr);
}

@media (max-width: 959px) {
  .mueusbd-component[data-style-section] > .mueusbd-component__inner {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

.mueusbd [hidden],
.mueusbd .advanced-list-empty:empty,
.mueusbd__list[data-empty="true"] .mueusbd__grid,
.mueusbd__list[data-empty="true"] .mueusbd__pagination,
.mueusbd__list[data-empty="true"] .mueusbd__infinite-sentinel {
  display: none !important;
}

.mueusbd[data-empty="true"] .sheet-watermark-wrap {
  margin-bottom: 0;
}

.mueusbd .mueusbd__pagination {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 32px;
}

.mueusbd .mueusbd__page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid currentColor;
  border-radius: 4px;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.mueusbd .mueusbd__page[aria-current="page"] {
  background: var(--pagination-active-background, var(--themeColor1, #e60012));
  border-color: var(--pagination-active-background, var(--themeColor1, #e60012));
  color: #fff;
}

.mueusbd .mueusbd__page:not([aria-current="page"]):hover {
  background: var(--pagination-hover-background, var(--themeColor1, #e60012));
  border-color: var(--pagination-hover-background, var(--themeColor1, #e60012));
  color: #fff;
}

.mueusbd .mueusbd__ellipsis {
  align-self: center;
}

.mueusbd .mueusbd__infinite-sentinel {
  display: block;
  height: 1px;
}
