/*
 * March7th UI Styles
 * Base styles and utility/component classes powered by march7th-tokens.css.
 * Load after march7th-tokens.css.
 * Usage:
 *   <link rel="stylesheet" href="/theme/march7th-tokens.css">
 *   <link rel="stylesheet" href="/theme/march7th-ui.css">
 */

:root.m7-theme-transitioning,
:root.m7-theme-transitioning *,
:root.m7-theme-transitioning *::before,
:root.m7-theme-transitioning *::after {
  transition:
    background-color var(--m7-duration-slow) var(--m7-ease-standard),
    background var(--m7-duration-slow) var(--m7-ease-standard),
    border-color var(--m7-duration-slow) var(--m7-ease-standard),
    box-shadow var(--m7-duration-slow) var(--m7-ease-standard),
    color var(--m7-duration-slow) var(--m7-ease-standard),
    fill var(--m7-duration-slow) var(--m7-ease-standard),
    outline-color var(--m7-duration-slow) var(--m7-ease-standard),
    stroke var(--m7-duration-slow) var(--m7-ease-standard) !important;
}

.m7-theme {
  background: var(--m7-page-bg); /* 应用页面背景色 */
  color: var(--m7-text); /* 应用默认正文文字色 */
  transition:
    background-color var(--m7-duration-fast) var(--m7-ease-standard),
    color var(--m7-duration-fast) var(--m7-ease-standard);
}

.m7-card {
  background: var(--m7-card-bg); /* 应用卡片背景色 */
  border-radius: var(--m7-radius-large);
  box-shadow: var(--m7-shadow-sm);
  color: var(--m7-text-regular); /* 应用常规文本色 */
  overflow: hidden;
  transition:
    background-color var(--m7-duration-fast) var(--m7-ease-standard),
    color var(--m7-duration-fast) var(--m7-ease-standard),
    box-shadow var(--m7-duration-fast) var(--m7-ease-standard);
}

.m7-card-transparent {
  background: var(--m7-card-bg-transparent); /* 应用半透明卡片背景色 */
  backdrop-filter: blur(8px);
  border-radius: var(--m7-radius-large);
  box-shadow: var(--m7-shadow-sm);
  overflow: hidden;
}

.m7-float-panel {
  background: var(--m7-float-panel-bg); /* 应用浮动面板背景色 */
  border: 1px solid var(--m7-line-divider); /* 应用轻量分割线/边框颜色 */
  border-radius: var(--m7-radius-large);
  box-shadow: var(--m7-shadow-xl);
  color: var(--m7-text-regular); /* 应用常规文本色 */
  overflow: hidden;
}

.m7-btn,
.m7-btn-regular {
  align-items: center;
  background: var(--m7-btn-regular-bg); /* 应用常规按钮背景色 */
  border: 0; /* 无边框颜色 */
  border-radius: 0.75rem;
  color: var(--m7-btn-content); /* 应用常规按钮内容颜色 */
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  gap: 0.4em;
  justify-content: center;
  min-height: 2.5rem;
  padding: 0.55rem 0.9rem;
  text-decoration: none;
  transition:
    background-color var(--m7-duration-fast) var(--m7-ease-standard),
    color var(--m7-duration-fast) var(--m7-ease-standard),
    transform var(--m7-duration-fast) var(--m7-ease-standard);
}

.m7-btn:hover,
.m7-btn-regular:hover {
  background: var(--m7-btn-regular-bg-hover); /* 应用常规按钮悬停背景色 */
}

.m7-btn:active,
.m7-btn-regular:active {
  background: var(--m7-btn-regular-bg-active); /* 应用常规按钮按下背景色 */
  transform: scale(0.97);
}

.m7-btn-plain {
  align-items: center;
  background: transparent; /* 透明背景，不额外铺色 */
  border: 0; /* 无边框颜色 */
  border-radius: 0.75rem;
  color: var(--m7-text-regular); /* 应用常规文本色 */
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  gap: 0.4em;
  justify-content: center;
  min-height: 2.5rem;
  padding: 0.55rem 0.75rem;
  text-decoration: none;
  transition:
    background-color var(--m7-duration-fast) var(--m7-ease-standard),
    color var(--m7-duration-fast) var(--m7-ease-standard),
    transform var(--m7-duration-fast) var(--m7-ease-standard);
}

