.txwf-open{
  margin-left:6px!important;
}

.txwf-mini{
  display:flex;
  gap:3px;
  margin-top:7px;
  flex-wrap:wrap;
}

.txwf-dot{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:19px;
  height:19px;
  border-radius:50%;
  border:1px solid #425463;
  font-size:11px;
  background:#07131c;
  color:#8193a1;
}

.txwf-dot.completed{
  border-color:#2fa56e;
  color:#69efaa;
}

.txwf-dot.active{
  border-color:#d2a33b;
  color:#ffd66a;
}

.txwf-dot.failed{
  border-color:#c94e5d;
  color:#ff7180;
}

.txwf-dialog{
  width:min(850px,94vw);
  max-height:88vh;
  padding:0;
  border:1px solid #284c61;
  border-radius:12px;
  background:#07131c;
  color:#eef8ff;
}

.txwf-dialog::backdrop{
  background:rgba(0,0,0,.72);
}

.txwf-head{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:22px;
  border-bottom:1px solid #203d4d;
}

.txwf-head h3{
  margin:5px 0;
}

.txwf-head p,
.txwf-head small{
  color:#8fa7b5;
  margin:0;
}

.txwf-progress{
  padding:12px 22px;
  color:#72dba6;
  border-bottom:1px solid #17313f;
  font-weight:700;
}

.txwf-list{
  padding:12px 22px;
}

.txwf-step{
  display:grid;
  grid-template-columns:42px 1fr 45px auto auto;
  align-items:center;
  gap:10px;
  padding:11px 8px;
  border-bottom:1px solid #152c39;
}

.txwf-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:8px;
  border:1px solid #355464;
  background:#091c27;
  font-size:18px;
}

.txwf-step-main{
  display:flex;
  flex-direction:column;
}

.txwf-step-main small{
  color:#819aa8;
  margin-top:3px;
}

.txwf-step.completed .txwf-icon,
.txwf-step.completed .txwf-state{
  color:#63e5a2;
  border-color:#25875d;
}

.txwf-state{
  font-size:22px;
  text-align:center;
}

.txwf-current,
.txwf-system{
  font-size:10px;
  letter-spacing:.8px;
  padding:4px 7px;
  border-radius:10px;
  border:1px solid #3b5968;
  color:#9eb7c5;
}

.txwf-current{
  border-color:#ad8a32;
  color:#ffd66b;
}

.txwf-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 22px;
  border-top:1px solid #203d4d;
}

.txwf-footer small{
  display:block;
  color:#839aa8;
}

.txwf-footer .ready{
  color:#62e6a2;
}

.txwf-footer .locked{
  color:#e0b75d;
}

.txwf-note{
  margin:0;
  padding:0 22px 20px;
  color:#8195a2;
  font-size:11px;
}

@media(max-width:700px){
  .txwf-step{
    grid-template-columns:38px 1fr 35px;
  }

  .txwf-step button,
  .txwf-current,
  .txwf-system{
    grid-column:2/-1;
    width:max-content;
  }
}

.txwf-fields{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:7px;
  margin-top:10px;
}

.txwf-field{
  padding:7px 9px;
  border:1px solid #264757;
  border-radius:6px;
  background:#081c27;
  min-width:0;
}

.txwf-field small{
  display:block;
  color:#7893a3;
  font-size:9px;
  letter-spacing:.6px;
  margin-bottom:3px;
}

.txwf-field b{
  display:block;
  color:#e9f7ff;
  font-size:11px;
  overflow-wrap:anywhere;
}

.txwf-validation-info{
  margin-top:9px;
  padding:8px 10px;
  border:1px solid #294b5d;
  border-radius:6px;
  background:#081c27;
  color:#89a7b8;
  font-size:11px;
  line-height:1.45;
}

.txwf-note-input{
  display:block;
  width:min(520px,100%);
  box-sizing:border-box;
  margin-top:9px;
  padding:8px 10px;
  border:1px solid #36586a;
  border-radius:6px;
  background:#06141d;
  color:#eefaff;
}

.txwf-action{
  white-space:nowrap;
}

@media(max-width:700px){
  .txwf-fields{
    grid-template-columns:1fr;
  }
}
