body { background: #f4f7fb; }
.chirp-top {
  background: #fff; border-bottom: 1px solid #e4e9f0; position: sticky; top: 0;
  display: flex; align-items: center; gap: 10px; padding: 12px 18px; z-index: 5;
}
.chirp-top .logo { font-weight: 800; font-size: 22px; color: #1d9bf0; letter-spacing: -.02em; }
.chirp-top .logo span { color: #16254d; }
.col { max-width: 600px; margin: 0 auto; background: #fff; min-height: 100vh;
  border-left: 1px solid #e4e9f0; border-right: 1px solid #e4e9f0; }

.profile-cover { height: 130px; background: linear-gradient(120deg,#16254d,#00a896); }
.profile-head { padding: 0 18px 14px; position: relative; }
.profile-head .avatar {
  width: 92px; height: 92px; border-radius: 50%; border: 4px solid #fff;
  margin-top: -46px; background:#fff;
}
.profile-head h1 { font-size: 20px; margin: 8px 0 0; }
.profile-head .handle { color: #667; margin: 0; }
.profile-head .bio { margin: 10px 0 6px; }
.profile-head .meta { color: #667; font-size: 14px; }
.tabs { display: flex; border-bottom: 1px solid #e4e9f0; }
.tabs div { flex: 1; text-align: center; padding: 14px; color: #667; font-weight: 600; }
.tabs div.active { color: #0f1419; border-bottom: 3px solid #1d9bf0; }

.post { padding: 14px 18px; border-bottom: 1px solid #e4e9f0; display: flex; gap: 12px; }
.post .avatar { width: 48px; height: 48px; border-radius: 50%; flex: none; }
.post .body { flex: 1; min-width: 0; }
.post .name { font-weight: 700; }
.post .name span { color: #667; font-weight: 400; }
.post .text { margin: 2px 0 10px; white-space: pre-wrap; }
.post .photo { border: 1px solid #e4e9f0; border-radius: 16px; overflow: hidden; }
.post .time { color: #667; font-size: 14px; margin-top: 10px; }
.post .time abbr { text-decoration: underline dotted; cursor: help; }
.post .actions { display: flex; gap: 42px; color: #667; font-size: 13px; margin-top: 10px; }

.replies { background: #fafbfd; }
.reply { padding: 12px 18px 12px 24px; border-bottom: 1px solid #eef1f5; display: flex; gap: 10px; }
.reply .avatar { width: 38px; height: 38px; border-radius: 50%; flex: none; }
.reply .name { font-weight: 700; font-size: 14px; }
.reply .name span { color: #667; font-weight: 400; }
.reply .text { font-size: 14px; margin: 1px 0 0; }
em { font-style: italic; }
