/* 首页「待办」(todo.js)—— 规格 docs/specs/hub-todo.md。颜色全用首页 :root 的变量,深色模式跟着走。 */
.todo{border:1px solid var(--line); border-radius:14px; background:var(--surface); padding:.9rem 1.1rem 1rem; margin:0 0 1.4rem;}
.td-head{display:flex; align-items:center; gap:.55rem; flex-wrap:wrap;}
.td-head b{font-size:1.02rem;}
.td-fold{border:0; background:none; color:var(--ink-faint); cursor:pointer; font-size:.9rem; padding:0 .1rem; width:1.2rem;}
.td-badge{font-size:.72rem; font-weight:750; padding:.08rem .5rem; border-radius:999px; background:var(--sunk); color:var(--ink-soft); font-variant-numeric:tabular-nums;}
.td-badge.need{background:#fde8e8; color:var(--bad);}
.td-wrap{display:flex; flex-direction:column; gap:1rem; margin-top:.7rem;}
.td-sec + .td-sec{border-top:1px solid var(--line); padding-top:.9rem;}
.td-sub{font-size:.78rem; font-weight:700; color:var(--ink-soft); margin:0 0 .35rem; display:flex; gap:.45rem; align-items:baseline; flex-wrap:wrap;}
.td-sub span{font-weight:500; color:var(--ink-faint);}
.td-sub em{font-style:normal; font-weight:400; color:var(--ink-faint); font-size:.74rem; margin-left:auto;}

/* 系统提醒:一行一条 */
.td-sys{display:grid; grid-template-columns:.5rem 4.4em 1fr auto; align-items:start; column-gap:.6rem; padding:.5rem .6rem; border-radius:10px; text-decoration:none; color:var(--ink); border:1px solid transparent;}
.td-sys:hover{background:var(--sunk); border-color:var(--line);}
.td-sys.err .td-text{color:var(--bad);}
.td-dot{width:.5rem; height:.5rem; border-radius:50%; margin-top:.45rem;}
.td-app{font-size:.75rem; font-weight:700; white-space:nowrap; padding-top:.15rem;}
.td-main{min-width:0; display:flex; flex-wrap:wrap; column-gap:.7rem; align-items:baseline;}
.td-text{font-size:.9rem; line-height:1.45; word-break:break-word;}
.td-subtext{font-size:.76rem; color:var(--ink-faint); word-break:break-word;}
.td-go{font-size:.78rem; color:var(--accent); white-space:nowrap; padding-top:.15rem;}
.td-empty{color:var(--ink-faint); font-size:.85rem; padding:.5rem .6rem;}
.td-faint{color:var(--ink-faint); font-size:.72rem;}

/* 页签 / 搜索 / 数字 */
.td-tabs{display:flex; align-items:center; gap:.3rem; flex-wrap:wrap; margin-bottom:.45rem;}
.td-tab{font:inherit; font-size:.82rem; font-weight:650; border:0; background:none; color:var(--ink-soft); padding:.3rem .65rem; border-radius:8px; cursor:pointer; display:inline-flex; gap:.35rem; align-items:center;}
.td-tab span{font-weight:500; color:var(--ink-faint);}
.td-tab.on{background:var(--sunk); color:var(--ink);}
.td-tabs em{font-style:normal; color:var(--ink-faint); font-size:.74rem; margin-left:auto;}
.td-filter{display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; margin:.1rem .6rem .5rem; padding:.45rem .5rem; background:var(--sunk); border-radius:9px;}
.td-filter input{flex:1 1 10rem; min-width:0; font:inherit; font-size:.8rem; padding:.28rem .5rem; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink);}
.td-link{font:inherit; font-size:.78rem; border:0; background:none; color:var(--accent); cursor:pointer;}
.td-fnote{font-size:.74rem; color:var(--accent);}
.td-overview{display:grid; gap:.4rem; margin:.1rem .6rem .6rem;}
.td-overview.n3{grid-template-columns:repeat(3, minmax(0,1fr));} .td-overview.n5{grid-template-columns:repeat(5, minmax(0,1fr));}
.td-overview .td-num{font:inherit; border:1px solid transparent; background:var(--sunk); border-radius:9px; padding:.45rem .5rem; text-align:center; cursor:pointer; color:var(--ink);}
.td-overview .td-num:hover{border-color:var(--line-firm);}
.td-overview .td-num.on{border-color:var(--accent); background:var(--flow-wash);}
.td-overview .td-num.static{cursor:default;} .td-overview .td-num.static:hover{border-color:transparent;}
.td-overview .td-num b{display:block; font-size:1.15rem; font-variant-numeric:tabular-nums;}
.td-overview .td-num span{font-size:.7rem; color:var(--ink-faint);}
.c-doing{color:var(--accent);} .c-blocked{color:var(--bad);} .c-over{color:var(--bad);} .c-done{color:var(--wh);}

