/* ==========================================================================
   NZEP ARCHIVE · feed.css —— 社区动态（纯基础风格）
   ========================================================================== */
.fd-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 17rem; gap: 1rem; align-items: start; }
@media (max-width: 900px) { .fd-wrap { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------- 发布框 */
.fd-box { border: 1px solid var(--border); background: var(--bg); margin-bottom: .9rem; }
.fd-box .top { display: flex; gap: .6rem; padding: .7rem .8rem .3rem; }
.fd-box .av { width: 2.2rem; height: 2.2rem; border-radius: 50%; border: 1px solid var(--border-soft); flex: 0 0 auto; object-fit: cover; background: var(--bg-alt); }
.fd-box textarea {
  flex: 1 1 auto; min-height: 3.4rem; resize: vertical; border: 0; outline: none; background: none;
  font: inherit; font-size: .92rem; line-height: 1.7; color: var(--text); padding: .15rem 0;
}
.fd-thumbs { display: flex; gap: .4rem; flex-wrap: wrap; padding: 0 .8rem; }
.fd-thumbs .th { position: relative; width: 4.4rem; height: 4.4rem; border: 1px solid var(--border-soft); overflow: hidden; }
.fd-thumbs .th img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fd-thumbs .th button {
  position: absolute; right: 0; top: 0; border: 0; background: rgba(0,0,0,.55); color: #fff; cursor: pointer;
  width: 1.15rem; height: 1.15rem; line-height: 1; font-size: .7rem;
}
.fd-quote { margin: .5rem .8rem 0; border: 1px solid var(--border-soft); background: var(--bg-subtle); padding: .45rem .6rem; font-size: .78rem; display: flex; gap: .5rem; align-items: flex-start; }
.fd-quote .sp { flex: 1 1 auto; }
.fd-quote button { border: 0; background: none; color: var(--c-gray); cursor: pointer; font-size: .72rem; }
.fd-box .bar {
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  border-top: 1px solid var(--border-faint); margin-top: .6rem; padding: .5rem .8rem; background: var(--bg-subtle);
}
.fd-box .bar .sp { flex: 1 1 auto; }
.fd-topic { font: inherit; font-size: .8rem; border: 1px solid var(--border-soft); padding: .2rem .45rem; width: 11rem; }
.fd-count { font-size: .72rem; color: var(--c-gray); font-family: var(--mono); }

/* ---------------------------------------------------------------- 帖子 */
.fd-list { border: 1px solid var(--border); background: var(--bg); }
.fd-post { display: flex; gap: .7rem; padding: .85rem .9rem; border-bottom: 1px solid var(--border-faint); }
.fd-post:last-child { border-bottom: 0; }
.fd-post .av { width: 2.4rem; height: 2.4rem; border-radius: 50%; border: 1px solid var(--border-soft); flex: 0 0 auto; object-fit: cover; background: var(--bg-alt); cursor: pointer; }
.fd-post .bd { flex: 1 1 auto; min-width: 0; }
.fd-post .hd { display: flex; align-items: baseline; gap: .4rem; flex-wrap: wrap; }
.fd-post .hd .nm { font-size: .86rem; color: var(--link); cursor: pointer; }
.fd-post .hd .at { font-size: .72rem; color: var(--c-gray); font-family: var(--mono); }
.fd-post .txt { font-size: .9rem; line-height: 1.75; margin: .3rem 0 0; white-space: pre-wrap; word-break: break-word; }
.fd-post .txt a.tp { color: var(--link); }
/* 正文里的网址：可点，窄屏上也能整段换行不撑破版式 */
.fd-post .txt a.lnk,
.fd-reply .txt a.lnk { color: var(--link); word-break: break-all; }
.fd-post.deleted .txt { color: var(--c-gray); font-style: italic; }
.fd-imgs { display: grid; grid-template-columns: repeat(auto-fit, minmax(8rem, 12rem)); gap: .35rem; margin-top: .5rem; }
.fd-imgs img { width: 100%; border: 1px solid var(--border-soft); display: block; cursor: pointer; max-height: 18rem; object-fit: cover; }
.fd-q { margin-top: .5rem; border: 1px solid var(--border-soft); background: var(--bg-subtle); padding: .5rem .6rem; }
.fd-q .t { font-size: .84rem; font-weight: 400; }
.fd-q .m { font-size: .72rem; color: var(--c-gray); margin-top: .2rem; }
.fd-q .c { font-size: .78rem; color: var(--text); margin-top: .25rem; }
.fd-q .c img { width: 3.4rem; height: 3.4rem; object-fit: cover; border: 1px solid var(--border-soft); vertical-align: middle; margin-right: .4rem; }
.fd-acts { display: flex; gap: 1.1rem; margin-top: .5rem; font-size: .76rem; color: var(--c-gray); }
.fd-acts button { border: 0; background: none; color: inherit; cursor: pointer; font: inherit; display: inline-flex; align-items: center; gap: .25rem; padding: 0; }
.fd-acts button:hover { color: var(--link); }
.fd-acts button.on { color: var(--bad); }
.fd-acts button.danger:hover { color: var(--bad); }

/* 回复区 */
.fd-replies { margin-top: .55rem; border-left: 2px solid var(--border-faint); padding-left: .6rem; display: none; }
.fd-replies.on { display: block; }
.fd-reply { display: flex; gap: .5rem; padding: .35rem 0; }
.fd-reply .av { width: 1.7rem; height: 1.7rem; border-radius: 50%; border: 1px solid var(--border-soft); object-fit: cover; }
.fd-reply .bd { flex: 1 1 auto; min-width: 0; font-size: .82rem; }
.fd-reply .hd { font-size: .74rem; color: var(--c-gray); display: flex; gap: .4rem; align-items: baseline; }
.fd-reply .hd .nm { color: var(--link); cursor: pointer; }
.fd-reply .txt { white-space: pre-wrap; word-break: break-word; margin-top: .1rem; }
.fd-reply.deleted .txt { color: var(--c-gray); font-style: italic; }
.fd-replyform { display: flex; gap: .4rem; margin-top: .4rem; }
.fd-replyform input { flex: 1 1 auto; font: inherit; font-size: .82rem; border: 1px solid var(--border-soft); padding: .28rem .45rem; }
.fd-empty { padding: 1.4rem .9rem; text-align: center; color: var(--c-gray); font-size: .82rem; }
.fd-more { padding: .8rem; text-align: center; }

/* ---------------------------------------------------------------- 右栏 */
.fd-side { border: 1px solid var(--border); background: var(--bg); margin-bottom: .9rem; }
.fd-side .head { padding: .45rem .7rem; background: var(--bg-alt); border-bottom: 1px solid var(--border-soft); font-size: .8rem; }
.fd-side .body { padding: .6rem .7rem; font-size: .8rem; }
.fd-side .body .row { display: flex; justify-content: space-between; padding: .22rem 0; }
.fd-side .body .row a { color: var(--link); }
.fd-chips { display: flex; flex-wrap: wrap; gap: .3rem; }
.fd-chips button { font: inherit; font-size: .74rem; border: 1px solid var(--border-soft); background: #fff; padding: .12rem .45rem; cursor: pointer; }
.fd-chips button.on { background: var(--bar); color: #fff; border-color: var(--bar); }
.fd-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--border); margin-bottom: .8rem; }
.fd-tabs button {
  font: inherit; font-size: .82rem; padding: .42rem .8rem; background: var(--bg-subtle); color: var(--text);
  border: 1px solid var(--border-faint); border-bottom: 0; cursor: pointer; margin-right: .2rem;
}
.fd-tabs button.on { background: #fff; border-color: var(--border); font-weight: 700; }

/* 动态分类标签：全部 / 更新动态 / 房间分享 / 玩家交流（2026-10）
   手机友好：可点区域 ≥44px（2.75rem），一行放不下就换行（flex-wrap），
   所以 390px 宽也不会横向溢出（套件在真浏览器里量 scrollWidth 与按钮高度）。 */
.fd-cats { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .6rem; }
.fd-cats button {
  font: inherit; font-size: .82rem; line-height: 1.2; min-height: 2.75rem; padding: .45rem .75rem;
  display: inline-flex; align-items: center; gap: .3rem;
  border: 1px solid var(--border-soft); background: var(--bg); color: var(--text); cursor: pointer;
}
.fd-cats button:hover { border-color: var(--border); }
.fd-cats button.on { background: var(--bar); border-color: var(--bar); color: #fff; font-weight: 700; }
.fd-cats button .n { font-family: var(--mono); font-size: .72rem; opacity: .72; }
.fd-cats button.on .n { opacity: .9; }

/* 发布框上的"发到哪一类"：只有玩家交流（默认）与房间分享 —— 更新动态不在这里 */
.fd-pcat { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; padding: .55rem .8rem 0; }
.fd-pcat .tiny { flex: 1 1 12rem; min-width: 0; }
.fd-pcat button {
  font: inherit; font-size: .78rem; min-height: 2.75rem; padding: .4rem .7rem;
  display: inline-flex; align-items: center;
  border: 1px solid var(--border-soft); background: var(--bg); color: var(--text); cursor: pointer;
}
.fd-pcat button.on { background: var(--bar); border-color: var(--bar); color: #fff; font-weight: 700; }
.fd-search { display: flex; gap: .4rem; margin-bottom: .8rem; }
.fd-search input { flex: 1 1 auto; font: inherit; border: 1px solid var(--border-soft); padding: .35rem .5rem; }
.fd-userhead { border: 1px solid var(--border); background: var(--bg-subtle); padding: .7rem .8rem; display: flex; gap: .7rem; align-items: center; margin-bottom: .8rem; }
.fd-userhead img { width: 3rem; height: 3rem; border-radius: 50%; border: 1px solid var(--border-soft); object-fit: cover; }
.fd-userhead .st { font-size: .74rem; color: var(--c-gray); }
.fd-quote .nm { color: var(--link); }

/* 触屏（手机与平板）：发帖区的输入统一 16px（小于 16px 时 iOS 会自动放大整页），
   标签与按钮也放大到手指好点的尺寸 */
@media (hover: none) {
  .fd-box textarea, .fd-box input, .fd-search input, .fd-topic,
  .fd-replyform input, .fd-replyform textarea, .fd-reply input, .fd-reply textarea { font-size: 16px; }
  .fd-tabs button { min-height: 2.75rem; }
  .fd-cats button { min-height: 2.75rem; }
  .fd-pcat button { min-height: 2.75rem; }
  .fd-chips button { min-height: 2.1rem; padding: .3rem .6rem; }
}
@media (max-width: 767px) {
  .fd-box textarea, .fd-box input, .fd-search input, .fd-topic,
  .fd-replyform input, .fd-replyform textarea, .fd-reply input, .fd-reply textarea { font-size: 16px; }
  .fd-tabs button { min-height: 2.75rem; }
  .fd-cats button { min-height: 2.75rem; }
  .fd-pcat button { min-height: 2.75rem; }
  .fd-chips button { min-height: 2.1rem; padding: .3rem .6rem; }
}
