.realm .site-header nav a {
 white-space: nowrap;
}
@media (min-width: 721px) {
 .realm .site-header .nav {
  gap: 16px;
 }
 .realm .site-header nav {
  flex-wrap: wrap;
  justify-content: flex-end;
 }
}
.realm .support-line-page {
 max-width: 680px;
 margin: 0 auto 32px;
 padding: 32px 24px;
 text-align: center;
}
.realm .support-line-page h1 {
 margin: 0 0 16px;
 line-height: 1.5;
}
.realm .support-line-id {
 margin: 0 0 20px;
 color: #dbc59a;
 font-size: 20px;
}
.realm .support-line-id strong {
 color: #f0dfb8;
 letter-spacing: 1px;
}
.realm .support-line-qr {
 display: block;
 width: fit-content;
 max-width: 100%;
 margin: 0 auto 20px;
 padding: 12px;
 border: 1px solid #d8d3c8;
 background: #fff;
 box-sizing: border-box;
}
.realm .support-line-qr img {
 display: block;
 width: 300px;
 max-width: 100%;
 height: auto;
}
.realm .support-line-instruction {
 margin: 0 0 20px;
 color: #cec3af;
 font-size: 15px;
}
.realm .support-line-friend {
 max-width: 100%;
 box-sizing: border-box;
 white-space: normal;
 text-align: center;
}
@media (max-width: 560px) {
 .realm .support-line-page {
  padding: 24px 16px;
 }
 .realm .support-line-page h1 {
  font-size: 27px;
 }
 .realm .support-line-qr {
  padding: 10px;
 }
 .realm .support-line-qr img {
  width: 240px;
 }
 .realm .support-line-id {
  font-size: 18px;
 }
}