/* 添加 */
.td-add{display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; margin:.2rem .6rem .5rem;}
.td-add input#tdInput, .td-add-team #tdForText{flex:1 1 14rem; min-width:0; font:inherit; font-size:.88rem; padding:.45rem .65rem; border:1px dashed var(--line-firm); border-radius:8px; background:var(--sunk); color:var(--ink);}
.td-add input#tdInput:focus, .td-add-team #tdForText:focus{outline:2px solid var(--accent); outline-offset:-1px; border-style:solid;}
.td-chips{display:flex; gap:.3rem; flex-wrap:wrap;}
.td-chip{position:relative; font:inherit; font-size:.75rem; border:1px solid var(--line); background:var(--surface); color:var(--ink-soft); border-radius:999px; padding:.15rem .55rem; cursor:pointer; white-space:nowrap;}
.td-chip.on{border-color:var(--accent); color:var(--accent); background:var(--flow-wash);}
.td-chip input[type=date]{position:absolute; inset:0; opacity:0; cursor:pointer;}
.td-chip-sel{font:inherit; font-size:.75rem; border:1px solid var(--line); background:var(--surface); color:var(--ink-soft); border-radius:999px; padding:.12rem .45rem;}
.td-due-in{display:inline-flex; gap:.3rem; align-items:center;} .td-due-in input{font:inherit; font-size:.74rem; border:0; background:none; color:var(--ink-soft);}

/* 分组 */
.td-group{font-size:.72rem; font-weight:700; color:var(--ink-faint); margin:.55rem .6rem .15rem;}
.td-group span{font-weight:500;}
.td-group.wk{font-size:.8rem; color:var(--ink); font-weight:700; margin:.7rem .6rem .2rem; padding-bottom:.15rem; border-bottom:1px solid var(--line);}
.td-group.wk span{color:var(--ink-faint); font-weight:500;} .td-group.wk em{font-style:normal; font-weight:600;}
button.td-group.wk{display:flex; gap:.3rem; align-items:baseline; width:calc(100% - 1.2rem); font:inherit; font-size:.8rem; font-weight:700; text-align:left; background:none; border:0; border-bottom:1px solid var(--line); cursor:pointer; color:var(--ink); padding:0 0 .15rem;}
.td-fold-i{color:var(--ink-faint); width:.9rem;}

