/* ベース */
body {
  font-family: system-ui, -apple-system, "Helvetica Neue", "Segoe UI", Roboto, "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  line-height: 1.6;
  margin: 0;
  padding: 1rem;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  color: #222;
}
header { border-bottom: 1px solid #eee; padding-bottom: 0.5rem; margin-bottom: 1rem; }
h1 { margin: 0; }
a { color: #0366d6; text-decoration: none; }

/* 汎用：section 内の h2/h3 の下に細いボーダーを引く（シンプル） */
section :is(h2) {
  padding-bottom: 0.35rem;       /* 見出しと線の余白（微調整可） */
  margin-bottom: 1rem;           /* 線と本文の間隔 */
  border-bottom: 3px solid rgb(0, 0, 0);
}

/* 擬似要素で線の表示を細かく制御したい場合 */
/* section :is(h1, h2, h3) {
  position: relative;
  padding-bottom: 0.25rem;
  margin-bottom: 1rem;
}
section :is(h1, h2, h3)::after {
  content: "";
  display: block;
  height: 1px;                    
  width: 100%;                    
  margin-top: 0.6rem;             
  background: var(--divider, #e6e6e6);
} */

/* セクション間の余白調整（必要なら調整） */
section { margin-bottom: 1.25rem; }

/* Recent activities list: collapsed/expanded */
.recent-activities {
  margin: 2rem 0;
}

/* 見出しパターンがある場合はそのまま利用 */
.section-title-with-divider {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.section-title-with-divider > span {
  margin: 0;
  font-weight: 600;
}
.section-title-with-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--divider, #ddd);
}

/* リスト */
.recent-list {
  list-style: disc outside;
  padding-left: 1.25rem;
  margin: 0.75rem 0 1rem 0;
}
.recent-list li {
  padding: 0.45rem 0;
  border-bottom: 1px dashed rgba(0,0,0,0.05);
  color: var(--text, #333);
  font-size: 0.98rem;
}

/* collapsed クラスが付いていると6件目以降を非表示にする（data-show の値に合わせて JS が制御） */
.recent-list.collapsed li {
  display: none;
}
.recent-list.collapsed li:nth-child(-n+5) {
  display: list-item;
}

/* トグルボタン */
.recent-toggle {
  display: inline-block;
  background: transparent;
  border: 1px solid rgba(0,0,0,0.08);
  padding: 0.45rem 0.75rem;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.95rem;
  color: var(--muted, #333);
}
.recent-toggle:hover,
.recent-toggle:focus {
  background: rgba(0,0,0,0.02);
  outline: none;
}

/* small screens: 少しコンパクトに */
@media (max-width: 480px) {
  .recent-list li {
    font-size: 0.95rem;
  }
  .recent-toggle {
    padding: 0.4rem 0.6rem;
  }
}

.pinned {
  background-color: #feffac;
  padding: 8px;
  margin-bottom: 10px;
  border-radius: 4px;
}