.m7-btn-plain:hover {
  background: var(--m7-btn-plain-bg-hover); /* 应用朴素按钮悬停/当前背景色 */
  color: var(--m7-primary); /* 应用主品牌色 */
}

.m7-btn-plain:active {
  background: var(--m7-btn-plain-bg-active); /* 应用朴素按钮按下背景色 */
  transform: scale(0.97);
}

.m7-current,
.m7-current-theme-btn {
  background: var(--m7-btn-plain-bg-hover); /* 应用朴素按钮悬停/当前背景色 */
  color: var(--m7-primary); /* 应用主品牌色 */
}

.m7-link {
  border-radius: 0.375rem;
  color: inherit; /* 继承父级文字颜色 */
  margin: -0.15em;
  padding: 0.15em;
  text-decoration-line: underline;
  text-decoration-style: dashed;
  text-decoration-thickness: 2px;
  text-decoration-color: var(--m7-link-underline); /* 应用链接下划线颜色 */
  text-underline-offset: 0.25rem;
  transition:
    background-color var(--m7-duration-fast) var(--m7-ease-standard),
    color var(--m7-duration-fast) var(--m7-ease-standard),
    text-decoration-color var(--m7-duration-fast) var(--m7-ease-standard);
}

.m7-link:hover {
  background: var(--m7-link-hover); /* 应用链接悬停背景色 */
  color: var(--m7-primary); /* 应用主品牌色 */
  text-decoration-color: var(--m7-link-hover); /* 应用链接悬停装饰色 */
}

.m7-link:active {
  background: var(--m7-link-active); /* 应用链接按下背景色 */
  text-decoration-color: var(--m7-link-active); /* 应用链接按下装饰色 */
}

.m7-inline-code {
  background: var(--m7-inline-code-bg); /* 应用行内代码背景色 */
  border-radius: 0.35rem;
  color: var(--m7-inline-code-color); /* 应用行内代码文字色 */
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.9em;
  padding: 0.12em 0.35em;
}

.m7-codeblock {
  background: var(--m7-codeblock-bg); /* 应用代码块背景色 */
  border-radius: 0.75rem;
  color: rgba(255, 255, 255, 0.88); /* 代码块默认文字颜色 */
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  line-height: 1.6;
  overflow: auto;
  padding: 1rem;
}

.m7-text-strong {
  color: var(--m7-text-strong); /* 应用强文本颜色 */
}

.m7-text-regular {
  color: var(--m7-text-regular); /* 应用常规文本色 */
}

.m7-text-muted {
  color: var(--m7-text-muted); /* 应用弱化文本颜色 */
}

.m7-text-subtle {
  color: var(--m7-text-subtle); /* 应用极弱文本颜色 */
}

.m7-divider {
  border-color: var(--m7-line-divider); /* 应用分割线颜色 */
}

.m7-theme ::selection,
.m7-card ::selection,
.m7-float-panel ::selection {
  background: var(--m7-selection-bg); /* 应用文本选中背景色 */
}

.m7-scrollbar {
  scrollbar-color: var(--m7-scrollbar-bg) transparent; /* 应用 Firefox 滚动条颜色与透明轨道 */
  scrollbar-width: thin;
}

.m7-scrollbar::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}

.m7-scrollbar::-webkit-scrollbar-thumb {
  background: var(--m7-scrollbar-bg); /* 应用滚动条默认颜色 */
  border-radius: 999px;
}

.m7-scrollbar::-webkit-scrollbar-thumb:hover {
  background: var(--m7-scrollbar-bg-hover); /* 应用滚动条悬停颜色 */
}

.m7-scrollbar::-webkit-scrollbar-thumb:active {
  background: var(--m7-scrollbar-bg-active); /* 应用滚动条按下颜色 */
}

.m7-hue-slider {
  appearance: none;
  background: var(--m7-color-selection-bar); /* 应用主题色选择条渐变 */
  border-radius: 0.375rem;
  height: 1.5rem;
  width: 100%;
}

