/* =========================================================
   トップページ「みんなの作品」の表示（読むための表示だけ）
   ========================================================= */

/* まだ作品がないとき */
.posted-empty {
  margin: 4px 0;
  padding: 18px 20px;
  font-family: var(--serif);
  font-size: .92rem;
  line-height: 1.9;
  color: var(--muted);
  text-align: center;
  background: color-mix(in srgb, var(--accent-soft) 25%, var(--panel));
  border: 1px dashed var(--border);
  border-radius: 10px;
}

/* 表紙・状態・あらすじ・タグ */
.posted-intro {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin: 6px 0 18px;
}

.posted-cover {
  width: 96px;
  aspect-ratio: 3 / 4;
  flex-shrink: 0;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--border);
  box-shadow: var(--shadow-1);
}

.posted-intro__text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.posted-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.posted-badge {
  padding: 2px 10px;
  font-size: .75rem;
  color: #274e78;
  background: #e2eaf4;
  border-radius: 999px;
}

.posted-badge--soft { color: #4f4a43; background: #efece7; }
.posted-badge--r15 { color: #7a2e2e; background: #f6e4e1; }

.posted-intro__summary {
  margin: 0;
  font-family: var(--serif);
  font-size: .95rem;
  line-height: 1.9;
  color: var(--text);
  white-space: pre-line;
}

.posted-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  font-size: .82rem;
  color: var(--accent);
}

@media (max-width: 560px) {
  .posted-cover { width: 80px; }
}