/* ── card：一張事業體卡片（三角形、三條腿、缺口一句話、下一步、細項、估值） ──
   卡片夠寬（≥ 760px）時分左右兩欄：左＝卡片本體，右＝三個框（.card-todo，由 todo-box 積木填）。
   不夠寬就三個框排在下面。用 container query 看「卡片自己」多寬，不看螢幕。 */
.card{background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden;
  container-type:inline-size;container-name:card;scroll-margin-top:180px;min-width:0}
.card.flash{outline:3px solid var(--people);outline-offset:2px}
.card-body{display:grid;grid-template-columns:minmax(0,1fr)}
.card-main{display:flex;flex-direction:column;min-width:0}
.card-todo{min-width:0;border-top:1px solid var(--line-2);padding:var(--sp-5)}
.card-todo:empty{display:none}
@container card (min-width:760px){
  .card-body:has(> .card-todo:not(:empty)){grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
  .card-todo{border-top:0;border-left:1px solid var(--line-2)}
}

.card-top{display:flex;gap:var(--sp-6);padding:var(--sp-6) var(--sp-7) var(--sp-4)}
.tri-box{flex:0 0 84px}
.tri-box svg{display:block;width:84px;height:78px}
.card-id{min-width:0;flex:1}
.stage{font-size:var(--fs-cap);font-weight:700;letter-spacing:.03em;color:var(--ink-3);margin:0 0 2px;line-height:var(--lh-tight)}
.name{font-size:var(--fs-lg);font-weight:800;margin:0 0 var(--sp-2);line-height:var(--lh-tight);letter-spacing:-.01em;overflow-wrap:anywhere}
.val-row{display:flex;gap:var(--sp-1) var(--sp-7);font-size:var(--fs-cap);color:var(--ink-3);flex-wrap:wrap}
.val-row b{display:block;font-size:var(--fs-md);color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums;line-height:var(--lh-tight)}
.up{color:var(--ok-ink)!important} .down{color:var(--bad-ink)!important}

.legs{padding:0 var(--sp-7) var(--sp-5);display:grid;gap:var(--sp-4)}
.leg{display:grid;grid-template-columns:40px minmax(0,1fr) 52px;align-items:center;gap:2px var(--sp-4);font-size:var(--fs-sm)}
.leg-name{font-weight:800;letter-spacing:.04em}
.leg-name.m{color:var(--money-ink)} .leg-name.p{color:var(--people-ink)} .leg-name.j{color:var(--project-ink)}
.track{display:block;height:9px;background:var(--line-2);border-radius:5px;overflow:hidden}
.fill{display:block;height:9px;border-radius:5px;min-width:3px}
.leg-num{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink-2);font-weight:700}
.leg-gap{grid-column:2/-1;font-size:var(--fs-cap);color:var(--ink-3);display:flex;justify-content:space-between;gap:var(--sp-1) var(--sp-3);flex-wrap:wrap;line-height:var(--lh-tight)}
.leg-gap .short{color:var(--bad-ink);font-weight:700}
.leg-gap .short.mild{color:var(--warn-ink)}
.leg-gap .full{color:var(--ok-ink);font-weight:700}
.leg.no-goal .leg-num{color:var(--ink-3)}
.leg-gap .nogoal{color:var(--ink-3);font-weight:700}
.tbd{color:var(--warn-ink)!important}

.gap{margin:0;padding:var(--sp-4) var(--sp-7);border-top:1px solid var(--line-2);background:var(--surface-2);font-size:var(--fs-sm);display:flex;gap:var(--sp-4);align-items:flex-start}
.sev{flex:0 0 auto;font-size:var(--fs-cap);font-weight:800;padding:0 var(--sp-3);border-radius:4px;letter-spacing:.02em;line-height:1.7}
.sev.none{background:var(--surface);color:var(--ink-2);border:1px dashed var(--ink-3)}
.sev.bad{background:var(--bad-bg);color:var(--bad-ink)} .sev.warn{background:var(--warn-bg);color:var(--warn-ink)} .sev.ok{background:var(--ok-bg);color:var(--ok-ink)}
.gap-txt{color:var(--ink-2);min-width:0;overflow-wrap:anywhere}
.nextline{padding:var(--sp-4) var(--sp-7);border-top:1px solid var(--line-2);font-size:var(--fs-sm);display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-1) var(--sp-4)}
.nextline b{font-size:var(--fs-cap);color:var(--ink-3);letter-spacing:.03em;padding-top:1px}
.nextline .who{color:var(--ink-3);font-size:var(--fs-cap);display:inline-block;white-space:nowrap}
.nextline .late{color:var(--bad-ink);font-weight:800}

