html,
body {
  font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Segoe UI", Arial, sans-serif !important;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
  font-family: inherit !important;
  letter-spacing: 0;
}

b,
strong,
.logo b,
.brand,
.panel-head,
.dialog-head,
.auth-head,
.card-title h2,
.panel-title h2,
.head h2,
.view-head h1,
.toolbar h1,
.side-title,
.section-title,
.entity-cell strong,
.material-cell strong,
.price-cell strong,
.amount-cell,
.stat b {
  font-weight: 500 !important;
}

.topbar .crumb,
.page-heading .crumb,
.admin .crumb {
  font-weight: 500 !important;
}

.crumb {
  font-weight: 400 !important;
}

.nav a,
.top-actions a,
.top-actions button,
.user,
.user a,
.user span,
.user b,
.profile b,
#coinCount,
.side a,
.tabs button,
.auth-tabs button,
.mode-tabs button,
.chips a,
.tag-group a,
.toolbar label,
.field label,
.form-line label,
.line label,
.custom label,
.pay b {
  font-weight: 400 !important;
}

.nav a.active,
.nav a:hover,
.tabs button.active,
.auth-tabs button.active,
.mode-tabs button.active,
.chips a.active,
.tag-group a.active,
.user .recharge-link,
.top-actions b,
.side a.active,
.summary b,
.view-note b,
.pay-status,
.link-list span {
  font-weight: 500 !important;
}

.btn,
.submit,
.download,
.buy,
.generate,
.pay-close,
.send-code,
.auth-submit,
.dialog-actions a,
.tool-actions button,
.multi-actions button,
.script-line .voice-bind button,
.script-line .del-line,
.pwd-toggle,
.reset,
.ops button,
.pager button,
.member-card button,
.plan .buy,
.voice-preview-btn,
.voice-fav,
.voice-item em,
.audio-control,
.audio-actions a,
.audio-actions button {
  font-weight: 500 !important;
}

.title,
.audio-title,
.cat b,
.card b,
.side-card b,
.user-card h2,
.plan h3,
.voice-current b,
.voice-item b,
.role,
.emotion-title b,
.tool-dialog h3,
.float-service-panel b,
.notice b,
.safe b {
  font-weight: 500 !important;
}

.meta,
.meta b,
.card p,
.cat span,
.side-card span,
.voice-current span,
.voice-item span,
.material-cell small,
.entity-cell small,
.price-cell small,
.page-heading small,
.muted,
.note,
.hint,
.tip,
.auth-switch,
.voice-count,
.multi-tip {
  font-weight: 400 !important;
}

.tag,
.badge,
.status,
.layui-table th,
.table th {
  font-weight: 500 !important;
}

#topicChips a {
  font-size: 14px !important;
  font-weight: 500 !important;
}

#roleChips .tag-group a {
  font-size: 13px !important;
  font-weight: 400 !important;
}

#roleChips .tag-group a.active {
  font-weight: 500 !important;
}

.float-service-btn {
  font-weight: 500 !important;
}

.hero h1,
.box h1,
.voice-head h1,
.welcome h1,
.login h1,
.info h3,
.pay-box h3 {
  font-weight: 500 !important;
}

.plan .price,
.card strong {
  font-weight: 500 !important;
}

code,
pre,
.advanced-fields textarea {
  font-family: Consolas, "SFMono-Regular", Menlo, Monaco, monospace !important;
}

/* Common header and account area polish */
.header .top {
  min-height: 66px;
}

.header .search {
  border-color: #dfe5ec !important;
  box-shadow: inset 0 1px 0 rgba(18, 28, 40, .02);
}

.header .search button {
  background: #2b3138 !important;
  color: #fff !important;
}

.header .user {
  min-height: 38px;
  gap: 8px !important;
  align-items: center !important;
  color: #5f6b7a !important;
  font-size: 13px !important;
}

.header .user.logged {
  gap: 6px !important;
  padding: 4px 6px 4px 10px;
  border: 1px solid #e3e8ef;
  border-radius: 8px;
  background: #fbfcfe;
  box-shadow: 0 1px 2px rgba(20, 32, 48, .03);
}

