.track-page { max-width: 640px; }
.track-form { margin-top: 30px; }
.track-form .field { margin-bottom: 18px; }
.track-form .field label { display: block; font-size: 13px; letter-spacing: 0.04em; color: var(--cream-dim); margin-bottom: 7px; }
.track-form .field input {
  width: 100%; background: var(--panel); border: 1px solid var(--line-soft); color: var(--cream);
  padding: 12px 14px; font-family: var(--sans); font-size: 15px; border-radius: 2px;
}
.track-form .field input:focus { border-color: var(--gold); outline: none; }
.track-form .form-error { color: #e2896f; font-size: 13.5px; margin: 0 0 16px; display: none; }
.track-form .form-error.show { display: block; }

.track-result {
  margin-top: 44px; border: 1px solid var(--line); padding: 30px 32px; background: var(--panel);
}
.track-result h2 { font-size: 24px; margin-bottom: 4px; }
.track-result .tr-amount { color: var(--gold-bright); font-family: var(--serif); font-size: 20px; margin-bottom: 22px; }
.track-result dl { display: grid; grid-template-columns: auto 1fr; gap: 10px 22px; margin: 0; }
.track-result dt { color: var(--cream-dim); font-size: 13px; letter-spacing: 0.03em; padding-top: 2px; }
.track-result dd { margin: 0; color: var(--cream); font-size: 15px; }
.track-status-pill { display: inline-block; padding: 3px 12px; border-radius: 20px; font-size: 13px; border: 1px solid var(--line); }
.track-status-paid { color: #7fd88f; border-color: #3f6a48; }
.track-status-pending { color: var(--cream-dim); }
.track-status-failed { color: #e2896f; border-color: #6a3f3f; }
