/* JetBrains Mono 用于代码块：它严格把 Unicode 盒绘字符（│ ├ └ ─）
   渲染为 1ch 宽，避免树形结构里前缀字符宽度漂移导致的列错位。 */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap');

pre, pre code, code, kbd, samp {
  font-family: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', 'SF Mono', Consolas, 'Liberation Mono', Menlo, monospace !important;
}

/* 修复英文长单词溢出问题 */
body {
  word-break: break-word;
  overflow-wrap: break-word;
}

/* 确保所有文本容器都能正确换行 */
p, li, td, th, div {
  word-break: break-word;
  overflow-wrap: break-word;
}

/* 特别处理链接 */
a {
  word-break: break-word;
  overflow-wrap: break-word;
}

/* 确保 Callout (Note, Info 等) 中的粗体文字继承父容器颜色 */
.callout strong, .callout b {
  color: inherit;
}

/* 让所有 markdown 表格铺满内容区域宽度(默认按内容自适应会挤在左侧) */
.prose table,
article table,
table {
  width: 100% !important;
}

/* 更新日志时间轴：放大日期、版本与正文，并让两列始终从顶部对齐。 */
.update-container {
  align-items: flex-start !important;
}

/* 时间列是每条 Update 的第一个直接子元素。取消组件默认的 sticky，
   避免滚动页面时日期被固定到标题下方，造成左右首行错位。 */
.update-container > div:first-child,
.update-container > div:has(> [data-component-part="update-label"]) {
  position: static !important;
  top: auto !important;
  align-self: flex-start !important;
}

.update-container > div:has(> [data-component-part="update-content"]) {
  min-width: 0;
  overflow: visible !important;
}

[data-component-part="update-label"] {
  padding: 0.375rem 0.75rem !important;
  font-size: 1rem !important;
  line-height: 1.5rem !important;
}

[data-component-part="update-description"] {
  margin-top: 0.75rem !important;
  font-size: 0.9375rem !important;
  line-height: 1.5rem !important;
}

[data-component-part="update-content"] {
  width: 100%;
  font-size: 1rem !important;
  line-height: 1.75 !important;
}

[data-component-part="update-content"] > :first-child {
  margin-top: 0 !important;
}

[data-component-part="update-content"] h3 {
  font-size: 1.375rem !important;
  line-height: 1.4 !important;
}

[data-component-part="update-content"] h4,
[data-component-part="update-content"] h5 {
  font-size: 1.0625rem !important;
  line-height: 1.5 !important;
  font-weight: 700 !important;
}

@media (min-width: 1024px) {
  .update-container {
    column-gap: 2rem !important;
  }

  .update-container > div:first-child,
  .update-container > div:has(> [data-component-part="update-label"]) {
    width: 180px !important;
  }
}