:root {
  --tcm-page: #f6ead8;
  --tcm-paper: #fffaf0;
  --tcm-card: rgba(255, 254, 249, 0.98);
  --tcm-ink: #321507;
  --tcm-muted: #8b7665;
  --tcm-green: #557c4e;
  --tcm-brown: #9b5528;
  --tcm-brown-dark: #753819;
  --tcm-red: #96351f;
  --tcm-line: rgba(148, 93, 42, 0.16);
  --tcm-shadow: 0 5px 14px rgba(84, 50, 20, 0.12);
}

html,
body {
  width: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  overflow-x: hidden !important;
  background: #e7dcc8 !important;
}

html.codex-doctorhome-zhi-page,
body.codex-doctorhome-zhi-page {
  background: #fff !important;
}

#app,
#app * {
  box-sizing: border-box;
}

#app {
  --page-max: 804px;
  --tabbar-h: clamp(50px, 8.34vh, 100px);
}

#app,
#app .home-box.codex-tcm-home {
  color: var(--tcm-ink) !important;
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif !important;
}

#app .home-box.codex-tcm-home {
  --page-max: 804px;
  --page-pad-x: clamp(16px, 3.98vw, 32px);
  --tabbar-h: clamp(50px, 8.34vh, 100px);
  --brand-h: clamp(78px, 20vw, 160px);
  --action-x: clamp(32px, 7.96vw, 64px);
  --action-h: clamp(35px, 5.84vh, 70px);
  --top-icon: clamp(23px, 5.72vw, 46px);
  --arrow-size: clamp(17px, 4.23vw, 34px);
  --doctor-card-h: clamp(142px, 23.6vh, 284px);
  --doctor-photo: clamp(84px, 14.02vh, 168px);
  --doctor-photo-col: clamp(128px, 28.86vw, 232px);
  --feature-card-h: clamp(68px, 11.4vh, 136px);
  --feature-icon-bg: clamp(40px, 6.28vh, 76px);
  --feature-icon-size: clamp(22px, 3.58vh, 43px);
  --fold-card-h: clamp(62px, 10.4vh, 124px);
  --fold-subtitle-gap: clamp(3px, 0.75vw, 6px);
  --module-gap: clamp(8px, 1.15vh, 14px);
  --grid-gap: clamp(10px, 1.48vh, 18px);
  --card-radius: clamp(8px, 1.99vw, 16px);
  --large-radius: clamp(14px, 3.48vw, 28px);
  width: min(100%, var(--page-max)) !important;
  max-width: var(--page-max) !important;
  min-height: 100vh !important;
  margin: 0 auto !important;
  padding: 0 var(--page-pad-x) calc(var(--tabbar-h) + var(--module-gap)) !important;
  overflow-x: hidden !important;
  position: relative !important;
  background:
    linear-gradient(180deg, rgba(255, 250, 240, 0.98) 0 105px, rgba(248, 237, 220, 0.98) 105px 100%),
    var(--tcm-page) !important;
}

#app .home-box.codex-tcm-home > * {
  position: relative;
  z-index: 1;
}

#app .home-box.codex-tcm-home > .top.codex-original-actions {
  display: none !important;
}

/* Header copied from the provided design reference so the top visual matches. */
#app .codex-tcm-brand {
  height: var(--brand-h) !important;
  min-height: 0 !important;
  margin: 0 calc(-1 * var(--page-pad-x)) clamp(5px, 1.28vw, 10px) !important;
  overflow: hidden !important;
  background: url("/patient/assets/tcm-ref-header.png") center top / 114% auto no-repeat !important;
}

#app .codex-tcm-brand-main,
#app .codex-tcm-bamboo,
#app .codex-tcm-herbs {
  display: none !important;
}

/* Top two action cards. */
#app .codex-tcm-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 12px !important;
  margin: 0 var(--action-x) var(--module-gap) !important;
}

#app .codex-tcm-actions .top_con {
  width: 100% !important;
  min-width: 0 !important;
  height: var(--action-h) !important;
  margin: 0 !important;
  padding: 0 clamp(6px, 1.49vw, 12px) 0 clamp(8px, 1.99vw, 16px) !important;
  border: 1px solid var(--tcm-line) !important;
  border-radius: var(--card-radius) !important;
  background: var(--tcm-card) !important;
  box-shadow: var(--tcm-shadow) !important;
  display: grid !important;
  grid-template-columns: var(--top-icon) minmax(0, 1fr) var(--arrow-size) !important;
  align-items: center !important;
  gap: clamp(5px, 1.24vw, 10px) !important;
  overflow: hidden !important;
  color: var(--tcm-ink) !important;
}

