.spage__title {
  margin-top:16px;
  font-size:28px;
  line-height:1;
  font-variation-settings:"wght" 700
}
@supports not (font-variation-settings:normal) {
  .spage__title {
    font-weight:700
  }
}
.spage__title br {
  display:none
}
.spage__product {
  margin-top:36px
}
.spage__login {
  margin-top:40px
}
.spage__amount,
.spage__payments,
.spage__region {
  margin-top:20px
}
.spage__banner {
  position:relative;
  display:flex;
  align-items:center;
  margin-bottom:40px;
  padding:30px 40px;
  background:var(--color-block-background);
  border-radius:var(--border-radius);
  cursor:pointer;
  transition:background .25s ease-in-out
}
.spage__banner:hover {
  background:var(--color-block-background-hover)
}
.spage__banner._no-mb {
  margin-bottom:0
}
.spage__banner-icon {
  flex:0 0 auto;
  margin-right:20px;
  font-size:0
}
.spage__banner-icon._emoji span {
  font-size:25px;
  line-height:1
}
.spage__banner-icon img {
  width:25px;
  height:25px
}
.spage__banner-title {
  flex:0 0 180px;
  padding-right:20px;
  font-size:18px;
  line-height:20px;
  font-variation-settings:"wght" 700
}
@supports not (font-variation-settings:normal) {
  .spage__banner-title {
    font-weight:700
  }
}
.spage__banner-description {
  max-width:370px
}
.spage__banner-next {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  width:30px;
  height:30px;
  margin-left:auto;
  font-size:0;
  background:var(--color-background);
  border-radius:50%
}
.spage__banner-next .svg-icon {
  font-size:10px
}
.spage._alt .page-crumbs {
  margin-bottom:20px
}
.spage._alt._nocrumbs {
  margin-top:36px
}
.spage._steam-only .spage__wrapper {
  margin-top:40px;
  padding:32px 40px 40px;
  background:linear-gradient(0deg,var(--color-block-background),var(--color-block-background)),radial-gradient(100% 100% at 0 0,rgba(19,99,150,.2) 0,rgba(19,99,150,0) 100%),radial-gradient(100% 100% at 100% 100%,rgba(7,25,63,.4) 0,rgba(7,25,63,0) 100%);
  border-radius:var(--border-radius)
}
.spage._steam-only._alt .spage__wrapper {
  padding:56px 60px 60px;
  background:linear-gradient(0deg,var(--color-block-background),var(--color-block-background)),radial-gradient(100% 100% at 0 0,rgba(32,127,255,.2) 0,rgba(32,127,255,0) 100%),radial-gradient(100% 100% at 100% 100%,rgba(125,32,255,.2) 0,rgba(125,32,255,0) 100%)
}
@media only screen and (max-width:1440px) {
  .spage__title {
    margin-top:12px;
    font-size:24px
  }
  .spage__product {
    margin-top:20px
  }
  .spage__login {
    margin-top:30px
  }
  .spage__amount,
  .spage__payments,
  .spage__region {
    margin-top:10px
  }
  .spage__banner {
    margin-bottom:30px;
    padding:20px 30px;
    border-radius:var(--border-radius-hd)
  }
  .spage__banner._no-mb {
    margin-bottom:0
  }
  .spage._steam-only .spage__wrapper {
    margin-top:30px;
    padding:26px 30px 30px
  }
  .spage._steam-only._alt .spage__wrapper {
    padding:36px 40px 40px
  }
}
@media only screen and (max-width:768px) {
  .spage._webapp {
    padding-top:22px
  }
  .spage__product {
    margin-top:16px
  }
  .spage__login {
    margin-top:25px
  }
  .spage__title {
    font-size:28px
  }
  .spage__title br {
    display:block
  }
  .spage__amount,
  .spage__region {
    margin-top:15px
  }
  .spage__payments {
    margin-top:20px;
    margin-bottom:20px
  }
  .spage__banner {
    align-items:flex-start;
    flex-wrap:wrap;
    margin-top:-15px
  }
  .spage__banner._no-mb {
    margin-top:0;
    margin-bottom:0
  }
  .spage__banner-title {
    flex:0 1 auto;
    margin-top:4px;
    padding-right:0
  }
  .spage__banner-description {
    flex:0 0 100%;
    max-width:100%;
    margin-top:8px;
    padding-right:50px
  }
  .spage__banner-next {
    position:absolute;
    top:50%;
    right:20px;
    transform:translateY(-50%)
  }
  .spage._steam-only .spage__wrapper {
    margin-left:-20px;
    margin-right:-20px;
    margin-bottom:20px;
    padding:24px 25px 25px
  }
  .spage._steam-only._alt .spage__wrapper {
    margin-bottom:0;
    padding:32px 20px 30px
  }
}
.spage-alt__title {
  font-size:34px;
  line-height:1;
  font-variation-settings:"wght" 700
}
@supports not (font-variation-settings:normal) {
  .spage-alt__title {
    font-weight:700
  }
}
.spage-alt__grid {
  display:flex;
  margin-top:36px
}
.spage-alt__main {
  flex:0 0 calc(100% - 500px)
}
.spage-alt__sidebar {
  flex:0 0 500px;
  padding-left:60px
}
@media only screen and (max-width:1800px) {
  .spage-alt__main {
    flex:0 0 calc(100% - 400px)
  }
  .spage-alt__sidebar {
    flex:0 0 400px;
    padding-left:40px
  }
}
@media only screen and (max-width:1440px) {
  .spage-alt__main {
    flex:0 0 calc(100% - 360px)
  }
  .spage-alt__sidebar {
    flex:0 0 360px;
    padding-left:40px
  }
}
@media only screen and (max-width:1200px) {
  .spage-alt__grid {
    flex-wrap:wrap
  }
  .spage-alt__main {
    flex-basis:100%
  }
  .spage-alt__sidebar {
    flex-basis:100%;
    padding-left:0
  }
}