/* 半自動 診断ウィジェット（統合仕様書 v1.5 §4.6 デザイン） */
.hd-diagnosis {
  --hd-brand: #9B1111;
  --hd-bg: #FDFDFD;
  --hd-text: #333333;
  --hd-gray: #F3F3F3;
  max-width: 640px;
  margin: 0 auto 2em;
  padding: 24px 16px;
  background: var(--hd-bg);
  color: var(--hd-text);
  font-family: "Noto Sans JP", sans-serif;
  border-radius: 8px;
  box-sizing: border-box;
}
.hd-diagnosis *,
.hd-diagnosis *::before,
.hd-diagnosis *::after { box-sizing: border-box; }

.hd-screen > * + * { margin-top: 16px; }

.hd-title { margin: 0; font-size: 1.4em; line-height: 1.4; }
.hd-catch { font-size: 1.05em; line-height: 1.7; }
.hd-time { color: #666; font-size: .9em; }
.hd-brand {
  padding: 12px 14px;
  background: var(--hd-gray);
  border-left: 3px solid var(--hd-brand);
  font-size: .9em;
  line-height: 1.7;
}

/* ボタン（タップ領域44px以上） */
.hd-btn {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 12px 16px;
  border: 2px solid var(--hd-brand);
  border-radius: 8px;
  background: #fff;
  color: var(--hd-text);
  font: inherit;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  line-height: 1.5;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.hd-btn--primary,
.hd-btn.is-selected { background: var(--hd-brand); color: #fff; }
.hd-btn--primary:hover,
.hd-btn--primary:focus { color: #fff; opacity: .9; }
.hd-choice:hover { background: #fbeeee; }
.hd-choice.is-selected:hover { background: var(--hd-brand); }
.hd-btn:focus-visible { outline: 3px solid rgba(155, 17, 17, .35); outline-offset: 2px; }

/* プログレス */
.hd-progress { display: flex; align-items: center; gap: 12px; }
.hd-progress__count { flex: none; font-weight: 700; font-variant-numeric: tabular-nums; }
.hd-progress__bar { flex: 1; height: 8px; background: var(--hd-gray); border-radius: 4px; overflow: hidden; }
.hd-progress__fill { height: 100%; background: var(--hd-brand); transition: width .2s; }

.hd-q-cat { color: var(--hd-brand); font-size: .85em; font-weight: 700; }
.hd-q-cat + .hd-q-text { margin-top: 4px; }
.hd-q-text { font-size: 1.1em; font-weight: 700; line-height: 1.7; }
.hd-choices > * + * { margin-top: 12px; }

.hd-back {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #666;
  font-size: .9em;
}

/* 結果 */
.hd-result { text-align: left; }
.hd-result__label { color: #666; font-size: .9em; }
.hd-result__level { margin-top: 4px; color: var(--hd-brand); font-size: 2em; font-weight: 700; line-height: 1.3; }
.hd-result__comment { line-height: 1.7; }
.hd-map__title { margin: 24px 0 0; font-size: 1.05em; }
.hd-map { margin: 8px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.hd-map__item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 6px;
  background: var(--hd-gray);
  font-size: .9em;
}
.hd-map__state { font-weight: 700; }
.hd-map__item.is-ok .hd-map__state { color: #2e7d32; }
.hd-map__item.is-check { background: #fbeeee; }
.hd-map__item.is-check .hd-map__state { color: var(--hd-brand); }
.hd-cta__lead { line-height: 1.7; }
.hd-cta > * + * { margin-top: 12px; }

/* ---------- 40問・結果（アドバイス） ---------- */
.hd-cat-title { margin: 8px 0 0; font-size: 1.25em; color: var(--hd-brand); }
.hd-cat-desc { color: #666; font-size: .9em; line-height: 1.7; }
.hd-item { padding: 16px 0; border-top: 1px solid var(--hd-gray); }
.hd-item .hd-q-text { font-size: 1em; }
.hd-item.is-missing { background: #fbeeee; margin: 0 -8px; padding: 16px 8px; border-radius: 6px; }
.hd-choices--row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 10px; }
.hd-choices--row > * + * { margin-top: 0; }
.hd-choices--row .hd-btn { padding: 8px 6px; font-size: .85em; font-weight: 500; }
@media (max-width: 420px) {
  .hd-choices--row { grid-template-columns: 1fr; }
}
.hd-missing { margin: 0; padding: 0; list-style: none; }
.hd-missing li { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 8px 0; border-top: 1px solid var(--hd-gray); font-size: .9em; }
.hd-missing__go { flex: none; min-height: 44px; display: inline-flex; align-items: center; color: var(--hd-brand); font-weight: 700; }
.hd-error { color: var(--hd-brand); font-weight: 700; }
.hd-btn:disabled { opacity: .6; cursor: wait; }

.hd-result__score { color: #666; font-variant-numeric: tabular-nums; }
.hd-result__intro { line-height: 1.7; }
.hd-chart { max-width: 420px; margin: 16px auto 0; }
.hd-section-title { margin: 32px 0 0; font-size: 1.1em; padding-bottom: 6px; border-bottom: 2px solid var(--hd-brand); }
.hd-section-title + * { margin-top: 12px; }
.hd-diff__total { font-weight: 700; font-variant-numeric: tabular-nums; }
.hd-diff__list, .hd-history__list { margin: 8px 0 0; padding: 0; list-style: none; }
.hd-diff__list li, .hd-history__list li { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-top: 1px solid var(--hd-gray); font-size: .9em; }
.hd-diff__val { font-variant-numeric: tabular-nums; }
.hd-diff__list li.is-up .hd-diff__val { color: #2e7d32; font-weight: 700; }
.hd-diff__list li.is-down .hd-diff__val { color: var(--hd-brand); font-weight: 700; }
.hd-priority { margin-top: 0; }
.hd-priority__name { font-size: 1.3em; font-weight: 700; color: var(--hd-brand); }
.hd-priority__desc { color: #666; font-size: .9em; }
.hd-priority__msg { line-height: 1.7; }
.hd-advice__cat { margin: 24px 0 0; font-size: 1em; color: var(--hd-brand); }
.hd-advice__item { margin-top: 12px; padding: 14px; background: #fff; border: 1px solid #e6e6e6; border-radius: 8px; }
.hd-advice__item > * { margin: 0; }
.hd-advice__item > * + * { margin-top: 8px; }
.hd-advice__q { font-weight: 700; line-height: 1.6; }
.hd-advice__answer { color: #666; font-size: .85em; }
.hd-advice__text { line-height: 1.8; }
.hd-advice__step { padding: 8px 12px; background: var(--hd-gray); border-radius: 6px; font-size: .95em; line-height: 1.7; }
.hd-advice__step::before { content: "最初の一歩："; font-weight: 700; color: var(--hd-brand); }
.hd-advice__step.is-partial::before { content: "次に詰めるところ："; }
.hd-advice__links { padding: 0; list-style: none; }
.hd-advice__links li + li { margin-top: 4px; }
.hd-advice__links a { display: inline-flex; align-items: center; min-height: 44px; color: var(--hd-brand); font-weight: 700; }
.hd-share-wrap { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.hd-share { width: auto; display: inline-block; }
.hd-share__note { color: #2e7d32; font-size: .9em; }
.hd-retest { color: #666; font-size: .9em; line-height: 1.7; }
.hd-history__date { color: #666; font-variant-numeric: tabular-nums; }
.hd-history__total { font-variant-numeric: tabular-nums; }
.hd-guest > * + * { margin-top: 12px; }
.hd-guest__sub { font-size: .9em; }
.hd-checkresult__level { color: var(--hd-brand); font-size: 1.3em; font-weight: 700; }
.hd-checkresult .hd-map { margin-top: 12px; }
