/* ============================================================
   MC 新闻页（/mcnews/）
   ------------------------------------------------------------
   作用域全部在 #mc-news 内。页面只有两张卡：最新正式版 / 最新快照。
   数据由 mc-news.js 取（构建期烘焍的中文正文 + Mojang 实时清单核对），
   这里只管排版：Hero 状态行 / 两张卡 / 展开后的中文更新内容。
   材质沿用站点玻璃令牌，与其它页面一套观感。
   ============================================================ */

#mc-news {
  --mn-line: var(--sf-glass-line, rgba(255, 255, 255, .13));
  --mn-film: var(--sf-glass, rgba(255, 255, 255, .03));
  --mn-sheen: var(--sf-glass-sheen);
  --mn-ice: var(--sf-ice, #9dc0d4);
  --mn-ice-2: var(--sf-ice-2, #cbe2ef);
  --mn-muted: var(--sf-muted, #7c8a95);
}

#mc-news .mn-hero,
#mc-news .mn-card,
#mc-news .mn-chron,
#mc-news .mn-section--foot {
  background-color: var(--mn-film);
  background-image: var(--mn-sheen);
  border: 1px solid var(--mn-line);
  border-radius: 12px;
  box-shadow:
    0 24px 60px -38px rgba(0, 0, 0, .95),
    inset 0 1px 0 rgba(255, 255, 255, .16);
}

/* ---------- Hero ---------- */
#mc-news .mn-hero { padding: 26px 28px 22px; margin-bottom: 26px; }

#mc-news .mn-hero__kind {
  display: inline-block;
  margin-bottom: 10px;
  padding: 2px 10px 3px;
  border-radius: 999px;
  border: 1px solid rgba(157, 192, 212, .28);
  background: rgba(157, 192, 212, .1);
  font-family: var(--sf-mono, monospace);
  font-size: .78rem;
  color: var(--mn-ice);
}

#mc-news .mn-hero__title {
  margin: 0 !important; padding: 0 !important; border: 0 !important;
  font-size: 2.1rem !important; letter-spacing: .04em; color: #eaf2f8 !important;
}

#mc-news .mn-hero__sub { margin: 10px 0 0; font-size: .95rem; line-height: 1.85; color: #b9c9d4; }
#mc-news .mn-hero__sub b { color: var(--mn-ice-2); font-weight: 500; }

#mc-news .mn-status {
  margin-top: 16px;
  font-family: var(--sf-mono, monospace);
  font-size: .84rem;
  line-height: 1.9;
  color: var(--mn-muted);
}

#mc-news .mn-status b { color: var(--mn-ice-2); font-weight: 500; }
#mc-news .mn-status.is-error { color: #e8a07a; }

/* ---------- 卡片容器 ---------- */
#mc-news .mn-cards { display: flex; flex-direction: column; gap: 16px; }

/* ---------- 单张卡片 ---------- */
#mc-news .mn-card { padding: 22px 24px; }

/* 版本配图：Mojang 补丁说明自带的那张 540×540，构建期存到本站。
   位置排在"版本号那行"下面、正文摘要上面 —— 和官方补丁说明页的顺序一致。
   排版上不贴顶也不通栏：留出上边距、圆角一圈细描边，视觉上是一张"插图"。

   比例必须由**外框**承担、图片绝对定位撑满，不能把 aspect-ratio 写在 img 上：
   写 img 上时 figure 会自己高出约 20px —— 图 413、figure 435，
   底下露出一条空带（`elementFromPoint` 逐行采样确认那一段命中的是 figure）。
   换过的常规修法全无效（font-size:0 / line-height:0 / display:flex /
   vertical-align / contain / overflow:clip / img height:100%），
   只有"figure 背比例 + img 绝对定位"能把空隙压到 0（实测 435→414）。
   原因没完全定论（像是匿名内联盒的度量残留），所以这里用几何上必然正确的写法。 */
#mc-news .mn-shot {
  position: relative;
  margin: 16px 0 0;
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(0, 0, 0, .22);
}

#mc-news .mn-shot img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

#mc-news .mn-shot + .mn-card__text { margin-top: 16px; }

#mc-news .mn-card--empty { font-size: .92rem; line-height: 1.9; color: #a9bac6; }
#mc-news .mn-card--empty a { color: var(--mn-ice) !important; }

#mc-news .mn-card__kind {
  margin-bottom: 10px;
  font-family: var(--sf-mono, monospace);
  font-size: .76rem;
  letter-spacing: .12em;
  color: var(--mn-muted);
}