.m7-hue-slider::-webkit-slider-thumb {
  appearance: none;
  background: rgba(255, 255, 255, 0.75); /* 滑块手柄半透明白色 */
  border: 0; /* 无边框颜色 */
  border-radius: 0.125rem;
  cursor: pointer;
  height: 1rem;
  width: 0.5rem;
}

.m7-hue-slider::-moz-range-thumb {
  background: rgba(255, 255, 255, 0.75); /* 滑块手柄半透明白色 */
  border: 0; /* 无边框颜色 */
  border-radius: 0.125rem;
  cursor: pointer;
  height: 1rem;
  width: 0.5rem;
}

.m7-container {
  width: min(var(--m7-container-width), calc(100% - var(--m7-spacing-3xl)));
  margin-inline: auto;
}

.m7-section { padding-block: var(--m7-spacing-5xl); }
.m7-stack { display: flex; flex-direction: column; gap: var(--m7-widget-gap); }
.m7-cluster { display: flex; flex-wrap: wrap; gap: var(--m7-spacing-sm); align-items: center; }
.m7-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: var(--m7-widget-gap); }
.m7-sidebar-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--m7-widget-gap); }

@media (min-width: 768px) {
  .m7-sidebar-layout { grid-template-columns: minmax(0, 1fr) var(--m7-sidebar-width); }
}

.m7-surface {
  background: var(--m7-card-bg-transparent); /* 通用半透明表面 */
  border: 1px solid var(--m7-line-divider); /* 通用表面边框 */
  border-radius: var(--m7-radius-2xl);
  box-shadow: var(--m7-shadow-md);
  color: var(--m7-text-regular); /* 表面默认文字颜色 */
  backdrop-filter: blur(var(--m7-blur-md));
}

.m7-navbar {
  position: sticky;
  top: 0;
  z-index: var(--m7-z-sticky);
  background: color-mix(in oklch, var(--m7-card-bg) 78%, transparent); /* 导航栏半透明背景 */
  border-bottom: 1px solid var(--m7-line-divider); /* 导航栏底部分割线 */
  backdrop-filter: blur(var(--m7-blur-2xl));
  box-shadow: var(--m7-shadow-sm);
}

.m7-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(var(--m7-spacing-4xl), 8vw, 7rem) var(--m7-spacing-lg);
  border-radius: var(--m7-radius-3xl);
  background:
    radial-gradient(circle at 20% 15%, color-mix(in oklch, var(--m7-accent-pink) 22%, transparent), transparent 34%),
    radial-gradient(circle at 80% 20%, color-mix(in oklch, var(--m7-primary) 24%, transparent), transparent 36%),
    var(--m7-card-bg-transparent); /* 英雄区渐变表面 */
  border: 1px solid var(--m7-line-divider); /* 英雄区边框 */
  backdrop-filter: blur(var(--m7-blur-md));
}

.m7-input,
.m7-select,
.m7-textarea {
  width: 100%;
  min-height: 2.75rem;
  padding: 0 var(--m7-spacing-lg);
  border: 1px solid var(--m7-line-divider); /* 表单控件边框 */
  border-radius: var(--m7-radius-xl);
  outline: none;
  background: var(--m7-btn-regular-bg); /* 表单控件背景 */
  color: var(--m7-text-strong); /* 表单控件文字 */
  font: inherit;
  transition: border-color var(--m7-duration-fast) var(--m7-ease-standard), box-shadow var(--m7-duration-fast) var(--m7-ease-standard), background-color var(--m7-duration-fast) var(--m7-ease-standard);
}

.m7-textarea { min-height: 7rem; padding-block: var(--m7-spacing-md); resize: vertical; }
.m7-select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23666' stroke-width='1.5' d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--m7-spacing-md) center;
  padding-right: var(--m7-spacing-3xl);
  cursor: pointer;
}

.m7-input:focus,
.m7-select:focus,
.m7-textarea:focus {
  border-color: var(--m7-primary); /* 表单聚焦边框 */
  box-shadow: 0 0 0 4px color-mix(in oklch, var(--m7-primary) 18%, transparent); /* 表单聚焦光晕 */
}

