/* 資金繰り表（/tools/shikinguri/）。見出し・ボタン・欄の見た目は tool-sheet.css を土台にし、ここでは表と予定の行だけを足す。
   帳簿の罫線と数字の桁で見せる。影・角丸・色の帯は使わない。足りない額だけ朱色にする。 */
.cf-tool{--minus:var(--accent)}
.cf-tool .sheet-head,.cf-tool .sheet-basis{max-width:1180px}
.cf-work{max-width:1180px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:56px;align-items:start;margin-top:44px}
.cf-work h2,.cf-advice>h2{font:600 22px/1.5 var(--serif);color:var(--ink);margin:0}
.cf-write{display:flex;flex-direction:column;gap:22px;min-width:0}
.cf-write .sheet-hint{margin:0}
#cf-sample-note{margin-top:-10px}

.cf-step{font:600 15px/1 var(--serif);color:var(--green);margin-right:.7em}
.cf-tool .cf-now-input{padding-bottom:24px;border-bottom:1px solid var(--ink)}
.cf-now-input legend{font-size:17px}
.cf-base{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 32px}
.cf-base .sheet-cell{flex:0 1 auto}
.cf-base .sheet-cell span{font-size:12px}
.cf-amount-big{gap:8px}
.cf-amount-big>span{font-size:16px;color:var(--ink)}
.cf-base #cf-balance{font:600 34px/1.3 var(--serif);width:5.2em;padding:2px 0 4px}

.cf-group{display:flex;flex-direction:column;gap:10px}
.cf-group legend{font:700 15px/1.6 var(--sans);color:var(--ink);margin-bottom:4px}
.cf-group .sheet-hint{margin-bottom:6px}