.card details{border-top:1px solid var(--line-2)}
.card summary{list-style:none;cursor:pointer;padding:0 var(--sp-7);min-height:var(--tap);font-size:var(--fs-sm);font-weight:700;color:var(--ink-2);display:flex;justify-content:space-between;align-items:center}
.card summary::-webkit-details-marker{display:none}
.card summary .arrow{transition:transform var(--dur) var(--ease);font-size:var(--fs-cap)}
.card details[open] summary .arrow{transform:rotate(90deg)}
.detail{padding:0 var(--sp-7) var(--sp-6);font-size:var(--fs-sm)}
.detail h4{font-size:var(--fs-cap);letter-spacing:.05em;color:var(--ink-3);margin:var(--sp-5) 0 var(--sp-2);font-weight:800}
.detail h4.m{color:var(--money-ink)} .detail h4.p{color:var(--people-ink)} .detail h4.j{color:var(--project-ink)}
.kv{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
.kv td{padding:var(--sp-1) 0;border-bottom:1px solid var(--line-2);color:var(--ink-2);vertical-align:top}
.kv td:last-child{text-align:right;color:var(--ink);font-weight:600;padding-left:var(--sp-4)}
.kv tr:last-child td{border-bottom:0}
.roles{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.role{border:1px solid var(--line);border-radius:5px;padding:0 var(--sp-3);font-size:var(--fs-cap);background:var(--surface)}
.role.have{border-color:var(--people);color:var(--people-ink)}
.role.missing{border:1.5px dashed var(--bad);color:var(--bad-ink);font-weight:700}
.items{list-style:none;margin:0;padding:0}
.items li{display:flex;gap:var(--sp-3);align-items:baseline;padding:var(--sp-1) 0;border-bottom:1px solid var(--line-2)}
.items li:last-child{border-bottom:0}
.st{flex:0 0 auto;font-size:var(--fs-cap);font-weight:800;padding:0 var(--sp-2);border-radius:4px;line-height:1.6;white-space:nowrap}
.st.done{background:var(--ok-bg);color:var(--ok-ink)} .st.doing{background:var(--surface-2);color:var(--ink-2);border:1px solid var(--line)} .st.stuck{background:var(--bad-bg);color:var(--bad-ink)}
.items .w{margin-left:auto;color:var(--ink-3);font-size:var(--fs-cap);white-space:nowrap}
.card-actions{display:flex;gap:var(--sp-3);padding:var(--sp-4) var(--sp-7) var(--sp-6);border-top:1px solid var(--line-2);margin-top:auto}

/* 待補資料、備註 */
.todo-tag{display:inline-block;background:var(--surface);color:var(--people-ink);border:1px dashed var(--people);border-radius:4px;
  padding:0 var(--sp-2);font-size:var(--fs-cap);font-weight:700;line-height:var(--lh-tight);vertical-align:1px;margin-left:var(--sp-2);white-space:nowrap}
.note{margin:0;padding:var(--sp-4) var(--sp-7);border-top:1px solid var(--line-2);font-size:var(--fs-sm);display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-4)}
.note b{font-size:var(--fs-cap);color:var(--ink-3)}
.note span{color:var(--ink-2);overflow-wrap:anywhere}
.card-tags{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-2);margin-top:var(--sp-2)}
.card-tags:empty,.card-group:empty{display:none}
/* 集團摘要＋底下的品牌（縮排） */
.card-group{padding:var(--sp-3) var(--sp-7);border-top:1px solid var(--line-2)}
.grp{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap;font-size:var(--fs-sm)}
.grp-sum b{font-weight:800}
.grp-of{margin:0;font-size:var(--fs-cap);color:var(--ink-3)}
.grp-of b{color:var(--ink-2)}
.vnode{display:grid;gap:var(--sp-3);min-width:0}
.kids{display:grid;gap:var(--sp-3);margin-left:var(--sp-5);padding-left:var(--sp-4);border-left:3px solid var(--line);min-width:0}
@media (min-width:760px){.kids{margin-left:var(--sp-9);padding-left:var(--sp-6)}}
