/* ============================================================
   v56 patch — hero-title 字号收到 18-20px（按 2 号精确方案）
   加载顺序：style → v53_japandi → v53_extras → v53_navtip
            → v54_designsystem → v54b_patch → v56_patch（最末）
   ============================================================ */

/* 主标题：适中字号，行距 1.5 让两行呼吸 */
.hero-title {
  font-size: clamp(22px, 5vw, 26px) !important;
  line-height: 1.5 !important;
  letter-spacing: .04em !important;
  max-width: 90% !important;
  margin: 0 0 24px 0 !important;
  word-break: break-word;
  overflow-wrap: break-word;
}

/* 给两行一些自然的间距（保留 <br>，但行距已经 1.5 撑开） */
.hero-title em {
  font-style: normal !important;
  /* 下划线保留，但因字号变小，下划线偏移收紧 */
}
.hero-title em::after {
  bottom: -2px !important;
}

/* hero-sub 跟着收：title 已是 20px，sub 13px 会更克制 */
.hero-sub {
  font-size: 13px !important;
  line-height: 1.95 !important;
  margin-bottom: 30px !important;
}

/* hero-sign 12px，注脚感更强 */
.hero-sign {
  font-size: 12px !important;
  padding-top: 14px !important;
}

/* hero 容器收纵向 padding —— eyebrow 不再被吊在半空 */
.hero {
  min-height: auto !important;
  padding: 2.5vh 4vw 7vh !important;
}

/* ============================================================
   v56b — hero 纵向节奏（只保留字距，间距交给 v56c 收尾）
   ============================================================ */
.hero-eyebrow {
  letter-spacing: .38em !important;    /* 微调字距，配合小字号 */
}
.hero-title {
  margin-top: 0 !important;
  margin-bottom: 28px !important;
}

/* 移动端 (< 980) 同步收紧 */
@media (max-width: 980px) {
  .hero-title {
    font-size: clamp(17px, 5vw, 20px) !important;
    line-height: 1.55 !important;
  }
  .hero-sub  { font-size: 12.5px !important; }
  .hero-sign { font-size: 11.5px !important; }
  .hero      { min-height: 40vh !important; padding: 6vh 5vw !important; }
}

/* ============================================================
   v56c — 最小修：eyebrow 紧贴横线（2 号 A 方案，最末优先级）
   ============================================================ */
.hero {
  padding-top: 0 !important;
}
.hero-eyebrow {
  margin-top: -8px !important;
  margin-bottom: 8px !important;   /* 与 title 之间留 8px 呼吸 */
}
@media (max-width: 980px) {
  .hero { padding-top: 0 !important; }
}

/* ============================================================
   v56e — 三栏等高（不要浮纸，不要内嵌滚动条，不要帖子二层）
   思路：让左/中/右都拉到同一最低高度，由内容最长那一栏（中栏）决定。
   不再使用 align-items: stretch + max-height（会留白或加滚动条）。
   ============================================================ */

/* 1) Grid 等列 */
.app {
  display: grid !important;
  grid-template-columns: 20% 60% 20% !important;
  align-items: stretch !important;     /* 让 cell 撑到 row 高 */
}

/* 2) 让左/中/右都按内容最长撑高（不设 max-height） */
.main,
.side-left,
.side-right {
  min-height: 100% !important;
  max-height: none !important;
  overflow: visible !important;
}

