/* 待办页专用样式（打卡页不加载这个文件）
 * 触控尺寸同样按 44px 基线：新增按钮 46、分段控件 44、勾选圈视觉 24 / 触控 46。
 */

/* ---------- 快速添加 ---------- */
.addbar{
  display:flex;align-items:center;gap:8px;margin-bottom:12px;
  background:linear-gradient(165deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
  border:1px solid var(--line-2);border-radius:18px;padding:5px 5px 5px 17px;
  transition:border-color .2s,background .2s,box-shadow .2s;
}
.addbar:focus-within{
  border-color:var(--acc-line);background:rgba(21,244,238,.04);
  box-shadow:0 0 0 3px rgba(21,244,238,.07);
}
.addbar input{
  flex:1;height:44px;border:0;background:transparent;outline:none;
  font-size:16px;letter-spacing:.01em;min-width:0;
}
.addbar input::placeholder{color:var(--txt-3)}
.addbar button{
  flex:0 0 46px;width:46px;height:46px;border-radius:14px;
  border:1px solid var(--acc);background:var(--acc);color:#03211f;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.16s;
  box-shadow:0 8px 24px -14px rgba(21,244,238,.9);
}
.addbar button svg{width:21px;height:21px}
.addbar button:active{transform:scale(.93)}
.addbar button[disabled]{opacity:.4;pointer-events:none}

.addmeta{display:flex;align-items:center;gap:8px;margin-bottom:20px}
.pri{display:flex;gap:6px}
.pri button{
  height:44px;min-width:58px;padding:0 16px;
  border:1px solid var(--line);background:rgba(255,255,255,.028);color:var(--txt-2);
  font-size:12.5px;letter-spacing:.08em;border-radius:12px;cursor:pointer;
  transition:.16s;font-weight:500;
}
.pri button:active{transform:scale(.96)}
.pri button.on{color:var(--acc);border-color:var(--acc-line);background:var(--acc-soft)}
.pri button[data-p="0"].on{
  color:#ffb07a;border-color:rgba(255,176,122,.32);background:rgba(255,176,122,.13);
}
.pri button[data-p="2"].on{
  color:var(--txt-2);border-color:var(--line-2);background:rgba(255,255,255,.06);
}

.duechip{
  margin-left:auto;position:relative;overflow:hidden;
  height:44px;display:flex;align-items:center;
  border:1px solid var(--line);border-radius:12px;padding:0 16px;
  font-size:12.5px;color:var(--txt-2);letter-spacing:.04em;cursor:pointer;transition:.16s;
  background:rgba(255,255,255,.028);
}
.duechip.set{color:var(--acc);border-color:var(--acc-line);background:var(--acc-soft)}
.duechip input{
  position:absolute;inset:0;opacity:0;border:0;padding:0;cursor:pointer;width:100%;height:100%;
}

/* ---------- 分组（分段控件） ---------- */
.tabs{
  display:flex;gap:2px;margin-bottom:16px;padding:4px;
  background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:15px;
}
.tabs button{
  flex:1;height:44px;border-radius:11px;border:1px solid transparent;background:transparent;
  color:var(--txt-3);font-size:13px;letter-spacing:.03em;cursor:pointer;transition:.18s;
  display:flex;align-items:center;justify-content:center;gap:6px;font-weight:500;
}
.tabs button i{
  font-style:normal;font-size:11px;font-variant-numeric:tabular-nums;
  min-width:18px;height:18px;border-radius:9px;display:inline-flex;
  align-items:center;justify-content:center;background:rgba(255,255,255,.06);
}
.tabs button.on{color:var(--txt);background:#1b242f;border-color:var(--line-2);box-shadow:0 2px 10px rgba(0,0,0,.25)}
.tabs button.on i{color:var(--acc);background:rgba(21,244,238,.14)}

/* ---------- 列表 ---------- */
.todos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.todo{
  display:flex;align-items:flex-start;gap:14px;
  padding:15px 15px;border-radius:16px;
  border:1px solid var(--line);
  background:linear-gradient(165deg,rgba(255,255,255,.045),rgba(255,255,255,.012));
  transition:opacity .25s,transform .25s,border-color .2s,background .2s;
}
.todo:active{background:rgba(255,255,255,.055)}
.todo.leaving{opacity:0;transform:translateX(10px)}

/* 视觉 24px，触控靠 ::before 扩到 46px */
.tick{
  flex:0 0 24px;width:24px;height:24px;margin-top:1px;border-radius:50%;
  border:1.6px solid rgba(255,255,255,.22);background:transparent;cursor:pointer;
  position:relative;transition:.18s;
}
.tick::before{content:"";position:absolute;inset:-11px;border-radius:50%}
.tick:active{transform:scale(.9)}
.todo.p0 .tick{border-color:rgba(255,176,122,.6)}
.todo.p1 .tick{border-color:rgba(21,244,238,.45)}
.todo.done .tick{background:var(--acc);border-color:var(--acc)}
.todo.done .tick::after{
  content:"";position:absolute;left:7.5px;top:3.5px;width:5px;height:10px;
  border:solid #03211f;border-width:0 2px 2px 0;transform:rotate(42deg);
}

.td-main{flex:1;min-width:0;cursor:pointer;padding:2px 0}
.td-title{
  margin:0;font-size:15px;line-height:1.5;letter-spacing:.005em;color:var(--txt);
  word-break:break-word;font-weight:500;
}
.todo.done .td-title{
  color:var(--txt-3);text-decoration:line-through;
  text-decoration-color:rgba(101,117,133,.6);font-weight:400;
}
.td-meta{
  display:flex;align-items:center;gap:9px;margin-top:6px;
  font-size:11.5px;color:var(--txt-3);letter-spacing:.04em;
}
.td-meta .pdot{width:5px;height:5px;border-radius:50%;background:var(--txt-3);display:block;flex:0 0 auto}
.todo.p0 .pdot{background:#ffb07a;box-shadow:0 0 8px rgba(255,176,122,.5)}
.todo.p1 .pdot{background:var(--acc);box-shadow:0 0 8px rgba(21,244,238,.45)}
.td-meta .due{color:var(--txt-3)}
.td-meta .due.over{color:var(--danger);font-weight:500}
.td-meta .due.today{color:var(--acc)}
.td-meta em{font-style:normal;opacity:.55}

.todo.pending{border-style:dashed;border-color:rgba(21,244,238,.24)}
.todo.pending .td-title::after{
  content:" · 待同步";color:rgba(21,244,238,.62);font-size:11.5px;font-weight:400;
}

.empty{
  text-align:center;color:var(--txt-3);font-size:13px;letter-spacing:.05em;
  padding:48px 0;line-height:2;
}
.foot{margin:20px 0 0;text-align:center;font-size:11.5px;color:var(--txt-3);letter-spacing:.04em}

/* ---------- 编辑弹层 ---------- */
.sheet .field{margin-bottom:16px}
.sheet .field label{
  display:block;font-size:10.5px;letter-spacing:.18em;color:var(--txt-3);
  margin-bottom:9px;font-weight:500;
}
.sheet input[type="text"],.sheet textarea,.sheet input[type="date"]{
  width:100%;background:rgba(255,255,255,.045);border:1px solid var(--line-2);
  border-radius:13px;padding:0 15px;height:52px;font-size:15.5px;outline:none;color:var(--txt);
  font-family:inherit;transition:.18s;
}
.sheet textarea{
  resize:none;line-height:1.7;font-size:15px;height:auto;
  min-height:88px;padding:13px 15px;
}
.sheet input:focus,.sheet textarea:focus{
  border-color:var(--acc-line);background:rgba(21,244,238,.045);
}
.sheet .pri{margin-top:2px}
.sheet .pri button{height:46px}
.sheet .row2{display:flex;gap:8px}
.sheet .row2 > *{flex:1}
.sheet .row2 .btn{flex:0 0 90px;height:52px;padding:0;font-size:14px}