/* ===== 数秘術 相性占い ===== */

.nm-phase { display: none; }
.nm-phase.active { display: block; }

/* --- 入力フォーム --- */
.nm-form-block { margin-bottom: 18px; }
.nm-form-block--b {
  padding-top: 18px;
  border-top: 1px dashed #e0ddf8;
}
.nm-form-ttl {
  font-size: 16px;
  font-weight: 700;
  color: #1a1440;
  text-align: center;
  margin-bottom: 14px;
}
.nm-form-block--a .nm-form-ttl::before { content: '👤 '; }
.nm-form-block--b .nm-form-ttl::before { content: '💞 '; }
.nm-form-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
}
.nm-select {
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  color: #1a1440;
  background: #f9f8ff;
  border: 1.5px solid #e0ddf8;
  border-radius: 12px;
  padding: 12px 10px;
  min-width: 78px;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  text-align: center;
  transition: border-color .18s;
}
.nm-select:focus { outline: none; border-color: #7F77DD; }
.nm-unit { font-size: 14px; color: #6b60b0; margin-right: 4px; }

.nm-btn {
  display: block;
  width: 100%;
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  background: #7F77DD;
  border: none;
  border-radius: 14px;
  padding: 17px;
  margin-top: 6px;
  cursor: pointer;
  letter-spacing: .04em;
  box-shadow: 0 4px 16px rgba(127,119,221,.32);
  transition: transform .18s, box-shadow .18s;
}
.nm-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 22px rgba(127,119,221,.42); }

.nm-note {
  font-size: 12px;
  color: #999;
  line-height: 1.8;
  margin-top: 16px;
  padding: 10px 14px;
  background: #f9f8ff;
  border-radius: 10px;
  border-left: 3px solid #AFA9EC;
}

/* --- 鑑定中 --- */
.nm-loading-card { text-align: center; padding: 56px 22px; }
.nm-loading-ring {
  width: 62px;
  height: 62px;
  margin: 0 auto 22px;
  border: 4px solid #e0ddf8;
  border-top-color: #7F77DD;
  border-radius: 50%;
  animation: nmSpin 1s linear infinite;
}
@keyframes nmSpin { to { transform: rotate(360deg); } }
.nm-loading-txt { font-size: 17px; font-weight: 700; color: #534AB7; margin-bottom: 8px; }
.nm-loading-sub { font-size: 13px; color: #999; line-height: 1.7; }

/* --- 2人の運命数 --- */
.nm-pair {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
  background: #1a1440;
  border-radius: 16px;
  padding: 20px 14px;
  margin-bottom: 14px;
}
.nm-person { text-align: center; min-width: 0; }
.nm-person-lbl { font-size: 11px; color: rgba(255,255,255,.6); letter-spacing: .1em; margin-bottom: 6px; }
.nm-person-num {
  font-size: 48px;
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
  font-family: Georgia, 'Times New Roman', serif;
}
.nm-person-num.is-master { color: #FFD76A; }
.nm-person-name { font-size: 13px; font-weight: 700; color: rgba(255,255,255,.9); margin-top: 6px; }
.nm-person-calc {
  font-size: 10px;
  color: rgba(255,255,255,.45);
  margin-top: 6px;
  line-height: 1.5;
  word-break: break-all;
}
.nm-pair-x { font-size: 22px; color: rgba(255,255,255,.5); font-weight: 300; }

.nm-pair + .nm-note { margin: 0 0 16px; }

/* --- 本文の行ブロック（1〜2文ごとに改行して読みやすくする） --- */
.nm-line { display: block; }
.nm-line + .nm-line { margin-top: .85em; }

/* 相性の2枠は本文が長いので、太字をやめて読みやすくする */
.nm-adv .aval { font-size: 13px; font-weight: 400; line-height: 1.85; color: #333; }
.nm-adv .akey { font-size: 11px; color: #7F77DD; font-weight: 700; margin-bottom: 8px; }

/* --- うまくいくコツ --- */
.nm-tip {
  background: #534AB7;
  border-radius: 14px;
  padding: 18px;
  margin-top: 12px;
}
.nm-tip-ttl { font-size: 12px; color: rgba(255,255,255,.7); margin-bottom: 6px; letter-spacing: .08em; }
.nm-tip-body { font-size: 14px; color: #fff; line-height: 1.9; }

/* --- 関係数 --- */
.nm-rel-card {
  background: linear-gradient(135deg, #fdeef4, #f8eefc);
  border-radius: 14px;
  padding: 18px;
}
.nm-rel-ttl { font-size: 15px; font-weight: 700; color: #b0417a; margin-bottom: 8px; line-height: 1.5; }
.nm-rel-body { font-size: 14px; color: #444; line-height: 1.95; }

/* --- 相手に求めるもの --- */
.nm-need {
  font-size: 13px;
  color: #444;
  line-height: 1.85;
  background: #f9f8ff;
  border-radius: 12px;
  padding: 12px 15px;
  margin-top: 12px;
  border-left: 3px solid #7F77DD;
}
.nm-need-key {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: #7F77DD;
  margin-bottom: 4px;
  letter-spacing: .04em;
}

/* --- 今年の流れ --- */
.nm-py { display: flex; flex-direction: column; gap: 8px; }
.nm-py-row {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #f9f8ff;
  border-radius: 12px;
  padding: 12px 15px;
}
.nm-py-who { font-size: 11px; font-weight: 700; color: #7F77DD; width: 42px; flex-shrink: 0; }
.nm-py-num {
  width: 34px;
  height: 34px;
  flex-shrink: 0;
  border-radius: 50%;
  background: #7F77DD;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.nm-py-txt { font-size: 13px; color: #333; line-height: 1.75; flex: 1; }

/* --- 時期 --- */
.nm-timing { display: flex; flex-direction: column; gap: 8px; }
.nm-timing-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: #f9f8ff;
  border-radius: 12px;
  padding: 14px 16px;
  flex-wrap: wrap;
}
.nm-timing-when { font-size: 16px; font-weight: 700; color: #1a1440; }
.nm-timing-rank { font-size: 12px; color: #7F77DD; font-weight: 500; }
.nm-timing-rank.is-best {
  background: #7F77DD;
  color: #fff;
  padding: 4px 12px;
  border-radius: 12px;
  font-weight: 700;
}
.nm-timing-note { font-size: 12px; color: #999; line-height: 1.8; margin-top: 10px; }

/* --- アコーディオン --- */
.nm-acc { margin-top: 22px; }
.nm-acc-btn {
  width: 100%;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  color: #534AB7;
  background: #f9f8ff;
  border: 1.5px solid #e0ddf8;
  border-radius: 12px;
  padding: 15px;
  cursor: pointer;
  transition: background .18s;
}
.nm-acc-btn:hover { background: #eeedfe; }
.nm-acc-body { margin-top: 12px; }
.nm-detail { background: #f9f8ff; border-radius: 12px; padding: 20px 18px; }
.nm-detail-ttl {
  font-size: 13px;
  font-weight: 700;
  color: #7F77DD;
  margin: 18px 0 8px;
  padding-left: 8px;
  border-left: 3px solid #7F77DD;
  letter-spacing: .04em;
}
.nm-detail-ttl:first-child { margin-top: 0; }
.nm-detail-text { font-size: 13px; color: #444; line-height: 2; }
.nm-detail-text + .nm-detail-text { margin-top: .85em; }

@media (max-width: 420px) {
  .nm-select { min-width: 68px; font-size: 15px; padding: 11px 6px; }
  .nm-person-num { font-size: 40px; }
  .nm-pair { padding: 18px 8px; gap: 4px; }
}

/* 相性マーク（◎○△）は文字なので、バナー上で読める色にする */
#numerology-app .res-emoji { color: #FFD76A; font-weight: 700; line-height: 1; }

/* 記事の一番下に置くシェアボタン（.wrap の外なので余白とリンク装飾をここで整える） */
#nm-share-bottom { margin: 28px 0 8px; }
#nm-share-bottom .sbtn, #nm-share-bottom .sbtn:hover { text-decoration: none; color: #fff; }