.header .user.logged::before {
  content: "我的账户";
  display: inline-flex;
  align-items: center;
  height: 28px;
  max-width: 96px;
  padding: 0 8px;
  color: #252b31;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.header .user:not(.logged) a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 12px;
  border-radius: 7px;
  color: #475467 !important;
}

.header .user:not(.logged) #loginLink {
  background: #2f8dfb;
  color: #fff !important;
}

.header .user:not(.logged) #registerLink {
  border: 1px solid #dbe3ec;
  background: #fff;
}

.header .user:not(.logged) #logoutLink,
.header .user:not(.logged) .profile {
  display: none !important;
}

.header .user .profile {
  align-items: center !important;
}

.header .coin-state {
  height: 28px;
  gap: 4px !important;
  padding: 0 9px;
  border: 1px solid #d8e8ff;
  border-radius: 999px;
  background: #f5f9ff;
  color: #58708d !important;
}

.header .coin-state b,
.header #coinCount {
  color: #1677d2 !important;
  font-variant-numeric: tabular-nums;
}

.header .user .recharge-link,
.header .user a[href*="recharge"].profile {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: #1677d2;
  color: #fff !important;
}

.header .user a[href*="member"].profile,
.header .user #memberCenterLink {
  height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  color: #596579 !important;
}

.header .user #logoutLink {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 6px;
  color: #8a94a3 !important;
}

.header .user #logoutLink:hover,
.header .user a[href*="member"].profile:hover,
.header .user #memberCenterLink:hover {
  color: #1677d2 !important;
  background: #f1f7ff;
}

.header .user:not(#userBox) {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid #e3e8ef;
  border-radius: 999px;
  background: #fbfcfe;
  color: #5f6b7a !important;
}

.header .nav {
  height: 42px !important;
}

.header .nav .wrap {
  height: 42px !important;
  gap: 4px;
}

.header .nav a {
  line-height: 42px !important;
  padding: 0 15px !important;
  color: #4b5563 !important;
  font-size: 14px !important;
  border-bottom-width: 2px !important;
}

.header .nav a.active,
.header .nav a:hover {
  color: #1677d2 !important;
  background: transparent !important;
}

/* Front-end hierarchy fixes */
.filters,
.toolbar,
.main,
.quick-panel,
.panel,
.side {
  border-color: #e4e8ee !important;
}

.filters .row b,
.shenglang .row b {
  color: #4e5968 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

.chips a,
.tag-group a,
.sort a {
  border-color: #dfe5ec !important;
  color: #4f5b6a !important;
}

.chips a.active,
.chips a:hover,
.tag-group a.active,
.tag-group a:hover,
.sort a.active,
.sort a:hover {
  background: #1677d2 !important;
  border-color: #1677d2 !important;
  color: #fff !important;
}

.title,
.card b,
.item b {
  color: #222832 !important;
}

.dialog-actions,
.form-actions,
.tool-actions,
.multi-actions,
.audio-actions {
  align-items: center;
}

/* Recharge and member pages */
.balance,
.member-buy,
.stats .stat,
.user-card,
.plan,
.record,
.side-list a {
  border-color: #e4e8ee !important;
}

.balance {
  font-weight: 500 !important;
}

.section-title {
  font-size: 15px !important;
  font-weight: 500 !important;
}

.member-card strong,
.plan .price,
.card strong {
  font-variant-numeric: tabular-nums;
}

/* Admin and partner-admin consistency */
.topbar {
  color: #4d5560;
}

.top-actions {
  gap: 8px !important;
  font-size: 13px !important;
}

.top-actions span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #e2e7ee;
  border-radius: 7px;
  background: #fafbfc;
  color: #5d6673;
}

.top-actions b {
  color: #222832 !important;
  font-weight: 500 !important;
}

.top-actions a,
.top-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid #d8dee7 !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: #475467 !important;
  font-weight: 500 !important;
  cursor: pointer;
}

.top-actions a:hover,
.top-actions button:hover {
  border-color: #b7d3f6 !important;
  color: #1677d2 !important;
  background: #f5f9ff !important;
}

