/* First-use hints. Namespace an-; colours come from the Paper / Night tokens. */

/* The avatar menu lives in adsngin.css. */

/* A small card in the corner: it never pushes the page down, and it goes with one press. */
.an-hint { position: fixed; right: 20px; bottom: 20px; z-index: 80; width: 320px; max-width: calc(100vw - 24px); padding: 14px 16px; background: var(--an-card); color: var(--an-ink); border: 1px solid var(--an-line); border-radius: 14px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25); font: 14px/1.45 var(--an-font); }
.an-hint[hidden] { display: none; }
.an-hint:focus { outline: none; }
.an-hint b { display: block; font-size: 15px; margin-bottom: 4px; }
.an-hint p { margin: 0 0 10px; color: var(--an-ink); }
@media (max-width: 640px) {
  /* above the phone tab bar */
  .an-hint { left: 12px; right: 12px; width: auto; bottom: 92px; }
}