.m7-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--m7-spacing-xs);
  padding: 0.25rem 0.6rem;
  border: 1px solid var(--m7-line-divider); /* 徽章边框 */
  border-radius: var(--m7-radius-full);
  background: var(--m7-btn-regular-bg); /* 徽章背景 */
  color: var(--m7-content-meta); /* 徽章文字 */
  font-size: 0.8125rem;
  font-weight: 600;
}

.m7-scale-hover { transition: transform var(--m7-duration-fast) var(--m7-ease-standard); }
.m7-scale-hover:hover { transform: scale(var(--m7-scale-105)); }
.m7-pressable { transition: transform var(--m7-duration-fast) var(--m7-ease-standard); }
.m7-pressable:active { transform: scale(var(--m7-scale-95)); }
.m7-gpu { transform: var(--m7-gpu-transform); backface-visibility: hidden; }

/* ===== March7th Base Styles ===== */
.m7-theme,
.m7-theme * ,
.m7-theme *::before,
.m7-theme *::after {
  box-sizing: border-box;
}

.m7-theme {
  min-height: 100vh;
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.m7-theme :where(h1, h2, h3, h4, h5, h6) {
  margin: 0 0 var(--m7-spacing-md);
  color: var(--m7-text-strong); /* 标题文字颜色 */
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -0.025em;
}

.m7-theme :where(h1) { font-size: clamp(2rem, 5vw, 4rem); }
.m7-theme :where(h2) { font-size: clamp(1.5rem, 3vw, 2.25rem); }
.m7-theme :where(h3) { font-size: clamp(1.25rem, 2vw, 1.5rem); }
.m7-theme :where(p) { margin: 0 0 var(--m7-spacing-lg); color: var(--m7-text-regular); /* 段落文字颜色 */ }
.m7-theme :where(small) { color: var(--m7-text-muted); /* 小号辅助文字颜色 */ }
.m7-theme :where(strong, b) { color: var(--m7-text-strong); /* 加粗强调文字颜色 */ }
.m7-theme :where(hr) { height: 1px; margin: var(--m7-spacing-2xl) 0; border: 0; background: var(--m7-line-divider); /* 水平分割线颜色 */ }

.m7-theme :where(a:not(.m7-btn):not(.m7-btn-regular):not(.m7-btn-plain):not(.m7-link)) {
  color: var(--m7-primary); /* 默认链接文字颜色 */
  text-decoration-color: var(--m7-link-underline); /* 默认链接下划线颜色 */
  text-underline-offset: 0.2em;
}

.m7-theme :where(a:not(.m7-btn):not(.m7-btn-regular):not(.m7-btn-plain):not(.m7-link):hover) {
  color: var(--m7-primary); /* 默认链接悬停文字颜色 */
  text-decoration-color: var(--m7-primary); /* 默认链接悬停下划线颜色 */
}

.m7-theme :where(ul, ol) { margin: 0 0 var(--m7-spacing-lg); padding-left: 1.35em; color: var(--m7-text-regular); /* 列表文字颜色 */ }
.m7-theme :where(li + li) { margin-top: var(--m7-spacing-xs); }
.m7-theme :where(blockquote) {
  margin: var(--m7-spacing-xl) 0;
  padding: var(--m7-spacing-md) var(--m7-spacing-lg);
  border-left: 4px solid var(--m7-primary); /* 引用块强调边框颜色 */
  border-radius: var(--m7-radius-lg);
  background: var(--m7-btn-regular-bg); /* 引用块背景色 */
  color: var(--m7-text-regular); /* 引用块文字颜色 */
}

.m7-theme :where(img, svg, video, canvas) { max-width: 100%; height: auto; }
.m7-theme :where(img, video) { border-radius: var(--m7-radius-xl); }
.m7-theme :where(figure) { margin: 0 0 var(--m7-spacing-xl); }
.m7-theme :where(figcaption) { margin-top: var(--m7-spacing-sm); color: var(--m7-text-muted); /* 媒体说明文字颜色 */ font-size: 0.875rem; text-align: center; }

.m7-theme :where(table) {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--m7-line-divider); /* 表格外边框颜色 */
  border-radius: var(--m7-radius-xl);
  overflow: hidden;
}