#app .codex-tcm-actions .top_con::before {
  content: "";
  width: var(--top-icon);
  height: var(--top-icon);
  border-radius: 50%;
  border: 0;
  background:
    radial-gradient(circle at 50% 34%, var(--tcm-brown) 0 22%, transparent 23%),
    radial-gradient(ellipse at 50% 77%, var(--tcm-brown) 0 32%, transparent 33%),
    #f6ead8;
}

#app .codex-tcm-actions .top_con.is-register::before {
  border: 2px solid var(--tcm-brown);
  border-radius: 5px;
  background:
    linear-gradient(var(--tcm-brown), var(--tcm-brown)) 6px 7px / 13px 2px no-repeat,
    linear-gradient(var(--tcm-brown), var(--tcm-brown)) 6px 12px / 13px 2px no-repeat,
    linear-gradient(var(--tcm-brown), var(--tcm-brown)) 6px 17px / 9px 2px no-repeat;
}

#app .codex-tcm-actions .top_con::after {
  content: "›";
  width: var(--arrow-size);
  height: var(--arrow-size);
  border-radius: 50%;
  background: #f5ead9;
  color: #8a4a22;
  display: grid;
  place-items: center;
  font-size: clamp(17px, 4.23vw, 34px);
  line-height: 1;
}

#app .codex-tcm-actions .top_con img,
#app .codex-tcm-actions .top_con .images,
#app .codex-tcm-actions .top_con span:last-child {
  display: none !important;
}

#app .codex-tcm-actions .top_con span,
#app .codex-tcm-actions .top_con div {
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--tcm-ink) !important;
  font-size: clamp(15px, 3.73vw, 30px) !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
}

/* Doctor card. */
#app .home-box.codex-tcm-home > .doctor {
  margin: 0 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#app .home-box.codex-tcm-home > .doctor .codex-doctor-main {
  height: var(--doctor-card-h) !important;
  min-height: var(--doctor-card-h) !important;
  margin: 0 0 var(--module-gap) !important;
  padding: clamp(13px, 3.23vw, 26px) clamp(16px, 3.98vw, 32px) !important;
  border: 1px solid var(--tcm-line) !important;
  border-radius: var(--large-radius) !important;
  background:
    url("/patient/assets/tcm-ref-doctor-bamboo.png") right clamp(8px, 1.99vw, 16px) bottom clamp(9px, 2.24vw, 18px) / clamp(42px, 10.45vw, 84px) clamp(64px, 15.92vw, 128px) no-repeat,
    linear-gradient(165deg, rgba(132, 119, 95, 0.10) 0 22%, transparent 42%) left 60% / 160px 80px no-repeat,
    linear-gradient(180deg, rgba(255, 255, 252, 0.99), rgba(255, 251, 244, 0.98)) !important;
  box-shadow: var(--tcm-shadow) !important;
  display: grid !important;
  grid-template-columns: var(--doctor-photo-col) minmax(0, 1fr) !important;
  grid-template-areas:
    "photo name"
    "photo rate"
    "photo action" !important;
  column-gap: clamp(12px, 2.99vw, 24px) !important;
  row-gap: clamp(4px, 1vw, 8px) !important;
  align-items: center !important;
  overflow: hidden !important;
}

#app .home-box.codex-tcm-home > .doctor .doctorMessage,
#app .home-box.codex-tcm-home > .doctor .doctorMessage .left,
#app .home-box.codex-tcm-home > .doctor .doctorMessage .left > div {
  display: contents !important;
}

#app .home-box.codex-tcm-home > .doctor .doctorMessage img {
  grid-area: photo;
  width: var(--doctor-photo) !important;
  height: var(--doctor-photo) !important;
  margin: 2px auto 0 !important;
  border: 1px solid rgba(202, 151, 88, 0.38) !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  box-shadow: 0 0 0 clamp(9px, 2.24vw, 18px) rgba(248, 236, 216, 0.86) !important;
}

