/* ── todo-box：卡片右邊的三個框（黃＝要找錢、藍＝要找人、綠＝要找項目） ── */
.todo-boxes{display:grid;gap:var(--sp-5);min-width:0}
.todo-box{--c:var(--line);--ci:var(--ink-2);--cb:var(--surface-2);border:2px solid var(--c);border-radius:var(--r-md);background:var(--cb);min-width:0;overflow:hidden}
.todo-box.tb-m{--c:var(--money);--ci:var(--money-ink);--cb:var(--money-bg)}
.todo-box.tb-p{--c:var(--people);--ci:var(--people-ink);--cb:var(--people-bg)}
.todo-box.tb-j{--c:var(--project);--ci:var(--project-ink);--cb:var(--project-bg)}
.tb-head{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-5) var(--sp-1) var(--sp-1)}
.tb-head h3{margin:0;font-size:var(--fs-md);font-weight:900;color:var(--ci);line-height:var(--lh-tight);white-space:nowrap}
.tb-cnt{margin-left:auto;font-size:var(--fs-cap);color:var(--ink-2);white-space:nowrap}
.box-grip{display:inline-flex;align-items:center;justify-content:center;min-width:var(--tap);min-height:var(--tap);border:0;border-radius:var(--r-sm);
  background:none;color:var(--ci);cursor:grab;touch-action:none}
.box-grip:hover{background:var(--surface)}
.todo-box.ds-dragging{background:var(--surface)}

.tb-list{list-style:none;margin:0;padding:0 var(--sp-3) var(--sp-3);display:grid;gap:var(--sp-2)}
.tb-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);min-width:0}
.tb-item.is-open{border-color:var(--c);box-shadow:0 0 0 1px var(--c)}
.tb-sum{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--sp-3);align-items:center;width:100%;min-height:var(--tap);
  padding:var(--sp-3) var(--sp-5);border:0;background:none;text-align:left;border-radius:var(--r-md)}
.tb-sum:hover{background:var(--surface-2)}
.tb-t{font-size:var(--fs-body);font-weight:700;line-height:var(--lh-tight);overflow-wrap:anywhere}
.tb-meta{grid-column:1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1) var(--sp-3);font-size:var(--fs-cap);color:var(--ink-3);line-height:var(--lh-tight)}
.tb-money{color:var(--ok-ink);font-weight:700;font-variant-numeric:tabular-nums}
.tb-chev{grid-column:2;grid-row:1/3;color:var(--ink-3);font-size:var(--fs-md);transition:transform var(--dur) var(--ease)}
.tb-item.is-open .tb-chev{transform:rotate(90deg)}
.tb-detail{padding:var(--sp-2) var(--sp-5) var(--sp-5);border-top:1px solid var(--line-2);animation:tb-in var(--dur) var(--ease)}
@keyframes tb-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.tb-foot{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-top:var(--sp-4);flex-wrap:wrap}
.tb-save{font-size:var(--fs-cap);color:var(--ink-3);min-height:1.5em}
.tb-save.is-saved{color:var(--ok-ink);font-weight:700}
.tb-save.is-saved::before{content:"✓ "}
.tb-save.is-error{color:var(--bad-ink);font-weight:700}
.tb-retry{margin-left:var(--sp-3);min-height:var(--tap);padding:0 var(--sp-5);border:1px solid var(--bad);border-radius:7px;background:var(--surface);color:var(--bad-ink);font-weight:700;font-size:var(--fs-sm)}
.tb-empty{margin:0;padding:var(--sp-1) var(--sp-5) var(--sp-4);font-size:var(--fs-sm);color:var(--ink-2)}
.tb-done-toggle{display:block;margin:0 var(--sp-3) var(--sp-3);min-height:var(--tap);padding:0 var(--sp-3);border:0;background:none;color:var(--ci);font-weight:700;font-size:var(--fs-sm);text-decoration:underline;text-underline-offset:3px}
.tb-done .tb-t{color:var(--ink-2)}
.tb-add{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--sp-2);padding:0 var(--sp-3) var(--sp-3)}
.tb-add input{min-width:0;min-height:var(--tap);padding:var(--sp-2) var(--sp-4);border:1px dashed var(--c);border-radius:7px;background:var(--surface);font-size:var(--fs-body)}
.tb-add .btn{padding:0 var(--sp-5);white-space:nowrap}
/* 階段 3 C6：上下拖排重要程度（抓握點在左）、期限、小步驟只顯示前 3 條 */
.tb-open > .tb-item{display:grid;grid-template-columns:auto minmax(0,1fr)}
.tb-open > .tb-item > .tb-sum,.tb-open > .tb-item > .tb-subs,.tb-open > .tb-item > .tb-detail{grid-column:2}
.tb-open > .tb-item:not(:has(> .tb-grip)) > *{grid-column:1 / -1}
.tb-grip{grid-row:1;display:inline-flex;align-items:center;justify-content:center;min-width:36px;min-height:var(--tap);border:0;background:none;color:var(--ink-3);cursor:grab;touch-action:none;border-radius:var(--r-md) 0 0 var(--r-md)}
.tb-grip:hover{color:var(--ci);background:var(--surface-2)}
.tb-item.ds-dragging{box-shadow:var(--shadow-lift)}
.tb-due{color:var(--ink-2);font-weight:700;white-space:nowrap}
.tb-due.late{color:var(--bad-ink)}
.tb-subs{list-style:none;margin:0;padding:0 var(--sp-5) var(--sp-3);display:grid;gap:2px;font-size:var(--fs-sm);color:var(--ink-2)}
.tb-subs li{display:flex;gap:var(--sp-2);align-items:baseline;overflow-wrap:anywhere}
.tb-subs li.done{color:var(--ink-3);text-decoration:line-through}
.tb-subs-more{font-size:var(--fs-sm)}
