/* ===== 共通 ===== */

body {
  font-family: system-ui, sans-serif;
  background: #fafafa;
  max-width: 650px; 
  margin: 0 auto;
  box-shadow: 0 0 6px rgba(0,0,0,0.08);
}
   
.logo-area  {
  text-align: center; /* 要素の中身を中央揃えにする */
}
.post-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 12px;
}

.face-icon {
  width: 56px;
  height: 56px; 
}

.post-body {
  padding: 18px 20px;
  border-radius: 10px;
  line-height: 1.9;
  margin-bottom: 12px;
}

.post-body p {
  margin: 0 0 0.8em;
}

.post-body p:last-child {
  margin-bottom: 0;
}

/* 空行対策 */
.post-body p:empty {
  display: none;
}

.date {
  color: #777;
  font-size: 1.2em;
  margin-left: 5px;
}

/* 戻るリンク */
a {
  text-decoration: none;
  color: #5a2ca0;
}

/* ===== 顔キャラ別 ===== */

/* 普通 */
.face-neutral h1 { color: #333; }
.face-neutral .post-body {
  background: #f5f5f5;
  border: 2px solid #baa5a5;
}

/* 嬉しい */
.face-happy h1 { color: #d26a00; }
.face-happy .post-body {
  background: #fff4e3;
  border: 2px solid #f5af2c;
}

/* 考え中 */
.face-thinking h1 { color: #003366; }
.face-thinking .post-body {
  background: #eef4ff;
  border: 2px solid #82a0e2;
}

/* 怒り */
.face-angry h1 { color: #b00020; }
.face-angry .post-body {
  background: #fff0f0;
  border: 2px solid #c64c4c;
}

/* 泣き */
.face-crying h1 { color: #375a7f; }
.face-crying .post-body {
  background: #d5f1d0;
  border: 2px solid #28df08;
}

/* 笑い */
.face-laugh h1 { color: #b85c00; }
.face-laugh .post-body {
  background: #fff6d8;
  border: 2px solid #d8b057;
}

/* 困り */
.face-trouble h1 { color: #6a5acd; }
.face-trouble .post-body {
  background: #f2efff;
  border: 2px solid #615c9e;
}

/* 驚き */
.face-surprise h1 { color: #00695c; }
.face-surprise .post-body {
  background: #e0f2f1;
  border: 2px solid #45cfc1;
}