#app .home-box.codex-tcm-home > .doctor .doctorName {
  grid-area: name;
  min-width: 0 !important;
  align-self: end !important;
  color: var(--tcm-ink) !important;
  font-family: "KaiTi", "STKaiti", "Microsoft YaHei", serif !important;
  font-size: clamp(24px, 6.35vw, 54px) !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  transform: translateY(4px) !important;
}

#app .home-box.codex-tcm-home > .doctor .doctorMessage .right {
  display: contents !important;
}

#app .home-box.codex-tcm-home > .doctor .healing {
  grid-area: rate;
  justify-self: start !important;
  align-self: center !important;
  display: flex !important;
  align-items: center !important;
  gap: clamp(7px, 1.74vw, 14px) !important;
  color: #40210f !important;
  font-size: clamp(15px, 4.23vw, 34px) !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  transform: translateY(5px) !important;
}

#app .home-box.codex-tcm-home > .doctor .healing::before {
  content: "";
  width: clamp(24px, 5.97vw, 48px);
  height: clamp(24px, 5.97vw, 48px);
  flex: 0 0 clamp(24px, 5.97vw, 48px);
  border-radius: clamp(7px, 1.74vw, 14px);
  background:
    linear-gradient(135deg, transparent 0 40%, #fff7e8 41% 50%, transparent 51%),
    linear-gradient(180deg, #d6a154, #b36f2e);
}

#app .home-box.codex-tcm-home > .doctor .healing .codex-rate-number {
  color: var(--tcm-red) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(24px, 7.21vw, 58px) !important;
  font-weight: 700 !important;
}

#app .home-box.codex-tcm-home > .doctor .wenz {
  grid-area: action;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-height: clamp(34px, 8.46vw, 68px) !important;
  margin: 0 !important;
  transform: translateY(10px) !important;
}

#app .home-box.codex-tcm-home > .doctor .wenz .van-button {
  width: min(100%, clamp(154px, 38.31vw, 308px)) !important;
  height: clamp(34px, 8.46vw, 68px) !important;
  min-height: clamp(34px, 8.46vw, 68px) !important;
  padding: 0 clamp(14px, 3.48vw, 28px) !important;
  border: 1px solid rgba(109, 60, 27, 0.32) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #a96130 0%, var(--tcm-brown-dark) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.32),
    0 6px 13px rgba(92, 48, 18, 0.26) !important;
  color: #fff8ec !important;
  font-size: clamp(21px, 5.97vw, 48px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

#app .home-box.codex-tcm-home > .doctor .wenz .van-button::before,
#app .home-box.codex-tcm-home > .doctor .wenz .van-button::after {
  display: none !important;
}

/* Two feature cards. */
#app .home-box.codex-tcm-home > .doctor .doctorHome-enter,
#app .home-box.codex-tcm-home > .doctor .enter-con {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

#app .home-box.codex-tcm-home > .doctor .enter-con {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: var(--grid-gap) clamp(10px, 2.49vw, 20px) !important;
}

#app .home-box.codex-tcm-home > .doctor .ents {
  display: contents !important;
}

#app .home-box.codex-tcm-home > .doctor .cons {
  width: 100% !important;
  min-width: 0 !important;
  height: var(--feature-card-h) !important;
  min-height: var(--feature-card-h) !important;
  margin: 0 !important;
  padding: clamp(7px, 1.74vw, 14px) clamp(5px, 1.24vw, 10px) clamp(7px, 1.74vw, 14px) clamp(7px, 1.74vw, 14px) !important;
  border: 1px solid rgba(145, 93, 40, 0.14) !important;
  border-radius: var(--card-radius) !important;
  background: var(--tcm-card) !important;
  box-shadow: var(--tcm-shadow) !important;
  display: grid !important;
  grid-template-columns: var(--feature-icon-bg) minmax(0, 1fr) clamp(16px, 4.1vw, 32px) !important;
  align-items: center !important;
  gap: clamp(3px, 0.77vw, 7px) !important;
  overflow: hidden !important;
  color: var(--tcm-ink) !important;
  text-align: left !important;
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="case"],
#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="follow"] {
  display: none !important;
}

#app .home-box.codex-tcm-home > .doctor .cons::before {
  content: "";
  grid-column: 1;
  grid-row: 1;
  width: var(--feature-icon-bg);
  height: var(--feature-icon-bg);
  border-radius: 50%;
  background: #fbf1df;
}