#mc-news .mn-card__head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
}

#mc-news .mn-card__ver {
  font-family: var(--sf-mono, monospace);
  font-size: 1.5rem; color: var(--mn-ice-2); letter-spacing: .03em;
}

#mc-news .mn-card__date { font-family: var(--sf-mono, monospace); font-size: .84rem; color: var(--mn-muted); }
#mc-news .mn-card__text { margin: 14px 0 0; font-size: .93rem; color: #a9bac6; line-height: 1.8; }
#mc-news .mn-card__text--muted { color: var(--mn-muted); }

#mc-news .mn-card__note { margin: 8px 0 0; font-size: .8rem; color: var(--mn-muted); }
#mc-news .mn-card__meta {
  margin: 10px 0 0;
  font-family: var(--sf-mono, monospace);
  font-size: .76rem;
  color: var(--mn-muted);
}

/* ---------- 类型徽章 ---------- */
#mc-news .mn-tag {
  padding: 1px 9px 2px;
  border-radius: 999px;
  border: 1px solid var(--mn-line);
  font-size: .74rem;
  color: var(--mn-muted);
  white-space: nowrap;
}

#mc-news .mn-tag--release { border-color: rgba(109, 219, 160, .45); background: rgba(109, 219, 160, .12); color: #8ee7b4; }
#mc-news .mn-tag--snapshot { border-color: rgba(157, 192, 212, .4); background: rgba(157, 192, 212, .1); color: var(--mn-ice-2); }

/* ---------- 按钮 ---------- */
#mc-news .mn-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }

#mc-news .mn-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 12px;
  border-radius: 7px;
  border: 1px solid var(--mn-line);
  background: rgba(255, 255, 255, .04);
  font-size: .82rem;
  color: var(--mn-ice-2) !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: background-color .16s ease, border-color .16s ease;
}

#mc-news .mn-btn:hover { background: rgba(255, 255, 255, .09); border-color: rgba(157, 192, 212, .45); }
#mc-news .mn-btn[disabled] { opacity: .5; cursor: default; }

/* ---------- 展开的中文更新内容 ---------- */
#mc-news .mn-body {
  margin-top: 16px;
  padding: 18px 20px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .07);
  background: rgba(0, 0, 0, .18);
}

#mc-news .mn-empty { margin: 0; font-size: .88rem; line-height: 1.9; color: var(--mn-muted); }
#mc-news .mn-empty a { color: var(--mn-ice) !important; }

#mc-news .mn-doc { font-size: .9rem; color: #a9bac6; }

#mc-news .mn-doc__intro {
  margin: 0 0 18px;
  padding: 0 0 14px 12px;
  border-left: 2px solid rgba(157, 192, 212, .4);
  line-height: 1.9;
  color: #bccbd6;
}

#mc-news .mn-doc__sec + .mn-doc__sec { margin-top: 22px; }

#mc-news .mn-doc__h {
  margin: 0 0 12px !important; padding: 0 0 6px !important;
  border: 0 !important; border-bottom: 1px solid rgba(255, 255, 255, .08) !important;
  font-size: 1.05rem !important; color: #e6eef4 !important;
}

#mc-news .mn-doc__g {
  margin: 16px 0 8px !important; padding: 0 !important; border: 0 !important;
  font-size: .9rem !important; color: var(--mn-ice) !important;
  letter-spacing: .04em;
}

#mc-news .mn-doc__item { margin: 0 0 12px; }
#mc-news .mn-doc__item + .mn-doc__item { margin-top: 12px; }

#mc-news .mn-doc__lead { margin: 0 0 6px; font-size: .93rem; color: #e2ecf3; }
#mc-news .mn-doc__kid { color: #d3e0e9; }

#mc-news .mn-doc__sub,
#mc-news .mn-doc__kids { margin: 0; padding-left: 1.15em; }
#mc-news .mn-doc__sub > li,
#mc-news .mn-doc__kids > li { margin: 5px 0; line-height: 1.8; }
#mc-news .mn-doc__kids > li > ul { margin: 5px 0 0; padding-left: 1.15em; }
#mc-news .mn-doc__kids > li > ul > li { margin: 4px 0; line-height: 1.75; color: #96a7b4; }

#mc-news .mn-more {
  margin-top: 10px;
  padding: 6px 14px;
  border-radius: 7px;
  border: 1px solid var(--mn-line);
  background: rgba(255, 255, 255, .04);
  font-size: .82rem;
  color: var(--mn-ice-2);
  cursor: pointer;
}
#mc-news .mn-more:hover { background: rgba(255, 255, 255, .09); }

