/* Kaname「お金の道具箱」専用スタイル（.kt-calc スコープ）。
 * 上質ポップ：白地＋青/コーラル/イエロー/ミント/ピンク・丸太見出し・チャンキー角丸。
 * 色やトークンは kaname.css / kaname_pop.css の --kt-* / --ktp-* を再利用。
 * 既存CSS（kaname.css / kaname_pop.css）は編集しない。ここで上書き/追加のみ。
 */

.kt-pop .kt-calc { padding-bottom: 56px; }

/* ---- ヒーロー --------------------------------------------------------- */
.kt-pop .kt-calc-stickers {
  margin-bottom: 14px;
  gap: 8px;
}
/* 390px幅でも3つのステッカーが1個だけ折り返さないよう、少しだけ詰める。 */
.kt-pop .kt-calc-stickers .kt-sticker {
  font-size: 11.5px;
  padding: 6px 11px;
  letter-spacing: .02em;
}

.kt-pop .kt-calc-hero {
  text-align: center;
  margin: 4px auto 22px;
}
.kt-pop .kt-calc-kicker { margin-bottom: 14px; }
.kt-pop .kt-calc-title {
  font-size: 32px;
  margin: 6px 0 12px;
  text-wrap: balance;
  word-break: keep-all;
  line-break: strict;
}
@media (max-width: 380px) {
  .kt-pop .kt-calc-title { font-size: 28px; }
}
.kt-pop .kt-calc-lead {
  max-width: 30em;
  margin: 0 auto;
  text-wrap: pretty;
  word-break: normal;
  line-break: strict;
}

/* 注意書き（法務・非断定）。やわらかいミントの面に。 */
.kt-pop .kt-calc-disclaimer {
  margin: 16px auto 0;
  max-width: 32em;
  font-size: 13px;
  line-height: 1.8;
  color: var(--ktp-ink-soft);
  background: var(--ktp-mint-bg);
  border: 1.5px solid #BCEFE5;
  border-radius: 18px;
  padding: 12px 16px;
  text-align: left;
}
.kt-pop .kt-calc-disclaimer strong { color: var(--ktp-mint-d); }
.kt-pop .kt-calc-disclaimer--small {
  font-size: 12px;
  background: #F6F8FB;
  border-color: var(--kt-line);
  color: var(--ktp-ink-soft);
}