#app .home-box.codex-tcm-home > .doctor .cons::after {
  content: "›";
  grid-column: 3;
  grid-row: 1;
  width: clamp(18px, 4.48vw, 36px);
  height: clamp(18px, 4.48vw, 36px);
  border-radius: 50%;
  background: #f5ead9;
  color: #8a4a22;
  display: grid;
  place-items: center;
  font-family: "Microsoft YaHei", Arial, sans-serif;
  font-size: clamp(16px, 3.98vw, 32px);
  line-height: 1;
}

#app .home-box.codex-tcm-home > .doctor .cons img {
  display: none !important;
}

#app .home-box.codex-tcm-home > .doctor .cons .codex-feature-icon {
  grid-column: 1;
  grid-row: 1;
  justify-self: center;
  align-self: center;
  width: var(--feature-icon-size);
  height: var(--feature-icon-size);
  color: var(--tcm-green);
  z-index: 2;
  position: relative;
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="case"] .codex-feature-icon {
  border: 3px solid currentColor;
  border-radius: 3px;
  box-shadow: inset 6px 0 0 rgba(85, 124, 78, 0.18);
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="case"] .codex-feature-icon::before,
#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="case"] .codex-feature-icon::after {
  content: "";
  position: absolute;
  left: 8px;
  right: 4px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="case"] .codex-feature-icon::before {
  top: 7px;
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="case"] .codex-feature-icon::after {
  top: 14px;
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="learn"] .codex-feature-icon::before,
#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="learn"] .codex-feature-icon::after {
  content: "";
  position: absolute;
  top: 3px;
  width: 12px;
  height: 21px;
  border: 3px solid currentColor;
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="learn"] .codex-feature-icon::before {
  left: 1px;
  border-right-width: 1px;
  border-radius: 4px 0 0 4px;
  transform: skewY(7deg);
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="learn"] .codex-feature-icon::after {
  right: 1px;
  border-left-width: 1px;
  border-radius: 0 4px 4px 0;
  transform: skewY(-7deg);
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="follow"] .codex-feature-icon {
  background:
    radial-gradient(circle at 30% 33%, currentColor 0 6px, transparent 7px),
    radial-gradient(circle at 68% 33%, currentColor 0 5px, transparent 6px),
    radial-gradient(ellipse at 30% 78%, currentColor 0 10px, transparent 11px),
    radial-gradient(ellipse at 70% 78%, currentColor 0 8px, transparent 9px);
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="box"] .codex-feature-icon {
  border: 3px solid currentColor;
  border-radius: 3px;
  margin-top: 4px;
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="box"] .codex-feature-icon::before {
  content: "";
  position: absolute;
  left: -5px;
  right: -5px;
  top: -8px;
  height: 8px;
  border: 3px solid currentColor;
  border-radius: 4px 4px 1px 1px;
}

#app .home-box.codex-tcm-home > .doctor .cons[data-tcm-kind="box"] .codex-feature-icon::after {
  content: "福";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: currentColor;
  color: #fbf1df;
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
  line-height: 15px;
  text-align: center;
  transform: translate(-50%, -47%);
}

#app .home-box.codex-tcm-home > .doctor .cons span {
  grid-column: 2;
  grid-row: 1;
  min-width: 0 !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: clamp(2px, 0.5vw, 4px) !important;
}

#app .home-box.codex-tcm-home > .doctor .cons .codex-feature-title {
  max-width: 100% !important;
  color: var(--tcm-ink) !important;
  font-family: "KaiTi", "STKaiti", "Microsoft YaHei", serif !important;
  font-size: clamp(17px, 4.55vw, 36px) !important;
  font-style: normal !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  white-space: normal !important;
  overflow: hidden !important;
  text-overflow: clip !important;
}

#app .home-box.codex-tcm-home > .doctor .cons .codex-feature-title-main,
#app .home-box.codex-tcm-home > .doctor .cons .codex-feature-title-tail {
  display: block !important;
  font: inherit !important;
  color: inherit !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  max-width: 100% !important;
}

#app .home-box.codex-tcm-home > .doctor .cons .codex-feature-title-tail {
  margin-top: 1px !important;
}

#app .home-box.codex-tcm-home > .doctor .cons .codex-feature-meta {
  color: var(--tcm-green) !important;
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif !important;
  font-size: clamp(12px, 3.2vw, 26px) !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: clip !important;
}

#app .home-box.codex-tcm-home > .doctor .cons .codex-feature-meta-empty {
  visibility: hidden !important;
}

