/* とぎれ / さんぽの一歩 — V4.0 新しい4画面（index/today/suggest/go）の見た目。
   依頼書 §22「見た目を作り込みすぎない」: 新しい色トークンは1つも足さない。
   ここに出てくる var(--…) は全部 style.css / ui-v2.css が既に定義している
   ものだけ — scripts/check_contrast.mjs の対象が増えない（新しい組を足して
   いないので、既存の検査がそのままカバーする）。
   レイアウトの土台（.app / header.topbar.topbar-entry / main.entry-main /
   footer.foot.foot-entry / .btn / .btn-primary / .adjacent-link /
   .speed-row / .speed-btn / .candidate-card / .uiv2-checklist / .signpost /
   .pin-row 系）は既存の style.css/ui-v2.css をそのまま使う。 */

/* --- 共通: 準備が整うまで押せない主CTA（<a class="btn"> は native disabled
   を持てないので aria-disabled を見た目にも反映する）-------------------- */
.btn[aria-disabled="true"] { opacity: .45; pointer-events: none; }

/* --- ホーム: 前回の一歩 ----------------------------------------------- */
.v4-praise {
  margin-top: 22px;
  padding: 14px 16px;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}
.v4-praise .v4-praise-h { font-size: 13px; color: var(--text-soft); font-weight: 600; margin: 0 0 6px; }
.v4-praise .v4-praise-line { display: flex; align-items: flex-start; gap: 8px; font-size: 15px; line-height: 1.5; }
.v4-praise .v4-praise-line .ic-wrap { flex: none; color: var(--brand-dark); margin-top: 2px; }

/* --- today.html: 出発地の選択（現在地を使う / 駅をえらぶ）------------- */
.v4-origin-choices {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.v4-origin-choices .speed-btn { min-height: 64px; }
.v4-origin-note { font-size: 13px; color: var(--text-soft); margin: 10px 0 0; }
.v4-origin-minor {
  display: inline-block;
  margin-top: 10px;
  font-size: 13px;
  color: var(--text-soft);
  text-decoration: underline;
  background: none;
  border: none;
  padding: 4px 0;
  cursor: pointer;
  min-height: var(--tap-min);
}
.v4-origin-minor:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/* --- suggest.html: ★カード・ほかの候補 -------------------------------- */
.v4-star-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12.5px;
  font-weight: 800;
  color: var(--brand-dark);
  background: var(--brand-tint);
  border-radius: 999px;
  padding: 3px 10px;
  margin-bottom: 8px;
}
.v4-reason-lines { margin: 8px 0 10px; display: flex; flex-direction: column; gap: 4px; }
.v4-reason-lines p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--text); }
.v4-facts { display: flex; flex-direction: column; gap: 6px; margin: 10px 0; }
.v4-facts .v4-fact-row { display: flex; align-items: center; gap: 8px; font-size: 14.5px; color: var(--text-soft); }
.v4-facts .v4-fact-row .ic-wrap { flex: none; color: var(--brand-dark); }
.v4-facts .v4-fact-row b { color: var(--text); font-weight: 700; font-variant-numeric: tabular-nums; }

.v4-caution {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  background: var(--caution-bg);
  color: var(--caution);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  font-size: 13.5px;
  line-height: 1.5;
  margin: 10px 0;
}
.v4-caution .ic-wrap { flex: none; margin-top: 1px; }

.v4-alt-list { display: flex; flex-direction: column; gap: 10px; margin: 10px 0 16px; }
.v4-alt-list .candidate-card .cname { font-size: 15px; }
.v4-tag-provisional {
  display: inline-block;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--caution);
  background: var(--caution-bg);
  border-radius: 999px;
  padding: 2px 8px;
  margin-left: 6px;
}

/* --- go.html: コース入口まで ------------------------------------------- */
.v4-go-step {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 4px;
}
.v4-go-step .ic-wrap { margin-top: 2px; }
.v4-go-step .ic-wrap { flex: none; color: var(--brand-dark); }
.v4-go-step .v4-go-step-main { font-size: 16px; font-weight: 700; }
.v4-go-step .v4-go-step-sub { font-size: 13px; color: var(--text-faint); margin-top: 2px; }
.v4-go-arrive {
  margin: 18px 0 8px;
  font-size: 17px;
  font-weight: 700;
  text-align: center;
}
.v4-go-estimate-tag {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-faint);
}