/* 资料型 Post：章节文章布局（非任务步骤流） */

.article-shell {
  position: relative;
  width: 100%;
}

.article-shell__main {
  min-width: 0;
  width: 100%;
}

.article-post {
  min-width: 0;
}

.article-post__lead {
  margin: 0.35rem 0 1.1rem;
  color: var(--text-muted);
  font-size: 0.95rem;
  line-height: 1.55;
}

.article-sections {
  display: flex;
  flex-direction: column;
  gap: 1.35rem;
}

.article-section {
  padding: 1.05rem 1.1rem 1.15rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
  scroll-margin-top: 1.25rem;
}

.article-section__title {
  margin: 0 0 0.85rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid var(--border);
  font-size: var(--text-h2);
  font-weight: 760;
  line-height: 1.3;
  color: var(--text);
}

.article-subsection {
  margin-top: 1.15rem;
  padding-top: 0.95rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.article-subsection:first-of-type {
  margin-top: 0.85rem;
}

.article-subsection__title {
  margin: 0 0 0.75rem;
  font-size: 1.02rem;
  font-weight: 740;
  color: var(--accent, #33ffa7);
}

.article-subsection--set-group {
  margin: 1.35rem 0 0;
  padding: 0.85rem 0.9rem 0.95rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.02);
}

.article-subsection--set-group > .article-subsection__title {
  margin: 0 0 0.7rem;
  padding-bottom: 0;
  border-bottom: 0;
  font-size: 1.08rem;
}

.article-subsection--set-group > .article-note {
  margin: 0 0 0.85rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: calc(var(--radius) - 2px);
  background: rgba(0, 0, 0, 0.22);
}

.article-subsection--set-group > .article-note p {
  margin: 0;
  color: var(--text-muted, #b7c0cc);
  font-size: 0.9rem;
}

.article-subsection--set-group .article-subsection {
  margin-top: 1rem;
  padding-top: 0.75rem;
}

.article-subsection--set-group .article-subsection:first-of-type {
  margin-top: 0.25rem;
}

.article-p,
.article-note p,
.article-list {
  margin: 0 0 0.7rem;
  color: var(--text);
  font-size: 0.95rem;
  line-height: 1.6;
}

.article-p:last-child,
.article-note:last-child,
.article-list:last-child,
.article-table-wrap:last-child,
.article-cards:last-child,
.article-figure:last-child,
.article-recommend:last-child,
.article-set-card:last-child {
  margin-bottom: 0;
}

.article-bonus-card,
.article-product-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.75rem 1rem;
  align-items: center;
  margin: 0 0 0.65rem;
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-muted);
}

.article-bonus-card:last-child,
.article-product-card:last-child {
  margin-bottom: 0;
}

.article-bonus-card__item,
.article-product-card__main {
  min-width: 0;
}

.article-bonus-card__fallback,
.article-product-card__title {
  font-weight: 720;
}

