@charset "UTF-8";
/* ============================================================================
 *  建設業財務諸表コンバーター  kz.css
 *  すべて .kz 配下に閉じ込め、サイト既存の styles.css と衝突させない。
 * ========================================================================== */

.kz {
  --kz-navy: #09223e;
  --kz-blue: #0b5f9e;
  --kz-green: #187965;
  --kz-teal: #19a7b6;
  --kz-gold: #d8aa43;
  --kz-ink: #172436;
  --kz-mute: #5d6877;
  --kz-pale: #f2f7fa;
  --kz-warm: #fff8e8;
  --kz-line: #dce6ed;
  --kz-red: #a23a35;
  font-family: "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
  color: var(--kz-ink);
  line-height: 1.7;
}
.kz *, .kz *::before, .kz *::after { box-sizing: border-box; }
.kz button, .kz input, .kz select, .kz textarea { font: inherit; color: inherit; }

/* ---- レイアウト ---------------------------------------------------------- */
.kz-shell { max-width: 1180px; margin: 0 auto; }
.kz-bar {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  padding: 14px 18px; background: var(--kz-navy); color: #fff; border-radius: 6px 6px 0 0;
}
.kz-bar h2 { margin: 0; color: #fff; font-size: 1.15rem; }
.kz-badge {
  padding: 3px 10px; border-radius: 999px; background: rgba(255,255,255,.14);
  font-size: .78rem; font-weight: 700; letter-spacing: .04em;
}
.kz-badge.is-internal { background: var(--kz-gold); color: var(--kz-navy); }
.kz-bar-spacer { flex: 1 1 auto; }

/* ---- 基本情報 ------------------------------------------------------------ */
.kz-meta {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px 16px; padding: 18px; border: 1px solid var(--kz-line); border-top: 0; background: #fff;
}
.kz-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.kz-field > label { font-size: .82rem; font-weight: 700; color: var(--kz-navy); }
.kz-field input[type="text"], .kz-field input[type="number"], .kz-field select, .kz-field textarea {
  width: 100%; padding: 8px 10px; border: 1px solid #aab8c4; border-radius: 4px; background: #fff;
}
.kz-field input:focus, .kz-field select:focus, .kz-field textarea:focus {
  outline: 3px solid rgba(25,167,182,.18); border-color: var(--kz-teal);
}
.kz-field small { color: var(--kz-mute); font-size: .78rem; line-height: 1.5; }
.kz-check { display: flex; gap: 7px; align-items: flex-start; font-size: .88rem; }
.kz-check input { margin-top: 5px; }

/* ---- タブ ---------------------------------------------------------------- */
.kz-tabs {
  display: flex; flex-wrap: wrap; gap: 2px; padding: 0 8px;
  border: 1px solid var(--kz-line); border-top: 0; background: var(--kz-pale);
}
.kz-tab {
  padding: 11px 14px; border: 0; border-bottom: 3px solid transparent; background: none;
  color: var(--kz-mute); font-size: .9rem; font-weight: 700; cursor: pointer; white-space: nowrap;
}
.kz-tab:hover { color: var(--kz-navy); }
.kz-tab[aria-selected="true"] { color: var(--kz-navy); border-bottom-color: var(--kz-green); background: #fff; }
.kz-tab .kz-tab-n {
  display: inline-block; min-width: 18px; margin-left: 6px; padding: 0 5px;
  border-radius: 9px; background: var(--kz-red); color: #fff; font-size: .72rem; text-align: center;
}
.kz-panel { padding: 20px 18px; border: 1px solid var(--kz-line); border-top: 0; background: #fff; }
.kz-panel[hidden] { display: none; }
.kz-panel h3 { margin: 0 0 4px; color: var(--kz-navy); font-size: 1.05rem; }
.kz-panel h3 + .kz-note { margin-top: 0; }
.kz-note { margin: 0 0 16px; color: var(--kz-mute); font-size: .87rem; }
.kz-sub { margin: 24px 0 10px; padding-left: 9px; border-left: 4px solid var(--kz-green); font-weight: 700; color: var(--kz-navy); }

/* ---- ボタン -------------------------------------------------------------- */
.kz-btns { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.kz-btn {
  padding: 10px 16px; border: 0; border-radius: 4px; background: var(--kz-green);
  color: #fff; font-weight: 700; font-size: .9rem; cursor: pointer;
}
.kz-btn:hover { background: var(--kz-blue); }
.kz-btn:disabled { background: #b8c4cd; cursor: not-allowed; }
.kz-btn.is-sub { background: #e8eef2; color: var(--kz-navy); }
.kz-btn.is-sub:hover { background: #d5e0e8; }
.kz-btn.is-ghost { background: none; border: 1px solid var(--kz-line); color: var(--kz-navy); }
.kz-btn.is-ghost:hover { background: var(--kz-pale); }

/* ---- 入力表（様式フォーム） ---------------------------------------------- */
.kz-form-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.kz-form-table th, .kz-form-table td { padding: 5px 8px; border-bottom: 1px solid #eef2f5; text-align: left; }
.kz-form-table tr.kz-r-h > th {
  padding: 14px 8px 6px; border-bottom: 2px solid var(--kz-navy);
  color: var(--kz-navy); font-size: 1rem;
}
.kz-form-table tr.kz-r-sh > th { padding-top: 12px; color: var(--kz-navy); font-weight: 700; }
.kz-form-table tr.kz-r-sh2 > th { padding-top: 8px; color: var(--kz-mute); font-weight: 700; font-size: .86rem; }
.kz-form-table tr.kz-r-s { background: #f7fafc; }
.kz-form-table tr.kz-r-g { background: #edf3f7; }
.kz-form-table tr.kz-r-s > th, .kz-form-table tr.kz-r-g > th { font-weight: 700; color: var(--kz-navy); }
.kz-form-table tr.kz-r-memo > th { color: var(--kz-mute); font-size: .86rem; }
.kz-form-table .kz-c-amount { width: 170px; text-align: right; }
.kz-form-table .kz-c-src { width: 108px; color: var(--kz-mute); font-size: .78rem; text-align: right; }
.kz-form-table input.kz-num {
  width: 100%; padding: 5px 8px; border: 1px solid #c3cfd8; border-radius: 3px;
  text-align: right; font-variant-numeric: tabular-nums;
}
.kz-form-table input.kz-num:focus { outline: 2px solid rgba(25,167,182,.22); border-color: var(--kz-teal); }
.kz-form-table input.kz-num.is-edited { border-color: var(--kz-gold); background: #fffdf5; }
.kz-form-table input.kz-num.is-neg-hint { color: var(--kz-red); }
.kz-form-table .kz-calc {
  display: block; padding: 5px 8px; text-align: right; font-weight: 700;
  font-variant-numeric: tabular-nums; color: var(--kz-navy);
}
.kz-form-table .kz-calc.is-minus { color: var(--kz-red); }
.kz-ind-1 { padding-left: 14px !important; }
.kz-ind-2 { padding-left: 30px !important; }
.kz-ind-3 { padding-left: 46px !important; }
.kz-hint { display: block; color: var(--kz-mute); font-size: .76rem; font-weight: 400; }

/* ---- 取込 ---------------------------------------------------------------- */
.kz-paste {
  width: 100%; min-height: 220px; padding: 12px; border: 1px solid #aab8c4; border-radius: 4px;
  font-family: "SFMono-Regular", Consolas, "Courier New", monospace; font-size: .84rem; line-height: 1.6;
  white-space: pre; overflow-wrap: normal; overflow-x: auto;
}
.kz-map-table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.kz-map-table th, .kz-map-table td { padding: 7px 9px; border: 1px solid var(--kz-line); text-align: left; }
.kz-map-table thead th { background: var(--kz-navy); color: #fff; font-size: .82rem; white-space: nowrap; }
.kz-map-table td.kz-num-cell { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kz-map-table select { width: 100%; padding: 4px 6px; border: 1px solid #c3cfd8; border-radius: 3px; font-size: .84rem; }
.kz-map-table tr.is-unmapped { background: #fff5f4; }
.kz-map-table tr.is-manual { background: #fffdf3; }
.kz-tag {
  display: inline-block; padding: 1px 7px; border-radius: 3px;
  font-size: .74rem; font-weight: 700; white-space: nowrap;
}
.kz-tag.t-exact { background: #e4f2ec; color: var(--kz-green); }
.kz-tag.t-rule { background: #e6eef6; color: var(--kz-blue); }
.kz-tag.t-manual { background: #fbf0d8; color: #8a6a1c; }
.kz-tag.t-none { background: #fae2e0; color: var(--kz-red); }
.kz-scroll { max-height: 520px; overflow: auto; border: 1px solid var(--kz-line); }

/* ---- 検算 ---------------------------------------------------------------- */
.kz-issue { padding: 11px 14px; margin-bottom: 8px; border-left: 5px solid; border-radius: 0 4px 4px 0; font-size: .88rem; }
.kz-issue b { display: block; margin-bottom: 2px; }
.kz-issue.l-error { border-color: var(--kz-red); background: #fdf2f1; }
.kz-issue.l-warn { border-color: var(--kz-gold); background: var(--kz-warm); }
.kz-issue.l-info { border-color: var(--kz-blue); background: #eef4fa; }
.kz-issue.l-ok { border-color: var(--kz-green); background: #eef7f3; }
.kz-issue span { color: var(--kz-mute); }

.kz-sticky {
  position: sticky; bottom: 0; z-index: 20;
  display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center;
  padding: 12px 18px; border: 1px solid var(--kz-line); border-top: 2px solid var(--kz-navy);
  background: rgba(255,255,255,.97); backdrop-filter: blur(4px);
  border-radius: 0 0 6px 6px; box-shadow: 0 -6px 18px rgba(9,34,62,.07);
}
.kz-stat { display: flex; flex-direction: column; line-height: 1.35; }
.kz-stat small { color: var(--kz-mute); font-size: .74rem; font-weight: 700; }
.kz-stat b { font-size: 1.02rem; font-variant-numeric: tabular-nums; }
.kz-stat b.is-ng { color: var(--kz-red); }
.kz-stat b.is-ok { color: var(--kz-green); }

/* ---- 変動計算書（マトリクス） -------------------------------------------- */
.kz-matrix-wrap { overflow-x: auto; border: 1px solid var(--kz-line); }
.kz-matrix { border-collapse: collapse; font-size: .82rem; white-space: nowrap; }
.kz-matrix th, .kz-matrix td { padding: 4px 6px; border: 1px solid var(--kz-line); }
.kz-matrix thead th { position: sticky; top: 0; background: var(--kz-pale); font-size: .76rem; }
.kz-matrix tbody th {
  position: sticky; left: 0; z-index: 2; min-width: 230px; max-width: 230px;
  background: #fff; text-align: left; white-space: normal; font-weight: 400;
}
.kz-matrix tr.is-calc { background: #f4f8fb; }
.kz-matrix tr.is-calc th { background: #f4f8fb; font-weight: 700; }
.kz-matrix input { width: 96px; padding: 3px 5px; border: 1px solid #ccd7de; border-radius: 3px; text-align: right; }
.kz-matrix .kz-mcalc { display: block; min-width: 96px; text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---- 明細表 -------------------------------------------------------------- */
.kz-annex-table { width: 100%; border-collapse: collapse; font-size: .87rem; }
.kz-annex-table th, .kz-annex-table td { padding: 5px 8px; border: 1px solid var(--kz-line); }
.kz-annex-table thead th { background: var(--kz-pale); font-size: .82rem; }
.kz-annex-table input { width: 100%; padding: 5px 7px; border: 1px solid #ccd7de; border-radius: 3px; }
.kz-annex-table input.kz-num { text-align: right; }
.kz-annex-table tfoot td { background: #f4f8fb; font-weight: 700; text-align: right; }
.kz-row-del {
  padding: 2px 8px; border: 1px solid var(--kz-line); border-radius: 3px;
  background: #fff; color: var(--kz-red); cursor: pointer; line-height: 1.4;
}

/* ---- 注記表 -------------------------------------------------------------- */
.kz-note-item { margin-bottom: 14px; }
.kz-note-item > label { display: block; margin-bottom: 4px; font-weight: 700; color: var(--kz-navy); font-size: .9rem; }
.kz-note-item textarea {
  width: 100%; min-height: 52px; padding: 8px 10px; border: 1px solid #c3cfd8;
  border-radius: 4px; resize: vertical; font-size: .88rem;
}
.kz-note-item textarea.is-tall { min-height: 110px; }

/* ==========================================================================
 *  プレビュー（提出様式レイアウト）
 * ======================================================================== */
.kz-preview { background: var(--kz-pale); padding: 18px; }
.kz-sheet {
  width: 210mm; min-height: 297mm; margin: 0 auto 18px; padding: 16mm 15mm;
  background: #fff; box-shadow: 0 4px 18px rgba(9,34,62,.14);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "MS PMincho", serif;
  color: #000; font-size: 10.5pt; line-height: 1.55;
}
.kz-sheet-head { margin-bottom: 6mm; }
.kz-sheet-no { font-size: 9pt; }
.kz-sheet h4 { margin: 3mm 0; font-size: 15pt; font-weight: 700; text-align: center; letter-spacing: .3em; }
.kz-sheet-sub { display: flex; justify-content: space-between; font-size: 9.5pt; }
.kz-sheet-sub .kz-unit { text-align: right; }
.kz-sheet table { width: 100%; border-collapse: collapse; font-size: 10pt; }
.kz-sheet table th, .kz-sheet table td { padding: 1.1mm 2mm; vertical-align: bottom; }
.kz-sheet table th { font-weight: 400; text-align: left; }
.kz-sheet .p-amount {
  width: 32mm; text-align: right; font-variant-numeric: tabular-nums;
  border-bottom: 1px dotted #999;
}
.kz-sheet tr.p-h th { padding-top: 3mm; font-weight: 700; border-bottom: 1px solid #000; }
.kz-sheet tr.p-sh th { padding-top: 2mm; font-weight: 700; }
.kz-sheet tr.p-s td.p-amount, .kz-sheet tr.p-s th { border-top: 1px solid #000; font-weight: 700; }
.kz-sheet tr.p-g td.p-amount { border-top: 1px solid #000; border-bottom: 3px double #000; font-weight: 700; }
.kz-sheet tr.p-g th { font-weight: 700; }
.kz-sheet .p-matrix { font-size: 7.4pt; table-layout: fixed; }
.kz-sheet .p-matrix th, .kz-sheet .p-matrix td { border: 1px solid #000; padding: .8mm 1mm; text-align: right; }
.kz-sheet .p-matrix thead th { text-align: center; font-size: 6.8pt; word-break: break-all; }
.kz-sheet .p-matrix tbody th { text-align: left; font-size: 7.4pt; }
.kz-sheet .p-notes dt { margin-top: 3mm; font-weight: 700; }
.kz-sheet .p-notes dd { margin: 0 0 0 4mm; white-space: pre-wrap; }
.kz-sheet .p-sign { margin-top: 8mm; text-align: right; font-size: 10pt; }
.kz-sheet-land { width: 297mm; min-height: 210mm; }

/* ==========================================================================
 *  印刷
 * ======================================================================== */
@media print {
  @page { size: A4 portrait; margin: 0; }
  body { background: #fff !important; }
  body * { visibility: hidden !important; }
  .kz-preview, .kz-preview * { visibility: visible !important; }
  .kz-preview {
    position: absolute; left: 0; top: 0; width: 100%; padding: 0; background: #fff;
  }
  .kz-sheet {
    width: 100%; min-height: auto; margin: 0; padding: 14mm 13mm;
    box-shadow: none; page-break-after: always; break-after: page;
  }
  .kz-sheet:last-child { page-break-after: auto; break-after: auto; }
  .kz-sheet-land { width: 100%; }
  .kz-no-print { display: none !important; }
}

/* ==========================================================================
 *  レスポンシブ
 * ======================================================================== */
@media (max-width: 900px) {
  .kz-sheet { width: 100%; min-height: auto; padding: 20px 16px; }
  .kz-preview { padding: 10px; }
  .kz-form-table .kz-c-src { display: none; }
}
@media (max-width: 640px) {
  .kz-panel { padding: 14px 10px; }
  .kz-form-table { font-size: .84rem; }
  .kz-form-table .kz-c-amount { width: 120px; }
  .kz-tab { padding: 9px 10px; font-size: .82rem; }
  .kz-sticky { gap: 8px 12px; padding: 10px 12px; }
}