.toolbar h1,
.view-head h1,
.welcome h1 {
  font-size: 20px !important;
  font-weight: 500 !important;
}

.table th,
.layui-table th {
  font-size: 12px !important;
  font-weight: 500 !important;
}

.table td,
.layui-table td {
  line-height: 1.55;
}

.ops button,
.btn,
.submit,
.buy,
.download,
.generate {
  border-radius: 6px !important;
}

.badge,
.tag,
.status {
  border-radius: 5px !important;
}

.nav-title,
.admin-avatar,
.field label,
.material-cell strong,
.entity-cell strong,
.amount-cell,
.auth-head,
.dialog-head,
.side-title,
.home-panel h2,
.toolbar h1,
.welcome h1,
.form-line label,
.badge,
.tip.show,
.pwd-toggle {
  font-weight: 500 !important;
}

.admin .nav a.active,
.sidebar .nav a.active,
.side a.active {
  font-weight: 500 !important;
}

.table b,
.table strong,
.layui-table b,
.layui-table strong {
  font-weight: 500 !important;
}

@media (max-width: 1200px) {
  .header .user {
    margin-left: 0;
    flex-wrap: wrap;
  }

  .header .user.logged {
    width: 100%;
    justify-content: flex-start;
  }

  .header .search {
    min-width: 0;
  }
}

@media (max-width: 760px) {
  .header .user.logged::before {
    max-width: 86px;
  }

  .header .coin-state,
  .header .user .recharge-link,
  .header .user a[href*="member"].profile,
  .header .user #memberCenterLink,
  .header .user #logoutLink {
    height: 30px;
  }

  .top-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
  }
}

/* Local account-menu concept: one quiet entry in the header, details on demand. */
.header .nav #shenglangNav,
.header .nav .partner-entry {
  display: none !important;
}

.header #userBox.logged {
  position: relative;
  z-index: 35;
  width: 142px;
  height: 40px;
  min-height: 40px;
  margin-left: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

.header #userBox.logged::before,
.header #userBox.logged::after {
  content: none;
}

.header #userBox.logged > a[href*="member"].profile,
.header #userBox.logged > #memberCenterLink {
  position: relative;
  display: flex !important;
  flex-direction: column;
  align-items: flex-start !important;
  justify-content: center;
  width: 142px;
  height: 40px !important;
  padding: 0 30px 0 40px !important;
  border: 1px solid #dfe4ea;
  border-radius: 7px;
  background: #fff;
  color: #20262e !important;
  font-size: 0;
  line-height: 1.2;
  box-shadow: 0 1px 2px rgba(24, 32, 44, .04);
}

.header #userBox.logged > a[href*="member"].profile::before,
.header #userBox.logged > #memberCenterLink::before {
  content: "我的账户";
  display: block;
  color: #20262e;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}

.header #userBox.logged > a[href*="member"].profile::after,
.header #userBox.logged > #memberCenterLink::after {
  content: "";
  position: absolute;
  right: 13px;
  top: 15px;
  width: 6px;
  height: 6px;
  border-right: 1px solid #768293;
  border-bottom: 1px solid #768293;
  transform: rotate(45deg);
  transition: transform .16s ease, top .16s ease;
}

.header #userBox.logged > a[href*="member"].profile span,
.header #userBox.logged > #memberCenterLink span {
  display: block;
  max-width: 72px;
  margin-top: 2px;
  overflow: hidden;
  color: #87919f !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.header #userBox.logged > a[href*="member"].profile:hover,
.header #userBox.logged > #memberCenterLink:hover,
.header #userBox.logged:focus-within > a[href*="member"].profile {
  border-color: #c8d3df;
  background: #f9fafb;
  color: #20262e !important;
}

.header #userBox.logged > a[href*="member"].profile::before {
  padding-left: 0;
}

.header #userBox.logged > a[href*="member"].profile {
  background-image: radial-gradient(circle at 20px 15px, #64748b 0 3px, transparent 3.5px), radial-gradient(ellipse at 20px 27px, #64748b 0 6px, transparent 6.5px);
  background-repeat: no-repeat;
}