/* 一行一件 */
.td-item{display:flex; align-items:flex-start; gap:.6rem; padding:.45rem .6rem; border-radius:10px;}
.td-item:hover, .td-item.open{background:var(--sunk);}
.td-item.high{box-shadow:inset 3px 0 0 #e8a33d;}
.td-body-row{flex:1; min-width:0; cursor:pointer; outline:none;}
.td-line1{display:flex; flex-wrap:wrap; align-items:baseline; column-gap:.5rem;}
.td-star{color:#e8a33d; font-size:.85rem;}
/* 预览用行数截断而不是 nowrap —— nowrap 的整行宽度会成为卡片的最小宽度,首页 body 是 grid,手机上整页被撑宽 */
.td-line2{font-size:.76rem; color:var(--ink-faint); margin-top:.1rem; overflow:hidden; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-break:break-all;}
.td-pg-i{color:var(--ink-soft); font-weight:600;}
.td-due{font-size:.72rem; color:var(--ink-soft); background:var(--sunk); border-radius:999px; padding:.05rem .5rem; white-space:nowrap; margin-top:.15rem;}
.td-item:hover .td-due, .td-item.open .td-due{background:var(--surface);}
.td-due.today{color:var(--accent); background:var(--flow-wash);}
.td-due.over{color:var(--bad); background:#fde8e8;}
.td-owner{font-size:.72rem; font-weight:700; color:var(--ink); background:var(--sunk); border:1px solid var(--line); border-radius:5px; padding:0 .4rem; white-space:nowrap;}
.td-owner.left{color:var(--ink-faint); text-decoration:line-through;}
.td-mark{font-size:.7rem; color:#9a5b00; background:#fff3d6; border-radius:5px; padding:0 .35rem; white-space:nowrap;}
.td-new{font-size:.68rem; font-weight:800; color:#fff; background:var(--bad); border-radius:5px; padding:0 .35rem; white-space:nowrap;}
.td-tab .td-new{margin-left:.15rem;}
.td-stale{font-size:.7rem; color:var(--ink-soft); background:var(--sunk); border:1px dashed var(--line-firm); border-radius:5px; padding:0 .35rem; white-space:nowrap;}
.td-state{width:1.05rem; text-align:center; font-weight:700; margin-top:.1rem;}
.td-state.done{color:var(--wh);} .td-state.cancelled{color:var(--ink-faint);}
.td-item.hist .td-text{color:var(--ink-soft);}
.td-done{margin:.7rem .6rem 0;} .td-done summary{font-size:.78rem; color:var(--ink-faint); cursor:pointer;}

/* 状态标签(可点)+ 菜单 —— 只有一套状态,没有勾选框 */
.td-st{font:inherit; font-size:.7rem; font-weight:650; border-radius:5px; padding:.02rem .4rem; white-space:nowrap; border:1px solid transparent;}
.st-todo{background:var(--sunk); color:var(--ink-soft); border-color:var(--line);}
.st-doing{background:var(--flow-wash); color:var(--accent);}
.st-blocked{background:#fde8e8; color:var(--bad);}
.st-done{background:var(--wh-wash); color:var(--wh);} .st-cancel{background:var(--sunk); color:var(--ink-faint);}
.td-st-wrap{position:relative; flex:none; margin-top:.05rem;}
.td-st-btn{cursor:pointer; min-width:4.6em; text-align:left;}
.td-st-menu{position:absolute; top:calc(100% + .25rem); left:0; z-index:20; display:flex; flex-direction:column; min-width:7.5rem; background:var(--surface); border:1px solid var(--line-firm); border-radius:9px; box-shadow:var(--shadow); padding:.25rem;}
.td-st-menu button{font:inherit; font-size:.82rem; text-align:left; border:0; background:none; color:var(--ink); padding:.4rem .6rem; border-radius:6px; cursor:pointer;}
.td-st-menu button:hover{background:var(--sunk);} .td-st-menu button.on{font-weight:700;}
.td-st-menu button.done{color:var(--wh); font-weight:650; border-top:1px solid var(--line); border-radius:0 0 6px 6px;}
.td-st-menu button.cancel{color:var(--ink-faint);}
.td-st-pick{display:flex; gap:.35rem; align-items:center; flex-wrap:wrap; font-size:.78rem; color:var(--ink-soft);}
.td-st-pick .td-st{cursor:pointer; padding:.2rem .6rem; opacity:.55;}
.td-st-pick .td-st.on{opacity:1; box-shadow:0 0 0 1.5px currentColor;}
.td-st-hint{color:var(--bad); font-size:.74rem;}

/* 展开的编辑面板 */
.td-editor{margin:.1rem .6rem .6rem 2.25rem; padding:.75rem .85rem; border:1px solid var(--line-firm); border-radius:10px; background:var(--surface); display:flex; flex-direction:column; gap:.55rem;}
.td-editor input, .td-editor textarea, .td-editor select{font:inherit; font-size:.86rem; color:var(--ink); background:var(--sunk); border:1px solid var(--line); border-radius:7px; padding:.38rem .55rem;}
.td-editor textarea{resize:vertical; min-height:6.5rem; line-height:1.55;}
.td-e-more summary{font-size:.78rem; color:var(--accent); cursor:pointer; margin:.1rem 0 .4rem;}
/* 标题、说明在编辑区里各占一整行(负责人 2026-10-12:说明框太小、没对齐) */
.td-e-fields{display:flex; flex-direction:column; gap:.55rem; margin-top:.55rem;}
.td-e-fields > .td-e-title, .td-e-fields > textarea{width:100%; box-sizing:border-box;}
.td-e-title{font-weight:600;}
.td-e-row{display:flex; gap:.5rem 1rem; flex-wrap:wrap; align-items:center; font-size:.8rem; color:var(--ink-soft);}
.td-e-row label{display:inline-flex; align-items:center; gap:.35rem;}
.td-e-pri input{accent-color:#e8a33d;}
.td-e-btns{display:flex; gap:.5rem;}
.td-e-note{font-size:.78rem; color:#9a5b00; background:#fff3d6; border-radius:7px; padding:.35rem .55rem;}
.td-btn{font:inherit; font-size:.82rem; border:1px solid var(--line-firm); background:var(--surface); color:var(--ink); border-radius:8px; padding:.35rem .9rem; cursor:pointer;}
.td-btn.primary{background:var(--accent); border-color:var(--accent); color:#fff;}
.td-pg-add{display:flex; gap:.5rem;}
.td-pg-add input{flex:1; min-width:0;}
.td-tl{display:flex; flex-direction:column; gap:.25rem; font-size:.82rem; border-left:2px solid var(--line); padding-left:.7rem; margin-left:.2rem;}
.td-tl-row{display:flex; gap:.5rem; align-items:baseline; flex-wrap:wrap;}
.td-tl-at{font-size:.72rem; color:var(--ink-faint); font-variant-numeric:tabular-nums; min-width:2.6rem;}
.td-tl-by{font-size:.72rem; color:var(--ink-soft); font-weight:650;}
.td-tl-p{color:var(--ink); flex:1 1 12rem; min-width:0; word-break:break-word;}
.td-tl-l{color:var(--ink-faint); font-size:.74rem; word-break:break-word;}
.td-editor.ro{gap:.4rem;} .td-ro-note{white-space:pre-wrap; font-size:.84rem;}
.td-ask{margin-left:2.25rem;}

/* 团队:人名卡片 */
.td-pcards{display:flex; gap:.4rem; flex-wrap:wrap; margin:.1rem .6rem .6rem;}
.td-pcard{font:inherit; text-align:left; border:1px solid var(--line); background:var(--surface); border-radius:10px; padding:.35rem .6rem; cursor:pointer; display:flex; flex-direction:column; gap:.05rem; min-width:7.5rem; color:var(--ink);}
.td-pcard.on{border-color:var(--accent); background:var(--flow-wash);}
.td-pcard b{font-size:.84rem;} .td-pcard span{font-size:.72rem; color:var(--ink-soft);} .td-pcard em{font-style:normal;}
.td-pcard i{font-style:normal; font-size:.68rem; color:var(--ink-faint);}
.td-pcard.left b{color:var(--ink-faint); text-decoration:line-through;} .td-pcard.left i{color:#9a5b00;}
.td-pcard.small{min-width:0; padding:.2rem .6rem;}

/* 提示条(带「撤销」)*/
#tdToast{position:fixed; left:50%; bottom:1.4rem; transform:translateX(-50%) translateY(1rem); opacity:0; background:var(--ink); color:var(--surface); padding:.5rem .9rem; border-radius:10px; font-size:.85rem; transition:.2s; pointer-events:none; z-index:50; max-width:calc(100vw - 2rem);}
#tdToast.show{opacity:1; transform:translateX(-50%);}
#tdToast.bad{background:var(--bad); color:#fff;}
#tdToast.undo{pointer-events:auto;} #tdToast button{font:inherit; font-size:.85rem; margin-left:.6rem; border:0; background:none; color:#9cc3ff; font-weight:700; cursor:pointer;}

@media (max-width:720px){
  .todo{padding:.8rem .7rem .9rem;}
  .td-sub em, .td-tabs em{flex-basis:100%; margin-left:0;}
  .td-sys{grid-template-columns:.5rem 1fr auto; row-gap:.15rem; padding-left:.35rem; padding-right:.35rem;}
  .td-app{grid-column:2; grid-row:1;} .td-go{grid-column:3; grid-row:1;}
  .td-main{grid-column:2 / 4; grid-row:2; flex-direction:column;}
  .td-item{padding-left:.35rem; padding-right:.35rem;} .td-add, .td-filter{margin-left:.35rem; margin-right:.35rem;}
  .td-editor, .td-ask{margin-left:.35rem; margin-right:.35rem;}
  .td-overview{margin-left:.35rem; margin-right:.35rem;} .td-overview.n5{grid-template-columns:repeat(3, minmax(0,1fr));}
  .td-pcards{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); margin-left:.35rem; margin-right:.35rem;} .td-pcard{min-width:0;}
}