:root {
  --tg-bg: #0e1621;
  --tg-bubble: #17212b;
  --tg-line: #242f3d;
  --tg-text: #f5f5f5;
  --tg-muted: #8ba3b8;
  --tg-link: #6ab3f3;
  --tg-ok: #4caf7a;
}
* { box-sizing: border-box; }
html, body {
  margin: 0; height: 100%; overflow: hidden;
  background: var(--tg-bg); color: var(--tg-text);
  font-family: -apple-system, "SF Pro Text", "PingFang SC", sans-serif;
}
.panel-toolbar {
  display: flex; gap: 8px; padding: 8px 10px;
  background: #17212b; border-bottom: 1px solid var(--tg-line);
}
.panel-toolbar input {
  flex: 1; border: 1px solid var(--tg-line); background: #0e1621;
  color: var(--tg-text); border-radius: 8px; padding: 8px 10px; font: inherit;
}
.panel-toolbar button {
  border: 1px solid var(--tg-line); background: #1c2733; color: var(--tg-text);
  border-radius: 8px; padding: 8px 12px; cursor: pointer; font: inherit;
}
.panel-feed {
  height: calc(100% - 49px); overflow: auto; position: relative;
  background: var(--tg-bg);
}
.lv-spacer { width: 1px; pointer-events: none; }
.lv-inner { position: absolute; left: 0; right: 0; top: 0; }

.lv-item {
  /* 勿 hidden：固定行高未跟上时会裁掉整图 */
  overflow: visible;
}
.tg-msg {
  margin: 10px 12px 14px; background: var(--tg-bubble);
  border-radius: 12px; overflow: hidden; border: 1px solid var(--tg-line);
  transition: box-shadow .2s, border-color .2s;
}
.tg-msg.linked { border-color: rgba(76, 175, 122, .45); }
.tg-msg.highlight {
  box-shadow: 0 0 0 2px var(--tg-link);
  animation: pulse 1.2s ease 2;
}
.tg-msg.ad { opacity: .55; }
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 2px rgba(106,179,243,.2); }
  50% { box-shadow: 0 0 0 3px rgba(106,179,243,.85); }
}
.tg-head {
  display: flex; gap: 6px; align-items: center; flex-wrap: wrap;
  padding: 8px 12px 0; font-size: 12px;
}
.tg-id { color: var(--tg-muted); font-variant-numeric: tabular-nums; }
.tg-badge {
  font-size: 10px; padding: 2px 6px; border-radius: 999px;
  background: #243040; color: var(--tg-muted);
}
.tg-badge.ok { background: rgba(76,175,122,.18); color: var(--tg-ok); }
.tg-media { line-height: 0; background: #0a1018; }
.tg-media img {
  width: 100%; display: block; height: auto; max-height: none;
  object-fit: contain; background: #0a1018;
}
.tg-media.album {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px;
}
.tg-media.album img { width: 100%; height: auto; object-fit: contain; }
.tg-media.album img:only-child,
.tg-media.album img:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}
.tg-body {
  padding: 10px 12px 12px; line-height: 1.55; font-size: 14px;
  white-space: pre-wrap; word-break: break-word;
}
.tg-body a { color: var(--tg-link); text-decoration: none; font-weight: 500; }
.tg-body a[data-nav] {
  cursor: pointer;
  padding: 1px 4px;
  border-radius: 4px;
  background: rgba(106, 179, 243, .12);
}
.tg-body a:hover { text-decoration: underline; }
.tg-body a[data-nav]:hover { background: rgba(106, 179, 243, .22); }
.tg-body strong { font-weight: 700; }

.empty {
  padding: 40px 20px; text-align: center; color: var(--tg-muted);
}