.home { max-width: 560px; margin: 0 auto; padding: var(--space-5) var(--space-3); display: grid; gap: var(--space-3); }
.home h1 { font-size: var(--text-xl); line-height: var(--leading-tight); }
.home p { font-size: var(--text-l); }
.home-links { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-2); }
.home-links a { text-decoration: none; }
.home-steps { list-style: decimal; padding-left: var(--space-4); display: grid; gap: var(--space-2); font-size: var(--text-l); }
.tr { max-width: 560px; margin: 0 auto; padding: var(--space-4) var(--space-3) var(--space-5); display: grid; gap: var(--space-4); }
.tr-top { display: grid; gap: var(--space-1); }
.tr-top h1 { font-size: var(--text-l); line-height: var(--leading-tight); }
.tr-pay { display: grid; gap: var(--space-3); }
.tr-amount { font-size: var(--text-xl); font-weight: var(--weight-strong); line-height: var(--leading-tight); font-variant-numeric: tabular-nums; }
.tr .row { --row-label: 96px; font-size: var(--text-m); }
.tr-recipient { font-family: var(--font-mono); font-size: var(--text-s); overflow-wrap: anywhere; font-weight: var(--weight-strong); }
.tr-actions { display: grid; gap: var(--space-2); justify-items: start; }
.tr-control { display: flex; flex-wrap: wrap; gap: var(--space-2); padding-top: var(--space-3); border-top: var(--rule-width) solid var(--rule); }
@media (max-width: 520px) {
  .tr .row { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
}
