/*
 * ふるさと納税ページ (guide.css の上に重ねる)
 *   朱 (shu)   : 上限額などのお金の結果と、返礼品を探すボタン(お金につながる行動)
 *   青緑 (teal): 入力・リンクなど操作できる場所
 *   黄 (marker): 表で今見ている年収の行
 */
.fz-year { display: inline-block; font-family: var(--sans); font-size: .42em; font-weight: 700; vertical-align: .35em; padding: 2px 12px; border-radius: 999px; background: var(--shu); color: var(--shu-ink); letter-spacing: .05em; }
.lead b { color: var(--ink); background: linear-gradient(transparent 62%, var(--marker) 62%); }

/* 入力 */
.fz-calc .calc-form { align-items: flex-end; }
.calc-form .fz-income input { width: 6.5em; font-size: 20px; font-weight: 700; }
.fz-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; flex-basis: 100%; }
.fz-row .modes { flex-basis: auto; }
.fz-hint { flex-basis: 100%; margin: 0; }
.fz-more { flex-basis: 100%; border-top: 1px dashed var(--line); padding-top: 10px; }
.fz-more summary { cursor: pointer; font-size: 13.5px; font-weight: 700; color: var(--teal); }
.fz-more-body { display: flex; flex-wrap: wrap; gap: 12px 20px; margin-top: 10px; }
.fz-more-body .inline input { width: 8em; }
.fz-more-body .note { flex-basis: 100%; margin: 0; }

/* 結果 */
.fz-calc .calc-result .big .num { font-size: 1.9em; }
.fz-break { margin: 0 0 6px; }
.fz-break summary { cursor: pointer; font-size: 13.5px; font-weight: 700; color: var(--teal); margin-bottom: 8px; }
table.fz-steps th { white-space: normal; font-size: 13px; color: var(--ink-2); background: none; border-bottom: 1px solid var(--line); padding: 9px 12px; }
table.fz-steps td { white-space: normal; font-size: 13.5px; color: var(--ink-2); }
table.fz-steps td.v, table.fz-fam td.v { text-align: right; white-space: nowrap; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
table.fz-steps tr.hl th, table.fz-steps tr.hl td { background: var(--hl); color: var(--ink); font-weight: 700; }
table.fz-steps tr.hl td.v, table.fz-fam tr.hl td.v { color: var(--shu); font-size: 16px; }
table.fz-fam th { white-space: normal; font-size: 14px; font-weight: 500; color: var(--ink); background: none; border-bottom: 1px solid var(--line); padding: 11px 14px; }
table.fz-fam tr.hl th, table.fz-fam tr.hl td { background: var(--hl); }
table.fz-fam tr:last-child th { border-bottom: 0; }
.fz-result-shop { margin-top: 16px; padding: 14px 16px; background: var(--shu-soft); border-radius: 12px; }
.fz-rs-title { margin: 0 0 8px; font-weight: 700; color: var(--ink); font-size: 14.5px; }
.fz-deadline { margin: 18px 0 0; padding: 12px 16px; background: var(--sheet); border: 1px solid var(--line); border-left: 5px solid var(--shu); border-radius: 10px; font-size: 14.5px; color: var(--ink-2); }
.fz-deadline b { color: var(--ink); }
.fz-deadline .num { font-size: 22px; margin: 0 2px; }

/* 早見表: 年収の列を固定、数字は右寄せ */
.fz-hayami table { min-width: 720px; }
.fz-hayami th { white-space: normal; line-height: 1.4; vertical-align: bottom; }
.fz-hayami td { text-align: right; font-variant-numeric: tabular-nums; }
.fz-hayami tbody th { position: sticky; left: 0; background: var(--sheet); white-space: nowrap; font-size: 13.5px; padding: 9px 12px; border-bottom: 1px solid var(--line); }
.fz-hayami thead th:first-child { position: sticky; left: 0; z-index: 1; }
.fz-hayami tbody tr:nth-child(even) td, .fz-hayami tbody tr:nth-child(even) th { background: var(--tile); }
.fz-hayami tr.hl td, .fz-hayami tr.hl th { background: var(--marker) !important; font-weight: 700; }
.fz-hayami tbody tr:last-child th { border-bottom: 0; }

/* 返礼品を探す: お金につながる行動なので朱 */
.fz-shop { padding: 18px 20px; background: var(--sheet); border: 1px solid var(--line); border-top: 5px solid var(--shu); border-radius: var(--radius); box-shadow: var(--shadow); }
.fz-shop p { margin: 0 0 8px; color: var(--ink-2); }
.fz-shop p b { color: var(--shu); }
.fz-gifts { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; margin: 10px 0; }
.fz-gifts .btn { justify-content: center; background: var(--shu); border-color: var(--shu); color: var(--shu-ink); padding: 11px 8px; box-shadow: 0 2px 0 rgba(120, 30, 10, .18); }
.fz-gifts .btn:hover { filter: brightness(1.08); background: var(--shu); }
.fz-shop-top { font-size: 14px; }

.fz-nenshu { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 0; padding: 0; }
.fz-nenshu a { display: block; padding: 10px 12px; background: var(--sheet); border: 1px solid var(--line); border-radius: 10px; font-weight: 700; text-decoration: none; }
.fz-nenshu a:hover { background: var(--teal-soft); }
.fz-first { margin: -8px 0 18px; font-size: 14.5px; font-weight: 700; }
table.fz-way th, table.fz-way td { white-space: normal; vertical-align: top; }
table.fz-way tbody th { font-size: 13px; color: var(--ink-2); background: var(--tile); white-space: nowrap; }
table.fz-way b { color: var(--shu); }
.fz-src { font-size: 13px; color: var(--ink-2); padding-left: 1.2em; }
.fz-src li { margin: 4px 0; }
.article > .cta-actions { margin: 14px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }

@media (max-width: 640px) {
  .fz-calc .calc-form > label { flex: 1 1 45%; }
  .fz-calc .calc-form > label.fz-income { flex-basis: 100%; }
  .fz-more-body > label { flex: 1 1 100%; }
  .fz-gifts { grid-template-columns: repeat(3, 1fr); }
  table.fz-steps th, table.fz-steps td { padding: 8px 8px; font-size: 12.5px; }
  .calc-result table.fz-steps td:nth-child(2) { display: table-cell; } /* guide.css が2列目を隠すのを戻す */
  .fz-shop { padding: 16px; }
}