/* Shared progress rail for authenticated client flows. */
body[data-scope="app"][data-auth] :is(.tr-stepper-min,.kyc-stepper-min,.conversion-progress){
  width:100%!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
}

body[data-scope="app"][data-auth] :is(.tr-stepper-row,.kyc-stepper-row){
  display:grid!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0 auto!important;
  padding:0!important;
  grid-auto-columns:minmax(0,1fr)!important;
  grid-auto-flow:column!important;
  align-items:stretch!important;
  gap:0!important;
  list-style:none!important;
}

body[data-scope="app"][data-auth] .conversion-progress{
  display:grid!important;
  width:100%!important;
  max-width:none!important;
  margin-inline:auto!important;
  grid-auto-columns:minmax(0,1fr)!important;
  grid-auto-flow:column!important;
  gap:0!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-item,.kyc-step-item){
  position:relative!important;
  display:grid!important;
  min-width:0!important;
  min-height:64px!important;
  grid-template-columns:22px minmax(0,1fr)!important;
  align-items:center!important;
  gap:9px!important;
  padding:9px 12px 8px!important;
  border:0!important;
  border-bottom:2px solid #dce5eb!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#657b8c!important;
  text-align:left!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-item,.kyc-step-item).active{
  border-bottom-color:#246792!important;
  color:#071f36!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-item,.kyc-step-item).completed{
  border-bottom-color:#087f70!important;
  color:#087f70!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-icon,.kyc-step-iconWrap){
  position:relative!important;
  display:inline-flex!important;
  width:22px!important;
  height:22px!important;
  min-width:0!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:currentColor!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-icon,.kyc-step-iconWrap)>svg,
body[data-scope="app"][data-auth] .kyc-step-iconWrap>.kyc-ico{
  display:block!important;
  width:17px!important;
  height:17px!important;
  visibility:visible!important;
  opacity:1!important;
  stroke-width:1.5!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-copy,.kyc-step-copy){
  display:flex!important;
  min-width:0!important;
  flex-direction:column!important;
  gap:3px!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-number,.kyc-step-number){
  color:currentColor!important;
  font-size:9.5px!important;
  font-weight:400!important;
  line-height:1!important;
  letter-spacing:.04em!important;
  text-transform:uppercase!important;
  opacity:.78!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-label,.kyc-step-label){
  min-width:0!important;
  margin:0!important;
  color:currentColor!important;
  font-size:12px!important;
  font-weight:400!important;
  line-height:1.2!important;
  white-space:nowrap!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-check,.kyc-step-check){
  position:absolute!important;
  top:50%!important;
  left:12px!important;
  display:none!important;
  width:15px!important;
  height:15px!important;
  align-items:center!important;
  justify-content:center!important;
  color:#087f70!important;
  transform:translateY(-50%)!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-item,.kyc-step-item).completed>:is(.tr-step-check,.kyc-step-check){
  display:inline-flex!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-item,.kyc-step-item).completed>:is(.tr-step-icon,.kyc-step-iconWrap)>svg{
  visibility:hidden!important;
}

body[data-scope="app"][data-auth] :is(.tr-step-check,.kyc-step-check) svg{
  width:14px!important;
  height:14px!important;
  stroke-width:1.5!important;
}

body[data-scope="app"][data-auth] :is(.tr-stepper-divider,.kyc-stepper-divider,.tr-step-arrow,.kyc-step-arrow,.conversion-progress__line,.tr-stepper-mobile-status,.kyc-mobile-progress){
  display:none!important;
}

body[data-scope="app"][data-auth] .conversion-progress>.tr-step-item{
  grid-template-columns:22px minmax(0,1fr)!important;
}

body[data-scope="app"][data-auth] .conversion-progress>.tr-step-item>span:first-child{
  display:inline-flex!important;
  width:22px!important;
  height:22px!important;
  align-items:center!important;
  justify-content:center!important;
  color:currentColor!important;
  font-size:9px!important;
}

body[data-scope="app"][data-auth] .conversion-progress>.tr-step-item>span:last-child{
  min-width:0!important;
  color:currentColor!important;
  font-size:10.5px!important;
  white-space:nowrap!important;
}

@media(max-width:700px){
  body[data-scope="app"][data-auth] :is(.tr-stepper-min,.kyc-stepper-min,.conversion-progress){
    min-width:0!important;
    overflow:hidden!important;
  }

  body[data-scope="app"][data-auth] :is(.tr-stepper-row,.kyc-stepper-row,.conversion-progress){
    display:block!important;
    width:100%!important;
    min-width:0!important;
  }

  body[data-scope="app"][data-auth] :is(.tr-step-item,.kyc-step-item),
  body[data-scope="app"][data-auth] .conversion-progress>.tr-step-item{
    display:none!important;
  }

  body[data-scope="app"][data-auth] :is(.tr-step-item,.kyc-step-item).active,
  body[data-scope="app"][data-auth] .conversion-progress>.tr-step-item.active{
    display:grid!important;
    width:100%!important;
    min-width:0!important;
    min-height:58px!important;
    padding-inline:12px!important;
  }
}

/* Registration reuses the mechanics without the authenticated workspace rail. */
body[data-scope="app"]:not([data-auth]) :is(.tr-stepper-min,.kyc-stepper-min){
  overflow:hidden!important;
}

body[data-scope="app"]:not([data-auth]) :is(.tr-stepper-row,.kyc-stepper-row){
  max-width:100%;
}

/* Transfers use one continuous progress rail.  The previous per-item borders
   produced mixed green/blue/grey fragments and stopped at the old 960px cap. */
body[data-scope="app"][data-auth][data-page="transfers"] .tr-stepper-row{
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  isolation:isolate;
}

body[data-scope="app"][data-auth][data-page="transfers"] .tr-stepper-row::before,
body[data-scope="app"][data-auth][data-page="transfers"] .tr-stepper-row::after{
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  height:2px;
  content:"";
  pointer-events:none;
}

body[data-scope="app"][data-auth][data-page="transfers"] .tr-stepper-row::before{
  background:#dce5eb;
}

body[data-scope="app"][data-auth][data-page="transfers"] .tr-stepper-row::after{
  right:auto;
  width:var(--transfer-progress,20%);
  background:#246792;
  transition:width .2s cubic-bezier(.22,1,.36,1);
}

body[data-scope="app"][data-auth][data-page="transfers"] .tr-step-item{
  z-index:1;
  grid-template-columns:22px minmax(0,1fr)!important;
  border-bottom:0!important;
}

body[data-scope="app"][data-auth][data-page="transfers"] .tr-step-icon,
body[data-scope="app"][data-auth][data-page="transfers"] .tr-step-check{
  grid-column:1;
  grid-row:1;
}

body[data-scope="app"][data-auth][data-page="transfers"] .tr-step-copy{
  grid-column:2;
  grid-row:1;
}

body[data-scope="app"][data-auth][data-page="transfers"] .tr-step-check{
  position:static!important;
  width:22px!important;
  height:22px!important;
  transform:none!important;
}

@media(prefers-reduced-motion:reduce){
  body[data-scope="app"][data-auth][data-page="transfers"] .tr-stepper-row::after{
    transition:none;
  }
}
