/* SNS_PHASE_8_4_1_BETA_ACCOUNT_FLOW */
.sns-account-action-strip{
  border-bottom:1px solid rgba(255,255,255,.07);
  background:rgba(13,17,22,.96);
}
.sns-account-action-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding-top:12px;
  padding-bottom:12px;
}
.sns-account-action-inner > div{
  display:flex;
  align-items:baseline;
  gap:10px;
  min-width:0;
}
.sns-account-action-inner strong{color:#f3f4f6;}
.sns-account-action-inner small{color:#8e97a4;}

.sns-account-first-hero{padding-bottom:32px;}
.sns-account-first-section{padding-top:30px;}
.sns-account-flow-steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:0 0 18px;
}
.sns-account-flow-step{
  min-height:116px;
  padding:16px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:#151a21;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.sns-account-flow-step span{
  color:#e0ae3e;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.12em;
}
.sns-account-flow-step strong{color:#f4f5f7;font-size:1rem;}
.sns-account-flow-step small{color:#929ba8;line-height:1.45;}
.sns-account-flow-step.active{
  border-color:rgba(224,174,62,.42);
  box-shadow:inset 0 0 0 1px rgba(224,174,62,.08);
}

.sns-account-first-auth{
  margin:0 0 18px;
  padding:20px;
  border:1px solid rgba(255,255,255,.09);
  border-left:3px solid #e0ae3e;
  border-radius:14px;
  background:#171c23;
}
.sns-no-round-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin:0 0 18px;
  padding:18px 20px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:#11161c;
}
.sns-no-round-card h2{margin:.2rem 0 .4rem;}
.sns-no-round-card p{margin:0;color:#9aa3af;max-width:780px;}
.sns-account-security-note{margin-top:0;}

@media (max-width:900px){
  .sns-account-flow-steps{grid-template-columns:repeat(2,minmax(0,1fr));}
  .sns-account-action-inner,
  .sns-no-round-card{align-items:flex-start;flex-direction:column;}
  .sns-account-action-inner > div{align-items:flex-start;flex-direction:column;gap:3px;}
}
@media (max-width:520px){
  .sns-account-flow-steps{grid-template-columns:1fr;}
  .sns-account-action-inner .button,
  .sns-no-round-card .button{width:100%;text-align:center;}
}
