.track-page{
  width:min(100% - 1rem,1080px);
  margin:0 auto;
  display:grid;
  gap:1rem;
  padding:clamp(.8rem,2.5vw,1.35rem) .5rem 2.5rem
}

.track-hero,.track-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:20px;
  box-shadow:var(--shadow)
}

.track-hero{
  padding:clamp(1.1rem,3vw,1.7rem);
  background:linear-gradient(135deg,#fff,#eff6ff 65%,#f8fbff)
}

.track-badge{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.42rem .72rem;
  border-radius:999px;
  background:#dbeafe;
  color:#1d4ed8;
  font-weight:900;
  font-size:.82rem
}

.track-hero h1{
  margin:.55rem 0 .5rem;
  color:var(--secondary);
  font-size:clamp(1.8rem,6vw,3rem);
  line-height:1.08;
  letter-spacing:-.035em
}

.track-hero p{max-width:72ch;color:var(--muted);line-height:1.55}
.track-links{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1rem}

.track-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  align-items:start
}

.track-card{padding:clamp(1rem,2.5vw,1.25rem)}
.track-card h2{color:var(--secondary);margin:0 0 .8rem}

.track-form{display:grid;gap:.65rem}
.track-form label{font-weight:900;color:#0f172a;font-size:.9rem}
.track-form input{
  width:100%;
  min-height:48px;
  border:1px solid var(--border);
  border-radius:12px;
  padding:.75rem;
  font:inherit;
  font-size:16px;
  color:#0f172a
}
.track-form input:focus{outline:3px solid rgba(37,99,235,.13);border-color:#60a5fa}

.track-help{
  display:flex;
  gap:.45rem;
  align-items:flex-start;
  color:#64748b;
  font-size:.86rem;
  line-height:1.45
}
.track-help i{color:#16a34a;margin-top:.15rem}
.track-submit{min-height:48px}
.track-submit:disabled{opacity:.7;cursor:not-allowed}

.track-message{display:none;margin-top:.8rem;padding:.8rem;border-radius:12px}
.track-message.show{display:block;background:#fef2f2;border:1px solid #fecaca;color:#b91c1c}

.track-result-card{min-height:330px}
.track-empty{
  min-height:280px;
  display:grid;
  place-items:center;
  align-content:center;
  text-align:center;
  gap:.55rem;
  color:#64748b
}
.track-empty i{font-size:2.5rem;color:#93c5fd}
.track-empty strong{color:#334155;font-size:1.05rem}

.track-result{display:none}
.track-result.show{display:block}
.track-result-head{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:flex-start;
  padding-bottom:.9rem;
  border-bottom:1px solid #e2e8f0
}
.track-current-label{display:block;color:#64748b;font-size:.78rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.track-result-head h2{margin:.2rem 0 0}
.track-status-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:.38rem .7rem;
  border-radius:999px;
  background:#dbeafe;
  color:#1d4ed8;
  font-weight:900;
  white-space:nowrap
}
.track-status-pill.is-completed{background:#dcfce7;color:#166534}
.track-status-pill.is-rejected{background:#fee2e2;color:#b91c1c}
.track-status-pill.is-processing{background:#fef3c7;color:#92400e}

.track-details{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.7rem;
  margin:1rem 0
}
.track-details>div{
  display:grid;
  gap:.2rem;
  padding:.75rem;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#f8fafc
}
.track-details span{color:#64748b;font-size:.8rem;font-weight:800}
.track-details strong{color:#0f172a}

.track-timeline{display:grid;gap:0;margin-top:1rem}
.track-step{
  position:relative;
  display:grid;
  grid-template-columns:34px 1fr;
  gap:.75rem;
  min-height:72px
}
.track-step:not(:last-child)::after{
  content:"";
  position:absolute;
  left:16px;
  top:34px;
  bottom:0;
  width:2px;
  background:#e2e8f0
}
.track-step.is-done:not(:last-child)::after{background:#86efac}
.track-step-icon{
  position:relative;
  z-index:1;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#f1f5f9;
  border:2px solid #cbd5e1;
  color:#94a3b8
}
.track-step.is-done .track-step-icon{background:#dcfce7;border-color:#22c55e;color:#166534}
.track-step.is-current .track-step-icon{background:#dbeafe;border-color:#2563eb;color:#1d4ed8}
.track-step-content{padding:.05rem 0 .85rem}
.track-step-content strong{display:block;color:#0f172a}
.track-step-content span{display:block;margin-top:.2rem;color:#64748b;font-size:.88rem;line-height:1.4}

.track-note{
  margin-top:.9rem;
  padding:.85rem;
  border-radius:12px;
  background:#eff6ff;
  border:1px solid #bfdbfe;
  color:#1d4ed8;
  line-height:1.5
}
.track-note.is-rejected{background:#fef2f2;border-color:#fecaca;color:#b91c1c}
.track-note.is-completed{background:#f0fdf4;border-color:#bbf7d0;color:#166534}
.track-disclaimer p{color:#64748b;line-height:1.55}

@media(min-width:860px){
  .track-grid{grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr)}
}

@media(max-width:640px){
  .track-page{width:100%;padding:.65rem .65rem 5.5rem}
  .track-hero,.track-card{border-radius:16px}
  .track-links{display:grid}
  .track-links .btn{width:100%}
  .track-details{grid-template-columns:1fr}
  .track-result-head{display:grid}
  .track-status-pill{width:max-content}
}