.m7-theme :where(th, td) {
  padding: var(--m7-spacing-sm) var(--m7-spacing-md);
  border-bottom: 1px solid var(--m7-line-divider); /* 表格行分割线颜色 */
  text-align: left;
}

.m7-theme :where(th) {
  background: var(--m7-btn-regular-bg); /* 表头背景色 */
  color: var(--m7-text-strong); /* 表头文字颜色 */
  font-weight: 700;
}

.m7-theme :where(td) { color: var(--m7-text-regular); /* 表格内容文字颜色 */ }
.m7-theme :where(tr:last-child td) { border-bottom: 0; }
.m7-theme :where(code:not(.m7-inline-code)) { background: var(--m7-inline-code-bg); color: var(--m7-inline-code-color); border-radius: var(--m7-radius-md); padding: 0.12em 0.35em; font-size: 0.9em; }
.m7-theme :where(pre:not(.m7-codeblock)) { background: var(--m7-codeblock-bg); color: rgba(255, 255, 255, 0.88); border-radius: var(--m7-radius-xl); overflow: auto; padding: var(--m7-spacing-lg); }

.m7-theme :where(button, input, select, textarea) { font: inherit; }
.m7-theme :where(button) { cursor: pointer; }
.m7-theme :where(:focus-visible) { outline: 3px solid color-mix(in oklch, var(--m7-primary) 50%, transparent); outline-offset: 3px; }

.m7-prose { color: var(--m7-text-regular); }
.m7-prose > * + * { margin-top: var(--m7-spacing-lg); }
.m7-prose :where(p, ul, ol, blockquote, table, figure, pre) { margin-bottom: 0; }

@media (max-width: 767px) {
  .m7-theme { font-size: 15px; }
  .m7-section { padding-block: var(--m7-spacing-3xl); }
  .m7-container { width: min(var(--m7-container-width), calc(100% - var(--m7-spacing-xl))); }
}

/* ===== March7th Content Components ===== */
.m7-post-card,
.m7-project-card,
.m7-profile-card,
.m7-friend-link {
  display: block;
  padding: var(--m7-spacing-xl);
  text-decoration: none;
}

.m7-post-card,
.m7-project-card,
.m7-profile-card,
.m7-stat-card,
.m7-friend-link {
  background: var(--m7-card-bg-transparent); /* 内容卡片半透明背景 */
  border: 1px solid var(--m7-line-divider); /* 内容卡片边框 */
  border-radius: var(--m7-radius-2xl);
  box-shadow: var(--m7-shadow-sm);
  color: var(--m7-text-regular); /* 内容卡片文字颜色 */
  overflow: hidden;
  transition: transform var(--m7-duration-fast) var(--m7-ease-standard), box-shadow var(--m7-duration-fast) var(--m7-ease-standard), border-color var(--m7-duration-fast) var(--m7-ease-standard);
}

.m7-post-card:hover,
.m7-project-card:hover,
.m7-friend-link:hover {
  border-color: color-mix(in oklch, var(--m7-primary) 34%, var(--m7-line-divider)); /* 内容卡片悬停边框 */
  box-shadow: var(--m7-shadow-md);
  transform: translateY(calc(var(--m7-translate-sm) * -1));
}

.m7-post-card__cover,
.m7-project-card__cover {
  aspect-ratio: 16 / 9;
  width: 100%;
  object-fit: cover;
  border-radius: var(--m7-radius-xl);
  background: linear-gradient(135deg, color-mix(in oklch, var(--m7-primary) 24%, transparent), color-mix(in oklch, var(--m7-accent-pink) 20%, transparent)), var(--m7-btn-regular-bg); /* 封面占位背景 */
}

.m7-post-card__title,
.m7-project-card__title,
.m7-profile-card__name,
.m7-friend-link__name {
  margin: 0;
  color: var(--m7-text-strong); /* 内容标题颜色 */
}

.m7-post-card__excerpt,
.m7-project-card__description,
.m7-profile-card__bio,
.m7-friend-link__description {
  margin: var(--m7-spacing-sm) 0 0;
  color: var(--m7-text-regular); /* 内容描述颜色 */
}

