/* A section the header bar names and nothing has designed yet.
 *
 * The rule this file exists to keep, from docs/design-language.md,
 * "The list page":
 *
 *   "The empty page keeps its frame and says what is missing in one
 *    quiet italic line."
 *
 * So: the same paper, the same bar, the same measure. One heading, one
 * italic line, one way back. Nothing else, because there is nothing
 * else to say honestly.
 *
 * No hex values. Every colour comes from theme-quiet-editorial.css.
 */

.frame.empty {
  width: 934px;
  max-width: 100%;
  margin: 0 auto;
  padding: 90px 32px 120px;
  text-align: center;
}

.frame.empty h1 {
  font-family: var(--wc-serif);
  font-size: 48px;
  font-weight: 400;
  line-height: 1.1;
  color: var(--wc-ink);
  margin: 0;
}

/* The one quiet italic line. It is the whole content of the page. */
.frame.empty .missing {
  font-family: var(--wc-serif);
  font-style: italic;
  font-size: 19px;
  color: var(--wc-muted);
  margin: 18px 0 0;
}

.frame.empty .wayout {
  font-family: var(--wc-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  margin: 40px 0 0;
}

.frame.empty .wayout a {
  color: var(--wc-accent);
  text-decoration: none;
}

.frame.empty .wayout a:hover { color: var(--qe-accent-deep); }
.frame.empty .wayout a:focus-visible { outline: 2px solid var(--wc-accent); outline-offset: 4px; }