/* Collapsible lower panels. */
#app .home-box.codex-tcm-home > .comment,
#app .home-box.codex-tcm-home > .content,
#app .home-box.codex-tcm-home > .bottom {
  margin: 0 0 var(--module-gap) !important;
  padding: 0 !important;
  border: 1px solid rgba(145, 93, 40, 0.14) !important;
  border-radius: var(--card-radius) !important;
  background: var(--tcm-card) !important;
  box-shadow: var(--tcm-shadow) !important;
  overflow: hidden !important;
}

#app .home-box.codex-tcm-home .codex-collapsible-section {
  transition: max-height 0.22s ease, height 0.22s ease;
}

#app .home-box.codex-tcm-home .codex-collapsible-section.codex-collapsed {
  height: var(--fold-card-h) !important;
  min-height: var(--fold-card-h) !important;
  max-height: var(--fold-card-h) !important;
}

#app .home-box.codex-tcm-home .codex-case-section.codex-collapsed .change,
#app .home-box.codex-tcm-home .codex-case-section.codex-collapsed > div:not(.diagnosis),
#app .home-box.codex-tcm-home .codex-follow-section.codex-collapsed > div:not(.diagnosis),
#app .home-box.codex-tcm-home .codex-review-section.codex-collapsed .doctorHome-enter,
#app .home-box.codex-tcm-home .codex-review-section.codex-collapsed .listbg,
#app .home-box.codex-tcm-home .codex-review-section.codex-collapsed .scroll {
  display: none !important;
}

#app .home-box.codex-tcm-home .comment-top,
#app .home-box.codex-tcm-home .diagnosis {
  height: var(--fold-card-h) !important;
  min-height: var(--fold-card-h) !important;
  margin: 0 !important;
  padding: clamp(5px, 1.24vw, 10px) clamp(38px, 9.45vw, 76px) clamp(5px, 1.24vw, 10px) clamp(72px, 17.91vw, 144px) !important;
  border: 0 !important;
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  column-gap: clamp(10px, 2.56vw, 20px) !important;
  align-content: center !important;
  align-items: center !important;
  color: var(--tcm-ink) !important;
  font-family: "KaiTi", "STKaiti", "Microsoft YaHei", serif !important;
  font-size: clamp(19px, 5.47vw, 44px) !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  cursor: pointer !important;
  user-select: none !important;
}

#app .home-box.codex-tcm-home .codex-review-section .comment-top {
  background: url("/patient/assets/tcm-ref-review-flower.png") right clamp(10px, 2.49vw, 20px) bottom clamp(4px, 1vw, 8px) / clamp(74px, 18.41vw, 148px) auto no-repeat !important;
}

#app .home-box.codex-tcm-home .codex-case-section .diagnosis {
  background: url("/patient/assets/tcm-ref-case-book.png") right clamp(8px, 1.99vw, 16px) bottom clamp(2px, 0.5vw, 4px) / clamp(84px, 20.9vw, 168px) auto no-repeat !important;
}

#app .home-box.codex-tcm-home .codex-follow-section .diagnosis {
  background: none !important;
}

#app .home-box.codex-tcm-home .codex-follow-section:not(.codex-collapsed) .diagnosis {
  background: url("/patient/assets/tcm-ref-follow-flower.png") right clamp(10px, 2.49vw, 20px) bottom clamp(-22px, -5.47vw, -11px) / clamp(60px, 14.93vw, 120px) auto no-repeat !important;
}

#app .home-box.codex-tcm-home .comment-top::before,
#app .home-box.codex-tcm-home .diagnosis::before {
  content: "";
  position: absolute;
  left: clamp(21px, 5.22vw, 42px);
  top: 50%;
  width: clamp(39px, 9.7vw, 78px);
  height: clamp(39px, 9.7vw, 78px);
  border-radius: 50%;
  background: #fbf1df;
  transform: translateY(-50%);
}

#app .home-box.codex-tcm-home .comment-top::after,
#app .home-box.codex-tcm-home .diagnosis::after {
  content: "";
  position: absolute;
  right: clamp(12px, 2.99vw, 24px);
  top: 50%;
  width: clamp(8px, 1.99vw, 16px);
  height: clamp(8px, 1.99vw, 16px);
  border-right: clamp(2px, 0.5vw, 4px) solid rgba(85, 124, 78, 0.75);
  border-bottom: clamp(2px, 0.5vw, 4px) solid rgba(85, 124, 78, 0.75);
  transform: translateY(-65%) rotate(45deg);
}

