body[data-page="tracking"] { min-height: 100vh; display: flex; flex-direction: column; }
.track-main { flex: 1; min-width: 0; }
.track-main h1, .track-main h2, .track-main h3, .track-main h4 { white-space: normal; overflow-wrap: anywhere; }
.track-search-band { padding-block: 34px 28px; background: var(--soft, #f3f6fa); }
.track-search-band h1 { font-size: 40px; line-height: 1.3; margin: 0 0 4px; }
.track-subtitle { margin: 0 0 20px; font-size: 18px; }
.track-search { max-width: none; }
.track-search > svg, .track-search > i { width: 24px; height: 24px; flex-shrink: 0; margin-left: 18px; }
.track-search button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 180px; }
.track-search button svg { width: 23px; height: 23px; flex-shrink: 0; }
.track-search button:disabled { background: #8f2635; cursor: wait; }
.track-search input[type="hidden"] { display: none; }
.track-input-error { margin: 10px 0 0; color: #ac1021; font-size: 14px; }
.track-content { padding-top: 28px; }
.track-result-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; margin-bottom: 24px; }
.track-number-block { min-width: 0; flex: 1; }
.track-field-label { margin: 0 0 4px; color: #526783; font-size: 13px; }
.track-number-row { display: flex; align-items: center; gap: 8px; }
.track-number-row h2 { font-size: 28px; line-height: 1.35; margin: 0; min-width: 0; user-select: all; }
.track-copy-button { color: #526783; width: 44px; height: 44px; }
.track-status-block { flex: 1; min-width: 0; text-align: right; }
.track-status { display: flex; justify-content: flex-end; align-items: center; gap: 12px; font-size: 26px; line-height: 1.35; margin: 0 0 7px; }
.track-status svg { width: 28px; height: 28px; flex-shrink: 0; }
.track-status-delivered svg { color: #258149; }
.track-status-exception, .track-status-cancelled { color: #ac1021; }
.track-status-unknown { color: #526783; }
.track-current-warehouse, .track-latest { margin: 3px 0 0; font-size: 13px; color: #526783; overflow-wrap: anywhere; }
.track-latest time { font-variant-numeric: tabular-nums; }
.track-progress { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 0 24px; padding: 16px 14px; list-style: none; background: #f5f7fa; }
.track-step { position: relative; min-width: 0; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding-inline: 8px; font-size: 14px; font-weight: 700; color: #657285; }
.track-step::before { content: ""; position: absolute; top: 23px; height: 2px; left: calc(-50% + 27px); right: calc(50% + 27px); background: #c8d0da; }
.track-step:first-child::before { display: none; }
.track-step-icon { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; border: 1px solid #abb7c7; border-radius: 50%; background: #f5f7fa; flex-shrink: 0; }
.track-step-icon svg { width: 25px; height: 25px; }
.track-step-complete { color: var(--navy, #062452); }
.track-step-complete .track-step-icon { color: #fff; border-color: var(--navy, #062452); background: var(--navy, #062452); }
.track-step-complete::before, .track-step-current::before { background: var(--navy, #062452); }
.track-step-current { color: #c41228; }
.track-step-current .track-step-icon { border: 2px solid #c41228; background: #fff; }
.track-details-grid { display: grid; grid-template-columns: minmax(0, 1.9fr) minmax(280px, 1fr); gap: 28px; }
.track-history { min-width: 0; padding-right: 28px; border-right: 1px solid #e1e6ee; }
.track-section-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 22px; }
.track-section-header h3, .track-parcel-info h3 { margin: 0; font-size: 20px; line-height: 1.45; }
#track-sort { max-width: 50%; min-height: 44px; padding: 6px 24px 6px 10px; border: 1px solid transparent; border-radius: 4px; background-color: #fff; color: #526783; font: inherit; font-size: 13px; cursor: pointer; }
#track-sort:hover { border-color: #dce3ee; }
#track-sort:disabled { opacity: .7; cursor: default; }
.track-main select:focus-visible { outline: 3px solid #2772c4; outline-offset: 3px; }
.track-timeline { margin: 0; padding: 0; list-style: none; }
.track-event { display: grid; grid-template-columns: 142px 14px minmax(0, 1fr); column-gap: 20px; position: relative; padding: 0 0 28px; min-height: 90px; }
.track-event:last-child { padding-bottom: 0; min-height: 70px; }
.track-event time { padding-top: 3px; font-size: 13px; font-variant-numeric: tabular-nums; line-height: 1.7; color: #526783; overflow-wrap: anywhere; }
.track-event-dot { position: relative; width: 12px; height: 12px; margin-top: 7px; border-radius: 50%; background: #b3bdcb; }
.track-event-dot::after { content: ""; position: absolute; width: 1px; top: 17px; left: 5px; height: calc(100% + 100px); background: #d4dce6; }
.track-event { overflow: hidden; }
.track-event:last-child .track-event-dot::after { display: none; }
.track-event-latest .track-event-dot { background: var(--red, #e51b2b); }
.track-event-copy h4 { margin: 0 0 4px; font-size: 17px; line-height: 1.5; }
.track-event-copy p { margin: 0; color: #526783; font-size: 14px; overflow-wrap: anywhere; }
.track-time-note { margin: 20px 0 0; font-size: 12px; color: #526783; }
.track-no-events { margin: 12px 0 32px; color: #526783; }
.track-parcel-info { align-self: start; min-width: 0; }
.track-parcel-info h3 { padding: 10px 14px; background: #f5f7fa; }
.track-parcel-info dl { margin: 8px 0 16px; padding-inline: 14px; }
.track-parcel-info dl > div { display: grid; grid-template-columns: minmax(90px, .9fr) minmax(0, 1.4fr); gap: 14px; padding-block: 6px; font-size: 14px; }
.track-parcel-info dt { color: #526783; }
.track-parcel-info dd { margin: 0; text-align: right; overflow-wrap: anywhere; font-weight: 600; }
.track-text-link { display: inline-flex; align-items: center; gap: 10px; color: #135790; font-size: 14px; font-weight: 700; min-height: 44px; }
.track-text-link svg { width: 18px; height: 18px; flex-shrink: 0; }
.track-text-link:hover { color: #c41228; text-decoration: underline; text-underline-offset: 4px; }
.track-info-contact { display: flex; border-top: 1px solid #e1e6ee; margin-inline: 14px; padding-block: 10px; }
.track-support { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 30px; border-top: 1px solid #e1e6ee; margin-top: 28px; padding-block: 12px; font-size: 14px; }
.track-empty-state { padding: 44px 0 52px; min-height: 260px; }
.track-empty-state > svg { width: 42px; height: 42px; color: #60718b; margin-bottom: 12px; }
.track-empty-state h2 { font-size: 24px; margin: 0 0 10px; }
.track-empty-state p { max-width: 65ch; margin: 0; color: #526783; }
.track-copy-feedback { border-top: 1px solid #dce3ee; margin-top: 20px; padding-block: 12px; color: #135790; }
.track-copy-feedback p { margin: 0; }
#track-copy-fallback { display: block; width: 100%; max-width: 540px; margin-top: 8px; padding: 10px; color: #062452; border: 1px solid #abb7c7; border-radius: 4px; }
body[data-page="tracking"] #site-footer { border-top: 1px solid #e1e6ee; }
@media (max-width: 1000px) {
    .track-details-grid { grid-template-columns: minmax(0, 1.4fr) minmax(260px, 1fr); gap: 20px; }
    .track-history { padding-right: 20px; }
    .track-event { grid-template-columns: 100px 12px minmax(0, 1fr); column-gap: 12px; }
    .track-number-row h2 { font-size: 24px; }
    .track-status { font-size: 23px; }
}
@media (max-width: 700px) {
    .track-search-band { padding-block: 24px; }
    .track-search-band h1 { font-size: 32px; }
    .track-subtitle { font-size: 16px; margin-bottom: 18px; }
    .track-search button { min-width: 104px; padding-inline: 12px; font-size: 16px; }
    .track-search button svg { display: none; }
    .track-search input { font-size: 16px; padding-inline: 10px; }
    .track-search > svg, .track-search > i { margin-left: 12px; width: 20px; height: 20px; }
    .track-content { padding-top: 22px; }
    .track-result-header { flex-direction: column; gap: 18px; margin-bottom: 20px; }
    .track-number-block, .track-status-block { width: 100%; }
    .track-status-block { text-align: left; }
    .track-status { justify-content: flex-start; font-size: 22px; }
    .track-number-row h2 { font-size: 23px; }
    .track-progress { padding: 14px 0; margin-bottom: 22px; }
    .track-step { font-size: 12px; padding-inline: 3px; gap: 8px; overflow-wrap: anywhere; }
    .track-step-icon { width: 40px; height: 40px; }
    .track-step-icon svg { width: 22px; height: 22px; }
    .track-step::before { top: 19px; left: calc(-50% + 22px); right: calc(50% + 22px); }
    .track-details-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .track-history { border: 0; padding-right: 0; }
    .track-section-header { margin-bottom: 16px; }
    .track-event { grid-template-columns: 86px 12px minmax(0, 1fr); column-gap: 12px; }
    .track-event-copy h4 { font-size: 16px; }
    .track-event time { font-size: 12px; }
    .track-parcel-info dl > div { grid-template-columns: minmax(90px, 1fr) minmax(0, 1.5fr); }
    .track-support { gap: 2px 20px; margin-top: 22px; }
    .track-support > strong { flex-basis: 100%; }
    .track-empty-state { padding-block: 24px 36px; min-height: 240px; }
}
@media (prefers-reduced-motion: reduce) {
    .track-main { scroll-behavior: auto; }
}