.m7-post-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--m7-spacing-xs) var(--m7-spacing-sm);
  align-items: center;
  color: var(--m7-text-muted); /* 文章元信息颜色 */
  font-size: 0.875rem;
}

.m7-post-meta > * + *::before {
  content: "•";
  margin-right: var(--m7-spacing-sm);
  color: var(--m7-text-subtle); /* 元信息分隔点颜色 */
}

.m7-project-card__actions,
.m7-profile-card__links,
.m7-friend-link__main {
  display: flex;
  flex-wrap: wrap;
  gap: var(--m7-spacing-sm);
  align-items: center;
}

.m7-profile-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--m7-spacing-lg);
  align-items: center;
}

.m7-profile-card__avatar,
.m7-friend-link__avatar {
  width: 4.5rem;
  height: 4.5rem;
  border: 2px solid color-mix(in oklch, var(--m7-primary) 30%, var(--m7-line-divider)); /* 头像边框 */
  border-radius: var(--m7-radius-full);
  object-fit: cover;
  background: var(--m7-btn-regular-bg); /* 头像占位背景 */
}

.m7-timeline {
  position: relative;
  padding-left: 0;
}

.m7-timeline::before {
  content: "";
  position: absolute;
  left: 7.5rem;
  top: 0.45rem;
  bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, var(--m7-primary), var(--m7-line-divider) 80%, transparent);
}

.m7-timeline__item {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr);
  gap: var(--m7-spacing-lg);
  position: relative;
  padding-bottom: var(--m7-spacing-xl);
}

.m7-timeline__item:last-child {
  padding-bottom: 0;
}

.m7-timeline__item::before {
  content: "";
  position: absolute;
  left: calc(7.5rem - 5px);
  top: 0.5rem;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--m7-primary);
  box-shadow: 0 0 0 3px color-mix(in oklch, var(--m7-primary) 22%, transparent);
  z-index: 1;
}

.m7-timeline__time {
  color: var(--m7-primary);
  font-weight: 700;
  text-align: right;
  padding-right: 1em;
}

.m7-timeline__content {
  color: var(--m7-text-regular);
  padding-left: 1em;
}

.m7-toc {
  display: block;
  padding: var(--m7-spacing-lg);
  border: 1px solid var(--m7-line-divider); /* 目录边框 */
  border-radius: var(--m7-radius-2xl);
  background: var(--m7-card-bg-transparent); /* 目录背景 */
}

.m7-toc__title {
  margin: 0 0 var(--m7-spacing-sm);
  color: var(--m7-text-strong); /* 目录标题颜色 */
  font-weight: 700;
}

.m7-toc__link {
  display: block;
  padding: 0.35rem 0.5rem;
  border-radius: var(--m7-radius-md);
  color: var(--m7-text-regular); /* 目录链接颜色 */
  text-decoration: none;
}

.m7-toc__link:hover,
.m7-toc__link.is-active {
  background: var(--m7-toc-btn-hover); /* 目录链接悬停背景 */
  color: var(--m7-toc-item-active); /* 目录链接激活颜色 */
}

.m7-toc__link--h3 { padding-left: var(--m7-spacing-xl); font-size: 0.925rem; }

.m7-code-copy {
  position: relative;
}

.m7-code-copy__button {
  position: absolute;
  top: var(--m7-spacing-sm);
  right: var(--m7-spacing-sm);
  z-index: 1;
}

.m7-stat-card {
  padding: var(--m7-spacing-xl);
  text-align: center;
}

.m7-stat-card__value {
  color: var(--m7-primary); /* 统计数值颜色 */
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 800;
  line-height: 1;
}

.m7-stat-card__label {
  margin-top: var(--m7-spacing-sm);
  color: var(--m7-text-muted); /* 统计标签颜色 */
}

@media (max-width: 767px) {
  .m7-profile-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .m7-timeline::before {
    left: 5px;
  }

  .m7-timeline__item {
    grid-template-columns: minmax(0, 1fr);
    padding-left: var(--m7-spacing-xl);
  }

  .m7-timeline__item::before {
    left: 0;
  }

  .m7-timeline__time {
    text-align: left;
    font-size: 0.875rem;
  }
}