#app .home-box.codex-tcm-home .codex-collapsible-section:not(.codex-collapsed) .comment-top::after,
#app .home-box.codex-tcm-home .codex-collapsible-section:not(.codex-collapsed) .diagnosis::after {
  transform: translateY(-35%) rotate(225deg);
}

#app .home-box.codex-tcm-home .comment-top > div:first-child {
  min-width: 0 !important;
  display: flex !important;
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  flex-direction: column !important;
  gap: var(--fold-subtitle-gap) !important;
  justify-self: start !important;
  align-self: center !important;
  color: var(--tcm-ink) !important;
}

#app .home-box.codex-tcm-home .comment-top > div:first-child > div {
  color: var(--tcm-ink) !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: clip !important;
}

#app .home-box.codex-tcm-home .diagnosis > .codex-section-title {
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  min-width: 0 !important;
  max-width: 100% !important;
  color: var(--tcm-ink) !important;
  font: inherit !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: clip !important;
}

#app .home-box.codex-tcm-home .comment-top > div:first-child::after {
  content: "真实反馈，见证康复之路";
  display: block !important;
  align-self: start !important;
  color: var(--tcm-green) !important;
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif !important;
  font-size: clamp(11px, 3.23vw, 26px) !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
}

#app .home-box.codex-tcm-home .diagnosis > span {
  display: block !important;
  grid-column: 1 !important;
  grid-row: 2 !important;
  justify-self: start !important;
  margin-top: var(--fold-subtitle-gap) !important;
  color: var(--tcm-green) !important;
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif !important;
  font-size: clamp(11px, 3.23vw, 26px) !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: clip !important;
}

#app .home-box.codex-tcm-home .codex-case-section .diagnosis > span {
  text-indent: clamp(-12px, -3.08vw, -6px) !important;
}

#app .home-box.codex-tcm-home .codex-follow-section .diagnosis > span {
  text-indent: clamp(-8px, -2.05vw, -4px) !important;
}

#app .home-box.codex-tcm-home .comment-top .ping {
  display: none !important;
}

#app .home-box.codex-tcm-home .comment-top > div:last-child,
#app .home-box.codex-tcm-home .diagnosis > div {
  position: static !important;
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  justify-self: end !important;
  align-self: center !important;
  transform: none !important;
  color: var(--tcm-green) !important;
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif !important;
  font-size: clamp(14px, 3.98vw, 32px) !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  max-width: clamp(72px, 18.46vw, 148px) !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  cursor: pointer !important;
}

#app .home-box.codex-tcm-home .comment-top > div:last-child {
  right: auto !important;
}

#app .home-box.codex-tcm-home .codex-review-section .comment-top::before {
  box-shadow: inset 0 0 0 0 #fff;
}

#app .home-box.codex-tcm-home .codex-review-section .comment-top > div:first-child::before,
#app .home-box.codex-tcm-home .codex-case-section .diagnosis::before,
#app .home-box.codex-tcm-home .codex-follow-section .diagnosis::before {
  color: var(--tcm-green);
}

#app .home-box.codex-tcm-home .codex-review-section .comment-top > div:first-child::before {
  content: "";
  position: absolute;
  left: clamp(27px, 6.72vw, 54px);
  top: 50%;
  width: clamp(27px, 6.72vw, 54px);
  height: clamp(27px, 6.72vw, 54px);
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2040%2040%27%20fill%3D%27none%27%3E%3Cpath%20d%3D%27M20%2031V18%27%20stroke%3D%27%23557c4e%27%20stroke-width%3D%273.4%27%20stroke-linecap%3D%27round%27%2F%3E%3Cpath%20d%3D%27M20%2018C15.2%2010.2%208.2%209.7%206.6%2016.3C12.2%2019.6%2017.1%2019.3%2020%2018Z%27%20fill%3D%27%23557c4e%27%2F%3E%3Cpath%20d%3D%27M20%2017.8C24.8%2010%2031.8%209.5%2033.4%2016.1C27.8%2019.5%2022.9%2019.2%2020%2017.8Z%27%20fill%3D%27%23557c4e%27%2F%3E%3Cpath%20d%3D%27M12%2031H28%27%20stroke%3D%27%23557c4e%27%20stroke-width%3D%273.4%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  transform: translateY(-50%);
}

