.track-page{padding-top:calc(var(--navbar-height-desktop)+36px);min-height:100vh;background:var(--color-parchment);}
.track-search{max-width:560px;margin:0 auto;padding:var(--space-10) var(--space-5);text-align:center;}
.track-search-bar{display:flex;gap:var(--space-3);margin-bottom:var(--space-3);}
.track-input{flex:1;padding:14px 20px;border:2px solid rgba(201,168,76,0.3);border-radius:var(--radius-sm);background:white;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-deep-brown);outline:none;transition:border-color 0.2s;}
.track-input:focus{border-color:var(--color-antique-gold);}
.tracking-result{max-width:680px;margin:0 auto;padding:0 var(--space-5) var(--space-10);}
.tracking-timeline{position:relative;padding:var(--space-7) 0;}
.tracking-steps{display:flex;justify-content:space-between;align-items:flex-start;position:relative;}
.tracking-steps::before{content:'';position:absolute;top:20px;left:0;right:0;height:2px;background:rgba(201,168,76,0.2);}
.tracking-progress{position:absolute;top:20px;left:0;height:2px;background:var(--color-antique-gold);transition:width 0.8s ease-out;}
@media(max-width:767px){.tracking-steps{flex-direction:column;}.tracking-steps::before{display:none;}.tracking-progress{display:none;}}
.tracking-step{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);flex:1;position:relative;z-index:1;}
@media(max-width:767px){.tracking-step{flex-direction:row;gap:var(--space-4);padding:var(--space-3) 0;border-bottom:1px solid rgba(201,168,76,0.1);}}
.step-node{width:40px;height:40px;border-radius:50%;background:white;border:2px solid rgba(201,168,76,0.3);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;transition:all 0.4s;}
.tracking-step.done .step-node{background:var(--color-antique-gold);border-color:var(--color-antique-gold);color:var(--color-ink-black);}
.tracking-step.active .step-node{background:var(--color-antique-gold);border-color:var(--color-antique-gold);color:white;}
.tracking-step.pending .step-node{background:white;border-color:rgba(59,31,10,0.15);color:rgba(59,31,10,0.2);}
.step-text{text-align:center;}
@media(max-width:767px){.step-text{text-align:left;}}
.step-name{font-size:var(--text-xs);font-weight:600;color:var(--color-deep-brown);letter-spacing:0.05em;text-transform:uppercase;}
.step-time{font-size:10px;color:rgba(59,31,10,0.4);margin-top:2px;}