.account-protection-badge {
  display: inline-grid;
  width: 1.05rem;
  height: 1.05rem;
  margin-inline-start: .35rem;
  place-items: center;
  vertical-align: middle;
  border: 1px solid #bf923e;
  border-radius: 50%;
  background: #3c301f;
  color: #ffda89;
  font: 700 .72rem/1 system-ui, sans-serif;
  flex: 0 0 auto;
}
.account-verification {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:.55rem .75rem;
  padding:.65rem .75rem;
  border:1px solid color-mix(in srgb, var(--amber) 40%, var(--line));
  border-radius:.6rem;
}
.account-verification p { margin:0; font-size:.86rem }
.account-verification .button { margin:0 }
.account-state:has(.account-verification-badge) { flex-wrap:wrap }
.account-verification-badge { color:var(--amber); font-size:.8em }
.account-protection-info {
  display: grid;
  gap: .4rem;
  margin-block: .8rem;
  padding: .85rem 1rem;
  border: 1px solid #6f5735;
  border-radius: .7rem;
  background: color-mix(in srgb, #b88029 7%, transparent);
}
.account-protection-info h3,
.account-protection-info p { margin: 0; }
.account-protection-info .account-protection-advice { color: #eac783; }
.account-protection-settings {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: end;
  margin-block: .3rem;
}
.account-protection-settings label { display: grid; gap: .3rem; }
.account-protection-settings input[type=number] { width: 9rem; }
.account-protection-settings .account-protection-toggle {
  display: flex;
  align-items: center;
  min-height: 2rem;
}
.account-protection-dialog {
  width: min(440px, calc(100vw - 2rem));
  padding: 1.25rem;
  border: 1px solid #6f5735;
  border-radius: .85rem;
  background: #202a36;
  color: #eef3fa;
  box-shadow: 0 12px 40px #0005;
}
.account-protection-dialog::backdrop { background: #0c121bb3; }
.account-protection-dialog h2 { margin: 0; font-size: 1.25rem; }
.account-protection-dialog-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1.1rem;
}

.account-retirement-list {
  display: grid;
  gap: .4rem;
  margin-block: .65rem 1rem;
}
.account-retirement-list h2 {
  margin: 0 0 .15rem;
  font-size: .95rem;
}
.account-retirement {
  border: 1px solid #714348;
  border-radius: .55rem;
  background: #9c374514;
}
.account-retirement summary {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .6rem .8rem;
  cursor: pointer;
}
.account-retirement summary span {
  color: #ff9299;
  text-decoration: underline;
  text-underline-offset: .18em;
}
.account-retirement p {
  margin: 0;
  padding: 0 .8rem .75rem;
}