#app .home-box.codex-tcm-home .codex-case-section .diagnosis::before {
  border-radius: 50%;
  background:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2040%2040%27%20fill%3D%27none%27%3E%3Cpath%20d%3D%27M7%2010.5C11.8%209.1%2016.1%209.9%2020%2012.4V31C16.1%2028.5%2011.8%2027.7%207%2029.1V10.5Z%27%20stroke%3D%27%23557c4e%27%20stroke-width%3D%273.2%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M33%2010.5C28.2%209.1%2023.9%209.9%2020%2012.4V31C23.9%2028.5%2028.2%2027.7%2033%2029.1V10.5Z%27%20stroke%3D%27%23557c4e%27%20stroke-width%3D%273.2%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M12%2016H16M12%2021H16M24%2016H28M24%2021H28%27%20stroke%3D%27%23557c4e%27%20stroke-width%3D%272.4%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fsvg%3E") center / clamp(28px, 6.97vw, 56px) clamp(28px, 6.97vw, 56px) no-repeat,
    linear-gradient(#fbf1df, #fbf1df);
  box-shadow: inset 0 0 0 0 transparent;
}

#app .home-box.codex-tcm-home .codex-case-section .diagnosis::after,
#app .home-box.codex-tcm-home .codex-follow-section .diagnosis::after,
#app .home-box.codex-tcm-home .codex-review-section .comment-top::after {
  z-index: 3;
}

#app .home-box.codex-tcm-home .codex-case-section .diagnosis {
  --case-icon: var(--tcm-green);
}

#app .home-box.codex-tcm-home .codex-follow-section .diagnosis::before {
  border-radius: 50%;
  background:
    radial-gradient(circle at 36% 38%, var(--tcm-green) 0 6px, transparent 7px),
    radial-gradient(circle at 66% 39%, var(--tcm-green) 0 5px, transparent 6px),
    radial-gradient(ellipse at 36% 75%, var(--tcm-green) 0 9px, transparent 10px),
    radial-gradient(ellipse at 68% 75%, var(--tcm-green) 0 7px, transparent 8px),
    #fbf1df;
}

#app .home-box.codex-tcm-home .codex-case-section:not(.codex-collapsed),
#app .home-box.codex-tcm-home .codex-follow-section:not(.codex-collapsed),
#app .home-box.codex-tcm-home .codex-review-section:not(.codex-collapsed) {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

#app .home-box.codex-tcm-home .codex-follow-section:not(.codex-collapsed) > div:not(.diagnosis),
#app .home-box.codex-tcm-home .codex-case-section:not(.codex-collapsed) > div:not(.diagnosis) {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

#app .home-box.codex-tcm-home .codex-case-section .change {
  display: block !important;
  margin: 0 8px 8px !important;
  overflow: hidden !important;
  border-radius: 6px !important;
}

#app .home-box.codex-tcm-home .codex-review-section:not(.codex-collapsed) .doctorHome-enter {
  display: block !important;
  padding: 0 12px 10px !important;
}

#app .home-box.codex-tcm-home .codex-review-section .scroll {
  height: 126px !important;
  overflow: hidden !important;
}

#app .home-box.codex-tcm-home .codex-review-section .item,
#app .home-box.codex-tcm-home .contents {
  color: #4a2d17 !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

#app .home-box.codex-tcm-home .contents {
  padding: clamp(11px, 2.74vw, 22px) clamp(14px, 3.48vw, 28px) !important;
}

#app .home-box.codex-tcm-home .contents .title {
  color: var(--tcm-ink) !important;
  font-family: "KaiTi", "STKaiti", "Microsoft YaHei", serif !important;
  font-size: clamp(21px, 5.22vw, 42px) !important;
  font-weight: 900 !important;
}

#app .home-box.codex-tcm-home .contents .text {
  color: #6f5a45 !important;
  font-size: 14px !important;
}

/* Bottom tabbar. */
#app .van-tabbar,
#app .van-tabbar--fixed {
  width: min(100%, var(--page-max)) !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  height: var(--tabbar-h) !important;
  border-top: 1px solid rgba(145, 93, 40, 0.14) !important;
  background: rgba(255, 253, 249, 0.98) !important;
  box-shadow: 0 -4px 12px rgba(72, 47, 24, 0.10) !important;
}

