.board-headline {
  font-family: var(--font-serif);
  font-variation-settings: 'opsz' 34;
  font-weight: var(--weight-semibold);
  letter-spacing: -0.01em;
  line-height: 1.18;
  color: var(--text-primary);
}
.board-headline a { color: inherit; text-decoration: none; }
.board-headline a:hover { color: var(--accent-primary); }

.board-index {
  width: 100%;
  max-width: var(--board-measure, var(--content-max-width));
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.board-index__masthead {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding-bottom: var(--space-5);
}
.board-index__title {
  font-family: var(--font-serif);
  font-variation-settings: 'opsz' 44;
  font-weight: var(--weight-bold);
  font-size: var(--text-4xl);
  letter-spacing: var(--tracking-tight);
  line-height: 1.1;
  color: var(--text-primary);
}
.board-index__sub { font-size: var(--text-sm); color: var(--text-secondary); }
.board-index__meta {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-top: var(--space-2);
}
.board-eyebrow {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  color: var(--text-tertiary);
  padding: var(--space-5) 0 var(--space-3);
}
.board-eyebrow .material-symbols-rounded { font-size: var(--text-base); color: var(--accent-primary); }
.board-index__list { display: flex; flex-direction: column; min-width: 0; }

.board-draft {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-xl);
  background: var(--surface-sunken);
  text-decoration: none;
  color: inherit;
}
.board-draft:hover { border-color: var(--accent-primary); }
.board-draft__icon { color: var(--text-tertiary); display: flex; }
.board-draft__label { font-size: var(--text-xs); color: var(--text-tertiary); }
.board-draft__title {
  font-family: var(--font-serif);
  font-variation-settings: 'opsz' 20;
  font-weight: var(--weight-semibold);
  font-size: var(--text-base);
  color: var(--text-secondary);
  font-style: italic;
}

.board-index__door { margin-left: auto; }
.board-index[data-style="journal"] .board-index__door { margin-left: 0; }

.board-index__topics {
  flex-wrap: wrap;
  margin-bottom: var(--space-4);
}
.board-index[data-style="journal"] .board-index__topics { justify-content: center; }

.board-entry {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
}

.board-entry__headline a::after {
  content: "";
  position: absolute;
  inset: 0;
}

.board-entry__headline a:focus-visible { outline: none; }
.board-entry:has(.board-entry__headline a:focus-visible) {
  outline: 2px solid var(--accent-primary);
  outline-offset: 2px;
}
.board-entry__row { display: contents; }
.board-entry__main {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  min-width: 0;
}
.board-entry__kicker {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
}
.board-entry__kicker:empty { display: none; }
.board-entry__excerpt {
  font-size: var(--text-sm);
  line-height: 1.55;
  color: var(--text-secondary);
  margin: 0;
}
.board-entry__byline { display: flex; align-items: center; min-width: 0; }
.board-entry__byline .byline { min-width: 0; }
.board-entry__meta {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
}
.board-entry__stat {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--text-xs);
  color: var(--text-tertiary);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.board-entry__stat .material-symbols-rounded { font-size: var(--text-base); }
.board-entry__spacer { flex: 1; }
.board-entry__cover { display: block; overflow: hidden; text-decoration: none; }
.board-entry__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }

.board-index[data-style="journal"] { --board-measure: var(--content-max-width); }
.board-index[data-style="journal"] .board-index__masthead { align-items: center; text-align: center; padding-bottom: var(--space-6); }

.board-index[data-style="journal"] .board-entry {
  grid-template-columns: minmax(0, 1fr) auto;
  row-gap: var(--space-3);
  padding-block: var(--space-8);
  border-bottom: 1px solid var(--border-strong);
}
.board-index[data-style="journal"] .board-entry__main { grid-column: 1; }
.board-index[data-style="journal"] .board-entry__cover {
  grid-column: 2;
  grid-row: 1;
  width: 96px;
  aspect-ratio: 1;
  border-radius: var(--radius-lg);
  margin-left: var(--space-4);
}
.board-index[data-style="journal"] .board-entry__avatar { display: none; }
.board-index[data-style="journal"] .board-entry__headline { font-size: var(--text-2xl); font-variation-settings: 'opsz' 28; }
.board-index[data-style="journal"] .board-entry__excerpt {
  font-family: var(--font-serif);
  font-variation-settings: 'opsz' 16;
  font-size: var(--text-base);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.board-index[data-style="journal"] .board-entry__meta { grid-column: 1 / -1; justify-content: flex-end; }
.board-index[data-style="journal"] .board-entry__meta .avatar-group { display: none; }
.board-index[data-style="journal"] .board-entry__stat--activity { display: none; }
.board-index[data-style="journal"] .board-entry--pinned {
  background: var(--accent-subtle);
  border-radius: var(--radius-xl);
  border-bottom: none;
  padding-block: var(--space-6);
  padding-inline: var(--space-5);
  margin-bottom: var(--space-2);
}
.board-index[data-style="journal"] .board-entry--pinned .board-entry__cover { display: none; }
.board-index[data-style="journal"] .board-entry--pinned.board-entry--folded { padding-block: var(--space-3); }
.board-index[data-style="journal"] .space-banner {
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--border-strong);
  margin-bottom: var(--space-5);
}
.board-index[data-style="journal"] .space-banner img {
  aspect-ratio: 4 / 1;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border-strong);
}