.header #userBox.logged > .coin-state,
.header #userBox.logged > .recharge-link,
.header #userBox.logged > a[href*="recharge"].profile,
.header #userBox.logged > #logoutLink {
  position: absolute;
  right: 0;
  z-index: 40;
  display: none !important;
  width: 260px;
  margin: 0;
  box-sizing: border-box;
  background: #fff;
}

.header #userBox.logged:hover > .coin-state,
.header #userBox.logged:hover > .recharge-link,
.header #userBox.logged:hover > a[href*="recharge"].profile,
.header #userBox.logged:hover > #logoutLink,
.header #userBox.logged:focus-within > .coin-state,
.header #userBox.logged:focus-within > .recharge-link,
.header #userBox.logged:focus-within > a[href*="recharge"].profile,
.header #userBox.logged:focus-within > #logoutLink {
  display: flex !important;
}

.header #userBox.logged:hover > a[href*="member"].profile::after,
.header #userBox.logged:focus-within > a[href*="member"].profile::after {
  top: 18px;
  transform: rotate(225deg);
}

.header #userBox.logged > .coin-state {
  top: 40px;
  height: 72px !important;
  align-items: center !important;
  justify-content: space-between;
  padding: 14px 16px !important;
  border: 1px solid #e1e6ec;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  color: #5c6673 !important;
  font-size: 13px;
  box-shadow: 0 14px 32px rgba(25, 34, 47, .13);
}

.header #userBox.logged > .coin-state::before {
  content: "当前余额";
  position: absolute;
  left: 16px;
  top: 13px;
  color: #8b95a2;
  font-size: 11px;
}

.header #userBox.logged > .coin-state {
  padding-top: 28px !important;
}

.header #userBox.logged > .coin-state b,
.header #userBox.logged > .coin-state #coinCount {
  color: #1769aa !important;
  font-size: 20px;
  font-weight: 500 !important;
  line-height: 1;
}

.header #userBox.logged > .recharge-link,
.header #userBox.logged > a[href*="recharge"].profile {
  top: 112px;
  height: 58px !important;
  align-items: center !important;
  justify-content: flex-start;
  padding: 10px 42px 10px 16px !important;
  border: 1px solid #e1e6ec;
  border-top-color: #edf0f3;
  border-bottom: 0;
  border-radius: 0;
  color: #1f2933 !important;
  font-size: 0;
  line-height: 1.25;
}

.header #userBox.logged > .recharge-link::before,
.header #userBox.logged > a[href*="recharge"].profile::before {
  content: "充值素材币";
  display: block;
  color: #1769aa;
  font-size: 13px;
  font-weight: 500;
}

.header #userBox.logged > .recharge-link::after,
.header #userBox.logged > a[href*="recharge"].profile::after {
  content: "充值与开通会员  ›";
  position: absolute;
  left: 16px;
  bottom: 9px;
  color: #8a94a1;
  font-size: 11px;
  font-weight: 400;
}

.header #userBox.logged > .recharge-link:hover,
.header #userBox.logged > a[href*="recharge"].profile:hover {
  background: #f5f8fb;
}

.header #userBox.logged > #logoutLink {
  top: 170px;
  height: 42px !important;
  align-items: center !important;
  justify-content: flex-start;
  padding: 0 16px !important;
  border: 1px solid #e1e6ec;
  border-top-color: #edf0f3;
  border-radius: 0 0 8px 8px;
  color: #7a8491 !important;
  font-size: 0;
}

.header #userBox.logged > #logoutLink::before {
  content: "退出登录";
  font-size: 12px;
  font-weight: 400;
}

.header #userBox.logged > #logoutLink:hover {
  background: #f8f9fa;
  color: #4b5563 !important;
}

@media (max-width: 1200px) {
  .header #userBox.logged {
    width: 142px;
    margin-left: auto;
    justify-content: initial;
  }
}

@media (max-width: 560px) {
  .header #userBox.logged > .coin-state,
  .header #userBox.logged > .recharge-link,
  .header #userBox.logged > a[href*="recharge"].profile,
  .header #userBox.logged > #logoutLink {
    right: 0;
    width: min(260px, calc(100vw - 28px));
  }
}