#mc-news .mn-credit {
  margin: 16px 0 0;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, .07);
  font-size: .78rem;
  line-height: 1.9;
  color: var(--mn-muted);
}
#mc-news .mn-credit a { color: var(--mn-ice) !important; }

/* ---------- 纪元大事记（时间线） ----------
   内容是**静态**写在 source/mcnews/index.md 里的，不走 JS ——
   事件属于"内容"而不是接口数据：少一个请求、少一处失败点，JS 挂了这段也还在。
   新增一条 = 在 <ol class="mn-tl"> 里加一个 <li>（新的写最上面，按时间倒序）。 */
#mc-news .mn-chron { padding: 22px 24px; margin-top: 28px; }

#mc-news .mn-chron__title,
#mc-news .mn-foot__title {
  padding: 0 !important;
  border: 0 !important;
  font-size: 1.02rem !important;
  line-height: 1.6;
  color: #e6eef4 !important;
}
/* 主题会给 #article-container 里的 h3 加一个 FontAwesome 前缀图标 + 左内边距
   （_layout/post.styl 的 beautify/headStyle）。这里必须显式关掉，
   否则标题前面挂个小图标、整体右移一截，跟卡片里的排版对不齐。 */
#mc-news .mn-chron__title::before,
#mc-news .mn-foot__title::before { content: none !important; }
#mc-news .mn-chron__title { margin: 0 0 8px !important; }
#mc-news .mn-foot__title { margin: 0 0 12px !important; }

#mc-news .mn-chron__sub {
  margin: 0 0 18px;
  font-size: .84rem;
  line-height: 1.8;
  color: var(--mn-muted);
}

#mc-news .mn-tl {
  position: relative;
  margin: 0;
  padding: 0 0 0 22px;
  list-style: none;
}
/* 竖轨：两端淡出，避免端点像被切断 */
#mc-news .mn-tl::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 10px;
  bottom: 12px;
  width: 1px;
  background: linear-gradient(180deg, rgba(157, 192, 212, .55), rgba(157, 192, 212, .18));
}
/* 只有一条时不要竖轨：否则圆点底下挂一小截线，像没画完 */
#mc-news .mn-tl:has(> .mn-tl__item:only-child)::before { content: none; }

#mc-news .mn-tl__item { position: relative; margin: 0 0 18px; }
#mc-news .mn-tl__item:last-child { margin-bottom: 0; }

/* 节点圆点：left:-22px 让它落在 .mn-tl 的左边缘，圆心与竖轨（left:4px + 1px）对齐 */
#mc-news .mn-tl__item::before {
  content: '';
  position: absolute;
  left: -22px;
  top: 6px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--mn-ice);
  box-shadow: 0 0 0 4px rgba(157, 192, 212, .1);
}

#mc-news .mn-tl__date {
  display: block;
  font-family: var(--sf-mono, monospace);
  font-size: .78rem;
  letter-spacing: .06em;
  color: var(--mn-ice);
}

#mc-news .mn-tl__text {
  margin: 6px 0 0;
  font-size: .93rem;
  line-height: 1.85;
  color: #bccbd6;
}

/* ---------- 页脚说明 ---------- */
#mc-news .mn-section--foot { padding: 20px 22px; margin-top: 28px; }
#mc-news .mn-section--foot p { margin: 0 0 10px; font-size: .86rem; color: #9fb0bd; line-height: 1.9; }
#mc-news .mn-section--foot p:last-child { margin-bottom: 0; }
#mc-news .mn-section--foot b { color: var(--mn-ice-2); font-weight: 500; }

#mc-news .mn-skeleton { padding: 18px; color: var(--mn-muted); font-size: .9rem; }

@media (max-width: 768px) {
  #mc-news .mn-hero { padding: 20px 18px; }
  #mc-news .mn-hero__title { font-size: 1.7rem !important; }
  #mc-news .mn-card { padding: 18px; }
  #mc-news .mn-shot { margin-top: 14px; aspect-ratio: 3 / 2; }
  #mc-news .mn-body { padding: 14px 14px; }
  #mc-news .mn-card__ver { font-size: 1.32rem; }
  #mc-news .mn-chron { padding: 18px; }
  #mc-news .mn-tl { padding-left: 20px; }
  #mc-news .mn-tl__item::before { left: -20px; }
}