.tx-now { border: 1px solid var(--border-color-primary); border-radius: 8px; padding: 8px 12px;
  background: var(--background-fill-secondary); line-height: 1.6;
  animation: tx-now-rise 0.28s ease-out; }
/* 「剛剛」那張卡片的內容每次行動都會換掉，所以這個動畫每次都會重播——等於「這是剛發生的事」
   的視覺提示。更早的紀錄列（.tx-row）刻意不動，不然整頁都在閃。 */
@keyframes tx-now-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
/* 拿到新東西的那一行：掃過一道光，只播一次（見 _line_class） */
@keyframes tx-shine { from { background-position: -150% 0; } to { background-position: 250% 0; } }
.tx-new { border-radius: 4px; background-image: linear-gradient(
    90deg, transparent 0%, rgba(250, 204, 21, 0.30) 45%, rgba(250, 204, 21, 0.30) 55%, transparent 100%);
  background-size: 220% 100%; background-repeat: no-repeat;
  animation: tx-shine 1.15s ease-out 1 both; }
@media (prefers-reduced-motion: reduce) {
  .tx-now, .tx-new { animation: none !important; }
  .tx-new { background-image: none; box-shadow: inset 3px 0 0 rgba(250, 204, 21, 0.9); padding-left: 8px; }
}
.tx-when { font-size: 12px; opacity: 0.7; }
.tx-head { margin: 2px 0; }
.tx-title { font-weight: 600; }
.tx-tag { margin-left: 0.75em; opacity: 0.85; }
.tx-line { margin: 2px 0; }
.tx-extra { border-left: 3px solid var(--border-color-primary); padding: 2px 10px; margin: 2px 0;
  font-size: 14px; line-height: 1.6; }
.tx-chgs { display: inline-flex; flex-wrap: wrap; gap: 4px; margin-left: 0.75em; vertical-align: middle; }
div.tx-chgs { display: flex; margin: 6px 0 2px; }
.tx-chg { font-size: 12px; line-height: 1.5; padding: 0 6px; border-radius: 4px; white-space: nowrap;
  border: 1px solid var(--border-color-primary); }
.tx-up { background: rgba(22, 163, 74, 0.16); border-color: rgba(22, 163, 74, 0.7); }
.tx-down { background: rgba(220, 38, 38, 0.16); border-color: rgba(220, 38, 38, 0.7); }
.tx-heading { font-weight: 600; margin: 4px 0; }
.tx-row { border-bottom: 1px solid var(--border-color-primary); font-size: 14px; line-height: 1.6; }
.tx-sum { display: flex; gap: 10px; padding: 3px 0; }
summary.tx-sum { cursor: pointer; list-style: none; }
summary.tx-sum::-webkit-details-marker { display: none; }
summary.tx-sum .tx-main::after { content: "▸"; margin-left: 0.5em; font-size: 11px; opacity: 0.55; }
details[open] > summary.tx-sum .tx-main::after { content: "▾"; }
.tx-body { padding: 0 0 4px calc(6.5em + 10px); font-size: 13px; opacity: 0.9; }
.tx-time { flex: 0 0 6.5em; font-size: 12px; opacity: 0.7; white-space: nowrap; padding-top: 2px; }
.tx-main { flex: 1; min-width: 0; }
.tx-empty { font-size: 13px; opacity: 0.7; }
.tx-glyph { float: right; width: 44px; height: 44px; margin: 0 0 4px 8px; opacity: 0.8; }