/* ==========================================================================
   开发者论坛 · UI 原型共享样式表
   依据《UI设计规格与冻结元素清单 v1.0》实现，配色/字号/间距严格对应编号
   本文件为静态可视化原型样式，非 Discourse 正式代码
   ========================================================================== */

/* ---------- 全局变量：配色（G-C01~C19） ---------- */
:root {
  /* 主色系 */
  --c-primary: #2563EB;        /* G-C01 主色/品牌操作色 */
  --c-primary-hover: #1D4ED8;  /* G-C02 主色悬停 */
  --c-primary-active: #1E40AF; /* G-C03 主色按下 */
  --c-primary-soft: #EFF4FE;   /* G-C04 主色浅底 */

  /* 背景与文字 */
  --c-bg: #F7F8FA;             /* G-C05 页面背景 */
  --c-surface: #FFFFFF;        /* G-C06 内容/卡片背景 */
  --c-text: #1F2933;           /* G-C07 文字主色 */
  --c-text-2: #5B6673;         /* G-C08 文字次要 */
  --c-text-3: #8A94A6;         /* G-C09 文字辅助/占位 */
  --c-border: #E3E7ED;         /* G-C10 边框色 */
  --c-divider: #EDF0F3;        /* G-C11 分割线 */

  /* 语义色 */
  --c-success: #16A34A;        /* G-C12 成功 */
  --c-warning: #D97706;        /* G-C13 警告 */
  --c-error: #DC2626;          /* G-C14 错误 */
  --c-hover-bg: #F2F4F7;       /* G-C15 悬停浅底 */

  /* 分类标识色 */
  --c-cat-prompt: #7C3AED;     /* G-C16 提示词技巧 紫 */
  --c-cat-tool: #0891B2;       /* G-C17 工具对比 青 */
  --c-cat-project: #16A34A;    /* G-C18 项目展示 绿 */
  --c-cat-help: #EA580C;       /* G-C19 问题求助 橙 */

  /* 字体（G-F01~F03） */
  --font-cn: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Noto Sans CJK SC", sans-serif;
  --font-en: "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", "Fira Code", "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

  /* 圆角（G-R01~R04） */
  --r-sm: 6px;   /* 按钮/输入框/标签 */
  --r-md: 10px;  /* 卡片 */
  --r-lg: 14px;  /* 模态/大面板 */

  /* 阴影（G-D01~D03） */
  --shadow-card: 0 1px 2px rgba(16,24,40,0.05);
  --shadow-hover: 0 4px 12px rgba(16,24,40,0.08);
  --shadow-modal: 0 12px 32px rgba(16,24,40,0.14);

  /* 布局 */
  --container: 1120px;         /* G-S03 内容最大宽 */
}

/* ---------- 基础重置 ---------- */
* { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font-cn), var(--font-en);
  font-size: 15px;
  line-height: 1.7;
  color: var(--c-text);
  background: transparent;        /* 让动态背景透出来 */
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
body.topic-modal-open { overflow: hidden; }

a { color: var(--c-primary); text-decoration: none; }
a:hover { color: var(--c-primary-hover); }

img { max-width: 100%; display: block; }

/* 跳到主内容（G-A08） */
.skip-link {
  position: absolute; left: -999px; top: 0;
  background: var(--c-primary); color: #fff;
  padding: 8px 16px; border-radius: var(--r-sm); z-index: 999;
}
.skip-link:focus { left: 16px; top: 8px; color: #fff; }

/* 聚焦环（G-B02, G-A04） */
:focus-visible {
  outline: none;
  border-color: var(--c-primary) !important;
  box-shadow: 0 0 3px rgba(37,99,235,0.25);
}

/* ---------- 容器 ---------- */
.container {
  max-width: var(--container);
  min-width: 0;
  margin: 0 auto;
  padding: 0 24px;          /* G-S04 */
}

/* ==========================================================================
   顶部导航栏（H-N 区）
   ========================================================================== */
.site-header {
  position: sticky; top: 0; z-index: 100;
  height: 60px;
  background: var(--c-surface);
  border-bottom: 1px solid var(--c-border);
}
.site-header .container {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 32px;
}

.brand { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.brand__logo {                 /* H-N01 Logo 图形（用 SVG 占位） */
  width: 32px; height: 32px; border-radius: 8px;
  background: linear-gradient(135deg, var(--c-primary), #7C3AED);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 700; font-size: 16px;
}
.brand__name {                 /* H-N02 站点名称 */
  font-size: 18px; font-weight: 600; color: var(--c-text);
  white-space: nowrap;
}

.nav {                          /* H-N03~07 分类导航 */
  display: flex; align-items: center; gap: 24px;
  flex: 1;
}
.nav__link {
  font-size: 14px; font-weight: 500; color: var(--c-text-2);
  padding: 6px 0; position: relative;
  border-bottom: 2px solid transparent;
  transition: color .15s;
}
.nav__link:hover { color: var(--c-primary); border-bottom-color: var(--c-primary); }
.nav__link--active { color: var(--c-primary); border-bottom-color: var(--c-primary); }

.header-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.header-user-actions { display: flex; align-items: center; gap: 10px; }
.header-quick-link {
  position: relative; display: inline-flex; align-items: center; gap: 4px;
  min-height: 36px; padding: 0 4px; color: var(--c-text-2); text-decoration: none;
  font-size: 14px; white-space: nowrap;
}
.header-quick-link:hover { color: var(--c-primary); }
.header-quick-link__label { font-size: 13px; }
.header-quick-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  background: var(--c-error); color: #fff; font-size: 11px; font-weight: 700; line-height: 1;
}

.search {                       /* H-N08 搜索框 */
  display: flex; align-items: center; gap: 8px;
  width: 240px; height: 36px;
  padding: 0 12px;
  border: 1px solid var(--c-border); border-radius: var(--r-sm);
  background: var(--c-bg);
}
.search:focus-within { border-color: var(--c-primary); box-shadow: 0 0 3px rgba(37,99,235,0.25); }
.search__icon { color: var(--c-text-3); flex-shrink: 0; }
.search input {
  border: none; background: none; outline: none;
  font-size: 14px; color: var(--c-text); width: 100%;
  font-family: inherit;
}
.search input::placeholder { color: var(--c-text-3); }

/* 汉堡（H-N12），默认隐藏，仅手机显示 */
.hamburger {
  display: none;
  width: 44px; height: 44px;
  align-items: center; justify-content: center;
  background: none; border: none; cursor: pointer;
  color: var(--c-text-2);
}

/* ==========================================================================
   按钮
   ========================================================================== */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  font-family: inherit; font-size: 14px; font-weight: 500;  /* G-F10 */
  line-height: 1; cursor: pointer;
  border-radius: var(--r-sm); border: 1px solid transparent;
  padding: 0 16px; height: 36px;
  transition: background .15s, border-color .15s, color .15s;
  white-space: nowrap;
}
/* 主按钮 */
.btn--primary { background: var(--c-primary); color: #fff; }
.btn--primary:hover { background: var(--c-primary-hover); color: #fff; }
.btn--primary:active { background: var(--c-primary-active); }
.btn--primary:disabled { background: #B9C4D4; color: #fff; cursor: not-allowed; }
/* 次要按钮 */
.btn--secondary { background: var(--c-surface); color: var(--c-primary); border-color: var(--c-border); }
.btn--secondary:hover { background: var(--c-hover-bg); }
.btn--secondary:active { background: var(--c-primary-soft); }
/* 文字按钮 */
.btn--text { background: none; color: var(--c-text-2); border: none; padding: 0 8px; }
.btn--text:hover { color: var(--c-primary); }
/* 尺寸 */
.btn--lg { height: 44px; font-size: 15px; }
.btn--md { height: 38px; }
.btn--block { width: 100%; }

/* ==========================================================================
   标签 / 徽章 / 分类色点
   ========================================================================== */
.cat-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  margin-right: 6px; flex-shrink: 0;
}
.cat-dot--prompt { background: var(--c-cat-prompt); }
.cat-dot--tool { background: var(--c-cat-tool); }
.cat-dot--project { background: var(--c-cat-project); }
.cat-dot--help { background: var(--c-cat-help); }

.cat-tag {
  display: inline-flex; align-items: center;
  font-size: 12px; padding: 2px 8px; border-radius: var(--r-sm);
  background: var(--c-primary-soft); color: var(--c-text-2);
  white-space: nowrap;
}
.cat-tag--prompt { background: rgba(124,58,237,.1); color: var(--c-cat-prompt); }
.cat-tag--tool { background: rgba(8,145,178,.1); color: var(--c-cat-tool); }
.cat-tag--project { background: rgba(22,163,74,.1); color: var(--c-cat-project); }
.cat-tag--help { background: rgba(234,88,12,.1); color: var(--c-cat-help); }

.tag {                          /* 普通标签 tag */
  display: inline-flex; align-items: center;
  font-size: 12px; padding: 2px 8px; border-radius: var(--r-sm);
  background: var(--c-hover-bg); color: var(--c-text-2);
  white-space: nowrap;
}

.badge-solved {                 /* 已解决徽章 H-M16/D-H05 */
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 12px; color: var(--c-success); font-weight: 500;
}
.badge-role {                   /* 身份徽章 D-P04 */
  font-size: 11px; padding: 1px 6px; border-radius: 4px;
  background: var(--c-primary-soft); color: var(--c-primary);
}
.badge-pin {                    /* 置顶 H-M15 */
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 12px; color: var(--c-warning); font-weight: 500;
}

/* ==========================================================================
   卡片
   ========================================================================== */
.card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-card);
}
.card__pad { padding: 20px; }     /* G-S05 */

/* ==========================================================================
   页脚（H-F 区）
   ========================================================================== */
.site-footer {
  margin-top: 48px;
  background: var(--c-bg);
  border-top: 1px solid var(--c-border);
  padding: 32px 0 24px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 32px;
}
.footer__name { font-size: 15px; font-weight: 600; color: var(--c-text); }
.footer__desc { font-size: 13px; color: var(--c-text-2); margin-top: 4px; }
.footer-col h4 { font-size: 13px; color: var(--c-text-2); margin-bottom: 10px; font-weight: 600; }
.footer-col a { display: block; font-size: 13px; color: var(--c-text-2); padding: 3px 0; }
.footer-col a:hover { color: var(--c-primary); }
.footer__meta {
  margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--c-border);
  font-size: 12px; color: var(--c-text-3);
  display: flex; flex-direction: column; gap: 4px;
}

/* ==========================================================================
   通用：主体两栏布局
   ========================================================================== */
.layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 24px;
  padding: 24px 0;
  align-items: start;
}
.layout > * { min-width: 0; }
.sidebar { display: flex; flex-direction: column; gap: 16px; }
.sidebar .card { position: sticky; }
.topic-layout { padding: 24px 0; min-width: 0; }

/* 侧栏卡片小标题 */
.side-title { font-size: 14px; font-weight: 600; color: var(--c-text-2); margin-bottom: 12px; }

/* 侧栏分类项 */
.side-cat {
  display: flex; align-items: center;
  font-size: 14px; color: var(--c-text); padding: 7px 0;
}
.side-cat:hover { color: var(--c-primary); }

/* ==========================================================================
   表单元素（发帖页 / 登录页共用）
   ========================================================================== */
.field { margin-bottom: 20px; }
.field__label { display: block; font-size: 13px; font-weight: 600; color: var(--c-text-2); margin-bottom: 8px; }
.field__hint { font-size: 12px; color: var(--c-text-3); margin-top: 6px; }
.field__error { font-size: 12px; color: var(--c-error); margin-top: 6px; display: none; }

