.story-transit-search {
  display: block;
  position: sticky;
  top: 0;
  z-index: 4;
  padding: 0 0 12px;
  background: linear-gradient(180deg, var(--theme-panel, #0d1118) 76%, transparent);
}

.story-transit-search input {
  width: 100%;
  min-height: 46px;
  border: 1px solid rgba(176, 204, 236, 0.2);
  border-radius: 12px;
  padding: 0 15px;
  color: #eef6ff;
  background: rgba(5, 9, 15, 0.88);
  font: inherit;
  outline: none;
}

.story-transit-search input::placeholder {
  color: rgba(210, 226, 245, 0.54);
}

.story-transit-search input:focus {
  border-color: var(--accent-strong, #aed0d1);
  box-shadow: 0 0 0 3px rgba(126, 190, 217, 0.1);
}

/* 5.2.1 gives the story itself a calmer, book-like reading rhythm. */
.saved-story-prose,
.public-story-prose {
  max-width: 44rem;
  font-family: var(--serif);
  font-size: clamp(1.28rem, 1.55vw, 1.48rem);
  font-weight: 400;
  line-height: 1.72;
  letter-spacing: 0.006em;
  font-kerning: normal;
  font-feature-settings: "kern" 1, "liga" 1;
  text-rendering: optimizeLegibility;
}

.saved-story-prose > div > p,
.public-story-prose > p {
  margin: 0 0 1.38em;
  text-wrap: pretty;
}

.saved-story-prose > div:first-child > p:first-child::first-letter,
.public-story-prose > p:first-child::first-letter {
  float: left;
  margin: 0.1em 0.11em 0 0;
  color: var(--accent-strong);
  font-family: var(--serif);
  font-size: 3.35em;
  line-height: 0.72;
}

.public-story-prose > p:first-child::first-letter {
  color: #8e6b3c;
}

.saved-story-reader > section:not(.story-publish-panel),
.saved-story-reader > blockquote,
.public-story-paper > section,
.public-story-paper > blockquote,
.public-story-ornament {
  max-width: 44rem;
  margin-left: auto;
  margin-right: auto;
}

.saved-story-reader > section p,
.public-story-paper > section > p:not(.public-story-kicker),
.public-story-lesson > div > p:not(.public-story-kicker) {
  font-family: var(--sans);
  font-size: 0.98rem;
  line-height: 1.82;
  text-wrap: pretty;
}

.saved-story-reader > blockquote,
.public-story-paper > blockquote {
  text-wrap: balance;
}

.story-publish-panel {
  border-color: rgba(155, 185, 189, 0.3);
  background: linear-gradient(135deg, rgba(155, 185, 189, 0.12), rgba(155, 185, 189, 0.035));
}

.story-publish-panel strong {
  font-size: 0.72rem;
}

.story-publish-panel span {
  max-width: 36rem;
  font-size: 0.64rem;
  line-height: 1.55;
}

.public-story-share small {
  display: block;
  margin-top: 7px;
  color: #8e9ba4;
  font-size: 0.7rem;
  line-height: 1.5;
}

@media (max-width: 640px) {
  .saved-story-prose,
  .public-story-prose {
    font-size: 1.24rem;
    line-height: 1.74;
  }

  .saved-story-prose > div:first-child > p:first-child::first-letter,
  .public-story-prose > p:first-child::first-letter {
    font-size: 3.05em;
  }

  .saved-story-reader > section p,
  .public-story-paper > section > p:not(.public-story-kicker),
  .public-story-lesson > div > p:not(.public-story-kicker) {
    font-size: 0.95rem;
  }
}
