/* Travel pace calculator */
.tp-inputs { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-end; margin-bottom: 24px; }
.tp-field { display: flex; flex-direction: column; gap: 5px; font-size: 14px; color: var(--muted); font-weight: 600; }
.tp-field input { font-size: 20px; font-variant-numeric: tabular-nums; }
.tp-field > input { width: 110px; }

.tp-distance { display: inline-flex; gap: 8px; align-items: stretch; }
.tp-distance input { width: 110px; }
.tp-distance .seg { align-items: stretch; }

.tp-result { text-align: center; margin: 8px 0 28px; }
.tp-days {
    font-family: "Fraunces", Georgia, serif; font-weight: 600;
    font-size: clamp(34px, 8vw, 56px); line-height: 1.05; color: var(--accent);
    font-variant-numeric: tabular-nums;
}
.tp-sub { color: var(--muted); margin-top: 4px; }
.tp-meta { color: var(--faint); font-size: 14px; margin-top: 10px; font-variant-numeric: tabular-nums; }

.tp-table {
    width: 100%; border-collapse: collapse; font-size: 14px;
    border: 1px solid var(--border); border-radius: 12px; overflow: hidden;
}
.tp-table caption { text-align: left; }
.tp-table th, .tp-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--border); }
.tp-table thead th { background: var(--bg); color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
.tp-table tbody tr:last-child th, .tp-table tbody tr:last-child td { border-bottom: 0; }
.tp-table tbody th { color: var(--text); font-weight: 600; }
.tp-table td { color: var(--muted); font-variant-numeric: tabular-nums; }