#app .van-tabbar-item {
  color: #746a61 !important;
  background: transparent !important;
  font-size: clamp(13px, 3.23vw, 26px) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

#app .van-tabbar-item--active,
#app .codex-tab-home {
  color: var(--tcm-brown) !important;
  font-weight: 800 !important;
}

#app .van-tabbar-item .van-icon {
  font-size: clamp(21px, 5.22vw, 42px) !important;
}

#app .codex-tab-home .van-tabbar-item__icon::after {
  content: "";
  display: block;
  width: clamp(20px, 4.98vw, 40px);
  height: clamp(3px, 0.75vw, 6px);
  margin: clamp(3px, 0.75vw, 6px) auto 0;
  border-radius: 999px;
  background: var(--tcm-brown);
}

#app .codex-tab-center {
  color: var(--tcm-brown) !important;
  transform: translateY(clamp(-7px, -1.24vw, -5px)) !important;
}

#app .codex-tab-center .van-tabbar-item__icon {
  width: clamp(30px, 7.46vw, 60px) !important;
  height: clamp(30px, 7.46vw, 60px) !important;
  margin: 0 auto !important;
  border-radius: 50% !important;
  background: transparent !important;
  display: grid !important;
  place-items: center !important;
  box-shadow: none !important;
}

#app .codex-tab-center .van-tabbar-item__icon::before {
  content: none !important;
}

#app .codex-tab-center .van-tabbar-item__icon img,
#app .codex-tab-center .van-tabbar-item__icon .van-icon__image {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  filter: none !important;
  opacity: 1 !important;
}

#app .van-tabbar-item:not(.codex-tab-center) .van-tabbar-item__icon img,
#app .van-tabbar-item:not(.codex-tab-center) .van-tabbar-item__icon .van-icon__image {
  filter: none !important;
  opacity: 0.72 !important;
}

#app .van-tabbar-item.codex-tab-shop:not(.codex-tab-center) .van-tabbar-item__icon img,
#app .van-tabbar-item.codex-tab-shop:not(.codex-tab-center) .van-tabbar-item__icon .van-icon__image {
  filter: none !important;
  opacity: 1 !important;
  width: clamp(38px, 10.77vw, 46px) !important;
  height: clamp(38px, 10.77vw, 46px) !important;
  left: 50% !important;
  top: clamp(-24px, -5.64vw, -20px) !important;
  transform: translateX(-50%) !important;
  border-width: 2px !important;
  box-sizing: border-box !important;
}

#app .van-tabbar-item.codex-tab-shop .van-tabbar-item__text > div {
  margin-top: clamp(25px, 6.92vw, 30px) !important;
}

body.codex-doctorhome-zhi-page #app,
body.codex-doctorhome-zhi-page #app .doctorHome {
  background: #fff !important;
  color: #111 !important;
}

body.codex-doctorhome-zhi-page #app .doctorHome-header {
  background: #fff !important;
  background-image: none !important;
  color: #111 !important;
}

body.codex-doctorhome-zhi-page #app .doctorHome-header *,
body.codex-doctorhome-zhi-page #app .doctorHome-content,
body.codex-doctorhome-zhi-page #app .doctorHome-content *,
body.codex-doctorhome-zhi-page #app .doctorHome-enter,
body.codex-doctorhome-zhi-page #app .doctorHome-enter *,
body.codex-doctorhome-zhi-page #app .doctorHome-intro,
body.codex-doctorhome-zhi-page #app .doctorHome-intro * {
  color: #111 !important;
}

body.codex-doctorhome-zhi-page #app .doctorHome-content,
body.codex-doctorhome-zhi-page #app .doctorHome-enter,
body.codex-doctorhome-zhi-page #app .doctorHome-intro {
  background-color: #fff !important;
}

@media (max-width: 370px) {
  #app .home-box.codex-tcm-home {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  #app .codex-tcm-brand {
    margin-left: -12px !important;
    margin-right: -12px !important;
  }

  #app .codex-tcm-actions {
    margin-left: 24px !important;
    margin-right: 24px !important;
  }

  #app .home-box.codex-tcm-home > .doctor .codex-doctor-main {
    grid-template-columns: 104px minmax(0, 1fr) !important;
    padding-left: 13px !important;
    padding-right: 13px !important;
  }

  #app .home-box.codex-tcm-home > .doctor .doctorMessage img {
    width: 82px !important;
    height: 82px !important;
  }
}
