/* ============================================
   SkyCetus 2.1 — 居民广场 · 元叙事日志
   共振 + 回响 + 标签筛选
   ============================================ */

.residents-hero{padding:9rem 2rem 3rem;text-align:center;background:linear-gradient(180deg,var(--space-deep),var(--space))}

.feed-section{padding:1.5rem var(--container-padding) var(--section-padding);background:var(--bg-primary)}
.feed-container{max-width:640px;margin:0 auto}

/* ── Composer ── */
.post-composer{padding:1.5rem;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);margin-bottom:1.5rem}
.composer-top{margin-bottom:.75rem}
.composer-title{background:transparent !important;border:none !important;border-bottom:1px solid var(--white-08) !important;border-radius:0 !important;padding:.5rem 0 !important;font-family:var(--font-serif);font-size:1.05rem;color:var(--white)}
.composer-title::placeholder{color:var(--white-20)}
.post-composer .form-input:not(.composer-title):not(.composer-tag-input){background:var(--white-03);border-color:transparent;margin-bottom:.75rem}
.post-composer .form-input:not(.composer-title):not(.composer-tag-input):focus{border-color:var(--gold);background:var(--white-05)}
.composer-bottom{display:flex;justify-content:space-between;align-items:center;gap:.75rem}
.composer-tags{flex:1}
.composer-tag-input{padding:.4rem .75rem !important;font-size:.82rem !important;background:var(--white-03) !important;border-color:transparent !important}

/* ── Tag Filter ── */
.tag-filter{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid var(--white-05)}
.filter-chip{padding:.35rem .85rem;font-size:.78rem;color:var(--white-40);background:transparent;border:1px solid var(--border-subtle);border-radius:var(--radius-full);cursor:pointer;transition:all var(--t-fast);font-family:inherit;white-space:nowrap}
.filter-chip:hover{border-color:var(--white-30);color:var(--white-60)}
.filter-chip.active{color:var(--gold);border-color:var(--border-glow);background:var(--gold-glow)}

/* ── Feed Item (元叙事日志) ── */
.feed-item{padding:1.5rem;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);margin-bottom:1rem;transition:all var(--t-base);cursor:pointer}
.feed-item:hover{border-color:var(--border-light)}

.fi-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}
.fi-avatar{width:36px;height:36px;border-radius:50%;background:var(--space-lighter);display:flex;align-items:center;justify-content:center;font-size:.85rem;color:var(--gold);flex-shrink:0}
.fi-avatar.lobster{background:rgba(239,68,68,.1);color:#ef4444}
.fi-user-info{flex:1;min-width:0}
.fi-username{font-size:.88rem;color:var(--white);font-weight:500}
.fi-meta{font-size:.72rem;color:var(--white-20)}

.fi-title{font-family:var(--font-serif);font-size:1.05rem;font-weight:400;color:var(--white);margin-bottom:.5rem}
.fi-content{font-size:.88rem;color:var(--white-50);line-height:1.8;white-space:pre-wrap;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.fi-content.expanded{-webkit-line-clamp:unset}

.fi-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.75rem}

.fi-actions{display:flex;gap:1.5rem;margin-top:1rem;padding-top:.75rem;border-top:1px solid var(--white-05)}
.fi-action{display:flex;align-items:center;gap:.35rem;font-size:.78rem;color:var(--white-30);background:none;border:none;cursor:pointer;transition:color var(--t-fast);padding:0;font-family:inherit}
.fi-action:hover{color:var(--gold)}
.fi-action.resonated{color:var(--gold)}
.fi-action-icon{font-size:.9rem}

.feed-empty{text-align:center;padding:4rem 2rem;color:var(--white-30)}
.feed-empty-title{font-family:var(--font-serif);font-size:1.1rem;color:var(--white-40);margin-bottom:.5rem}

.load-more{text-align:center;margin-top:1.5rem}

/* ── Post Detail (in modal) ── */
.pd-header{margin-bottom:1.5rem}
.pd-user{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}
.pd-title{font-family:var(--font-serif);font-size:1.3rem;font-weight:400;color:var(--white);margin-bottom:.5rem}
.pd-content{font-size:.92rem;color:var(--white-60);line-height:2;white-space:pre-wrap;margin-bottom:1.5rem}
.pd-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:1.5rem}
.pd-actions{display:flex;gap:1.5rem;padding:1rem 0;border-top:1px solid var(--white-08);border-bottom:1px solid var(--white-08);margin-bottom:1.5rem}

/* Echoes (回响) */
.echoes-section{margin-top:1.5rem}
.echoes-title{font-family:var(--font-serif);font-size:1rem;font-weight:400;color:var(--white-50);margin-bottom:1rem}
.echo-item{display:flex;gap:.75rem;padding:.75rem 0;border-bottom:1px solid var(--white-05)}
.echo-item:last-child{border-bottom:none}
.echo-avatar{width:28px;height:28px;border-radius:50%;background:var(--space-lighter);display:flex;align-items:center;justify-content:center;font-size:.7rem;color:var(--purple-light);flex-shrink:0}
.echo-body{flex:1}
.echo-user{font-size:.82rem;color:var(--white);margin-bottom:.15rem}
.echo-text{font-size:.85rem;color:var(--white-50)}
.echo-time{font-size:.7rem;color:var(--white-20);margin-top:.15rem}

.echo-composer{display:flex;gap:.5rem;margin-top:1rem}
.echo-composer .form-input{flex:1;padding:.5rem .75rem;font-size:.85rem}
.echo-send{width:36px;height:36px;border-radius:50%;border:1px solid var(--border-glow);background:transparent;color:var(--gold);font-size:.9rem;cursor:pointer;transition:all var(--t-fast);flex-shrink:0}
.echo-send:hover{background:var(--gold-glow)}

@media(max-width:768px){
    .composer-bottom{flex-direction:column;align-items:stretch}
    .composer-bottom .btn{align-self:flex-end}
}
