/* Asking for access: the lock page's door card, with the choice of door and four quiet fields. */
.door-card.access { width: min(480px, 100%); }
.door-card.access form { display: grid; gap: 10px; }
.ac-for { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 4px; }
.ac-for button {
  display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px; border: 0; border-radius: 9px; cursor: pointer;
  font: 500 13.5px/1 var(--body); letter-spacing: -0.012em; color: var(--grey-2); text-align: left;
  background: var(--crystal); box-shadow: inset 0 1px 0 rgba(243, 234, 214, 0.1), inset 0 0 0 1px rgba(243, 234, 214, 0.08);
  opacity: 0.7; transition: opacity 0.3s var(--ease), box-shadow 0.3s var(--ease), color 0.3s var(--ease);
}
.ac-for button:hover { opacity: 0.95; }
.ac-for button[aria-checked="true"] { opacity: 1; color: var(--text); background: var(--crystal-hi); box-shadow: inset 0 1px 0 rgba(243, 234, 214, 0.28), inset 0 0 0 1px rgba(243, 234, 214, 0.32); }
.ac-for .k { font-size: 11px; letter-spacing: 0.04em; color: rgba(243, 234, 214, 0.36); font-variant-numeric: tabular-nums; }
.ac-for button[aria-checked="true"] .k { color: var(--text); }
.ac-have {
  display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-radius: 9px;
  font: 500 13px/1 var(--body); color: var(--text); background: rgba(243, 234, 214, 0.05); box-shadow: inset 0 0 0 1px rgba(243, 234, 214, 0.1);
  transition: background-color 0.3s var(--ease);
}
.ac-have:hover { background: rgba(243, 234, 214, 0.09); }
.ac-have .mu { color: var(--grey); font-weight: 400; }
.ac-have svg { margin-left: auto; }
.ac-have[hidden] { display: none; }
.ac-trap { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.ac-fine { margin: 0; font-size: 12px; color: var(--grey); }
.door-card.access .msg { margin: 0; min-height: 1.2em; font-size: 13px; }
.ac-send { background: none; border: 0; padding: 0; cursor: pointer; font: 500 13px/1 var(--body); color: var(--text); }
.ac-go { border: 0; cursor: pointer; }
.ac-done { display: grid; gap: 10px; }
.ac-done[hidden] { display: none; }
.ac-done-t { margin: 0; font: 500 28px/1.1 var(--display); letter-spacing: -0.03em; color: var(--text); }

/* the lock page's way to ask */
.ask-link { margin-top: -10px; font-size: 13px; color: var(--grey); }
.ask-link span { color: var(--text); font-weight: 500; }
.ask-link:hover span { text-decoration: underline; text-underline-offset: 3px; }