.input, .textarea, .select {
  width: 100%; height: 44px;
  padding: 0 14px;
  font-family: inherit; font-size: 15px; color: var(--c-text);
  background: var(--c-surface);
  border: 1px solid var(--c-border); border-radius: var(--r-sm);
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.textarea { height: auto; padding: 12px 14px; resize: vertical; line-height: 1.6; }
.input::placeholder, .textarea::placeholder { color: var(--c-text-3); }
.input:hover, .textarea:hover, .select:hover { border-color: #C7CFDA; }
.input:focus, .textarea:focus, .select:focus {
  border-color: var(--c-primary); box-shadow: 0 0 3px rgba(37,99,235,0.25);
}
.select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238A94A6' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 40px; }

/* ==========================================================================
   Markdown 工具条
   ========================================================================== */
.md-toolbar {
  display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
  padding: 8px 10px;
  border: 1px solid var(--c-border); border-bottom: none;
  border-radius: var(--r-sm) var(--r-sm) 0 0;
  background: var(--c-bg);
}
.md-toolbar button {
  width: 32px; height: 32px; border: none; background: none; cursor: pointer;
  border-radius: 4px; color: var(--c-text-2);
  display: flex; align-items: center; justify-content: center;
}
.md-toolbar button:hover { background: var(--c-hover-bg); color: var(--c-primary); }
.md-toolbar + .textarea { border-radius: 0 0 var(--r-sm) var(--r-sm); }

/* ==========================================================================
   代码块（D-P07）
   ========================================================================== */
.codeblock {
  position: relative;
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  margin: 12px 0;
  overflow: hidden;
}
.codeblock__head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 12px; border-bottom: 1px solid var(--c-border);
  font-size: 12px; color: var(--c-text-3);
}
.codeblock__copy {
  background: none; border: none; cursor: pointer;
  font-size: 12px; color: var(--c-text-2); font-family: inherit;
}
.codeblock__copy:hover { color: var(--c-primary); }
.codeblock pre {
  margin: 0; padding: 12px; overflow-x: auto;
  font-family: var(--font-mono); font-size: 13px; line-height: 1.6;
  color: var(--c-text);
}

/* ==========================================================================
   提示条
   ========================================================================== */
.notice {
  padding: 12px 16px; border-radius: var(--r-sm); font-size: 14px;
  display: flex; align-items: center; gap: 8px;
}
.notice--info { background: var(--c-primary-soft); color: var(--c-text-2); }
.notice--muted { background: var(--c-hover-bg); color: var(--c-text-3); font-size: 12px; }
.notice--error { background: #FEECEC; color: var(--c-error); }
.notice--success { background: #EAF7EE; color: var(--c-success); }

/* ==========================================================================
   原型顶部提示条（仅原型演示用，非正式元素）
   ========================================================================== */
.proto-bar {
  background: #1F2933; color: #fff; font-size: 12px;
  text-align: center; padding: 6px 12px;
}
.proto-bar a { color: #9DBEFF; }
.proto-nav {
  background: #111827; padding: 8px 0;
}
.proto-nav .container { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.proto-nav span { color: #9CA3AF; font-size: 12px; margin-right: 8px; }
.proto-nav a {
  font-size: 12px; color: #E5E7EB; padding: 4px 10px;
  border: 1px solid #374151; border-radius: 4px;
}
.proto-nav a:hover { background: #1F2937; color: #fff; }

/* ==========================================================================
   头像
   ========================================================================== */
.avatar {
  border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 600; font-size: 13px;
  background: #7C3AED;
}
.avatar--sm { width: 24px; height: 24px; font-size: 11px; }
.avatar--md { width: 32px; height: 32px; }
.avatar--lg { width: 40px; height: 40px; font-size: 15px; }
.avatar--b { background: #0891B2; }
.avatar--c { background: #EA580C; }
.avatar--d { background: #16A34A; }
.avatar--e { background: #DB2777; }

/* ==========================================================================
   响应式
   ========================================================================== */
@media (max-width: 1023px) {
  .layout { grid-template-columns: 1fr; }
  .sidebar { order: 2; }
  .search { width: 44px; padding: 0; justify-content: center; }
  .search input { display: none; }
}

@media (max-width: 767px) {
  .nav { display: none; }
  .nav.mobile-open {
    display: flex; position: absolute; top: 60px; left: 16px; right: 16px;
    z-index: 100; flex-direction: column; align-items: stretch; gap: 4px;
    padding: 12px; background: var(--c-surface); border: 1px solid var(--c-border);
    border-radius: var(--r-md); box-shadow: var(--shadow-modal);
  }
  .nav.mobile-open .nav__group { width: 100%; }
  .nav.mobile-open .nav__trigger, .nav.mobile-open .nav__link { width: 100%; justify-content: flex-start; }
  .hamburger { display: flex; }
  .site-header .container { gap: 12px; }
  .header-actions .btn { display: none; }
  .header-user-actions { gap: 4px; }
  .header-quick-link { min-height: 44px; padding: 0 3px; }
  .header-quick-link__label { display: none; }
  .footer-grid { grid-template-columns: 1fr; gap: 24px; }
  .container { padding: 0 16px; }
  .card__pad { padding: 16px; }
}

/* ==========================================================================
   话题列表行（H-M06~M14）交互态与响应式
   ========================================================================== */
.tlist-row { transition: background .15s; }
.tlist-row:hover { background: var(--c-hover-bg); }
.tlist-row:hover .tlist-title { color: var(--c-primary); }
.tlist-title {
  font-size: 15px; font-weight: 500; color: var(--c-text);
  transition: color .15s;
}

@media (max-width: 767px) {
  /* 列表表头隐藏，行简化为两行：标题+分类 / 头像+回复数+时间（H-M 响应式说明） */
  .tlist-head { display: none !important; }
  .tlist-row {
    grid-template-columns: 1fr auto !important;
    row-gap: 8px !important;
  }
}

/* ==========================================================================
   点赞按钮激活态（D-P09）
   ========================================================================== */
.md-like:hover { color: var(--c-error) !important; }
.md-like.on { color: var(--c-error) !important; }
.md-like.on svg { fill: rgba(220,38,38,.12); }

/* ==========================================================================
   编辑/预览切换选中态（D-R05 / P-17）
   ========================================================================== */
.tab-on {
  background: var(--c-primary-soft) !important;
  color: var(--c-primary) !important;
  border-radius: var(--r-sm);
  border: none; cursor: pointer; font-family: inherit;
}
.tab-off {
  background: none; color: var(--c-text-2);
  border: none; cursor: pointer; font-family: inherit;
  border-radius: var(--r-sm);
}
.tab-off:hover { background: var(--c-hover-bg); }

/* ==========================================================================
   发帖页编辑器双栏（P-14 / P-16）响应式：手机改为单栏切换
   ========================================================================== */
@media (max-width: 767px) {
  .editor-grid { grid-template-columns: 1fr !important; }
  .editor-grid .textarea { border-right: none !important; border-bottom: 1px solid var(--c-border) !important; }
}

/* ==========================================================================
   板块分区（首页板块卡片区）
   ========================================================================== */
.section-group { margin-bottom: 28px; }
.section-group__title {
  display: flex; align-items: center; gap: 8px;
  font-size: 16px; font-weight: 600; color: var(--c-text);
  margin-bottom: 12px;
}
.section-group__title .bar {
  width: 3px; height: 16px; border-radius: 2px; background: var(--c-primary);
}
.board-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
}
.board-card {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 16px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-card);
  transition: box-shadow .15s, border-color .15s, transform .1s;
}
.board-card:hover { box-shadow: var(--shadow-hover); border-color: #C7CFDA; }
.board-card__icon {
  width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 18px;
}
.board-card__body { min-width: 0; flex: 1; }
.board-card__name {
  font-size: 15px; font-weight: 600; color: var(--c-text);
  display: flex; align-items: center; gap: 6px;
}
.board-card__desc {
  font-size: 12px; color: var(--c-text-2); margin: 4px 0 8px;
  line-height: 1.5;
}
.board-card__meta { font-size: 12px; color: var(--c-text-3); }
.board-card:hover .board-card__name { color: var(--c-primary); }

/* 板块图标配色（对应分类色） */
.bi--prompt { background: var(--c-cat-prompt); }
.bi--tool { background: var(--c-cat-tool); }
.bi--project { background: var(--c-cat-project); }
.bi--help { background: var(--c-cat-help); }
.bi--model { background: #2563EB; }
.bi--tutorial { background: #0D9488; }
.bi--resource { background: #CA8A04; }
.bi--newbie { background: #DB2777; }
.bi--chat { background: #64748B; }

/* ==========================================================================
   用户等级徽章（Lv0~Lv4）
   ========================================================================== */
.lv-badge {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 11px; font-weight: 600; line-height: 1;
  padding: 2px 6px; border-radius: 4px;
  white-space: nowrap;
}
.lv-badge--0 { background: #EEF1F5; color: #64748B; }
.lv-badge--1 { background: #E0F2FE; color: #0369A1; }
.lv-badge--2 { background: #DCFCE7; color: #15803D; }
.lv-badge--3 { background: #FEF3C7; color: #B45309; }
.lv-badge--4 { background: #F3E8FF; color: #7C3AED; }

/* 头衔/称号（显示在用户名旁的一句称号） */
.title-tag {
  font-size: 11px; color: var(--c-text-3);
  white-space: nowrap;
}
.title-tag::before { content: "· "; }

/* 作者行组合（头像+名字+等级+头衔） */
.author-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.author-line__name { font-size: 15px; font-weight: 600; color: var(--c-text); }
.author-line__name:hover { color: var(--c-primary); }

/* 列表行内的小作者信息（头像+名字+等级） */
.mini-author { display: flex; align-items: center; gap: 6px; margin-top: 6px; }
.mini-author__name { font-size: 12px; color: var(--c-text-2); }

/* 话题行内作者信息（跟在标签后，左侧留白推开） */
.row-author {
  display: inline-flex; align-items: center; gap: 6px;
  margin-left: auto; padding-left: 8px;
}
.row-author__name { font-size: 12px; color: var(--c-text-2); }
.row-author__name:hover { color: var(--c-primary); }
@media (max-width: 767px) {
  .row-author { margin-left: 0; }
}

/* ==========================================================================
   用户主页（user.html）
   ========================================================================== */
.profile-head {
  display: flex; gap: 20px; align-items: flex-start;
  padding: 24px;
}
.profile-head__avatar {
  width: 88px; height: 88px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 700; font-size: 36px;
  background: #7C3AED;
}
.profile-head__body { flex: 1; min-width: 0; }
.profile-head__name {
  font-size: 24px; font-weight: 700; color: var(--c-text);
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.profile-head__bio { font-size: 14px; color: var(--c-text-2); margin: 8px 0 12px; }
.profile-head__titles { display: flex; flex-wrap: wrap; gap: 6px; }

/* 数据统计条 */
.stat-row {
  display: flex; gap: 32px; flex-wrap: wrap;
  padding: 16px 24px; border-top: 1px solid var(--c-divider);
}
.stat-item { text-align: center; }
.stat-item__num { font-size: 20px; font-weight: 700; color: var(--c-text); }
.stat-item__label { font-size: 12px; color: var(--c-text-3); margin-top: 2px; }

/* 头衔称号（大号，用户主页展示的称号标签） */
.honor {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; font-weight: 500;
  padding: 3px 10px; border-radius: 999px;
  background: var(--c-primary-soft); color: var(--c-primary);
}
.honor--gold { background: #FEF3C7; color: #B45309; }
.honor--purple { background: #F3E8FF; color: #7C3AED; }
.honor--green { background: #DCFCE7; color: #15803D; }
.honor--pink { background: #FCE7F3; color: #DB2777; }

/* 等级进度条 */
.lv-progress {
  height: 8px; border-radius: 999px; background: var(--c-hover-bg);
  overflow: hidden; margin: 8px 0 4px;
}
.lv-progress__fill { height: 100%; background: var(--c-primary); border-radius: 999px; }

/* 徽章墙 */
.badge-wall {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
  gap: 16px;
}
.badge-item { text-align: center; }
.badge-item__icon {
  width: 52px; height: 52px; margin: 0 auto 6px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
  background: var(--c-primary-soft);
}
.badge-item__icon--locked { background: var(--c-hover-bg); filter: grayscale(1); opacity: .5; }
.badge-item__name { font-size: 12px; color: var(--c-text); }
.badge-item__count { font-size: 11px; color: var(--c-text-3); }

/* 用户主页 Tab */
.profile-tabs {
  display: flex; gap: 4px; border-bottom: 1px solid var(--c-border);
  margin: 24px 0 16px;
}
.profile-tabs a {
  padding: 10px 16px; font-size: 14px; font-weight: 500;
  color: var(--c-text-2); border-bottom: 2px solid transparent;
}
.profile-tabs a:hover { color: var(--c-primary); }
.profile-tabs a.active { color: var(--c-primary); border-bottom-color: var(--c-primary); }

@media (max-width: 767px) {
  .board-grid { grid-template-columns: 1fr; }
  .profile-head { flex-direction: column; align-items: center; text-align: center; }
  .profile-head__name { justify-content: center; }
  .stat-row { justify-content: space-around; gap: 16px; }
}

/* ==========================================================================
   帖子卡片（D-P / D-R）· MineBBS 风格：左侧作者竖栏 + 右侧内容
   ========================================================================== */
.post {
  display: grid;
  grid-template-columns: 160px 1fr;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  margin-bottom: 16px;
}

/* 左侧作者竖栏 */
.post__author {
  background: var(--c-bg);
  border-right: 1px solid var(--c-divider);
  padding: 20px 12px;
  display: flex; flex-direction: column;
  align-items: center; text-align: center; gap: 8px;
}
.post__avatar { width: 64px; height: 64px; font-size: 24px; }
.post__name {
  font-size: 15px; font-weight: 600; color: var(--c-text);
  word-break: break-all; line-height: 1.3;
}
.post__name:hover { color: var(--c-primary); }
.post__badges {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.identity-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 132px; max-width: 100%; height: 20px; padding: 0 10px;
  border-radius: 999px; font-size: 11px; font-weight: 500; line-height: 20px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle;
}
.post__identities {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.profile-head__name .identity-badge,
.user-menu__name .identity-badge { width: auto; min-width: 52px; }

/* 用户组彩色标签（身份） */
.post__group {
  display: inline-block; font-size: 11px; font-weight: 600;
  padding: 2px 10px; border-radius: 10px; color: #fff; white-space: nowrap;
}
.post__group--owner  { background: var(--c-primary); }   /* 楼主 */
.post__group--vip    { background: #B45309; }             /* 高级会员 */
.post__group--member { background: #15803D; }             /* 普通会员 */

/* 作者栏统计数据 */
.post__stats {
  width: 100%; margin-top: 4px; padding-top: 12px;
  border-top: 1px solid var(--c-divider);
  display: flex; flex-direction: column; gap: 5px;
}
.post__stat {
  display: flex; justify-content: space-between;
  font-size: 12px; color: var(--c-text-3);
}
.post__stat b { color: var(--c-text-2); font-weight: 600; }

/* 右侧内容区 */
.post__main {
  padding: 16px 20px; min-width: 0;
  display: flex; flex-direction: column;
}
.post__meta {
  display: flex; align-items: center;
  font-size: 12px; color: var(--c-text-3);
  padding-bottom: 12px; margin-bottom: 12px;
  border-bottom: 1px solid var(--c-divider);
}
.post__floor { margin-left: auto; font-weight: 600; color: var(--c-text-2); }
.post__content { flex: 1; min-width: 0; }
.post__actions {
  display: flex; align-items: center; gap: 16px;
  margin-top: 16px; padding-top: 12px;
  border-top: 1px solid var(--c-divider);
}
.topic-info-inline {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px;
  margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--c-divider);
  font-size: 12px; color: var(--c-text-3);
}
.topic-info-inline__label { font-weight: 600; color: var(--c-text-2); }

/* 响应式：窄屏作者栏转为横向顶部栏 */
@media (max-width: 767px) {
  #headContent { min-width: 0; overflow-wrap: anywhere; }
  .post { grid-template-columns: 1fr; }
  .post__author {
    flex-direction: row; text-align: left; flex-wrap: wrap;
    border-right: none; border-bottom: 1px solid var(--c-divider);
    padding: 12px 16px; gap: 8px; overflow: hidden;
  }
  .post__avatar { width: 44px; height: 44px; font-size: 16px; }
  .post__badges {
    flex: 0 0 calc(100% - 16px); width: calc(100% - 16px); min-width: 0;
    flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start;
  }
  .post__badges .identity-badge { width: auto; max-width: 132px; }
  .post__identities {
    flex: 0 0 calc(100% - 16px); width: calc(100% - 16px); max-width: 100%;
    flex-direction: row; flex-wrap: wrap; justify-content: flex-start;
  }
  .post__stats {
    flex: 0 0 calc(100% - 16px); width: calc(100% - 16px); min-width: 0; margin: 0; padding: 0; border: none;
    display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px;
  }
  .post__stat { justify-content: center; gap: 4px; }
  .post__main { padding: 14px 16px; }
}

/* ==========================================================================
   首页轮播图（Banner / 幻灯片）
   ========================================================================== */
.hero {
  position: relative;
  border-radius: var(--r-md);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  margin-bottom: 24px;
}
.hero__track {
  display: flex;
  min-width: 0;
  transition: transform .45s ease;
}
.hero__slide {
  position: relative;
  flex: 0 0 100%;
  min-width: 0;
  min-height: 220px;
  display: flex; flex-direction: column; justify-content: center;
  padding: 32px 40px;
  color: #fff;
}
.hero__slide.hero__slide--1,
.hero__slide.hero__slide--2,
.hero__slide.hero__slide--3 { min-height: 360px; }
.hero__slide { padding-left: 64px; padding-right: 64px; }
.hero__slide.hero__slide--1,
.hero__slide.hero__slide--2,
.hero__slide.hero__slide--3,
a.hero__slide { text-decoration: none; }
a.hero__slide:hover { color: #fff; }
a.hero__slide:focus-visible { outline: 3px solid var(--c-primary); outline-offset: -3px; }
.hero__slide.hero__slide--image-only { padding: 0; }
.hero__image,
.hero__overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__image { object-fit: cover; z-index: 0; }
.hero__overlay { background: linear-gradient(90deg, rgba(15,23,42,.68), rgba(15,23,42,.16)); z-index: 0; }
.hero__content { position: relative; z-index: 1; width: 100%; display: flex; flex-direction: column; align-items: flex-start; }
.hero__desc { width: 100%; overflow-wrap: anywhere; }
.hero__slide--1 { background: linear-gradient(120deg, #2563EB, #7C3AED); }
.hero__slide--2 { background: linear-gradient(120deg, #0891B2, #16A34A); }
.hero__slide--3 { background: linear-gradient(120deg, #EA580C, #DB2777); }
.hero__tag {
  display: inline-block; align-self: flex-start;
  font-size: 12px; font-weight: 600;
  background: rgba(255,255,255,.22);
  padding: 3px 10px; border-radius: 10px; margin-bottom: 12px;
  backdrop-filter: blur(2px);
}
.hero__title { font-size: 24px; font-weight: 700; line-height: 1.3; margin-bottom: 8px; }
.hero__desc { font-size: 14px; opacity: .92; max-width: 560px; margin-bottom: 18px; }
.hero__btn {
  display: inline-block; align-self: flex-start;
  font-size: 14px; font-weight: 600; color: var(--c-primary);
  background: #fff; padding: 8px 18px; border-radius: var(--r-sm);
}
.hero__btn:hover { color: var(--c-primary-hover); background: #f3f6ff; }

/* 左右箭头 */
.hero__arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; border-radius: 50%;
  border: none; cursor: pointer;
  background: rgba(0,0,0,.28); color: #fff;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s;
}
.hero__arrow:hover { background: rgba(0,0,0,.45); }
.hero__arrow--prev { left: 14px; }
.hero__arrow--next { right: 14px; }

/* 圆点指示器 */
.hero__dots {
  position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 8px;
}
.hero__dot {
  width: 8px; height: 8px; border-radius: 50%; border: none; cursor: pointer;
  background: rgba(255,255,255,.5); padding: 0;
}
.hero__dot.on { background: #fff; width: 20px; border-radius: 4px; }

/* ==========================================================================
   签到卡片
   ========================================================================== */
.checkin { text-align: center; }
.checkin__head {
  display: flex; align-items: center; gap: 8px;
  font-size: 15px; font-weight: 600; color: var(--c-text);
  margin-bottom: 12px;
}
.checkin__streak {
  font-size: 13px; color: var(--c-text-2); margin-bottom: 12px;
}
.checkin__streak b { color: var(--c-warning); font-size: 18px; }
/* 本周签到进度点 */
.checkin__week {
  display: flex; justify-content: space-between; gap: 4px; margin-bottom: 14px;
}
.checkin__day {
  flex: 1;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  font-size: 11px; color: var(--c-text-3);
}
.checkin__dot {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--c-hover-bg);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; color: var(--c-text-3);
}
.checkin__day--done .checkin__dot { background: var(--c-success); color: #fff; }
.checkin__day--today .checkin__dot { background: var(--c-primary); color: #fff; }
.checkin__btn { width: 100%; }
.checkin__btn:disabled { background: var(--c-success); border-color: var(--c-success); cursor: default; opacity: 1; }

/* 第六阶段：首页数据概览、签到卡片和装饰动效 */
.overview-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.overview-card {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-card);
}
.overview-card__icon { font-size: 20px; line-height: 1; flex-shrink: 0; }
.overview-card__num { display: block; font-size: 28px; line-height: 1.15; font-weight: 700; color: var(--c-text); }
.overview-card__label { display: block; margin-top: 4px; font-size: 12px; color: var(--c-text-3); }
.checkin { position: relative; overflow: hidden; }
.checkin__head { justify-content: space-between; }
.checkin__today { font-size: 11px; font-weight: 500; color: var(--c-text-3); }
.checkin__profile {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  margin-bottom: 12px;
  text-align: left;
  background: var(--c-bg);
  border-radius: 8px;
}
.checkin__profile .avatar { width: 48px; height: 48px; font-size: 18px; }
.checkin__user-info { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.checkin__user-info strong { max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; color: var(--c-text); }
.checkin__user-info .checkin__streak { margin: 0; }
.checkin-success-float {
  position: absolute;
  left: 50%;
  top: 112px;
  z-index: 2;
  color: var(--c-success);
  font-size: 16px;
  font-weight: 700;
  pointer-events: none;
  animation: checkinSuccessFloat 1.2s ease-out both;
}
@keyframes checkinSuccessFloat {
  from { opacity: 0; transform: translate(-50%, 8px) scale(.85); }
  20% { opacity: 1; }
  to { opacity: 0; transform: translate(-50%, -34px) scale(1.05); }
}
.sakura-layer {
  position: fixed;
  inset: 0;
  z-index: 5;
  overflow: hidden;
  pointer-events: none;
}
.sakura-flake {
  position: absolute;
  top: -30px;
  left: var(--sakura-left);
  width: var(--sakura-size);
  height: var(--sakura-size);
  background:
    radial-gradient(ellipse at 34% 22%, rgba(255,255,255,.96) 0 9%, transparent 38%),
    linear-gradient(155deg, #fff8fb 0%, #f8c4d2 54%, #df8fa6 100%);
  opacity: var(--sakura-opacity);
  -webkit-mask: var(--sakura-mask) center / 100% 100% no-repeat;
  mask: var(--sakura-mask) center / 100% 100% no-repeat;
  transform: translate3d(0,-30px,0) rotate(var(--sakura-r0)) scaleX(.88);
  will-change: transform, opacity;
  animation: sakuraFall var(--sakura-duration) linear var(--sakura-delay) infinite;
}
.sakura-flake--a {
  --sakura-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 80'%3E%3Cpath fill='white' d='M32 78C18 68 7 51 8 33C9 17 18 5 30 13L32 17L34 13C46 5 55 17 56 33C57 51 46 68 32 78Z'/%3E%3C/svg%3E");
}
.sakura-flake--b {
  --sakura-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 80'%3E%3Cpath fill='white' d='M26 78C11 64 6 43 12 26C18 10 30 4 34 17C44 8 55 20 57 37C59 54 46 70 26 78Z'/%3E%3C/svg%3E");
  background:
    radial-gradient(ellipse at 28% 24%, rgba(255,255,255,.9) 0 8%, transparent 36%),
    linear-gradient(125deg, #f9dbe3 0%, #efabbc 54%, #c97991 100%);
}
.sakura-flake--c {
  --sakura-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 80'%3E%3Cpath fill='white' d='M34 78C22 66 15 47 18 28C21 11 33 5 36 18C44 10 53 22 51 39C49 56 43 68 34 78Z'/%3E%3C/svg%3E");
  background:
    radial-gradient(ellipse at 30% 18%, rgba(255,255,255,.92) 0 8%, transparent 35%),
    linear-gradient(150deg, #fff5f8 0%, #f3b4c5 48%, #c87991 100%);
}
.sakura-flake--far { z-index: 0; }
.sakura-flake--mid { z-index: 1; }
.sakura-flake--near { z-index: 2; }
.sakura-flake::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 14%;
  width: 1px;
  height: 54%;
  border-radius: 999px;
  background: linear-gradient(to top, rgba(145,72,94,.36), rgba(255,255,255,0));
  opacity: .58;
  transform: translateX(-50%) rotate(var(--sakura-vein-rotate));
  transform-origin: bottom center;
}
.sakura-flake::after {
  content: "";
  position: absolute;
  left: 23%;
  top: 18%;
  width: 38%;
  height: 24%;
  border-radius: 50%;
  background: rgba(255,255,255,.26);
  transform: rotate(-18deg);
  opacity: .7;
}
@keyframes sakuraFall {
  0% { transform: translate3d(0, -30px, 0) rotate(var(--sakura-r0)) scaleX(.88); opacity: 0; }
  10% { opacity: var(--sakura-opacity); }
  22% { transform: translate3d(var(--sakura-x1), 22vh, 0) rotate(var(--sakura-r1)) scaleX(.46); }
  48% { transform: translate3d(var(--sakura-x2), 49vh, 0) rotate(var(--sakura-r2)) scaleX(.92); }
  72% { transform: translate3d(var(--sakura-x3), 76vh, 0) rotate(var(--sakura-r3)) scaleX(.52); }
  90% { opacity: var(--sakura-opacity); }
  100% { transform: translate3d(var(--sakura-x4), 110vh, 0) rotate(var(--sakura-r4)) scaleX(.82); opacity: 0; }
}

@media (max-width: 767px) {
  .overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .overview-card { padding: 12px; gap: 8px; }
  .overview-card__num { font-size: 22px; }
  .overview-card__icon { font-size: 17px; }
  .hero__slide.hero__slide--1,
  .hero__slide.hero__slide--2,
  .hero__slide.hero__slide--3,
  a.hero__slide { min-height: 200px; padding: 24px 52px; }
  .hero__slide.hero__slide--image-only { padding: 0; }
  .hero__content { min-width: 0; max-width: 100%; }
  .hero__slide .hero__desc { width: auto; max-width: calc(100vw - 136px); word-break: break-all; }
  .checkin-success-float { top: 106px; }
  .layout { display: flex; flex-direction: column; gap: 0; padding: 20px 0; }
  .layout > section { order: 2; }
  .layout > .sidebar { display: contents; }
  .sidebar > #checkinCard,
  .sidebar > #guestCard { order: 1; margin-bottom: 16px; }
  .sidebar > .card:not(#checkinCard):not(#guestCard) { order: 3; margin-bottom: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .sakura-layer, .checkin-success-float { display: none !important; }
}

/* ==========================================================================
   首页新增区块 · 移动端适配
   ========================================================================== */
@media (max-width: 767px) {
  .hero__slide { min-height: 180px; padding: 24px 20px; }
  .hero__title { font-size: 19px; }
  .hero__desc { font-size: 13px; margin-bottom: 14px; }
  .hero__arrow { width: 30px; height: 30px; }
}

/* ==========================================================================
   用户角色权限标识（站长 / 管理员 / 版主 / VIP / 认证开发者 / 会员）
   ========================================================================== */
.role {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 11px; font-weight: 600; line-height: 1;
  padding: 2px 7px; border-radius: 4px;
  white-space: nowrap;
}
.role--owner  { background: #FEE2E2; color: #B91C1C; }   /* 站长 红 */
.role--admin  { background: #FFEDD5; color: #C2410C; }   /* 管理员 橙 */
.role--mod    { background: #DBEAFE; color: #1D4ED8; }   /* 版主 蓝 */
.role--vip    { background: #FEF3C7; color: #B45309; }   /* VIP 金 */
.role--dev    { background: #DCFCE7; color: #15803D; }   /* 认证开发者 绿 */
.role--member { background: #EEF1F5; color: #64748B; }   /* 普通会员 灰 */

/* ==========================================================================
   用户下拉菜单（个人中心）
   ========================================================================== */
.user-menu { position: relative; flex-shrink: 0; }
.user-menu__trigger {
  display: flex; align-items: center; gap: 6px;
  background: none; border: none; cursor: pointer; padding: 2px;
  border-radius: 50px;
}
.user-menu__trigger:hover { background: var(--c-hover-bg); }
.user-menu__caret { color: var(--c-text-3); transition: transform .2s; }
.user-menu.open .user-menu__caret { transform: rotate(180deg); }

.user-menu__panel {
  position: absolute; top: calc(100% + 8px); right: 0;
  width: 280px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-modal);
  padding: 8px;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .18s, transform .18s, visibility .18s;
  z-index: 200;
}
.user-menu.open .user-menu__panel { opacity: 1; visibility: visible; transform: translateY(0); }

/* 顶部用户信息块 */
.user-menu__head {
  display: flex; align-items: center; gap: 12px;
  padding: 12px; border-radius: var(--r-sm);
  background: var(--c-bg); margin-bottom: 8px;
}
.user-menu__info { min-width: 0; }
.user-menu__name {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: 15px; font-weight: 600; color: var(--c-text);
}
.user-menu__stats {
  display: flex; gap: 14px; margin-top: 6px;
  font-size: 12px; color: var(--c-text-3);
}
.user-menu__stats b { color: var(--c-text-2); }

/* 菜单项网格（两列） */
.user-menu__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px;
}
.user-menu__item {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 10px; border-radius: var(--r-sm);
  font-size: 13px; color: var(--c-text-2);
}
.user-menu__item:hover { background: var(--c-hover-bg); color: var(--c-primary); }
.user-menu__item svg { flex-shrink: 0; color: var(--c-text-3); }
.user-menu__item:hover svg { color: var(--c-primary); }
.user-menu__divider { height: 1px; background: var(--c-divider); margin: 8px 4px; }
.user-menu__item--danger { color: var(--c-error); }
.user-menu__item--danger:hover { background: #FEF2F2; color: var(--c-error); }
.user-menu__item--danger svg { color: var(--c-error); }

/* 头像旁小等级标 */
.mini-lv {
  font-size: 10px; font-weight: 700; color: #fff;
  background: var(--c-primary); border-radius: 4px;
  padding: 1px 5px; white-space: nowrap;
}

/* ==========================================================================
   帖子前缀标签（发帖时选择的分类前缀）
   ========================================================================== */
.prefix {
  display: inline-flex; align-items: center;
  font-size: 12px; font-weight: 600; line-height: 1;
  padding: 3px 8px; border-radius: 4px;
  white-space: nowrap;
}
.prefix--notice   { background: #FEE2E2; color: #B91C1C; }  /* 论坛事务/公告 */
.prefix--plugin   { background: #DBEAFE; color: #1D4ED8; }  /* 服务端插件 */
.prefix--share    { background: #EDE9FE; color: #6D28D9; }  /* 技术分享 */
.prefix--work     { background: #DCFCE7; color: #15803D; }  /* 作品展示 */
.prefix--opensource { background: #CFFAFE; color: #0E7490; } /* 开源软件 */
.prefix--homework { background: #FCE7F3; color: #BE185D; }  /* 作业发布 */
.prefix--help     { background: #FFEDD5; color: #C2410C; }  /* 问题求助 */
.prefix--tool     { background: #E0F2FE; color: #0369A1; }  /* 工具对比 */

/* ==========================================================================
   置顶 / 精华 明显标识
   ========================================================================== */
.flag-top {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 11px; font-weight: 700; line-height: 1;
  padding: 2px 7px; border-radius: 4px;
  background: var(--c-warning); color: #fff;
}
.flag-elite {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 11px; font-weight: 700; line-height: 1;
  padding: 2px 7px; border-radius: 4px;
  background: linear-gradient(120deg, #F59E0B, #DC2626); color: #fff;
}
/* 置顶帖整行高亮底 */
.tlist-row--top { background: #FFFBEB; }
.tlist-row--top:hover { background: #FEF3C7; }

/* ==========================================================================
   精华帖子卡片（侧栏）
   ========================================================================== */
.elite-item {
  display: block; padding: 10px 0;
  border-bottom: 1px solid var(--c-divider);
}
.elite-item:last-child { border-bottom: none; }
.elite-item__title {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--c-text); line-height: 1.5;
}
.elite-item__title:hover { color: var(--c-primary); }
.elite-item__meta {
  font-size: 12px; color: var(--c-text-3); margin-top: 4px;
}

/* ==========================================================================
   头像上传 / 更换
   ========================================================================== */
.avatar-edit { position: relative; display: inline-block; cursor: pointer; }
.avatar-edit__overlay {
  position: absolute; inset: 0; border-radius: 50%;
  background: rgba(0,0,0,.5); color: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; font-size: 12px;
  opacity: 0; transition: opacity .2s;
}
.avatar-edit:hover .avatar-edit__overlay { opacity: 1; }

@media (max-width: 767px) {
  .user-menu__panel { width: 260px; }
}

/* 邮箱验证与登录状态页 */
.auth-main {
  min-height: calc(100vh - 61px - 66px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 16px;
  overflow-x: hidden;
}
.auth-home-link { min-height: 44px; display: inline-flex; align-items: center; margin-bottom: 6px; color: var(--c-text-2); font-size: 13px; }
.auth-card { width: 100%; max-width: 420px; padding: 32px; border-radius: var(--r-lg); box-shadow: var(--shadow-modal); }
.password-toggle {
  position: absolute; right: 0; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center;
  border: 0; background: none; color: var(--c-text-3); cursor: pointer;
}
.verification-state { text-align: center; }
.state-icon {
  width: 48px; height: 48px; margin: 2px auto 14px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.state-icon--mail { color: var(--c-primary); background: var(--c-primary-soft); }
.state-icon--warning { color: var(--c-warning); background: #FFF7E8; }
.state-title { margin-bottom: 18px; font-size: 22px; font-weight: 600; line-height: 1.4; }
.state-copy { color: var(--c-text-2); font-size: 14px; }
.state-copy--preline { white-space: pre-line; }
.masked-email { margin: 3px 0 18px; overflow-wrap: anywhere; color: var(--c-text); font-size: 16px; font-weight: 600; }
.verification-tip {
  display: flex; align-items: flex-start; gap: 10px; margin-bottom: 16px; padding: 12px 14px;
  border-radius: var(--r-sm); background: var(--c-primary-soft); color: var(--c-text-2);
  text-align: left; font-size: 13px; line-height: 1.7;
}
.verification-tip svg { flex: 0 0 24px; color: var(--c-primary); }
.spam-tip { margin-bottom: 18px; color: var(--c-text-2); font-size: 13px; line-height: 1.65; }
.resend-notice { margin-bottom: 14px; text-align: left; font-size: 13px; }
.state-link { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; margin-top: 8px; font-size: 13px; }
.contact-email { margin-top: 9px; color: var(--c-text-3); font-size: 12px; overflow-wrap: anywhere; }

/* 独立邮箱验证页 */
.email-status { text-align: center; }
.email-status__icon {
  width: 56px; height: 56px; margin: 2px auto 16px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.email-status__icon--loading { color: var(--c-primary); background: var(--c-primary-soft); }
.email-status__icon--success { color: var(--c-success); background: #EAF7EE; }
.email-status__icon--invalid { color: var(--c-warning); background: #FFF7E8; }
.email-status__icon--network { color: var(--c-error); background: #FEECEC; }
.email-status__spinner {
  width: 28px; height: 28px; border: 3px solid #BFD1FB; border-top-color: var(--c-primary);
  border-radius: 50%; animation: email-spin .8s linear infinite;
}
@keyframes email-spin { to { transform: rotate(360deg); } }
.email-status__title { margin-bottom: 10px; font-size: 22px; font-weight: 600; }
.email-status__copy { margin-bottom: 22px; color: var(--c-text-2); font-size: 14px; line-height: 1.75; }
.email-status__secondary { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; margin-top: 8px; font-size: 13px; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

@media (max-width: 420px) {
  .auth-main { padding: 24px 16px; }
  .auth-card { max-width: 358px; padding: 20px; }
  .site-header .container { min-width: 0; }
  .auth-card .btn, .auth-card a { min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .email-status__spinner { animation-duration: 1.6s; }
}

/* ==========================================================================
   顶部导航下拉菜单（板块分组）
   ========================================================================== */
.nav__group { position: relative; }
.nav__trigger {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 14px; font-weight: 500; color: var(--c-text-2);
  background: none; border: none; cursor: pointer;
  padding: 6px 0; font-family: inherit;
  border-bottom: 2px solid transparent;
  transition: color .15s;
}
.nav__trigger:hover { color: var(--c-primary); }
.nav__group:hover .nav__trigger { color: var(--c-primary); border-bottom-color: var(--c-primary); }
.nav__caret { transition: transform .2s; }
.nav__group:hover .nav__caret { transform: rotate(180deg); }

.nav__dropdown {
  position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%) translateY(-6px);
  min-width: 200px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-modal);
  padding: 6px;
  opacity: 0; visibility: hidden;
  transition: opacity .18s, transform .18s, visibility .18s;
  z-index: 200;
}
.nav__group:hover .nav__dropdown { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
/* 悬停桥接，避免鼠标移到下拉时断开 */
.nav__dropdown::before {
  content: ""; position: absolute; top: -8px; left: 0; right: 0; height: 8px;
}
.nav__ditem {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px; border-radius: var(--r-sm);
  font-size: 13px; color: var(--c-text-2); white-space: nowrap;
}
.nav__ditem:hover { background: var(--c-hover-bg); color: var(--c-primary); }
.nav__ditem .cat-dot { margin-right: 0; }

@media (max-width: 1023px) {
  .nav__dropdown { min-width: 180px; }
}

/* ==========================================================================
   积分币标识（通用）
   ========================================================================== */
.coin {
  display: inline-flex; align-items: center; gap: 3px;
  font-weight: 600; color: var(--c-warning);
}
.coin::before { content: "🪙"; font-size: .9em; }

/* ==========================================================================
   通知中心（顶部铃铃 + 下拉面板）
   ========================================================================== */
.notif { position: relative; flex-shrink: 0; }
.notif__trigger {
  position: relative;
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: none; border: none; cursor: pointer; color: var(--c-text-2);
}
.notif__trigger:hover { background: var(--c-hover-bg); color: var(--c-primary); }
.notif__dot {
  position: absolute; top: 4px; right: 4px;
  min-width: 16px; height: 16px; border-radius: 8px;
  background: var(--c-error); border: 2px solid var(--c-surface);
  color: #fff; font-size: 10px; font-weight: 700; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  padding: 0 3px;
}
.notif__foot { text-align: center; padding: 8px 4px 4px; }
.notif__foot a { font-size: 13px; color: var(--c-primary); }
.notif__panel {
  position: absolute; top: calc(100% + 8px); right: 0;
  width: 340px; max-height: 420px; overflow-y: auto;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-modal);
  padding: 6px;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .18s, transform .18s, visibility .18s;
  z-index: 200;
}
.notif.open .notif__panel { opacity: 1; visibility: visible; transform: translateY(0); }
.notif__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 10px 8px; font-size: 14px; font-weight: 600; color: var(--c-text);
}
.notif__head a { font-size: 12px; font-weight: 500; color: var(--c-text-3); }
.notif__item {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 10px; border-radius: var(--r-sm);
}
.notif__item:hover { background: var(--c-hover-bg); }
.notif__item--unread { background: var(--c-primary-soft); }
.notif__icon {
  width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 15px;
  background: var(--c-surface); border: 1px solid var(--c-border);
}
.notif__icon--like { background: #FEE2E2; border-color: transparent; }
.notif__icon--reply { background: #DBEAFE; border-color: transparent; }
.notif__icon--buy { background: #FEF3C7; border-color: transparent; }
.notif__icon--sys { background: #EDE9FE; border-color: transparent; }
.notif__icon--message { background: #CFFAFE; border-color: transparent; } /* 第五阶段：私信通知专属底色，青色系，与回复(蓝)/点赞(红)/购买(黄)/系统(紫)区分 */
.notif__text { font-size: 13px; color: var(--c-text); line-height: 1.5; }
.notif__text b { font-weight: 600; }
.notif__time { font-size: 11px; color: var(--c-text-3); margin-top: 2px; }

/* 第二阶段：板块与帖子治理 */
.modal-mask{display:none;position:fixed;inset:0;z-index:300;align-items:center;justify-content:center;padding:12px;background:rgba(0,0,0,.4)}
.modal-mask.open{display:flex}
.modal-box{width:440px;max-width:calc(100vw - 24px);max-height:86vh;overflow-y:auto;padding:24px;background:var(--c-surface);border-radius:var(--r-md);box-shadow:var(--shadow-modal)}
.modal-box h3{margin-bottom:16px;font-size:16px;font-weight:600}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.category-modal{width:520px}.manage-modal{width:480px}.reply-edit-modal{width:640px}.history-modal,.log-detail-modal{width:680px;max-height:80vh}
.btn--danger-outline{height:36px;padding:0 16px;border:1px solid var(--c-error);border-radius:var(--r-sm);background:var(--c-surface);color:var(--c-error);font:500 14px var(--font-cn);cursor:pointer}
.btn--danger-outline:disabled,.admin-btn:disabled{cursor:not-allowed;opacity:.45}
.admin-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.category-filters .input{width:260px;height:38px}.category-filters .select{width:140px;height:38px}
.log-filters .input,.log-filters .select{width:140px;height:38px}.log-filters .log-search{width:260px}
.admin-empty{padding:30px;text-align:center;color:var(--c-text-3)}.error-text{color:var(--c-error)}
.admin-mobile-cards{display:none}.admin-subtext{max-width:360px;margin-top:3px;color:var(--c-text-3);font-size:12px;line-height:1.5}
.category-name{display:flex;align-items:center}.category-name code{font-size:12px}
.state-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;background:var(--c-hover-bg);color:var(--c-text-2);font-size:11px;white-space:nowrap}
.state-active{background:#DCFCE7;color:#15803D}.state-readonly{background:#FEF3C7;color:#B45309}.state-disabled{background:#FEE2E2;color:#B91C1C}
.color-field,.inline-field{display:flex;align-items:center;gap:8px}.color-field .input{flex:1}.color-field input[type=color]{width:44px;height:44px;padding:2px;border:1px solid var(--c-border);border-radius:var(--r-sm);background:#fff}
.status-options{border:0}.status-options legend{margin-bottom:8px;color:var(--c-text-2);font-size:12px}.status-options label{display:inline-flex;align-items:center;gap:5px;margin-right:18px;color:var(--c-text);font-size:14px}
.moderator-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--c-divider)}
.modal-copy{margin-bottom:14px;color:var(--c-text-2);font-size:13px}.admin-pager{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:16px;font-size:12px;color:var(--c-text-3)}
.detail-row{display:grid;grid-template-columns:100px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--c-divider)}.detail-row dt{color:var(--c-text-3);font-size:12px}.detail-row dd{min-width:0}.detail-row pre{overflow-wrap:anywhere;white-space:pre-wrap;font:13px/1.6 var(--font-cn)}
.locked-badge{display:inline-flex;vertical-align:middle;padding:3px 9px;border-radius:999px;background:#EEF1F5;color:#64748B;font-size:12px;font-weight:600}
.post__content--deleted{color:var(--c-text-3);font-style:italic}
.post-more{position:relative;margin-left:auto}.more-trigger{min-width:44px;min-height:36px;border:0;background:none;color:var(--c-text-2);font:14px var(--font-cn);cursor:pointer}
.more-menu{display:none;position:absolute;right:0;bottom:calc(100% + 6px);z-index:30;width:150px;padding:6px;border:1px solid var(--c-border);border-radius:var(--r-sm);background:var(--c-surface);box-shadow:var(--shadow-modal)}.more-menu.open{display:block}
.more-menu__item{display:block;width:100%;min-height:36px;padding:7px 10px;border:0;border-radius:4px;background:none;color:var(--c-text-2);text-align:left;font:13px var(--font-cn);cursor:pointer}.more-menu__item:hover{background:var(--c-hover-bg);color:var(--c-primary)}.more-menu__item--danger{color:var(--c-error)}
.manage-object{margin-bottom:16px;padding:12px 14px;border-radius:var(--r-sm);background:var(--c-bg);color:var(--c-text-2);font-size:13px}
.history-item{padding:14px 0;border-bottom:1px solid var(--c-divider);font-size:13px}.history-reason{margin:5px 0;color:var(--c-text-2)}.history-item summary{color:var(--c-primary);cursor:pointer}.history-body{margin-top:10px;padding:12px;border-radius:var(--r-sm);background:var(--c-bg)}.history-empty{padding:30px;text-align:center;color:var(--c-text-3)}
.topic-toast{position:fixed;right:24px;bottom:24px;z-index:500;max-width:calc(100vw - 32px);padding:12px 16px;border-radius:var(--r-sm);background:#EAF7EE;color:var(--c-success);box-shadow:var(--shadow-modal);opacity:0;pointer-events:none;transform:translateY(8px);transition:.2s}.topic-toast.show{opacity:1;transform:translateY(0)}
.deleted-topic-notice{justify-content:space-between;margin:10px 0 12px}.deleted-topic-content{margin-bottom:16px;border-color:#FCA5A5}

@media (max-width:767px){
  .admin-main{padding:18px 12px!important;overflow-x:hidden!important}.admin-panel__head{align-items:stretch!important}.admin-panel__head .btn{min-height:44px}
  .admin-desktop-table{display:none}.admin-mobile-cards{display:grid;gap:12px}.admin-mobile-card{display:grid;min-width:0;gap:8px;overflow:hidden;padding:16px;border:1px solid var(--c-border);border-radius:var(--r-md);background:var(--c-surface);font-size:13px}.admin-mobile-card code,.admin-mobile-card div{overflow-wrap:anywhere}
  .mobile-card-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.push-right{margin-left:auto}.mobile-card-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.mobile-card-actions .admin-btn{min-width:0;min-height:44px;margin:0;padding:4px;white-space:normal}
  .admin-filters{display:grid;grid-template-columns:1fr 1fr}.category-filters .input,.category-filters .select,.log-filters .input,.log-filters .select,.log-filters .log-search{width:100%}.category-filters .input,.log-filters .log-search{grid-column:1/-1}.admin-filters .btn{min-height:44px}
  .modal-box{padding:20px}.reply-edit-modal{width:calc(100vw - 16px);max-height:calc(100vh - 16px)}.history-modal{width:calc(100vw - 16px)}
  .modal-actions .btn,.more-trigger,.more-menu__item{min-height:44px}.more-menu{position:fixed;right:12px;bottom:12px;left:12px;width:auto}.post__actions{gap:10px;flex-wrap:wrap}.post-more{margin-left:auto}
  .admin-pager{flex-wrap:wrap}.detail-row{grid-template-columns:1fr;gap:3px}.topic-toast{right:16px;bottom:16px}.deleted-topic-notice{align-items:flex-start;flex-direction:column}.deleted-topic-notice .btn{width:100%;min-height:44px}
}

/* ==========================================================================
   开源商城 · 商品卡片
   ========================================================================== */
.shop-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px;
}
.shop-card {
  display: flex; flex-direction: column;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: box-shadow .15s, border-color .15s;
}
.shop-card:hover { box-shadow: var(--shadow-hover); border-color: #C7CFDA; }
.shop-card__cover {
  height: 120px;
  display: flex; align-items: center; justify-content: center;
  font-size: 34px; color: #fff;
  background: linear-gradient(120deg, var(--c-primary), #7C3AED);
}
.shop-card__body { padding: 14px 16px; flex: 1; display: flex; flex-direction: column; }
.shop-card__name { font-size: 15px; font-weight: 600; color: var(--c-text); margin-bottom: 4px; }
.shop-card__desc { font-size: 12px; color: var(--c-text-2); line-height: 1.5; flex: 1; margin-bottom: 10px; }
.shop-card__foot {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 10px; border-top: 1px solid var(--c-divider);
}
.shop-card__price { font-size: 15px; font-weight: 700; }
.shop-card__buy {
  font-size: 12px; font-weight: 600; color: #fff;
  background: var(--c-primary); padding: 5px 12px; border-radius: var(--r-sm);
}
.shop-card__buy:hover { background: var(--c-primary-hover); }
.shop-card__owned {
  font-size: 12px; font-weight: 600; color: var(--c-success);
}

/* ==========================================================================
   帖子内购买区块（开源软件详情页）
   ========================================================================== */
.buy-box {
  display: flex; align-items: center; gap: 16px;
  padding: 16px 20px; margin: 16px 0;
  border-radius: var(--r-md);
  background: linear-gradient(120deg, #EFF4FE, #F3E8FF);
  border: 1px solid var(--c-border);
}
.buy-box__info { flex: 1; }
.buy-box__label { font-size: 12px; color: var(--c-text-2); }
.buy-box__price { font-size: 24px; font-weight: 700; color: var(--c-text); margin-top: 2px; }
.buy-box__price .coin { font-size: 15px; }
.buy-box--owned { background: #F0FDF4; }

/* ==========================================================================
   积分明细页面
   ========================================================================== */
.balance-card {
  display: flex; align-items: center; justify-content: space-between;
  padding: 28px 32px; border-radius: var(--r-lg);
  background: linear-gradient(120deg, #2563EB, #7C3AED);
  color: #fff; margin-bottom: 20px;
}
.balance-card__label { font-size: 13px; opacity: .85; }
.balance-card__num { font-size: 36px; font-weight: 700; margin-top: 4px; }
.balance-card__actions { display: flex; gap: 10px; }
.balance-card__actions .btn--primary { background: #fff; color: var(--c-primary); }
.balance-card__actions .btn--primary:hover { background: #f3f6ff; }
.balance-card__actions .btn--secondary { border-color: rgba(255,255,255,.4); color: #fff; }
.balance-card__actions .btn--secondary:hover { background: rgba(255,255,255,.15); }

.ledger-row {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 20px; border-bottom: 1px solid var(--c-divider);
}
.ledger-row:last-child { border-bottom: none; }
.ledger-row__icon {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 16px;
  background: var(--c-hover-bg);
}
.ledger-row__body { flex: 1; min-width: 0; }
.ledger-row__title { font-size: 14px; color: var(--c-text); }
.ledger-row__time { font-size: 12px; color: var(--c-text-3); margin-top: 2px; }
.ledger-row__amt { font-size: 15px; font-weight: 700; white-space: nowrap; }
.ledger-row__amt--in { color: var(--c-success); }
.ledger-row__amt--out { color: var(--c-error); }

.rule-list { font-size: 13px; color: var(--c-text-2); line-height: 2; }
.rule-list b { color: var(--c-text); }

@media (max-width: 767px) {
  .shop-grid { grid-template-columns: 1fr; }
  .balance-card { flex-direction: column; align-items: flex-start; gap: 16px; }
  .notif__panel { width: 300px; }
}

/* ==========================================================================
   编辑器工具条：扩展下拉面板（多彩字 / 表情 / 动态图 共用）
   类名对应 new-topic.html 实际结构：.editor-pop（容器）.editor-pop__panel（面板）
   ========================================================================== */
.md-toolbar { position: relative; overflow: visible; }
.editor-pop { position: relative; display: inline-flex; }
.editor-pop > button {
  width: 32px; height: 32px; border: none; background: none; cursor: pointer;
  border-radius: 4px; color: var(--c-text-2);
  display: flex; align-items: center; justify-content: center;
}
.editor-pop > button:hover { background: var(--c-hover-bg); color: var(--c-primary); }
.editor-pop.open > button { background: var(--c-primary-soft); color: var(--c-primary); }

.editor-pop__panel {
  position: absolute; top: calc(100% + 8px); left: 0;
  width: 220px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-modal);
  padding: 12px;
  z-index: 300;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .15s, transform .15s, visibility .15s;
}
.editor-pop__panel--wide { width: 300px; }
.editor-pop.open .editor-pop__panel { opacity: 1; visibility: visible; transform: translateY(0); }
.editor-pop__title { font-size: 12px; color: var(--c-text-3); margin-bottom: 10px; }

/* 多彩字：颜色选择面板 */
.color-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.color-dot {
  width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--c-surface);
  cursor: pointer; box-shadow: 0 0 0 1px var(--c-border); padding: 0;
}
.color-dot:hover { transform: scale(1.15); box-shadow: 0 0 0 2px var(--c-primary); }

/* 表情：emoji 面板 */
.emoji-grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 2px;
  max-height: 200px; overflow-y: auto;
}
.emoji-item {
  font-size: 20px; padding: 5px; border: none; background: none; cursor: pointer;
  border-radius: 4px; line-height: 1;
}
.emoji-item:hover { background: var(--c-hover-bg); }

/* 动态图 GIF：面板 */
.gif-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 4px; }
.gif-item {
  aspect-ratio: 1; border-radius: var(--r-sm); border: none; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px; font-size: 22px; color: #fff;
  background: linear-gradient(135deg, var(--c-primary), #7C3AED);
}
.gif-item span { font-size: 10px; font-weight: 500; }
.gif-item:nth-child(2) { background: linear-gradient(135deg, #0891B2, #16A34A); }
.gif-item:nth-child(3) { background: linear-gradient(135deg, #EA580C, #DB2777); }
.gif-item:nth-child(4) { background: linear-gradient(135deg, #7C3AED, #DB2777); }
.gif-item:nth-child(5) { background: linear-gradient(135deg, #D97706, #DC2626); }
.gif-item:nth-child(6) { background: linear-gradient(135deg, #16A34A, #0891B2); }
.gif-item:nth-child(7) { background: linear-gradient(135deg, #2563EB, #0891B2); }
.gif-item:nth-child(8) { background: linear-gradient(135deg, #64748B, #1F2933); }

@media (max-width: 767px) {
  .editor-pop__panel { left: auto; right: 0; }
}

/* ==========================================================================
   动态背景：全屏彩色光斑（柔和渐变，缓慢飘动）
   ========================================================================== */
.bg-blobs {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  background: #EDF1FB;      /* 整体偏冷白底，让蓝紫光斑更好看 */
  pointer-events: none;
}
.bg-blob {
  position: absolute;
  border-radius: 50%;
  will-change: transform;
}
.bg-blob-1 {
  width: 700px; height: 700px;
  background: radial-gradient(circle, #2563EB 0%, transparent 70%);
  top: -280px; left: -180px;
  opacity: .16;
  animation: blobDrift1 22s ease-in-out infinite alternate;
}
.bg-blob-2 {
  width: 650px; height: 650px;
  background: radial-gradient(circle, #7C3AED 0%, transparent 70%);
  bottom: -240px; right: -160px;
  opacity: .15;
  animation: blobDrift2 28s ease-in-out infinite alternate;
}
.bg-blob-3 {
  width: 520px; height: 520px;
  background: radial-gradient(circle, #0891B2 0%, transparent 70%);
  bottom: 8%; left: 18%;
  opacity: .12;
  animation: blobDrift3 18s ease-in-out infinite alternate;
}
.bg-blob-4 {
  width: 420px; height: 420px;
  background: radial-gradient(circle, #DB2777 0%, transparent 70%);
  top: 25%; right: 8%;
  opacity: .09;
  animation: blobDrift4 24s ease-in-out infinite alternate;
}

@keyframes blobDrift1 {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(90px, 70px) scale(1.18); }
}
@keyframes blobDrift2 {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(-80px, -60px) scale(1.12); }
}
@keyframes blobDrift3 {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(60px, -90px) scale(1.22); }
}
@keyframes blobDrift4 {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(-70px, 50px) scale(0.88); }
}

/* ==========================================================================
   全站微动效升级
   ========================================================================== */
/* 页面进入淡入 */
@keyframes pageFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
main { animation: pageFadeIn .4s ease both; }

/* 卡片悬浮微抬 */
.card {
  transition: box-shadow .22s ease, transform .22s ease, border-color .22s ease;
}
.card:hover {
  box-shadow: 0 6px 20px rgba(37,99,235,.10);
  transform: translateY(-2px);
}
/* 话题行、板块卡、商品卡 已有 hover 背景，叠加抬起效果 */
.board-card { transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease; }
.board-card:hover { transform: translateY(-3px); }
.shop-card { transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease; }
.shop-card:hover { transform: translateY(-3px); }

/* 头像悬停微缩放 */
.avatar { transition: transform .15s ease, box-shadow .15s ease; }
a:hover > .avatar, button:hover > .avatar { transform: scale(1.08); box-shadow: 0 4px 12px rgba(37,99,235,.2); }

/* 按钮按下反馈 */
.btn:active { transform: scale(.97); }

/* 导航栏加毛玻璃效果（背景动态时让header更清晰可读） */
.site-header {
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* 下拉面板毛玻璃 */
.user-menu__panel,
.notif__panel,
.nav__dropdown,
.editor-pop__panel {
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* 卡片轻度磨砂 */
.card {
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* 侧栏卡片同步 */
.card.card__pad { background: rgba(255,255,255,.90); }

/* 登录卡片 */
.card[style*="max-width:420px"] {
  background: rgba(255,255,255,.95);
}

/* 用户下拉菜单头部背景 */
.user-menu__head { background: rgba(247,248,250,.9); }

/* 精华标识、置顶标识加微光动效 */
@keyframes elitePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(245,158,11,.3); }
  50%       { box-shadow: 0 0 8px 3px rgba(245,158,11,.2); }
}
.flag-elite { animation: elitePulse 2.5s ease-in-out infinite; }

/* 签到按钮呼吸动画（未签到时吸引注意） */
@keyframes breathe {
  0%, 100% { box-shadow: 0 0 0 0 rgba(37,99,235,.3); }
  50%       { box-shadow: 0 0 10px 4px rgba(37,99,235,.15); }
}
.checkin__btn:not(:disabled) { animation: breathe 2.8s ease-in-out infinite; }

/* 购买按钮闪光效果 */
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}
.buy-box .btn--primary:not(:disabled) {
  background: linear-gradient(90deg, var(--c-primary) 0%, #7C3AED 40%, var(--c-primary) 100%);
  background-size: 200% auto;
  animation: shimmer 3s linear infinite;
}

/* 积分余额数字高亮跳动（仅 balance-card） */
@keyframes coinPop {
  0%, 100% { transform: scale(1); }
  50%       { transform: scale(1.04); }
}
.balance-card__num { animation: coinPop 3s ease-in-out infinite; }

/* 英雄轮播图阴影更自然 */
.hero { box-shadow: 0 8px 32px rgba(37,99,235,.18); }

/* ==========================================================================
   按钮特效升级：光泽扫过 + 上浮 + 点击波纹
   ========================================================================== */
.btn {
  position: relative;
  overflow: hidden;
  transition: background .15s, border-color .15s, color .15s, transform .18s ease, box-shadow .18s ease;
}
/* 主按钮：悬停上浮 + 光泽扫过 */
.btn--primary {
  background: linear-gradient(135deg, var(--c-primary), #3B7BF0);
  box-shadow: 0 2px 8px rgba(37,99,235,.25);
}
.btn--primary::before {
  content: "";
  position: absolute; top: 0; left: -60%;
  width: 40%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.45), transparent);
  transform: skewX(-20deg);
  transition: left .5s ease;
  pointer-events: none;
}
.btn--primary:hover::before { left: 130%; }
.btn--primary:hover {
  box-shadow: 0 6px 16px rgba(37,99,235,.38);
  transform: translateY(-2px);
}
.btn--primary:active { transform: translateY(0) scale(.96); box-shadow: 0 2px 6px rgba(37,99,235,.3); }

/* 次要按钮：悬停边框+轻抬 */
.btn--secondary:hover {
  border-color: var(--c-primary);
  color: var(--c-primary-hover);
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(37,99,235,.12);
}
.btn--secondary:active { transform: translateY(0) scale(.97); }

/* 文字按钮：悬停轻微背景 */
.btn--text:hover { background: var(--c-hover-bg); border-radius: var(--r-sm); }

/* 点击波纹反馈（CSS-only 简化版，兼容所有 .btn） */
.btn::after {
  content: "";
  position: absolute; inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle, rgba(255,255,255,.55) 0%, transparent 60%);
  opacity: 0; transform: scale(0);
  transition: transform .4s ease, opacity .6s ease;
  pointer-events: none;
}
.btn:active::after { transform: scale(2.2); opacity: 1; transition: none; }

/* ==========================================================================
   卡片特效升级：渐变描边 + 光晕 + 联动高亮
   ========================================================================== */
.card {
  position: relative;
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
.card:hover {
  box-shadow: 0 10px 28px rgba(37,99,235,.14), 0 2px 6px rgba(16,24,40,.06);
  transform: translateY(-3px);
  border-color: rgba(37,99,235,.28);
}

/* 板块卡片：悬停渐变光晕 + 图标放大跳色 */
.board-card {
  position: relative;
  overflow: hidden;
}
.board-card::before {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(120px 120px at var(--mx, 50%) var(--my, 0%), rgba(37,99,235,.10), transparent 70%);
  opacity: 0;
  transition: opacity .3s ease;
  pointer-events: none;
}
.board-card:hover::before { opacity: 1; }
.board-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(37,99,235,.16);
  border-color: rgba(37,99,235,.3);
}
.board-card:hover .board-card__icon {
  transform: scale(1.12) rotate(-4deg);
  box-shadow: 0 6px 14px rgba(0,0,0,.18);
}
.board-card__icon { transition: transform .25s ease, box-shadow .25s ease; }

/* 商品卡片同款联动 */
.shop-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(37,99,235,.16);
  border-color: rgba(37,99,235,.3);
}
.shop-card:hover .shop-card__icon { transform: scale(1.1); }
.shop-card__icon { transition: transform .25s ease; }

/* 话题列表行：悬停左侧描边高亮 */
.tlist-row {
  position: relative;
  transition: background .15s ease, padding-left .15s ease;
}
.tlist-row::before {
  content: "";
  position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--c-primary);
  transform: scaleY(0);
  transition: transform .18s ease;
}
.tlist-row:hover::before { transform: scaleY(1); }

@media (prefers-reduced-motion: reduce) {
  /* 尊重用户系统的减少动画偏好 */
  .bg-blob, main, .flag-elite, .checkin__btn, .buy-box .btn--primary,
  .balance-card__num, .card, .board-card, .shop-card, .avatar,
  .btn, .btn--primary::before, .btn::after, .tlist-row::before { animation: none !important; transition: none !important; }
}

/* ==========================================================================
   第四阶段：发帖审核（管理后台审核面板 / 关键词管理 / 前台待审与弹窗）
   全部复用现有变量与组件体系（.req-badge / .modal-box / .btn / .notice）
   ========================================================================== */

/* ---- 管理后台 · 帖子审核 ---- */
.review-batchbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;margin-bottom:14px;border:1px solid var(--c-border);border-radius:var(--r-md);background:var(--c-surface);}
.review-batchbar__count{font-size:13px;color:var(--c-text-2);}
.review-card{border:1px solid var(--c-border);border-radius:var(--r-md);background:var(--c-surface);padding:14px 16px;margin-bottom:12px;display:flex;gap:12px;transition:opacity .3s ease;}
.review-card--out{opacity:0;}
.review-card__check{flex-shrink:0;padding-top:2px;}
.review-card__check input{width:16px;height:16px;cursor:pointer;}
.review-card__body{flex:1;min-width:0;}
.review-card__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px;font-size:12px;color:var(--c-text-2);}
.review-card__title{font-size:15px;font-weight:600;margin-bottom:4px;overflow-wrap:anywhere;}
.review-card__preview{font-size:13px;color:var(--c-text-2);line-height:1.7;overflow-wrap:anywhere;}
.review-card__full{margin-top:8px;padding:10px 12px;border-radius:var(--r-sm);background:var(--c-bg);font-size:13px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;}
.review-card__hits{margin-top:8px;font-size:12px;color:var(--c-text-2);display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.review-card__author{margin-top:6px;font-size:12px;color:var(--c-text-2);}
.review-card__author .rejected-red{color:var(--c-error);font-weight:700;}
.review-card__time{margin-top:4px;font-size:12px;color:var(--c-text-3);}
.review-card__actions{margin-top:10px;display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;}
.hl-kw{background:#FEF3C7;color:inherit;border-radius:2px;padding:0 2px;}
.kw-chip{display:inline-flex;align-items:center;font-size:12px;padding:1px 8px;border-radius:6px;background:#FEF3C7;color:#B45309;font-weight:600;}
.btn--review-ok{height:36px;padding:0 16px;border:1px solid var(--c-success);border-radius:var(--r-sm);background:var(--c-surface);color:var(--c-success);font:500 14px var(--font-cn);cursor:pointer;}
.btn--review-ok:hover{background:#EAF7EE;}
.type-badge{display:inline-block;font-size:11px;padding:2px 8px;border-radius:10px;font-weight:600;background:var(--c-primary-soft);color:var(--c-primary);}
.flagonly-badge{display:inline-block;font-size:11px;padding:2px 8px;border-radius:10px;font-weight:600;background:#F2F4F7;color:#5B6673;}
.btn--reject-solid{height:36px;padding:0 16px;border:1px solid var(--c-error);border-radius:var(--r-sm);background:var(--c-error);color:#fff;font:500 14px var(--font-cn);cursor:pointer;}
.btn--reject-solid:hover{background:#B91C1C;}
.review-empty{padding:40px 20px;text-align:center;color:var(--c-text-3);font-size:14px;}
.review-empty__icon{font-size:34px;margin-bottom:8px;filter:grayscale(1);opacity:.6;}

/* ---- 管理后台 · 关键词管理 ---- */
.kw-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.kw-pill{height:32px;padding:0 14px;border:1px solid var(--c-border);border-radius:999px;background:var(--c-surface);color:var(--c-text-2);font:500 13px var(--font-cn);cursor:pointer;white-space:nowrap;}
.kw-pill:hover{border-color:var(--c-primary);color:var(--c-primary);}
.kw-pill.active{background:var(--c-primary-soft);color:var(--c-primary);border-color:transparent;font-weight:600;}
.kw-act{display:inline-block;font-size:11px;padding:2px 8px;border-radius:10px;font-weight:600;}
.kw-act--block{background:#FEE2E2;color:#B91C1C;}
.kw-act--review{background:#FEF3C7;color:#B45309;}
.kw-act--replace{background:#EFF4FE;color:#2563EB;}
.kw-act--flag{background:#F2F4F7;color:#5B6673;}
.kw-radio{display:block;padding:8px 10px;border:1px solid var(--c-border);border-radius:var(--r-sm);margin-bottom:8px;cursor:pointer;font-size:14px;}
.kw-radio input{margin-right:6px;}
.kw-radio__desc{display:block;margin-left:22px;font-size:12px;color:var(--c-text-3);}
.kw-test-hit{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:13px;color:var(--c-text-2);}

/* ---- 前台 · 发帖等待审核卡片 ---- */
.pending-card{max-width:560px;margin:40px auto;text-align:center;padding:36px 28px;}
.pending-card__icon{font-size:48px;line-height:1;color:#D97706;margin-bottom:14px;}
.pending-card__title{font-size:18px;font-weight:600;margin-bottom:10px;}
.pending-card__desc{font-size:14px;color:var(--c-text-2);line-height:1.8;margin-bottom:14px;overflow-wrap:anywhere;}
.pending-card__badge-row{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:var(--c-text-2);margin-bottom:20px;}
.pending-card__actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}
.kw-block-bar{padding:12px 16px;border-radius:var(--r-sm);background:#FEE2E2;color:#B91C1C;font-size:14px;margin-bottom:16px;}

/* ---- 前台 · 话题页待审回复 ---- */
.post--pending{border-left:3px solid #D97706;background:rgba(254,243,199,.4);}
.post__pending-tip{font-size:12px;color:#B45309;margin-bottom:8px;}
.reply-pending-notice{padding:12px 16px;border-radius:var(--r-sm);background:#FEF3C7;color:#B45309;font-size:14px;margin-bottom:12px;}

/* ---- 首页 · 审核结果弹窗 ---- */
.popup-review-box{position:relative;width:440px;max-width:calc(100vw - 24px);text-align:center;}
.popup-review__index{position:absolute;top:14px;right:18px;font-size:12px;color:var(--c-text-3);}
.popup-review__circle{width:64px;height:64px;border-radius:50%;margin:8px auto 14px;display:flex;align-items:center;justify-content:center;}
.popup-review__circle--rejected{background:#FEE2E2;}
.popup-review__circle--approved{background:#DCFCE7;}
.popup-review__mark{font-size:40px;line-height:1;font-weight:700;}
.popup-review__mark--rejected{color:#DC2626;}
.popup-review__mark--approved{color:#16A34A;}
.popup-review__title{font-size:16px;font-weight:600;text-align:center;margin-bottom:10px;}
.popup-review__topic{font-size:14px;color:var(--c-text);margin-bottom:12px;overflow-wrap:anywhere;}
.popup-review__reason{padding:12px 14px;border-radius:var(--r-sm);background:#FEE2E2;color:#B91C1C;font-size:13px;line-height:1.7;text-align:left;margin-bottom:12px;overflow-wrap:anywhere;}
.popup-review__hint{font-size:13px;color:var(--c-text-2);margin-bottom:18px;}
.popup-review__actions{display:flex;justify-content:center;gap:12px;}

/* ---- 我的待审内容页 ---- */
.mr-main{max-width:760px;margin:0 auto;padding:24px;}
.mr-title{font-size:20px;font-weight:600;}
.mr-desc{font-size:13px;color:var(--c-text-2);margin:6px 0 16px;}
.mr-pills{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.mr-card{display:block;border:1px solid var(--c-border);border-radius:var(--r-md);background:var(--c-surface);padding:14px 16px;margin-bottom:12px;color:inherit;}
.mr-card--link{cursor:pointer;}
.mr-card--link:hover{border-color:var(--c-primary);}
.mr-card__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--c-text-2);margin-bottom:6px;}
.mr-card__title{font-size:15px;font-weight:500;overflow-wrap:anywhere;}
.mr-card__time{font-size:12px;color:var(--c-text-3);margin-top:6px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.mr-card__reason{margin-top:8px;padding:10px 12px;border-radius:var(--r-sm);background:#FEE2E2;color:#B91C1C;font-size:13px;overflow-wrap:anywhere;}
.mr-empty{padding:50px 20px;text-align:center;color:var(--c-text-3);}
.mr-empty__icon{font-size:40px;line-height:1;margin-bottom:12px;filter:grayscale(1);opacity:.55;}
.mr-empty__main{font-size:15px;color:var(--c-text-2);margin-bottom:4px;}
.mr-empty__sub{font-size:13px;color:var(--c-text-3);}

/* ---- 用户菜单 · 待审角标 ---- */
.menu-badge--pending{margin-left:auto;min-width:18px;height:18px;padding:0 6px;border-radius:9px;background:#FEF3C7;color:#B45309;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;line-height:1;}

/* ---- 手机版（390px）适配 ---- */
@media (max-width: 480px) {
  /* 按钮高度 44px */
  .review-card .btn, .review-card .btn--review-ok, .review-card .btn--danger-outline,
  .review-batchbar .btn, .popup-review__actions .btn, .mr-card .btn,
  .pending-card__actions .btn, .kw-pill { min-height: 44px; }
  /* 审核卡片按钮独立一行 */
  .review-card{flex-direction:column;}
  .review-card__actions{flex-direction:column;align-items:stretch;}
  .review-card__actions .btn, .review-card__actions .btn--review-ok, .review-card__actions .btn--danger-outline{width:100%;}
  /* 批量操作栏吸底 */
  .review-batchbar{position:sticky;bottom:0;z-index:50;box-shadow:0 -4px 12px rgba(16,24,40,.08);}
  /* 弹窗按钮纵排通栏 */
  #reviewRejectModal .modal-actions, #keywordModal .modal-actions, #kwImportModal .modal-actions,
  .popup-review__actions, .pending-card__actions { flex-direction: column; }
  #reviewRejectModal .modal-actions .btn, #reviewRejectModal .modal-actions .btn--reject-solid,
  #keywordModal .modal-actions .btn, #kwImportModal .modal-actions .btn,
  .popup-review__actions .btn, .pending-card__actions .btn { width: 100%; min-height: 44px; }
  /* 关键词表改卡片纵排 */
  #panelKeywords .admin-table thead{display:none;}
  #panelKeywords .admin-table, #panelKeywords .admin-table tbody{display:block;width:100%;}
  #panelKeywords .admin-table tr{display:block;border:1px solid var(--c-border);border-radius:var(--r-md);background:var(--c-surface);padding:10px 12px;margin-bottom:12px;}
  #panelKeywords .admin-table td{display:block;border:none;padding:4px 2px;overflow-wrap:anywhere;}
  /* 筛选胶囊横向滚动 */
  .kw-filters, .mr-pills{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;}
  .kw-filters .input{min-width:150px;}
}

/* 动态名字特效：字号、字重、行高与字距均继承所在位置。 */
.name-effect {
  position: relative;
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  vertical-align: baseline;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
}
.name-effect__text {
  display: inline-block;
  max-width: 100%;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
}
.name-effect--particle-sparkle .name-effect__text {
  background: linear-gradient(110deg,#f8fafc 10%,#67e8f9 30%,#c084fc 52%,#f9a8d4 72%,#fff 90%);
  background-size: 230% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 0 7px rgba(103,232,249,.5));
  animation: nameParticleText 2s linear infinite;
}
.name-effect__particle {
  position: absolute;
  z-index: 1;
  color: #fff;
  font-size: 13px;
  line-height: 1;
  text-shadow: 0 0 8px #67e8f9;
  pointer-events: none;
  animation: nameParticleSparkle 1.5s ease-in-out infinite;
}
.name-effect__particle--one { left: -18px; top: -10px; }
.name-effect__particle--two { right: -19px; top: 7px; animation-delay: .45s; }
.name-effect__particle--three { right: 13px; bottom: -13px; animation-delay: .9s; }
.name-effect--flow-gradient .name-effect__text {
  background: linear-gradient(90deg,#06b6d4,#818cf8,#ec4899,#f59e0b,#06b6d4);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 0 5px rgba(129,140,248,.4));
  animation: nameFlowGradient 2.4s linear infinite;
}
.name-effect--neon-glow .name-effect__text {
  color: #d8b4fe;
  text-shadow: 0 0 4px #c084fc,0 0 10px #a855f7,0 0 22px #7e22ce;
  animation: nameNeonGlow 1.35s ease-in-out infinite alternate;
}
.name-effect--rainbow-cycle .name-effect__text {
  background: linear-gradient(90deg,#ff3d6e,#ffb13b,#f5f749,#45e39a,#36c9ff,#8b5cf6,#ff3dba,#ff3d6e);
  background-size: 400% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 0 6px rgba(255,255,255,.35));
  animation: nameRainbowCycle 1.65s linear infinite;
}
@keyframes nameParticleText { to { background-position: -230% 0; } }
@keyframes nameParticleSparkle {
  0%, 100% { opacity: 0; transform: scale(.3) rotate(0deg); }
  45% { opacity: 1; transform: scale(1.25) rotate(90deg); }
  70% { opacity: .2; }
}
@keyframes nameFlowGradient { to { background-position: -300% 0; } }
@keyframes nameNeonGlow {
  to { color: #fff; text-shadow: 0 0 3px #fff,0 0 9px #e879f9,0 0 20px #d946ef,0 0 36px #a21caf; }
}
@keyframes nameRainbowCycle { to { background-position: 400% 0; } }

@media (max-width: 767px) {
  .name-effect--particle-sparkle { margin-inline: 18px 19px; }
  .post__author { overflow: visible; }
  .post__name { box-sizing:border-box;padding-inline:18px 19px;width:max-content;max-width:calc(100vw - 32px);overflow:visible;flex:0 1 auto; }
  .post__name .name-effect,.post__name .name-effect__text { max-width:none;white-space:nowrap; }
  .post__name .name-effect--particle-sparkle { margin-inline:0; }
  .post__name .name-effect--length-13-18 { font-size:12px;white-space:nowrap; }
  .post__name .name-effect--length-19-24 { font-size:10px;white-space:nowrap; }
  .row-author__name .name-effect--length-13-18 { font-size:11px;white-space:nowrap; }
  .row-author__name .name-effect--length-19-24,.profile-head__name .name-effect--length-19-24,.msg-conv__name .name-effect--length-19-24,.msg-room__title .name-effect--length-19-24,.user-menu__name .name-effect--length-19-24,#nameEffectModal .name-effect--length-19-24 { font-size:10px;white-space:nowrap; }
  .profile-head__name .name-effect--length-13-18,.msg-conv__name .name-effect--length-13-18,.msg-room__title .name-effect--length-13-18,.user-menu__name .name-effect--length-13-18,#nameEffectModal .name-effect--length-13-18 { font-size:13px;white-space:nowrap; }
}
@media (prefers-reduced-motion: reduce) {
  .name-effect .name-effect__text,.name-effect .name-effect__particle { animation:none !important; }
  .name-effect__particle { display:none; }
}

/* 管理后台运营总览 */
.operations-overview,.operations-overview *{min-width:0}
.operations-overview__status{margin:-8px 0 14px;color:var(--c-text-3);font-size:12px;text-align:right}
.operations-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.operations-summary__loading{grid-column:1/-1;color:var(--c-text-3)}
.operations-summary__card{overflow:hidden}
.operations-summary__label{color:var(--c-text-3);font-size:12px}
.operations-summary__value{display:block;margin-top:6px;color:var(--c-text);font-size:28px;line-height:1.2}
.operations-summary__detail{margin-top:5px;color:var(--c-text-2);font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.operations-section{margin-top:18px}
.operations-section__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.operations-section__head h2{font-size:15px;font-weight:600}
.operations-section__head span{color:var(--c-text-3);font-size:12px;text-align:right}
.operations-trend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.operations-trend__group{overflow:hidden}
.operations-trend__head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.operations-trend__head h3{font-size:14px;font-weight:600}
.operations-trend__legend{display:flex;gap:12px;flex-wrap:wrap;color:var(--c-text-2);font-size:11px}
.operations-trend__legend span{display:inline-flex;align-items:center;gap:5px}
.operations-trend__legend i{width:9px;height:9px;border-radius:2px}
.operations-trend__days{display:grid;grid-template-columns:repeat(7,minmax(32px,1fr));gap:5px;min-height:180px}
.operations-trend__day{display:flex;flex-direction:column;min-width:0;text-align:center}
.operations-trend__bars{display:flex;align-items:flex-end;justify-content:center;gap:3px;height:140px;border-bottom:1px solid var(--c-divider)}
.operations-bar-wrap{display:flex;flex-direction:column;justify-content:flex-end;width:15px;height:100%}
.operations-bar__value{color:var(--c-text-2);font-size:9px;line-height:14px}
.operations-bar{display:block;width:100%;min-height:2px;border-radius:3px 3px 0 0}
.operations-bar--topics{background:var(--c-primary)}
.operations-bar--replies{background:#7C3AED}
.operations-bar--new{background:#0891B2}
.operations-bar--active{background:#16A34A}
.operations-trend__date{margin-top:6px;color:var(--c-text-3);font-size:10px;overflow-wrap:anywhere}
.operations-quick-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.operations-quick-links .btn{width:100%;white-space:normal}
.operations-quick-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;margin-left:4px;padding:0 6px;border-radius:10px;background:var(--c-primary-soft);color:var(--c-primary);font-size:11px;font-weight:700;line-height:1}
.operations-overview__privacy{margin-top:16px;padding:10px 12px;border-radius:var(--r-sm);background:var(--c-primary-soft);color:var(--c-text-2);font-size:12px;line-height:1.6}

@media (max-width:1100px){
  .operations-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .operations-trend{grid-template-columns:1fr}
  .operations-quick-links{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:767px){
  .operations-overview__status{text-align:left}.operations-section__head{align-items:flex-start;flex-direction:column;gap:3px}.operations-section__head span{text-align:left}.operations-quick-links .btn{min-height:44px}.operations-trend__days{gap:3px}.operations-trend__group{padding:12px}.operations-bar-wrap{width:13px}
}

@media (max-width:420px){
  .operations-summary,.operations-quick-links{grid-template-columns:1fr}
}