/* ===== マイクラ風記事デザイン テスト ===== */

.mcat-wrap {
  background: #f0f7ea;
  min-height: 100vh;
  padding: 24px 0 60px;
}
.mcat-container {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 20px;
}

/* パンくず */
.mcat-breadcrumb {
  font-size: 0.8rem;
  color: #888;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.mcat-breadcrumb a { color: #3a7d1e; text-decoration: none; }

/* レイアウト */
.mcat-layout {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 32px;
  align-items: start;
}
@media (max-width: 760px) {
  .mcat-layout { grid-template-columns: 1fr; }
  .mcat-sidebar { order: -1; }
}

/* ===== メイン記事 ===== */
.mcat-article {
  background: #fff;
  border-radius: 12px;
  border: 3px solid #5b8a2e;
  box-shadow: 4px 4px 0 #b8d98a;
  padding: 32px;
}

/* カテゴリバッジ */
.mcat-cat-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #1a73c8;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 4px;
  border: 2px solid #1256a0;
  margin-bottom: 12px;
}
.mcat-cat-badge__icon {
  width: 18px;
  height: 18px;
  object-fit: contain;
  image-rendering: pixelated;
}

/* タイトル */
.mcat-title {
  font-size: clamp(1.2rem, 3vw, 1.6rem);
  font-weight: 900;
  line-height: 1.4;
  color: #1a1a1a;
  margin: 0 0 16px;
  border-left: 5px solid #5b8a2e;
  padding-left: 12px;
}

/* メタ */
.mcat-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 2px dashed #c8e6a0;
  font-size: 0.85rem;
  color: #555;
}
.mcat-meta__item {
  display: flex;
  align-items: center;
  gap: 4px;
}
.mcat-meta__icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  image-rendering: pixelated;
}
.mcat-meta__icon--empty { opacity: 0.2; }
.mc-pixel-num {
  display: inline-flex;
  align-items: center;
}
.mcat-meta__readmin-label { font-size: 0.8rem; }

/* アイキャッチダミー */
.mcat-thumb { margin-bottom: 24px; }
.mcat-thumb__dummy {
  background: #e8f5d8;
  border: 2px dashed #5b8a2e;
  border-radius: 8px;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #5b8a2e;
  font-size: 1rem;
  font-weight: 700;
}

/* ===== 本文 ===== */
.mcat-content { line-height: 1.8; }

.mcat-lead {
  font-size: 1rem;
  background: #f0f7e8;
  border-left: 4px solid #5b8a2e;
  padding: 16px 20px;
  border-radius: 0 8px 8px 0;
  margin: 0 0 24px;
  color: #333;
}

/* H2 */
.mcat-h2 {
  font-size: 1.15rem;
  font-weight: 900;
  color: #1a1a1a;
  padding: 10px 16px;
  border-radius: 6px;
  margin: 32px 0 16px;
  border-left: 5px solid #5b8a2e;
  background: #f0f7e8;
}

.mcat-text {
  font-size: 0.95rem;
  color: #333;
  margin: 0 0 16px;
}

/* ポイント・Tipsボックス */
.mcat-box {
  border-radius: 8px;
  margin: 20px 0;
  overflow: hidden;
  border: 2px solid #5b8a2e;
}
.mcat-box__label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  font-size: 0.85rem;
  font-weight: 900;
  color: #fff;
  background: #5b8a2e;
}
.mcat-box__icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  image-rendering: pixelated;
}
.mcat-box__text {
  padding: 12px 16px;
  font-size: 0.92rem;
  margin: 0;
  line-height: 1.7;
  background: #f0f7e8;
  color: #2a4a10;
}

.mcat-box--tip { border-color: #1a73c8; }
.mcat-box--tip .mcat-box__label { background: #1a73c8; }
.mcat-box--tip .mcat-box__text  { background: #eaf4ff; color: #0d3d6e; }

/* 防具リスト */
.mcat-armor-list {
  background: #f0f7e8;
  border-radius: 8px;
  padding: 20px;
  margin: 20px 0;
  border: 2px solid #5b8a2e;
  box-shadow: 3px 3px 0 #b8d98a;
}
.mcat-armor-list__icons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 12px;
}
.mcat-armor-list__icons img {
  width: 48px;
  height: 48px;
  object-fit: contain;
  image-rendering: pixelated;
  background: #fff;
  border-radius: 6px;
  padding: 6px;
  border: 2px solid #5b8a2e;
}
.mcat-armor-list__arrow { color: #5b8a2e; font-size: 1.2rem; font-weight: 900; }
.mcat-armor-list__text {
  color: #444;
  font-size: 0.85rem;
  text-align: center;
  margin: 0;
}

/* ===== サイドバー ===== */
.mcat-widget {
  background: #fff;
  border-radius: 10px;
  border: 2px solid #5b8a2e;
  box-shadow: 3px 3px 0 #b8d98a;
  overflow: hidden;
  margin-bottom: 20px;
}
.mcat-widget__head {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #5b8a2e;
  color: #fff;
  font-size: 0.9rem;
  font-weight: 700;
  padding: 10px 14px;
}
.mcat-widget__icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  image-rendering: pixelated;
}

/* 目次 */
.mcat-toc {
  padding: 16px 16px 16px 36px;
  margin: 0;
}
.mcat-toc li {
  font-size: 0.88rem;
  margin-bottom: 8px;
}
.mcat-toc a {
  color: #1a73c8;
  text-decoration: none;
  line-height: 1.5;
}
.mcat-toc a:hover { text-decoration: underline; }

/* 装備グリッド */
.mcat-equip-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  padding: 12px;
  background: #f0f7e8;
}
.mcat-equip-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  background: #fff;
  border-radius: 6px;
  padding: 12px 8px;
  border: 2px solid #c8e6a0;
}
.mcat-equip-item img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  image-rendering: pixelated;
}
.mcat-equip-item span {
  font-size: 0.72rem;
  color: #555;
  text-align: center;
  font-weight: 700;
}