/* The help page (/help), on top of auth.css: example prompts as the log's own pastel boxes. */
.help h3 { font-size: 16px; line-height: 1.3; margin: 20px 0 6px; }
.help h2 { scroll-margin-top: 16px; }
.toc { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 8px; }
.toc a {
  display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border: 1px solid var(--line);
  border-radius: 999px; font-size: 15px; text-decoration: none; color: var(--ink);
}
/* What you'd type or say: the log's pastel note box, so it looks like what lands on the page. */
.prompt {
  background: var(--p1); border-radius: 12px; padding: 10px 14px; margin: 0 0 12px;
  overflow-wrap: anywhere;
}
.help ul.how { list-style: none; padding-left: 0; }
ul.how li { margin-bottom: 12px; }
ul.how .prompt { margin: 6px 0 0; }
/* v8: prompts copy on a tap (help.js). */
.prompt { cursor: pointer; position: relative; padding-right: 64px; }
.prompt::after {
  content: "Copy"; position: absolute; right: 12px; top: 10px; font-size: 13px; font-weight: 600; color: var(--accent);
}
.prompt.copied::after { content: "Copied"; }
.copied-status { position: sticky; top: 8px; min-height: 0; margin: 0; font-size: 15px; color: var(--accent); }