/* 保険。style.css・flow.css・fm.css の上に重ねる（接頭辞 in-） */
.in-lab { margin: 10px 0 6px; font-size: 12px; font-weight: 700; color: var(--muted); }
.in-lab:first-child { margin-top: 0; }
.in-small { margin: 8px 0 0; font-size: 12.5px; color: var(--ink2); }
.in-k { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--muted); }
.in-judge { margin: 8px 0 0; font-size: 13px; font-weight: 700; border-radius: 8px; padding: 7px 10px; }
.in-judge.mid { background: #fffbeb; color: #78350f; }
.in-why { margin: 6px 0 0; padding-left: 1.2em; font-size: 12.5px; color: var(--ink2); display: grid; gap: 3px; }
.in-why.soft { color: var(--muted); }
.in-big { margin: 0 0 6px; font-size: 22px; font-weight: 700; }
.in-big.ok { color: #15803d; }
.in-big.ng { color: #b91c1c; }

/* 申込みから支払いまで */
.in-flow { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 14px; align-items: start; }
.in-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.in-step { appearance: none; width: 100%; display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; align-items: center; text-align: left; font: inherit; color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: 8px 12px; cursor: pointer; }
.in-step:hover { border-color: #94a3b8; }
.in-step.on { border-color: #0d9488; background: #f0fdfa; }
.in-sn { width: 26px; height: 26px; border-radius: 50%; background: var(--line2); color: var(--ink2); font: 600 12.5px/26px var(--latin); text-align: center; display: inline-block; flex: none; }
.in-step.on .in-sn, .in-k .in-sn { background: #0d9488; color: #fff; }
.in-st { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; min-width: 0; }
.in-st b { font-size: 14px; }
.in-st small { font-size: 12px; color: var(--muted); }
.in-panel { padding: 14px 16px; min-width: 0; position: sticky; top: 12px; }
.in-panel h3 { margin: 6px 0 6px; font-size: 17px; }
.in-dl { margin: 6px 0 0; display: grid; grid-template-columns: 7.5em minmax(0, 1fr); gap: 6px 12px; font-size: 13.5px; }
.in-dl dt { font-size: 12px; font-weight: 700; color: var(--muted); padding-top: 2px; }
.in-dl dd { margin: 0; color: var(--ink2); }
.in-nav { display: flex; gap: 6px; margin-top: 12px; }
.in-nav button { appearance: none; font: inherit; font-size: 12.5px; font-weight: 700; color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: 999px; padding: 5px 13px; cursor: pointer; }
.in-nav button[disabled] { color: #94a3b8; cursor: default; }

/* 入力と結果の 2 列 */
.in-cool, .in-prem, .in-age, .in-law { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 12px; align-items: start; margin-top: 10px; }
.in-prem { margin-bottom: 12px; }
.in-coolin, .in-coolout, .in-premin, .in-premout, .in-agein, .in-ageout, .in-lawin, .in-lawout { padding: 12px 14px; min-width: 0; }
.in-coolout p, .in-lawout p { font-size: 13.5px; color: var(--ink2); margin: 0 0 6px; }
.in-inputs { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px 12px; align-items: end; margin-top: 4px; }
.in-inputs label { display: grid; gap: 3px; font-size: 12px; font-weight: 700; color: var(--muted); min-width: 0; }
.in-inputs input { font: inherit; font-size: 15px; font-weight: 500; color: var(--ink); background: #f8fafc; border: 1px solid #cbd5e1; border-radius: 9px; padding: 6px 9px; min-width: 0; width: 100%; }

/* 保険料 */
.in-ptbl th { white-space: nowrap; }
.in-ptbl td.n { font-family: var(--latin); }
.in-ltbl thead th { white-space: nowrap; }
.fm-table td.n { text-align: right; }
.in-ptbl tr.sum th, .in-ptbl tr.sum td { border-top: 2px solid var(--line); }
.in-ptbl tr.sum b { color: #1d4ed8; font-size: 16px; }
.in-bars { display: grid; gap: 5px; }
.in-barrow { display: grid; grid-template-columns: 6.5em minmax(0, 1fr) 4.5em; gap: 8px; align-items: center; font-size: 12.5px; color: var(--ink2); }
.in-barrow.on { font-weight: 700; color: var(--ink); }
.in-barlab, .in-barval { font-family: var(--latin); }
.in-barval { text-align: right; }
.in-bar { height: 12px; border-radius: 6px; background: var(--line2); overflow: hidden; }
.in-bar i { display: block; height: 100%; background: #94a3b8; border-radius: 6px; }
.in-barrow.on .in-bar i { background: #0d9488; }

/* 年齢 */
.in-atbl td, .in-atbl th { font-size: 12.5px; }
.in-ages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.in-ages > div { border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.in-ages small { font-size: 11.5px; font-weight: 700; color: var(--muted); }
.in-ages b { font: 700 22px var(--latin); color: var(--ink); }
.in-ages span { font-size: 11.5px; color: var(--ink2); }
.in-ages .key { background: #eff6ff; border-color: #bfdbfe; }
.in-ages .key b { color: #1d4ed8; }
.in-ages .key.b { background: #f0fdfa; border-color: #99f6e4; }
.in-ages .key.b b { color: #0f766e; }
.in-grace { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.in-sel { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; }
.in-sel select { font: inherit; font-size: 13.5px; border: 1px solid var(--line); border-radius: 8px; padding: 5px 8px; background: var(--paper); color: var(--ink); }
.in-graceout { margin: 0; font-size: 13.5px; color: var(--ink2); flex: 1 1 320px; }
.in-graceout .srcl { display: block; margin-top: 4px; }

/* 法律の改正 */
.in-ltbl th small, .in-atbl th small { display: block; font-size: 11px; font-weight: 500; color: var(--muted); }
.in-ltbl tr.yes td b { color: #15803d; }
.in-ltbl tr.no td b { color: #b91c1c; }
.in-ltbl td { white-space: nowrap; }
.in-more { margin-top: 10px; border-top: 1px dashed var(--line); padding-top: 8px; }
.in-more p { margin: 0 0 6px; font-size: 12.5px; color: var(--ink2); }
.in-more b { display: block; font-size: 12.5px; color: var(--ink); }

.in-tbl dl { margin: 6px 0 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 3px 10px; font-size: 12.5px; }
.in-tbl dt { font-family: var(--latin); font-weight: 600; font-size: 12px; color: var(--ink); overflow-wrap: anywhere; }
.in-tbl dd { margin: 0; color: var(--ink2); }

.in-step:focus-visible, .in-nav button:focus-visible, .in-inputs input:focus-visible, .in-sel select:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; }

@media (max-width: 1100px) {
  .in-flow, .in-cool, .in-prem, .in-age, .in-law { grid-template-columns: minmax(0, 1fr); }
  .in-panel { position: static; }
}
@media (max-width: 760px) {
  .in-dl { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .in-dl dd { margin-bottom: 6px; }
  .in-ages { grid-template-columns: minmax(0, 1fr); }
  .in-atbl th, .in-atbl td { padding: 6px 5px; font-size: 12px; }
  .in-tbl dl { grid-template-columns: minmax(0, 1fr); }
}