/* Reading pages (privacy policy, support) on top of styles.css. */
.doc {
  width: min(720px, 100%);
  margin: 0 auto;
  padding: 40px 0 72px;
}

.doc h1 {
  max-width: none;
  font-size: clamp(36px, 5vw, 52px);
  letter-spacing: -.05em;
}

.doc .lead {
  margin: 18px 0 8px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.7;
}

.doc .updated {
  margin: 0 0 36px;
  color: var(--muted);
  font: 500 12px/1.5 var(--mono);
  letter-spacing: .04em;
}

.doc h2 {
  margin: 40px 0 10px;
  font-size: 21px;
  font-weight: 600;
  letter-spacing: -.02em;
}

.doc p, .doc li {
  font-size: 16px;
  line-height: 1.7;
}

.doc ul { padding-left: 22px; }
.doc li + li { margin-top: 6px; }

.doc a { color: var(--green-dark); text-underline-offset: 3px; }

.doc .summary {
  margin: 0 0 8px;
  padding: 18px 22px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
}

.doc .summary p { margin: 0; }
.doc .summary p + p { margin-top: 8px; }

.doc details {
  border-bottom: 1px solid var(--line);
  padding: 14px 0;
}

.doc summary {
  cursor: pointer;
  font-size: 17px;
  font-weight: 600;
}

.doc details p { margin: 10px 0 0; }

.doc .contact {
  margin-top: 40px;
  padding: 20px 22px;
  border-radius: 14px;
  background: var(--green-soft);
}

@media (prefers-color-scheme: dark) {
  .doc a { color: var(--green); }
}