/* 予定の1行：名前・日付・金額・印・消す */
.cf-row{display:grid;grid-template-columns:9em minmax(0,1fr) auto;grid-template-areas:"label label amount" "date flags del";gap:0 14px;align-items:center;padding:6px 0 4px;border-bottom:1px solid var(--rule)}
.cf-row input[type=text]{grid-area:label;font-weight:600}
.cf-row input[type=date]{grid-area:date;font-size:14px;color:var(--muted)}
.cf-row .cf-amount{grid-area:amount}
.cf-row .cf-amount input{width:4.8em}
.cf-row .cf-flags{grid-area:flags}
.cf-row .cf-del{grid-area:del;justify-self:end}
.cf-tool input[type=date],.cf-tool input[type=number]{font:inherit;font-size:15px;line-height:1.8;color:var(--ink);background:transparent;border:0;border-bottom:1.5px solid transparent;border-radius:0;padding:6px 0;width:100%;min-width:0}
.cf-row input[type=text]{font-size:15px;padding:6px 0;border-bottom-color:transparent}
.cf-tool input[type=number]{text-align:right;font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.cf-tool input[type=number]::-webkit-inner-spin-button,.cf-tool input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.cf-tool input[type=date]:focus,.cf-tool input[type=number]:focus,.cf-row input[type=text]:focus{outline:none;border-bottom-color:var(--green)}
.cf-base input{border-bottom-color:var(--rule-strong)!important}
.cf-amount{display:flex;align-items:baseline;gap:4px}
.cf-amount>span{font-size:12px;color:var(--muted);white-space:nowrap}
.cf-flags{display:flex;gap:12px;font-size:13px;white-space:nowrap}
.cf-flags label{display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.cf-flags input{accent-color:var(--green);width:15px;height:15px;margin:0}
.cf-del,.cf-add,.cf-plain{font:inherit;font-size:13px;color:var(--muted);background:none;border:0;padding:4px 0;cursor:pointer;text-decoration:underline;text-underline-offset:.3em}
.cf-del:hover{color:var(--minus)}
.cf-add{align-self:flex-start;font-weight:700;color:var(--green)}
.cf-add::before{content:"＋ "}

/* できあがり：一言と、週ごとの表 */
.cf-out{position:sticky;top:20px;display:flex;flex-direction:column;gap:18px;min-width:0}
.cf-verdict{margin:0;font-size:15px;line-height:1.95;padding-bottom:16px;border-bottom:1px solid var(--ink)}
.cf-verdict strong{display:block;word-break:auto-phrase;font:600 23px/1.6 var(--serif);color:var(--minus);margin-bottom:4px;text-wrap:balance}
.cf-verdict[data-kind="none"] strong{color:var(--green)}
.cf-table-wrap{background:var(--sheet);border:1px solid var(--rule-strong)}
.cf-table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.6;font-variant-numeric:tabular-nums}
.cf-cap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px}
.cf-table caption{text-align:left;font:700 12px/1.5 var(--sans);letter-spacing:.04em;color:var(--muted);padding:9px 14px;border-bottom:1px solid var(--rule-strong)}
.cf-table th,.cf-table td{min-width:0;padding:7px 10px;border:0;border-bottom:1px solid var(--rule);background:none;text-align:right;white-space:nowrap;vertical-align:middle}
.cf-table thead th{font:12px/1.4 var(--sans);color:var(--muted);vertical-align:bottom;background:none}
.cf-table thead small{display:block;font-size:10px}
.cf-table tbody th{text-align:left;font-weight:600;color:var(--ink)}
.cf-table td+td,.cf-table th+th{border-left:0}
.cf-table tbody tr:nth-child(even){background:none}
.cf-table tbody tr:last-child>*{border-bottom:0}
.cf-io{color:var(--muted)}
.cf-num{font-weight:700;color:var(--ink)}
.cf-maybe{color:var(--muted);font-weight:400}
.is-minus{color:var(--minus)!important}
.cf-table tr.is-first>*{background:#f6e9de}
.cf-table tr.cf-now>*{border-bottom:1px solid var(--rule-strong)}
.cf-now-date{display:block;font-size:10px;font-weight:400;color:var(--muted)}
.cf-io-m{display:none}

/* 残高の動き：真ん中が0。右へ残り、左へ足りない額 */
.cf-track{position:relative;width:32%;padding:0!important}
td.cf-track::before{content:"";position:absolute;left:50%;top:0;bottom:0;border-left:1px solid var(--rule-strong)}
.cf-track i{position:absolute;top:50%;height:9px;margin-top:-4.5px;width:0;left:50%}
.cf-bar{background:var(--green);height:5px!important;margin-top:-2.5px!important}
.cf-bar-maybe{background:#cfd8cb}
.cf-bar.is-minus{background:var(--minus)}
.cf-bar-maybe.is-minus{background:#ecc9b2}
th.cf-track{text-align:center;padding:7px 0!important}
.cf-zero{font-size:10px}
.cf-keys{display:flex;gap:14px;font-weight:400;letter-spacing:0}
.cf-key{display:inline-flex;align-items:center;gap:6px;font-size:11px}
.cf-key i{position:static;margin:0;display:inline-block;width:14px}
.cf-key i.cf-key-sure{height:5px;background:var(--green)}
.cf-key i.cf-key-maybe{height:9px;background:#cfd8cb}

.cf-export{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px}
.cf-export .sheet-copy{border:0;font-weight:700}
.cf-file{position:relative}
.cf-file input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.cf-file:focus-within{outline:2px solid var(--green);outline-offset:3px}

/* やること */
.cf-advice{max-width:1180px;margin-top:64px;padding-top:28px;border-top:1px solid var(--ink)}
.cf-band h3{font:600 19px/1.6 var(--serif);color:var(--ink);margin:14px 0 20px}
.cf-band:not([hidden])~.cf-band:not([hidden]){margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}
.cf-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0 40px}
.cf-band h3,.cf-links{grid-column:1/-1}
.cf-do{padding:14px 0 18px;border-top:1px solid var(--line)}
.cf-do h4{font-size:15px;line-height:1.7;color:var(--ink);margin:0 0 6px}
.cf-do p{font-size:14px;line-height:1.95;margin:0}
.cf-links{display:flex;flex-wrap:wrap;gap:8px 28px;font-size:14px;font-weight:700;margin:6px 0 0}

@media(max-width:960px){
  .cf-work{grid-template-columns:1fr;gap:44px}
  .cf-out{position:static}
}
@media(max-width:600px){
  .cf-table .cf-io{display:none}
  .cf-io-m{display:block;font-size:10px;font-weight:400;color:var(--muted);margin-top:1px}
  .cf-table th,.cf-table td{padding:7px 8px;font-size:13px}
  .cf-track{width:30%}
  .cf-table th,.cf-table td{padding-inline:6px}
  .cf-verdict strong{font-size:20px}
}
@media print{
  .cf-write,.cf-export,#cf-file-note,.sheet-buttons,.breadcrumbs,.sheet-privacy{display:none!important}
  .cf-work{display:block;margin:0}
  .cf-out{position:static}
  .cf-table-wrap{background:none}
  .cf-band[hidden]{display:none!important}
  .cf-advice{margin-top:16px;break-before:auto}
  .cf-track i{print-color-adjust:exact;-webkit-print-color-adjust:exact}
}