/* ---- 道具箱ハブ（ジャンプチップ・スティッキー目次） ------------------ */
.kt-pop .kt-tool-hub {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  justify-content: flex-start;
  gap: 8px;
  margin: 0 -16px 26px;
  padding: 10px 16px;
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(1.2) blur(6px);
  -webkit-backdrop-filter: saturate(1.2) blur(6px);
  border-bottom: 1.5px solid var(--kt-line);
  scrollbar-width: none;
}
.kt-pop .kt-tool-hub::-webkit-scrollbar { display: none; }
.kt-pop .kt-tool-hub .kt-tool-chip {
  flex: 0 0 auto;
  scroll-snap-align: start;
}
/* スクロール先頭で見出しが隠れないよう、各カードのアンカー余白を確保 */
.kt-pop .kt-tool-card { scroll-margin-top: 68px; }
.kt-pop .kt-tool-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 14px;
  text-decoration: none;
  padding: 10px 18px;
  border-radius: 999px;
  border: 2px solid transparent;
  transition: transform .18s var(--ktp-bounce-s), box-shadow .2s var(--ktp-ease);
}
.kt-pop .kt-tool-chip:active { transform: scale(.95); }
.kt-pop .kt-tool-chip--coral  { background: var(--ktp-coral-bg);  color: var(--ktp-coral-d);  border-color: #FFC9B8; }
.kt-pop .kt-tool-chip--mint   { background: var(--ktp-mint-bg);   color: var(--ktp-mint-d);   border-color: #BCEFE5; }
.kt-pop .kt-tool-chip--indigo { background: var(--ktp-indigo-bg); color: var(--ktp-indigo-d); border-color: #BBD2FF; }
.kt-pop .kt-tool-chip--sun    { background: var(--ktp-sun-bg);    color: var(--ktp-sun-d);    border-color: #FFE49B; }
.kt-pop .kt-tool-chip--pink   { background: var(--ktp-pink-bg);   color: var(--ktp-pink-d);   border-color: #FFC4E0; }

/* ---- 5分類・絵文字サムネカード目次（視覚化ダイエットV1-c・2026-07-22） ------
   削る/貯める/増やす/守る/使う。挿絵は illus_tools_<cat>.webp（実在ガード）／
   無ければ絵文字だけで成立＝画像の有無でレイアウトが壊れない。色トークンは
   既存 --ktp-* を再利用（kaname_pop.css本体は無変更）。390px幅で2列を維持。 */
.kt-pop .kt-cat-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 10px;
  margin: 4px 0 22px;
}
.kt-pop .kt-cat-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  text-align: center;
  text-decoration: none;
  padding: 12px 8px 10px;
  border-radius: 20px;
  border: 2px solid transparent;
  box-sizing: border-box;
  min-height: 44px;
  transition: transform .18s var(--ktp-bounce-s), box-shadow .2s var(--ktp-ease);
}
.kt-pop .kt-cat-card:active { transform: scale(.96); }
.kt-pop .kt-cat-card-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
}
.kt-pop .kt-cat-card-thumb img { width: 48px; height: 48px; border-radius: 14px; object-fit: cover; }
.kt-pop .kt-cat-card-emoji { font-size: 26px; line-height: 1; }
.kt-pop .kt-cat-card-label {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 14px;
}
.kt-pop .kt-cat-card-desc {
  font-size: 10.5px;
  line-height: 1.3;
  opacity: .72;
}
.kt-pop .kt-cat-card--coral  { background: var(--ktp-coral-bg);  color: var(--ktp-coral-d);  border-color: #FFC9B8; }
.kt-pop .kt-cat-card--mint   { background: var(--ktp-mint-bg);   color: var(--ktp-mint-d);   border-color: #BCEFE5; }
.kt-pop .kt-cat-card--indigo { background: var(--ktp-indigo-bg); color: var(--ktp-indigo-d); border-color: #BBD2FF; }
.kt-pop .kt-cat-card--sun    { background: var(--ktp-sun-bg);    color: var(--ktp-sun-d);    border-color: #FFE49B; }
.kt-pop .kt-cat-card--pink   { background: var(--ktp-pink-bg);   color: var(--ktp-pink-d);   border-color: #FFC4E0; }

@media (max-width: 380px) {
  .kt-pop .kt-cat-nav { grid-template-columns: repeat(3, 1fr); }
}

/* ---- ツールカード ---------------------------------------------------- */
.kt-pop .kt-tool-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.kt-pop .kt-tool-card {
  position: relative;
  background: #fff;
  border: 2.5px solid var(--kt-line);
  border-radius: 28px;
  padding: 22px 20px 20px;
  box-shadow: 0 14px 34px rgba(43,108,246,.10);
  scroll-margin-top: 16px;
}
/* 上辺に色帯（道具ごとのテーマ色） */
.kt-pop .kt-tool-card::before {
  content: "";
  position: absolute;
  left: 18px; right: 18px; top: -1px;
  height: 6px;
  border-radius: 0 0 8px 8px;
}
.kt-pop .kt-tool-card--coral::before  { background: var(--ktp-coral); }
.kt-pop .kt-tool-card--mint::before   { background: var(--ktp-mint); }
.kt-pop .kt-tool-card--indigo::before { background: var(--ktp-indigo); }
.kt-pop .kt-tool-card--sun::before    { background: var(--ktp-sun); }
.kt-pop .kt-tool-card--pink::before   { background: var(--ktp-pink); }

.kt-pop .kt-tool-no {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .12em;
  color: var(--ktp-ink-soft);
  margin: 4px 0 2px;
}
.kt-pop .kt-tool-title {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 22px;
  line-height: 1.35;
  color: var(--ktp-ink);
  word-break: keep-all;
  overflow-wrap: break-word;
  text-wrap: pretty;
  line-break: strict;
  margin: 0 0 6px;
}
.kt-pop .kt-tool-sub {
  font-size: 14px;
  line-height: 1.7;
  color: var(--ktp-ink-soft);
  margin: 0 0 16px;
}

/* ---- 入力フィールド -------------------------------------------------- */
.kt-pop .kt-field-grid {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 18px;
}
.kt-pop .kt-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.kt-pop .kt-field-label {
  font-family: var(--kt-display);
  font-weight: 700;
  font-size: 14px;
  color: var(--ktp-ink);
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
}
.kt-pop .kt-field-label small {
  font-weight: 700;
  font-size: 11px;
  color: #fff;
  background: var(--ktp-ink-soft);
  border-radius: 999px;
  padding: 2px 8px;
}
.kt-pop .kt-field-label strong { color: var(--kt-kicker); }

.kt-pop .kt-input-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}
.kt-pop .kt-num {
  flex: 1 1 auto;
  width: 100%;
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 20px;
  color: var(--ktp-ink);
  background: #F6F8FB;
  border: 2px solid var(--kt-line);
  border-radius: 16px;
  padding: 12px 14px;
  text-align: right;
  -moz-appearance: textfield;
}
.kt-pop .kt-num:focus {
  outline: none;
  border-color: var(--ktp-indigo);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(43,108,246,.14);
}
.kt-pop .kt-num::-webkit-outer-spin-button,
.kt-pop .kt-num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.kt-pop .kt-unit {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 15px;
  color: var(--ktp-ink-soft);
  flex: 0 0 auto;
}

/* スライダー */
.kt-pop .kt-field--slider { gap: 4px; }
.kt-pop .kt-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--ktp-indigo-bg), var(--ktp-indigo));
  outline: none;
  margin: 8px 0 2px;
}
.kt-pop .kt-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: #fff;
  border: 4px solid var(--ktp-indigo);
  box-shadow: 0 4px 10px rgba(43,108,246,.35);
  cursor: pointer;
}
.kt-pop .kt-range::-moz-range-thumb {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: #fff;
  border: 4px solid var(--ktp-indigo);
  box-shadow: 0 4px 10px rgba(43,108,246,.35);
  cursor: pointer;
}
.kt-pop .kt-range-scale {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  font-weight: 700;
  color: var(--ktp-ink-soft);
}
.kt-pop .kt-range-scale i { font-style: normal; }

/* ---- 結果ブロック ---------------------------------------------------- */
.kt-pop .kt-result {
  border-radius: 22px;
  padding: 18px 18px 16px;
  text-align: center;
  background: #F6F8FB;
  border: 2px dashed var(--kt-line);
}
.kt-pop .kt-result-cap {
  font-family: var(--kt-display);
  font-weight: 700;
  font-size: 13px;
  color: var(--ktp-ink-soft);
  margin: 0 0 6px;
}
.kt-pop .kt-result-big {
  font-family: var(--kt-display);
  font-weight: 800;
  line-height: 1.2;
  margin: 0;
}
.kt-pop .kt-big-yen {
  display: block;
  font-size: 34px;
  word-break: break-word;
}
@media (max-width: 380px) {
  .kt-pop .kt-big-yen { font-size: 30px; }
}
.kt-pop .kt-big-man {
  display: block;
  font-size: 16px;
  margin-top: 2px;
  opacity: .85;
}
.kt-pop .kt-result-sub {
  font-size: 13px;
  font-weight: 700;
  color: var(--ktp-ink-soft);
  margin: 8px 0 0;
}
.kt-pop .kt-result-sub span { color: var(--ktp-ink); }

/* 結果のテーマ色（大きな数字に色を載せる＝肝） */
.kt-pop .kt-result--coral  { background: var(--ktp-coral-bg);  border-color: #FFC9B8; }
.kt-pop .kt-result--coral  .kt-result-big { color: var(--ktp-coral-d); }
.kt-pop .kt-result--mint   { background: var(--ktp-mint-bg);   border-color: #BCEFE5; }
.kt-pop .kt-result--mint   .kt-result-big { color: var(--ktp-mint-d); }
.kt-pop .kt-result--indigo { background: var(--ktp-indigo-bg); border-color: #BBD2FF; }
.kt-pop .kt-result--indigo .kt-result-big { color: var(--ktp-indigo-d); }
.kt-pop .kt-result--sun    { background: var(--ktp-sun-bg);    border-color: #FFE49B; }
.kt-pop .kt-result--sun    .kt-result-big { color: var(--ktp-sun-d); }
.kt-pop .kt-result--pink   { background: var(--ktp-pink-bg);   border-color: #FFC4E0; }
.kt-pop .kt-result--pink   .kt-result-big { color: var(--ktp-pink-d); }

/* ---- 横棒グラフ ------------------------------------------------------ */
.kt-pop .kt-result-bars {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}
.kt-pop .kt-bar {
  display: grid;
  grid-template-columns: 4.5em 1fr auto;
  align-items: center;
  gap: 8px;
}
.kt-pop .kt-bar-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--ktp-ink-soft);
}
.kt-pop .kt-bar-track {
  height: 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.7);
  box-shadow: inset 0 0 0 1px var(--kt-line);
  overflow: hidden;
}
.kt-pop .kt-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  transition: width .35s var(--ktp-ease);
}
.kt-pop .kt-bar-fill--coral  { background: var(--ktp-coral); }
.kt-pop .kt-bar-fill--mint   { background: var(--ktp-mint); }
.kt-pop .kt-bar-fill--indigo { background: var(--ktp-indigo); }
.kt-pop .kt-bar-fill--sun    { background: var(--ktp-sun); }
.kt-pop .kt-bar-fill--pink   { background: var(--ktp-pink); }
.kt-pop .kt-bar-val {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 12px;
  color: var(--ktp-ink);
  white-space: nowrap;
}

/* 積み上げバー（つみたて：元本＋ふえた分） */
.kt-pop .kt-result-bars--stack { display: block; }
.kt-pop .kt-stack {
  display: flex;
  height: 20px;
  border-radius: 999px;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px var(--kt-line);
}
.kt-pop .kt-stack-seg { height: 100%; transition: width .35s var(--ktp-ease); }
.kt-pop .kt-stack-seg--base { background: var(--ktp-indigo); }
.kt-pop .kt-stack-seg--gain { background: var(--ktp-sun); }
.kt-pop .kt-stack-legend {
  display: flex;
  gap: 16px;
  justify-content: center;
  margin-top: 10px;
  font-size: 12px;
  font-weight: 700;
  color: var(--ktp-ink-soft);
}
.kt-pop .kt-dot {
  display: inline-block;
  width: 11px; height: 11px;
  border-radius: 50%;
  margin-right: 5px;
  vertical-align: -1px;
}
.kt-pop .kt-dot--base { background: var(--ktp-indigo); }
.kt-pop .kt-dot--gain { background: var(--ktp-sun); }

/* ---- 3つの箱 -------------------------------------------------------- */
.kt-pop .kt-box-row {
  display: flex;
  gap: 10px;
  margin-top: 6px;
}
.kt-pop .kt-box {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  background: #fff;
  border: 2px solid var(--kt-line);
  border-radius: 18px;
  padding: 14px 6px 12px;
}
.kt-pop .kt-box-emoji { font-size: 24px; line-height: 1; }
.kt-pop .kt-box-name {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 13px;
  color: var(--ktp-ink);
}
.kt-pop .kt-box-pct {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 12px;
  color: var(--ktp-ink-soft);
}
.kt-pop .kt-box-amt {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 14px;
  margin-top: 2px;
  letter-spacing: -.02em;
  word-break: break-all;
}
.kt-pop .kt-box--live { border-color: #BBD2FF; }
.kt-pop .kt-box--live .kt-box-amt { color: var(--ktp-indigo-d); }
.kt-pop .kt-box--fun  { border-color: #FFC9B8; }
.kt-pop .kt-box--fun  .kt-box-amt { color: var(--ktp-coral-d); }
.kt-pop .kt-box--save { border-color: #BCEFE5; }
.kt-pop .kt-box--save .kt-box-amt { color: var(--ktp-mint-d); }

/* ---- ツール注記（法務・非断定） ------------------------------------- */
.kt-pop .kt-tool-note {
  font-size: 12px;
  line-height: 1.75;
  color: var(--ktp-ink-soft);
  margin: 12px 2px 0;
}
.kt-pop .kt-tool-note strong { color: var(--ktp-ink); }
.kt-pop .kt-tool-note--strong {
  background: var(--ktp-sun-bg);
  border: 1.5px solid #FFE49B;
  border-radius: 16px;
  padding: 11px 14px;
  color: #6b5400;
}
.kt-pop .kt-tool-note--strong strong { color: var(--ktp-sun-d); }

/* ---- 「見つけたお金に追加」ボタン ----------------------------------- */
.kt-pop .kt-found {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.kt-pop .kt-found-btn {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 15px;
  line-height: 1.3;
  color: #fff;
  background: var(--ktp-indigo);
  border: 2px solid var(--ktp-indigo-d);
  border-radius: 999px;
  padding: 12px 22px;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(43,108,246,.28);
  transition: transform .18s var(--ktp-bounce-s), box-shadow .2s var(--ktp-ease),
              background-color .2s var(--ktp-ease), opacity .2s var(--ktp-ease);
}
.kt-pop .kt-found-btn:hover { box-shadow: 0 10px 24px rgba(43,108,246,.34); }
.kt-pop .kt-found-btn:active { transform: scale(.96); }
.kt-pop .kt-found-btn:disabled {
  cursor: default;
  box-shadow: none;
  transform: none;
}
.kt-pop .kt-found-btn:disabled:not(.kt-found-btn--done) {
  opacity: .5;
  background: var(--ktp-ink-soft);
  border-color: var(--ktp-ink-soft);
}
.kt-pop .kt-found-amt { font-weight: 800; opacity: .92; }

/* 追加済み：落ち着いたミントの確定色＋チェック */
.kt-pop .kt-found-btn--done {
  background: var(--ktp-mint);
  border-color: var(--ktp-mint-d);
  color: #0f5c50;
  opacity: 1;
}

/* 確認・促しメッセージ */
.kt-pop .kt-found-msg {
  margin: 0;
  font-family: var(--kt-display);
  font-weight: 700;
  font-size: 13px;
  line-height: 1.7;
  max-width: 26em;
  text-align: center;
  border-radius: 14px;
  padding: 9px 14px;
}
.kt-pop .kt-found-msg--ok {
  color: #0f5c50;
  background: var(--ktp-mint-bg);
  border: 1.5px solid #BCEFE5;
}
.kt-pop .kt-found-msg--nudge {
  color: var(--ktp-indigo-d);
  background: var(--ktp-indigo-bg);
  border: 1.5px solid #BBD2FF;
}

/* ---- セレクト（ふるさと納税の家族構成） ----------------------------- */
.kt-pop .kt-select {
  text-align: left;
  font-size: 16px;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--ktp-ink-soft) 50%),
                    linear-gradient(135deg, var(--ktp-ink-soft) 50%, transparent 50%);
  background-position: calc(100% - 18px) calc(50% - 2px), calc(100% - 13px) calc(50% - 2px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 36px;
}

/* 文字を大きく出す結果（繰上返済 vs 投資の判定）。 */
.kt-pop .kt-big-text {
  font-size: 24px;
  line-height: 1.3;
  word-break: keep-all;
  overflow-wrap: break-word;
}
@media (max-width: 380px) {
  .kt-pop .kt-big-text { font-size: 21px; }
}

/* ---- 次の一歩（関連レッスンへのリンク） ----------------------------- */
.kt-pop .kt-next {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 14px 2px 0;
}
.kt-pop .kt-next-cap {
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 12px;
  color: var(--ktp-ink-soft);
  flex: 0 0 auto;
}
.kt-pop .kt-next-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-family: var(--kt-display);
  font-weight: 800;
  font-size: 13px;
  text-decoration: none;
  padding: 9px 15px;
  border-radius: 999px;
  border: 2px solid transparent;
  background: #fff;
  transition: transform .16s var(--ktp-bounce-s), box-shadow .2s var(--ktp-ease);
}
.kt-pop .kt-next-link::after { content: " ›"; font-weight: 800; margin-left: 3px; }
.kt-pop .kt-next-link:active { transform: scale(.95); }
.kt-pop .kt-next-link--coral  { color: var(--ktp-coral-d);  border-color: #FFC9B8; background: var(--ktp-coral-bg); }
.kt-pop .kt-next-link--mint   { color: var(--ktp-mint-d);   border-color: #BCEFE5; background: var(--ktp-mint-bg); }
.kt-pop .kt-next-link--indigo { color: var(--ktp-indigo-d); border-color: #BBD2FF; background: var(--ktp-indigo-bg); }
.kt-pop .kt-next-link--sun    { color: var(--ktp-sun-d);    border-color: #FFE49B; background: var(--ktp-sun-bg); }
.kt-pop .kt-next-link--pink   { color: var(--ktp-pink-d);   border-color: #FFC4E0; background: var(--ktp-pink-bg); }
.kt-pop .kt-next-link:hover { box-shadow: 0 6px 16px rgba(43,108,246,.16); }

/* ---- フッター -------------------------------------------------------- */
.kt-pop .kt-calc-foot {
  text-align: center;
  margin-top: 32px;
}
.kt-pop .kt-calc-foot-note {
  font-family: var(--kt-display);
  font-weight: 700;
  font-size: 15px;
  line-height: 1.8;
  color: var(--ktp-ink);
  max-width: 26em;
  margin: 0 auto 14px;
}

/* ---- Wave3 UX簡素化（2026-07-10）：電卓アコーディオン化 --------------------- */
/* 既存 .kt-tool-card の見た目（背景/枠線/角丸/影/色帯）は無変更。<section>→<details>化で
   生まれる summary の既定マーカー（▶/黒三角）だけを消し、開閉chevronを追加する。
   .kt-tool-no/.kt-tool-title は summary の直下へ移設（フォント/色/余白トークンは既存のまま、
   タグだけ p/h2→span。block化して従来どおり縦積みにする）。 */
.kt-pop .kt-tool-card > summary.kt-tool-summary {
  display: block;
  cursor: pointer;
  list-style: none;
  position: relative;
  padding-right: 30px;
}
.kt-pop .kt-tool-card > summary.kt-tool-summary::-webkit-details-marker { display: none; }
.kt-pop .kt-tool-card > summary.kt-tool-summary::marker { content: ""; }
.kt-pop .kt-tool-summary .kt-tool-no,
.kt-pop .kt-tool-summary .kt-tool-title {
  display: block;
}
.kt-pop .kt-tool-chev {
  position: absolute;
  top: 2px;
  right: 0;
  display: inline-block;
  font-size: 16px;
  font-weight: 800;
  color: var(--ktp-ink-soft);
}
/* 開閉の向き替えのみ（アニメーションなし＝prefers-reduced-motion対応を別途考えなくてよい）。 */
.kt-pop .kt-tool-card[open] > summary.kt-tool-summary .kt-tool-chev { transform: rotate(180deg); }
.kt-pop .kt-tool-body { margin-top: 2px; }
/* 【絶対に迷わない・2026-07-10】3分類フォールド（入れ子details・既存カード/summaryの見た目を流用） */
.kt-tool-catfold{ margin:12px 0 0; }
.kt-tool-catfold-sum{ display:flex; align-items:center; gap:8px; }
.kt-tool-catfold-body{ padding:4px 8px 10px; }
.kt-tool-catfold-body .kt-tool-card{ margin:10px 0 0; }