dialog.auth-dialog {
  color:var(--ink);
  background:var(--panel);
  border:3px solid var(--pink);
  border-radius:16px;
  padding:24px;
  width:min(440px,calc(100% - 28px));
  max-height:90dvh;
  overflow:auto;
  box-shadow:8px 8px 0 #0008
}
dialog.auth-dialog::backdrop {
  background:#000b
}
.auth-dialog h2 {
  color:var(--pink2);
  font-size:25px;
  margin:8px 36px 20px 0
}
.auth-dialog button {
  min-height:44px;
  border-radius:9px;
  padding:11px 14px;
  background:var(--panel2);
  border:2px solid var(--line);
  font-weight:700
}
.auth-dialog button:focus-visible,.auth-dialog input:focus-visible {
  outline:3px solid var(--mint);
  outline-offset:3px
}
.auth-dialog .auth-close {
  position:absolute;
  right:12px;
  top:12px;
  background:transparent;
  font-size:24px;
  line-height:1;
  border:0
}
.auth-methods {
  display:grid;
  gap:10px
}
.auth-dialog .auth-primary {
  background:var(--pink);
  color:#190b19;
  border-color:var(--pink2)
}
.auth-dialog label {
  display:block;
  margin:16px 0 7px;
  font-size:16px
}
.auth-dialog input {
  width:100%;
  padding:12px;
  background:var(--bg);
  color:var(--ink);
  border:2px solid var(--line);
  border-radius:8px;
  font:inherit;
  font-size:16px
}
.auth-dialog form button[type=submit] {
  width:100%;
  margin:20px 0 8px
}
.auth-dialog .auth-link {
  display:block;
  margin:4px auto 0;
  background:transparent;
  border:0;
  color:var(--pink2);
  min-height:36px;
  padding:6px;
  text-decoration:underline
}
.auth-dialog button:disabled {
  opacity:.55;
  cursor:wait
}
.auth-dialog button[aria-disabled=true] {
  opacity:.65
}
.auth-message {
  line-height:1.5;
  font-size:15px;
  overflow-wrap:anywhere
}
.auth-message[data-error=true] {
  color:#ffabc9
}
.auth-help {
  font-size:14px;
  color:var(--muted);
  line-height:1.5
}
.auth-dialog .auth-secondary {
  background:transparent;
  font-size:14px;
  margin-top:8px
}
.auth-build {
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-top:14px
}
.profile-auth-email {
  overflow-wrap:anywhere
}
.auth-profile-avatar {
  width:90px;
  height:90px;
  object-fit:contain
}
.avatar-picker {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
  margin-top:12px
}
.avatar-option {
  padding:3px!important;
  min-height:58px;
  background:#080d16!important;
  border:2px solid var(--line)!important;
  border-radius:9px
}
.avatar-option img {
  display:block;
  width:100%;
  height:54px;
  object-fit:contain
}
.avatar-option.selected {
  border-color:var(--pink)!important;
  background:#2a1628!important;
  box-shadow:0 0 0 2px #ff4fac44
}
.avatar-option:disabled {
  opacity:.55;
  cursor:not-allowed
}
#avatarNotice {
  font-size:14px;
  overflow-wrap:anywhere
}
#nicknameForm {
  margin-top:14px
}
#nicknameNotice {
  font-size:14px;
  overflow-wrap:anywhere
}
#profileNickname {
  overflow-wrap:anywhere
}
#nicknameForm button:disabled {
  opacity:.55;
  cursor:not-allowed
}
#nicknameInput:focus-visible {
  outline:3px solid var(--mint);
  outline-offset:2px
}
#tradeForm {
  margin-top:8px
}
#tradeNotice {
  font-size:14px;
  overflow-wrap:anywhere
}
#tradeForm button:disabled {
  opacity:.55;
  cursor:not-allowed
}
#tradeInput:focus-visible {
  outline:3px solid var(--mint);
  outline-offset:2px
}
[hidden] {
  display:none!important
}