.board-index[data-style="ledger"] { --board-measure: var(--content-max-width); }

.board-index[data-style="ledger"] .board-entry {
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: var(--space-3);
  align-items: start;
  padding-block: var(--space-4);
  border-bottom: 1px solid var(--border-strong);
}
.board-index[data-style="ledger"] .board-entry__avatar { grid-column: 1; }
.board-index[data-style="ledger"] .board-entry__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: var(--space-4);
  row-gap: var(--space-2);
  grid-column: 2;
  min-width: 0;
  border-left: 1px solid var(--border-strong);
  padding-left: var(--space-3);
}
.board-index[data-style="ledger"] .board-entry__main { flex: 1 1 320px; gap: var(--space-1); }
.board-index[data-style="ledger"] .board-entry__meta { flex: 0 1 auto; margin-left: auto; gap: var(--space-4); }
.board-index[data-style="ledger"] .board-entry__cover { display: none; }
.board-index[data-style="ledger"] .board-entry__headline { font-size: var(--text-xl); font-variation-settings: 'opsz' 24; }
.board-index[data-style="ledger"] .board-entry__excerpt {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.board-index[data-style="ledger"] .board-entry__byline .avatar,
.board-index[data-style="ledger"] .board-entry__byline .byline__time { display: none; }
.board-index[data-style="ledger"] .board-entry--unread .board-entry__headline { font-weight: var(--weight-bold); }

.board-index[data-style="ledger"] .board-index__section--pinned .board-index__list {
  background: var(--surface-base);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-xl);
  padding: var(--space-1) var(--space-4);
}
.board-index[data-style="ledger"] .board-index__section--pinned .board-entry { border-bottom: none; }
.board-index[data-style="ledger"] .board-index__section--pinned .board-entry__row { border-left: none; padding-left: 0; }
.board-index[data-style="ledger"] .space-banner {
  margin-bottom: 0;
  border: 1px solid var(--border-subtle);
  border-bottom: none;
  border-radius: var(--radius-xl) var(--radius-xl) 0 0;
}
.board-index[data-style="ledger"] .space-banner img {
  border-radius: calc(var(--radius-xl) - 1px) calc(var(--radius-xl) - 1px) 0 0;
}
.board-index[data-style="ledger"] .space-banner + .board-index__masthead {
  background: var(--surface-base);
  border: 1px solid var(--border-subtle);
  border-top: none;
  border-radius: 0 0 var(--radius-xl) var(--radius-xl);
  padding: var(--space-4);
  margin-bottom: var(--space-5);
}

.board-index[data-style="gazette"] { --board-measure: var(--content-max-width); }

.board-index[data-style="gazette"] .board-index__section:not(.board-index__section--pinned) .board-index__list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(max(280px, (100% - var(--space-4)) / 2), 1fr));
  gap: var(--space-4);
}

.board-index[data-style="gazette"] .board-entry {
  display: flex;
  flex-direction: column;
  background: var(--surface-raised);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--duration-fast) var(--ease-out),
              transform var(--duration-fast) var(--ease-out);
}
.board-index[data-style="gazette"] .board-entry:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }

.board-index[data-style="gazette"] .board-entry__cover {
  aspect-ratio: 16 / 9;
  order: -1;
  border-radius: var(--radius-xl) var(--radius-xl) 0 0;
}
.board-index[data-style="gazette"] .board-entry__avatar { display: none; }
.board-index[data-style="gazette"] .board-entry__main { padding: var(--space-4) var(--space-5) 0; flex: 1; }
.board-index[data-style="gazette"] .board-entry__byline { margin-top: auto; padding-top: var(--space-2); }
.board-index[data-style="gazette"] .board-entry__meta { padding: var(--space-2) var(--space-5) var(--space-4); justify-content: flex-end; }
.board-index[data-style="gazette"] .board-entry__meta .avatar-group,
.board-index[data-style="gazette"] .board-entry__stat--activity { display: none; }
.board-index[data-style="gazette"] .board-entry__headline { font-size: var(--text-xl); font-variation-settings: 'opsz' 26; }
.board-index[data-style="gazette"] .board-entry__excerpt {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.board-index[data-style="gazette"] .board-entry--text .board-entry__headline {
  font-size: var(--text-2xl);
  font-variation-settings: 'opsz' 30;
}
.board-index[data-style="gazette"] .board-entry--text .board-entry__main { padding-top: var(--space-5); }

.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) {
  isolation: isolate;
  min-height: 320px;
  justify-content: flex-end;
  border: none;
  border-radius: var(--radius-2xl);
  box-shadow: var(--shadow-md);
}
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__cover {
  position: absolute;
  inset: 0;
  z-index: -1;
  order: 0;
  aspect-ratio: auto;
  display: block;
}
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--scrim-media);
}
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__main {
  padding: var(--space-6) var(--space-5) var(--space-2);
}
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__meta {
  padding: 0 var(--space-5) var(--space-5);
  justify-content: flex-start;
}
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__excerpt { display: none; }
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__headline {
  font-size: var(--text-3xl);
  font-variation-settings: 'opsz' 54;
  color: var(--ink-on-media);
}
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__headline a { color: var(--ink-on-media); }
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .pin-flag { color: var(--ink-on-media); }
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .badge {
  color: var(--ink-on-media);
  border-color: var(--ink-on-media-faint);
  background: transparent;
}
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .byline__name { color: var(--ink-on-media); }
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .byline__time { color: var(--ink-on-media-soft); }
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__stat { color: var(--ink-on-media-soft); }
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__meta .avatar-group { display: flex; }
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded) .board-entry__meta .avatar-group .avatar { border-color: transparent; }
.board-index[data-style="gazette"] .board-entry--pinned:not(.board-entry--folded):hover { transform: none; }
.board-index .board-entry--folded :is(.board-entry__excerpt, .board-entry__meta, .board-entry__cover) { display: none; }
.board-index .board-entry.board-entry--folded .board-entry__headline {
  font-size: var(--text-lg);
  font-variation-settings: 'opsz' 20;
}
.board-index[data-style="gazette"] .board-entry--folded .board-entry__main { padding-block: var(--space-3); }
.board-index[data-style="gazette"] .space-banner { margin-bottom: var(--space-6); }
.board-index[data-style="gazette"] .space-banner img {
  aspect-ratio: 16 / 4;
  border-radius: var(--radius-xl);
}

.board-article {
  width: 100%;
  max-width: var(--content-max-width);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.board-article__kicker {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding-bottom: var(--space-4);
}
.board-article__headline {
  font-family: var(--font-serif);
  font-variation-settings: 'opsz' 44;
  font-weight: var(--weight-semibold);
  font-size: var(--text-4xl);
  letter-spacing: var(--tracking-tight);
  line-height: 1.12;
  color: var(--text-primary);
  margin: 0 0 var(--space-4);
}
.board-article__byline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-3);
  padding-bottom: var(--space-5);
}
.board-article__byline-meta {
  margin-left: auto;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--space-2);
}
.board-article__cover {
  border-radius: var(--radius-xl);
  overflow: hidden;
  margin-bottom: var(--space-6);
}
.board-article__cover img { width: 100%; height: auto; display: block; }

.board-article__prose {
  max-width: none;
  font-family: var(--font-serif);
  font-variation-settings: 'opsz' 18;
  font-size: var(--text-lg);
  line-height: 1.68;
  color: var(--text-primary);
}
.board-article__prose p + p { margin-top: var(--space-5); }
.board-article__prose blockquote { margin: var(--space-5) 0; }
.board-article__prose a { text-underline-offset: 3px; }
.board-article__attachments {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-top: var(--space-6);
}
.board-article__foot {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: wrap;
  margin-top: var(--space-6);
  padding-top: var(--space-4);
  border-top: 1px solid var(--border-strong);
}

.board-article .thread-earlier::before,
.board-article .thread-earlier::after { background: var(--border-strong); }
.board-article {
  --thread-rule: var(--border-strong);
  --thread-ground: var(--surface-sunken);
}
.board-article__comments {
  margin-top: var(--space-8);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}
.board-article__comments-head {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
}
.board-article__comments-title {
  font-family: var(--soul-font-display);
  font-size: var(--text-lg);
  font-weight: var(--weight-semibold);
  color: var(--text-primary);
}
.board-article__comments-count { font-size: var(--text-sm); color: var(--text-tertiary); }

.board-back {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  align-self: flex-start;
  font-size: var(--text-sm);
  color: var(--text-secondary);
  text-decoration: none;
  margin-bottom: var(--space-4);
}
.board-back:hover { color: var(--accent-primary); }
.board-back .material-symbols-rounded { font-size: var(--text-lg); }