/* 3) 移除浮纸 + 帖子二层（继承原本的扁平观感） */
.main {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.post {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  /* padding/margin 留给原版控制 */
}

/* 4) 左栏 nav-group 间距收紧 */
.nav-group { margin-bottom: 18px !important; }
.nav-label { margin-bottom: 8px !important; }

/* 5) 右栏板块间距收紧 */
.aside-section { margin-bottom: 20px !important; }
.aside-label   { margin-bottom: 8px !important; }

/* 6) 中栏 hero 到 feed 间距收紧 */
.hero          { padding-bottom: 24px !important; margin-bottom: 0 !important; }
.section-head  { margin-bottom: 14px !important; padding-top: 0 !important; }

/* ============================================================
   v56e-final — 精确回收大间距（针对 v54 基准值）
   v54_designsystem.css 第 513 行 .aside-section { margin-bottom: 36px }
   v54b_patch.css      第  16 行 .nav-group     { margin-bottom: 22px }
   v56e (上方) 写到了 18/20，仍被 v54 顶住，这里再压一档
   ============================================================ */

/* 左栏 nav-group：v54b 设 22px → 压到 12px */
.nav-group {
  margin-bottom: 12px !important;
}
/* 左栏 nav-label 到首项：更紧 */
.nav-label {
  margin-bottom: 6px !important;
}

/* 右栏 aside-section：v54 设 36px → 压到 14px */
.aside-section {
  margin-bottom: 14px !important;
}
/* 右栏 label 到首项 */
.aside-label {
  margin-bottom: 6px !important;
}

/* hero：收上下 padding */
.hero {
  padding-top: 0 !important;
  padding-bottom: 18px !important;
}
/* hero-eyebrow 到 title 之间 */
.hero-eyebrow {
  margin-bottom: 6px !important;
  margin-top: -4px !important;
}
/* hero-title 到 sub 之间 */
.hero-title {
  margin-bottom: 16px !important;
}
/* hero-sub 到 sign */
.hero-sub {
  margin-bottom: 14px !important;
}

/* section-head 到 feed */
.section-head {
  margin-bottom: 10px !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* post 间距收紧 */
.post {
  margin-bottom: 6px !important;
}

/* 底部 footer 往上推 */
.footer {
  padding-top: 10px !important;
  margin-top: 10px !important;
}

/* ============================================================
   v56f — 极端收紧（v56e-final 之后再压一档，最末优先级）
   ============================================================ */

/* 左栏：几乎无缝 */
.nav-group {
  margin-bottom: 6px !important;
}
.nav-label {
  margin-bottom: 3px !important;
}

/* 右栏：几乎无缝 */
.aside-section {
  margin-bottom: 8px !important;
}
.aside-label {
  margin-bottom: 3px !important;
}

/* hero 整体压矮 */
.hero {
  padding-top: 0 !important;
  padding-bottom: 10px !important;
  margin-bottom: 0 !important;
}
.hero-eyebrow {
  margin-top: -4px !important;
  margin-bottom: 4px !important;
}
.hero-title {
  margin-bottom: 10px !important;
}
.hero-sub {
  margin-bottom: 8px !important;
}

/* section 到 feed */
.section-head {
  margin-bottom: 6px !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 帖子几乎无缝 */
.post {
  margin-bottom: 4px !important;
  padding: 12px !important;
}

/* footer 更紧 */
.footer {
  padding-top: 6px !important;
  margin-top: 6px !important;
}

/* ============================================================
   v57 — 分类 / 标签 UI
   - 发帖弹窗的分类按钮 + 标签 chip
   - 首页 feed 分组标题 + 「查看全部」
   - 帖子里的分类徽章 + 标签
   ============================================================ */

/* 1) 发帖弹窗 — 分类四宫格 */
.cp-cat-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-top: 6px;
}
.cp-cat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 10px 4px;
  font-family: var(--f-serif-cn, serif);
  font-size: 14px;
  letter-spacing: .1em;
  color: var(--ink-2, #4A453E);
  background: transparent;
  border: 1px solid rgba(0,0,0,.1);
  border-radius: 4px;
  cursor: pointer;
  transition: all .15s;
}
.cp-cat em {
  font-style: normal;
  font-size: 10px;
  letter-spacing: .05em;
  color: var(--ink-4, #AAA49A);
}
.cp-cat:hover { background: rgba(0,0,0,.02); }
.cp-cat.on {
  background: var(--ink-1, #2C2824);
  color: #F8F6F2;
  border-color: var(--ink-1, #2C2824);
}
.cp-cat.on em { color: rgba(248,246,242,.6); }

/* 2) 发帖弹窗 — 标签输入 */
.cp-tag-tip {
  font-style: normal;
  font-size: 11px;
  color: var(--ink-4, #AAA49A);
  margin-left: 6px;
}
.cp-tag-input-row { position: relative; }
.cp-tag-suggest {
  display: none;
  position: absolute;
  top: 100%; left: 0; right: 0;
  margin-top: 4px;
  padding: 6px;
  background: #FFF;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
  z-index: 10;
  flex-wrap: wrap;
  gap: 4px;
}
.cp-tag-suggest span {
  display: inline-block;
  padding: 4px 10px;
  font-size: 12px;
  color: var(--ink-3, #7A7265);
  background: rgba(0,0,0,.03);
  border-radius: 12px;
  cursor: pointer;
}
.cp-tag-suggest span:hover { background: rgba(0,0,0,.06); }
.cp-tag-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.cp-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-size: 12px;
  color: var(--ink-2, #4A453E);
  background: #F0EBE3;
  border-radius: 12px;
}
.cp-chip i {
  font-style: normal;
  cursor: pointer;
  color: var(--ink-4, #AAA49A);
  font-size: 14px;
  line-height: 1;
}
.cp-chip i:hover { color: #A8201A; }

/* 3) 首页 feed 分组标题 + 查看全部 */
.feed-cat-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: 18px 0 10px;
  margin-top: 16px;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.feed-cat-head:first-child { margin-top: 0; padding-top: 6px; }
.feed-cat-name {
  font-family: var(--f-serif-cn, serif);
  font-size: 16px;
  letter-spacing: .15em;
  color: var(--ink-1, #2C2824);
}
.feed-cat-more {
  font-size: 12px;
  color: var(--ink-3, #7A7265);
  text-decoration: none;
  letter-spacing: .08em;
  border-bottom: 1px dotted #9C9388;
  padding-bottom: 1px;
}
.feed-cat-more:hover { color: var(--ink-1, #2C2824); }

.feed-state-mini {
  padding: 16px 0;
  font-size: 13px;
  color: var(--ink-4, #AAA49A);
  text-align: center;
}
.feed-state-mini em {
  display: block;
  font-style: italic;
  font-size: 12px;
  margin-top: 4px;
  color: var(--ink-4, #AAA49A);
}

.feed-foot-link {
  text-align: center;
  padding: 24px 0 16px;
  margin-top: 12px;
  border-top: 1px solid rgba(0,0,0,.04);
}
.feed-foot-link a {
  font-family: var(--f-serif-cn, serif);
  font-size: 14px;
  letter-spacing: .15em;
  color: var(--ink-2, #4A453E);
  text-decoration: none;
  border-bottom: 1px dotted #9C9388;
  padding-bottom: 2px;
}
.feed-foot-link a:hover { color: var(--ink-1, #2C2824); }

/* 5) 右栏热门标签（推特 Trends） */
.trending-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  padding-top: 2px;
}
.trending-tag {
  display: inline-block;
  padding: 4px 10px;
  font-size: 12px;
  color: var(--ink-3, #7A7265);
  background: rgba(0,0,0,.03);
  border-radius: 12px;
  text-decoration: none;
  letter-spacing: .04em;
  transition: all .15s;
}
.trending-tag:hover {
  color: var(--ink-1, #2C2824);
  background: rgba(0,0,0,.07);
}

/* 4) 帖子里：分类徽章 + 标签 */
.post-cat {
  display: inline-block;
  margin-left: 8px;
  padding: 1px 8px;
  font-family: var(--f-serif-cn, serif);
  font-size: 11px;
  letter-spacing: .08em;
  color: var(--ink-3, #7A7265);
  background: rgba(168, 137, 92, .1);
  border-radius: 3px;
}
.post-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 8px 0 4px;
}
.post-tag {
  display: inline-block;
  padding: 2px 8px;
  font-size: 11px;
  color: var(--ink-3, #7A7265);
  background: transparent;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 10px;
  letter-spacing: .04em;
  transition: all .15s;
}
.post-tag:hover {
  color: var(--ink-1, #2C2824);
  border-color: rgba(0,0,0,.18);
  background: rgba(0,0,0,.02);
}

/* ============================================================
   v56g (rev) — 仅控制【左栏首个 nav-label / 右栏首个 aside-label /
                中栏 hero-eyebrow】到上面横线（.brand 下边线）的距离
   注意：不再触碰 .brand-meta 与 .brand 的任何属性，标题区原样保留
   ============================================================ */

/* 1) 左/右栏顶部不再额外留 padding（仅清除左右两栏自己的 padding-top） */
.side-left,
.side-right {
  padding-top: 0 !important;
}

/* 2) 三栏首个标签整体上移（这是唯一的"距离参数"） */
.side-left .nav-group:first-child .nav-label,
.side-right .aside-section:first-child .aside-label,
.main .hero .hero-eyebrow {
  margin-top: -32px !important;
}

/* 3) 把首个分组/板块自身的 margin-top 清掉，避免它把上面拉开 */
.side-left .nav-group:first-child,
.side-right .aside-section:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ============================================================
   v61 — 暗黑模式按钮 fixed 浮动样式（独立页面用）
   ============================================================ */
.theme-toggle--float {
  position: fixed !important;
  top: 16px;
  right: 16px;
  z-index: 100;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(0, 0, 0, .15);
  font-family: var(--f-serif-cn, serif);
  font-size: 14px;
  color: #2C2620;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
  transition: all .2s;
}
.theme-toggle--float:hover {
  background: #FFF;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
}
[data-theme="dark"] .theme-toggle--float {
  background: rgba(50, 50, 50, .9);
  color: #F0EBE3;
  border-color: rgba(255, 255, 255, .2);
}

/* ============================================================
   v60 mobile — 移动端折叠（< 768px 隐藏左右栏，只留中栏）
   ============================================================ */
@media (max-width: 768px) {
  .app, .app--board {
    grid-template-columns: 1fr !important;
    padding: 0 14px !important;
  }
  .side-left,
  .side-right {
    display: none !important;
  }
  .main, .main--board {
    padding: 0 !important;
  }

  /* 顶 brand 行收紧 */
  .brand {
    flex-wrap: wrap;
    padding: 14px 0 !important;
    gap: 8px;
  }
  .brand-name {
    font-size: 22px !important;
  }
  .brand-cn {
    font-size: 16px !important;
  }
  .brand-meta {
    font-size: 11px !important;
    line-height: 1.3 !important;
  }
  .auth-area {
    width: 100%;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 4px;
  }
  .auth-area a,
  .auth-area .write-letter {
    font-size: 11px !important;
    margin-right: 0 !important;
    letter-spacing: .04em !important;
  }

  /* hero 收 */
  .hero {
    padding: 14px 0 !important;
  }
  .hero-title {
    font-size: 18px !important;
    line-height: 1.5 !important;
  }
  .hero-sub {
    font-size: 12.5px !important;
    margin-bottom: 10px !important;
  }

  /* feed 卡片：取消 56px 头像列、单列堆叠 */
  .post {
    padding: 12px 0 !important;
  }
  .post-head {
    gap: 8px !important;
  }
  .post-avatar {
    width: 32px !important;
    height: 32px !important;
  }
  .post-body p,
  .post-body {
    font-size: 14px !important;
    line-height: 1.7 !important;
  }
  .post-foot {
    flex-wrap: wrap !important;
    gap: 8px 12px !important;
    font-size: 11.5px !important;
  }

  /* 标签 chip 缩小 */
  .post-tag {
    font-size: 10.5px !important;
    padding: 1px 6px !important;
  }

  /* fab 浮按钮往左下挪一点 */
  .fab-write {
    right: 16px !important;
    bottom: 16px !important;
    width: 48px !important;
    height: 48px !important;
    font-size: 14px !important;
  }

  /* footer 居中堆叠 */
  .footer {
    padding: 16px 0 !important;
    text-align: center;
    font-size: 12px !important;
  }
  .footer > div {
    line-height: 1.8;
  }

  /* 弹窗在小屏内边距小一点 */
  .modal {
    width: 92vw !important;
    max-width: 460px !important;
    padding: 24px 20px !important;
  }

  /* 广场页头 + 工具栏 */
  .board-toolbar {
    padding: 12px 0 !important;
    font-size: 12px !important;
  }
  .board-item {
    grid-template-columns: 36px 1fr !important;
    padding: 16px 0 !important;
  }
  .board-item-side {
    display: none !important;
  }
}
/* login tabs */  
.login-tabs{display:flex;gap:4px;margin:14px 0 8px;border-bottom:1px solid rgba(139,130,117,0.18);} 
.login-tab{appearance:none;background:none;border:0;padding:10px 18px 12px;cursor:pointer;font-family:var(--f-serif-cn,serif);font-size:14px;color:rgba(58,52,46,0.45);letter-spacing:.16em;position:relative;transition:color .25s;} 
.login-tab:hover{color:rgba(58,52,46,0.8);} 
.login-tab.on{color:#3a342e;} 
.login-tab.on::after{content:"";position:absolute;left:18px;right:18px;bottom:-1px;height:2px;background:#3a342e;border-radius:1px;} 
.login-tab.on{font-weight:600;}