.article-bonus-card__effect,
.article-product-card__price,
.article-set-card__piece-effect {
  display: block;
  margin: 0;
  padding: 0.4rem 0.65rem;
  border-radius: calc(var(--radius) - 2px);
  background: rgba(232, 236, 242, 0.05);
  border: 1px solid rgba(232, 236, 242, 0.14);
  color: var(--text-muted, #b7c0cc);
  font-size: 0.88rem;
  line-height: 1.45;
  white-space: normal;
}

.article-product-card__items {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

@media (max-width: 720px) {
  .article-bonus-card,
  .article-product-card {
    grid-template-columns: 1fr;
  }
}

.article-set-card {
  margin: 0 0 1rem;
  padding: 0.85rem 0.95rem 0.95rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-muted);
}

.article-set-card__head {
  margin: 0 0 0.7rem;
  padding: 0;
  border-bottom: 0;
}

.article-set-card--detail .article-set-card__head {
  margin: 0 0 0.55rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.article-set-card__total {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.2rem 0.45rem;
  margin-top: 0.7rem;
  padding: 0.65rem 0.75rem;
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid rgba(51, 255, 167, 0.22);
  background: rgba(51, 255, 167, 0.07);
}

.article-set-card__total-label {
  flex: 0 0 auto;
  color: #9cf0bf;
  font-size: 0.86rem;
  font-weight: 780;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.article-set-card__total-effect {
  flex: 1 1 12rem;
  min-width: 0;
  color: #e8fff4;
  font-size: 0.92rem;
  font-weight: 650;
  line-height: 1.5;
  white-space: normal;
}

.article-set-card__heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(13rem, 20rem);
  align-items: start;
  gap: 0.85rem 1.1rem;
}

.article-set-card__title {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  margin: 0;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

.article-set-card__title:hover strong {
  color: var(--accent, #33ffa7);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.article-set-card__icon {
  width: 2.4rem;
  height: 2.4rem;
  object-fit: contain;
  flex: 0 0 auto;
}

.article-set-card__name {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3rem 0.4rem;
  min-width: 0;
}

.article-set-card__title strong {
  font-size: 1.02rem;
  font-weight: 720;
  color: var(--accent, #33ffa7);
}

.article-set-card__bonus {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0.45rem 0.7rem;
  border-radius: calc(var(--radius) - 2px);
  background: rgba(51, 255, 167, 0.06);
  border: 1px solid rgba(51, 255, 167, 0.16);
  color: #c8ffe4;
  font-size: 0.88rem;
  line-height: 1.45;
}

.article-set-card__pieces {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.article-set-card__piece {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.45rem 1rem;
  align-items: center;
  min-height: 2rem;
  padding: 0.42rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.article-set-card__piece:has(.article-set-card__piece-main:only-child),
.article-set-card__pieces .article-set-card__piece:not(:has(.article-set-card__piece-effect)) {
  grid-template-columns: minmax(0, 1fr);
}

.article-set-card__piece:last-child {
  border-bottom: 0;
}

.article-set-card__piece-main {
  min-width: 0;
}

.article-set-card__piece--total {
  margin-top: 0.2rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid rgba(51, 255, 167, 0.18);
  border-radius: calc(var(--radius) - 2px);
  background: rgba(51, 255, 167, 0.07);
}

.article-set-card__piece--total .article-set-card__piece-effect {
  padding: 0;
  border: 0;
  background: transparent;
  color: #c8ffe4;
  font-size: 0.88rem;
}

.article-set-card__total-label {
  display: inline-flex;
  align-items: center;
  min-height: 1.85rem;
  color: #9cf0bf;
  font-size: 0.9rem;
  font-weight: 720;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .article-set-card__piece {
    grid-template-columns: 1fr;
    gap: 0.18rem;
  }

  .article-set-card__heading {
    grid-template-columns: 1fr;
  }
}

.article-set-card__piece .quest-entity-ref {
  align-items: center;
}

.article-set-card__piece .quest-entity-ref__icon {
  width: 1.85rem;
  height: 1.85rem;
}

.article-set-card__piece .quest-entity-ref__link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.article-set-card__piece .quest-entity-ref__names {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.28rem 0.35rem;
}

.article-set-card__piece .entity-grade {
  margin-left: 0;
}

.article-set-card__piece--missing {
  color: var(--text-muted);
  font-size: 0.85rem;
}

.article-set-card__title .entity-grade {
  margin-left: 0;
}

/* 资料表里的物品引用：图标/名称/彩标垂直对齐 */
.article-table .quest-entity-ref {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  max-width: 100%;
}

.article-table .quest-entity-ref__link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

.article-table .quest-entity-ref__icon {
  width: 1.85rem;
  height: 1.85rem;
  flex: 0 0 auto;
}

.article-table .quest-entity-ref__names {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.28rem 0.35rem;
  min-width: 0;
}

.article-table .quest-entity-ref__names strong {
  font-weight: 650;
  line-height: 1.35;
}

.article-table .entity-grade {
  margin-left: 0;
  flex: 0 0 auto;
}

.article-set-card__piece .quest-entity-ref__link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

.article-set-card__piece .quest-entity-ref__names {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.28rem 0.35rem;
}

.article-set-card__piece .entity-grade {
  margin-left: 0;
}

.article-set-card__title .entity-grade {
  margin-left: 0.35rem;
}

.article-note {
  margin: 0 0 0.85rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-muted);
}

.article-note p {
  margin: 0;
  color: var(--text-muted);
}

.article-list {
  padding-left: 1.15rem;
}

.article-list li + li {
  margin-top: 0.28rem;
}

.article-figure {
  margin: 0 0 1rem;
  display: flex;
  justify-content: center;
}

.article-figure img {
  display: block;
  margin-inline: auto;
  max-width: min(100%, 28rem);
  width: auto;
  height: auto;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--surface-muted);
}

.article-table-wrap {
  margin: 0 0 0.9rem;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.article-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  min-width: 0;
  font-size: 0.9rem;
}

.article-table th,
.article-table td {
  padding: 0.55rem 0.7rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  text-align: left;
  vertical-align: middle;
  line-height: 1.45;
  word-break: break-word;
}

/* 仅两列表（武器/效果、部件/效果）跨章节统一列宽 */
.article-table:has(th:nth-child(2):last-child) th:first-child,
.article-table:has(td:nth-child(2):last-child) td:first-child {
  width: 42%;
}

.article-table:has(th:nth-child(2):last-child) th:nth-child(2),
.article-table:has(td:nth-child(2):last-child) td:nth-child(2) {
  width: 58%;
}

/* 恰好三列的强化/效果表：首列稍宽，其余均分（勿误伤 6 列等级表） */
.article-table:has(th:nth-child(3):last-child) th:first-child,
.article-table:has(td:nth-child(3):last-child) td:first-child {
  width: 26%;
}

/* 会员加成表：参数 / 数值 / 备注 = 1/4 · 1/4 · 1/2 */
.article-table--premium-bonus th:nth-child(1),
.article-table--premium-bonus td:nth-child(1),
.article-table--premium-bonus th:nth-child(2),
.article-table--premium-bonus td:nth-child(2) {
  width: 25%;
}

.article-table--premium-bonus th:nth-child(3),
.article-table--premium-bonus td:nth-child(3) {
  width: 50%;
}

/* 商城价目表：商品稍宽，价格右栏收紧不拉飞 */
.article-table--shop-price th:first-child,
.article-table--shop-price td:first-child {
  width: 70%;
}

.article-table--shop-price th:nth-child(2),
.article-table--shop-price td:nth-child(2) {
  width: 30%;
  white-space: nowrap;
  vertical-align: middle;
}

.article-table--shop-price td:first-child {
  vertical-align: middle;
}

/* 列表里的物品引用：每项一行，别挤成标签云 */
.article-list .quest-entity-ref {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
}

.article-list > li {
  margin: 0.28rem 0;
}

.article-table th {
  background: var(--surface-muted);
  color: var(--text-muted);
  font-size: 0.78rem;
  letter-spacing: 0.03em;
  white-space: nowrap;
}

.article-table tbody tr:nth-child(even) td {
  background: rgba(255, 255, 255, 0.025);
}

.article-table tr:last-child td {
  border-bottom: 0;
}

/* 套装强化加成：wiki 式逐条换行 */
.article-table--set-enchant th:first-child,
.article-table--set-enchant td:first-child {
  width: 12%;
  color: var(--accent, #33ffa7);
  font-weight: 700;
  white-space: nowrap;
  vertical-align: middle;
}

.article-table--set-enchant th:not(:first-child),
.article-table--set-enchant td:not(:first-child) {
  width: 29.3%;
  vertical-align: top;
}

.article-table--set-enchant td:not(:first-child) {
  white-space: pre-line;
  line-height: 1.55;
}

/* 强化 HP 表：首列按等级着色（对齐 wiki） */
.article-table--enchant-hp {
  font-variant-numeric: tabular-nums;
}

.article-table--enchant-hp th:first-child,
.article-table--enchant-hp td:first-child {
  width: 22%;
  white-space: nowrap;
  font-weight: 650;
}

.article-table--enchant-hp td:first-child.article-table__grade--d,
.article-table--enchant-hp td:first-child.article-table__grade--c {
  color: #8ec8ff;
}

.article-table--enchant-hp td:first-child.article-table__grade--b,
.article-table--enchant-hp td:first-child.article-table__grade--a {
  color: #f0a090;
}

/* 升级经验双栏数字表 */
.article-table--level-exp {
  font-variant-numeric: tabular-nums;
  font-size: 0.86rem;
}

.article-table--level-exp th,
.article-table--level-exp td {
  text-align: center;
  padding: 0.42rem 0.5rem;
}

.article-table--level-exp th:nth-child(1),
.article-table--level-exp th:nth-child(4),
.article-table--level-exp td:nth-child(1),
.article-table--level-exp td:nth-child(4) {
  width: 9%;
  color: var(--accent, #33ffa7);
  font-weight: 650;
}

.article-table--level-exp th:nth-child(2),
.article-table--level-exp th:nth-child(5),
.article-table--level-exp td:nth-child(2),
.article-table--level-exp td:nth-child(5),
.article-table--level-exp th:nth-child(3),
.article-table--level-exp th:nth-child(6),
.article-table--level-exp td:nth-child(3),
.article-table--level-exp td:nth-child(6) {
  width: 20.5%;
}

.article-table--level-exp td:nth-child(3),
.article-table--level-exp td:nth-child(6) {
  color: #d7e0ea;
}

/* 等级差惩罚表：色块列收窄 */
.article-table--penalty {
  font-variant-numeric: tabular-nums;
}

.article-table--penalty th,
.article-table--penalty td {
  text-align: center;
  padding: 0.45rem 0.55rem;
}

.article-table--penalty th:nth-child(1),
.article-table--penalty td:nth-child(1) {
  width: 28%;
  font-weight: 650;
}

.article-table--penalty th:nth-child(2),
.article-table--penalty td:nth-child(2) {
  width: 16%;
}

.article-table--penalty th:nth-child(3),
.article-table--penalty td:nth-child(3) {
  width: 56%;
}

.article-table--penalty td:nth-child(2) {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.article-table--penalty .article-swatch {
  margin-right: 0;
}

/* 生命石等技能目录：两列紧凑、首列略窄 */
.article-table--skill-catalog {
  font-size: 0.92rem;
}

.article-table--skill-catalog th:first-child,
.article-table--skill-catalog td:first-child {
  width: 34%;
  white-space: nowrap;
}

.article-table--skill-catalog th:nth-child(2),
.article-table--skill-catalog td:nth-child(2) {
  width: 66%;
  line-height: 1.5;
  color: var(--text-muted);
}

.article-table--skill-catalog td:first-child {
  color: var(--text);
  font-weight: 560;
}

.article-swatch {
  display: inline-block;
  width: 1.15rem;
  height: 1.15rem;
  margin-right: 0.45rem;
  border-radius: 0.2rem;
  vertical-align: -0.2rem;
  background: var(--swatch-color, #888);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.article-inline-icon {
  display: inline-block;
  width: 1.85rem;
  height: 1.85rem;
  margin-right: 0.45rem;
  vertical-align: -0.45rem;
  object-fit: contain;
}

.article-icon-stack {
  position: relative;
  display: inline-block;
  width: 1.85rem;
  height: 1.85rem;
  margin-right: 0.45rem;
  vertical-align: -0.45rem;
  flex: 0 0 auto;
}

.article-icon-stack__base,
.article-icon-stack__overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.article-icon-stack__overlay {
  z-index: 1;
}

.article-table td:has(.article-swatch),
.article-table td:has(.article-inline-icon),
.article-table td:has(.article-icon-stack) {
  white-space: nowrap;
}

.article-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: 0.75rem;
  margin: 0 0 0.9rem;
}

.article-card {
  padding: 0.8rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-muted);
}

.article-card__head {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 0.45rem;
}

.article-card__head img {
  width: 1.55rem;
  height: 1.55rem;
  object-fit: contain;
}

.article-card__head strong {
  font-size: 0.95rem;
}

.article-card ul {
  margin: 0;
  padding-left: 1.05rem;
  color: var(--text-muted);
  font-size: 0.88rem;
  line-height: 1.5;
}

.article-card li + li {
  margin-top: 0.2rem;
}

.article-recommend {
  margin: 0 0 0.85rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid rgba(88, 214, 141, 0.28);
  border-radius: var(--radius);
  background: rgba(58, 180, 110, 0.08);
}

.article-recommend__title {
  margin: 0 0 0.4rem;
  color: #9cf0bf;
  font-size: 0.88rem;
  font-weight: 740;
}

.article-recommend ul {
  margin: 0;
  padding-left: 1.05rem;
  color: var(--text);
  font-size: 0.9rem;
  line-height: 1.5;
}

.article-recommend li + li {
  margin-top: 0.22rem;
}

.article-combo {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0 0 0.9rem;
}

.article-combo__panel {
  padding: 0.8rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-muted);
  min-width: 0;
}

.article-combo__panel h3 {
  margin: 0 0 0.55rem;
  font-size: 0.92rem;
  text-align: center;
  color: var(--text);
}

.article-combo__panel ul {
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--text-muted);
  font-size: 0.88rem;
  line-height: 1.5;
}

.article-combo__panel li {
  margin: 0.28rem 0;
}

.article-combo__panel .quest-entity-ref {
  display: flex;
  width: 100%;
  max-width: 100%;
}

.article-combo__panel .quest-entity-ref__link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

/* 兑换池：两侧同级物品，等级标重复可不显示 */
.article-combo--item-pools .entity-grade {
  display: none;
}

@media (max-width: 720px) {
  .article-combo {
    grid-template-columns: 1fr;
  }

  .article-section {
    padding: 0.9rem 0.85rem 1rem;
  }

  .article-table {
    min-width: 0;
  }

  .article-table:has(th:nth-child(2):last-child) th:first-child,
  .article-table:has(td:nth-child(2):last-child) td:first-child,
  .article-table:has(th:nth-child(2):last-child) th:nth-child(2),
  .article-table:has(td:nth-child(2):last-child) td:nth-child(2),
  .article-table:has(th:nth-child(3):last-child) th:first-child,
  .article-table:has(td:nth-child(3):last-child) td:first-child {
    width: auto;
  }

  .article-set-card__heading {
    grid-template-columns: 1fr;
  }
}
