.todo-shell { min-height:100vh; padding:16px; }
.todo-topbar { max-width:none; margin-bottom:12px; border-radius:13px; }
.todo-main { min-height:calc(100vh - 112px); display:grid; grid-template-columns:220px minmax(0,1fr); overflow:hidden; border:1px solid #dce4ee; border-radius:14px; background:#fff; box-shadow:0 12px 34px rgba(29,45,78,.07); }
.todo-side { display:flex; min-height:0; flex-direction:column; padding:22px 14px; color:#dbe5f7; background:#243252; }
.todo-side-kicker { margin:0 8px 8px; color:#90adff; font:14px "DM Mono",monospace; letter-spacing:.14em; }
.todo-side h2 { margin:0 8px 24px; color:#fff; font-size:21px; letter-spacing:-.04em; }
.todo-side-nav { display:grid; gap:3px; }
.todo-side-button { display:flex; align-items:center; gap:10px; width:100%; min-height:39px; padding:8px 10px; color:#bac8df; border:0; border-radius:8px; background:transparent; cursor:pointer; font-size: 14px; text-align:left; }
.todo-side-button:hover,.todo-side-button.is-active { color:#fff; background:rgba(255,255,255,.11); }
.todo-side-icon { width:23px; height:23px; display:grid; place-items:center; color:#9eb5f3; border-radius:6px; background:rgba(255,255,255,.07); font-size: 14px; font-weight:700; }
.todo-year-label { margin:27px 8px 8px; color:#8fa1bf; font:14px "DM Mono",monospace; letter-spacing:.13em; }
.todo-years { display:grid; gap:2px; max-height:220px; overflow:auto; }
.todo-year { display:flex; align-items:center; justify-content:space-between; padding:7px 10px; color:#aab9d1; border:0; border-radius:7px; background:transparent; cursor:pointer; font:14px "DM Mono",monospace; }
.todo-year:hover,.todo-year.is-active { color:#fff; background:rgba(255,255,255,.1); }
.todo-private-note { margin-top:auto; padding:13px 10px 0; color:#8fa1bf; border-top:1px solid rgba(255,255,255,.1); font-size: 14px; line-height:1.7; }
.todo-content { min-width:0; background:#f7f9fc; }
.todo-content-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:25px 28px 18px; border-bottom:1px solid #e4eaf1; background:#fff; }
.todo-content-head h1 { margin:2px 0 5px; font-size:24px; }
.todo-eyebrow { margin:0; color:#477cff; font:14px "DM Mono",monospace; letter-spacing:.12em; }
.todo-period-copy { margin:0; color:#7c899e; font-size: 14px; }
.todo-head-actions { display:flex; gap:7px; }
.todo-button { padding:8px 11px; color:#56647b; border:1px solid #d5deea; border-radius:8px; background:#fff; cursor:pointer; font-size: 14px; }
.todo-button:hover { color:#477cff; border-color:#9db6f4; }
.todo-button.primary { color:#fff; border-color:#477cff; background:#477cff; }
.todo-toolbar { display:flex; align-items:center; gap:9px; padding:11px 28px; border-bottom:1px solid #e6ebf2; background:#fbfcfe; }
.todo-period-nav { display:flex; align-items:center; gap:5px; }
.todo-period-nav button { width:29px; height:29px; padding:0; color:#66758d; border:1px solid #d9e1eb; border-radius:7px; background:#fff; cursor:pointer; }
.todo-today { width:auto!important; padding:0 9px!important; font-size: 14px; }
.todo-toolbar-spacer { flex:1; }
.todo-filter,.todo-search { padding:7px 9px; color:#58667c; border:1px solid #d8e1eb; border-radius:7px; outline:0; background:#fff; font-size: 14px; }
.todo-search { width:170px; }
.todo-search:focus,.todo-filter:focus { border-color:#477cff; box-shadow:0 0 0 3px rgba(71,124,255,.1); }
.todo-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:15px 28px 0; }
.todo-stat { padding:11px 13px; border:1px solid #e0e7ef; border-radius:9px; background:#fff; }
.todo-stat span { color:#8591a5; font-size: 14px; }
.todo-stat b { display:block; margin-top:5px; font:19px "DM Mono",monospace; }
.todo-stat.is-done b { color:#16805a; }
.todo-stat.is-late b { color:#c16843; }
.todo-view { padding:15px 28px 34px; }
.todo-quick { display:grid; grid-template-columns:minmax(180px,1fr) 130px 105px auto; gap:7px; margin-bottom:10px; padding:10px; border:1px solid #dce4ee; border-radius:10px; background:#fff; }
.todo-quick input,.todo-quick select { width:100%; padding:8px 9px; color:#43516a; border:1px solid #d9e1eb; border-radius:7px; outline:0; background:#fff; font-size: 14px; }
.todo-group { overflow:hidden; border:1px solid #dfe6ef; border-radius:11px; background:#fff; }
.todo-group-head { display:flex; align-items:center; justify-content:space-between; min-height:43px; padding:10px 14px; border-bottom:1px solid #edf1f5; background:#fbfcfe; }
.todo-group-head b { font-size: 14px; }
.todo-group-head span { color:#8b97a9; font-size: 14px; }
.todo-list { display:grid; }
.todo-item { display:grid; grid-template-columns:28px minmax(160px,1fr) 90px 78px 150px; align-items:center; gap:9px; min-height:55px; padding:8px 13px; border-bottom:1px solid #edf1f5; background:#fff; }
.todo-item:last-child { border-bottom:0; }
.todo-item[draggable="true"] { cursor:grab; }
.todo-item.is-dragging { opacity:.4; }
.todo-item.is-drop-target { background:#edf3ff; }
.todo-check { width:20px; height:20px; padding:0; color:#fff; border:1px solid #cbd6e3; border-radius:6px; background:#fff; cursor:pointer; }
.todo-item.is-completed .todo-check { border-color:#16805a; background:#16805a; }
.todo-item.is-completed .todo-title { color:#9aa5b5; text-decoration:line-through; }
.todo-title { overflow:hidden; color:#283750; font-size: 14px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.todo-description { display:block; overflow:hidden; margin-top:3px; color:#929daf; font-size: 14px; font-weight:400; text-overflow:ellipsis; white-space:nowrap; }
.todo-time { color:#758299; font:14px "DM Mono",monospace; }
.todo-priority { width:max-content; padding:3px 6px; border-radius:5px; font-size: 14px; }
.todo-priority.normal { color:#61718a; background:#eef2f7; }
.todo-priority.important { color:#96611a; background:#fff2d7; }
.todo-priority.urgent { color:#b34b48; background:#ffebe9; }
.todo-actions { display:flex; justify-content:flex-end; gap:4px; }
.todo-actions button { padding:5px 7px; color:#68768d; border:0; border-radius:6px; background:#f0f3f7; cursor:pointer; font-size: 14px; }
.todo-actions button:hover { color:#477cff; background:#e7edff; }
.todo-actions .is-danger:hover { color:#b74846; background:#ffebe9; }
.todo-empty { padding:40px 20px; color:#8692a5; text-align:center; font-size: 14px; }
.todo-week-grid { display:grid; grid-template-columns:repeat(7,minmax(135px,1fr)); gap:7px; overflow-x:auto; }
.todo-day-column { min-height:300px; border:1px solid #dfe6ef; border-radius:10px; background:#fff; }
.todo-day-column.is-today { border-color:#88a8f4; box-shadow:0 0 0 2px rgba(71,124,255,.08); }
.todo-day-head { padding:10px; border-bottom:1px solid #edf1f5; }
.todo-day-head b { display:block; font-size: 14px; }
.todo-day-head span { color:#8995a8; font:14px "DM Mono",monospace; }
.todo-mini-list { display:grid; gap:5px; padding:7px; }
.todo-mini { padding:8px; border-left:3px solid #c7d4e5; border-radius:6px; background:#f7f9fc; cursor:pointer; }
.todo-mini.urgent { border-left-color:#df6b66; }
.todo-mini.important { border-left-color:#e0a74e; }
.todo-mini.is-completed { opacity:.55; }
.todo-mini b { display:block; overflow:hidden; font-size: 14px; text-overflow:ellipsis; white-space:nowrap; }
.todo-mini span { display:block; margin-top:3px; color:#8a96a8; font-size: 14px; }
.todo-calendar { display:grid; grid-template-columns:repeat(7,minmax(100px,1fr)); overflow:hidden; border:1px solid #dfe6ef; border-radius:11px; background:#fff; }
.todo-weekday { padding:8px; color:#7f8b9f; border-bottom:1px solid #e8edf3; background:#f8fafc; font-size: 14px; text-align:center; }
.todo-calendar-day { min-height:105px; padding:8px; border-right:1px solid #edf1f5; border-bottom:1px solid #edf1f5; background:#fff; cursor:pointer; }
.todo-calendar-day:nth-child(7n) { border-right:0; }
.todo-calendar-day.is-outside { color:#b1bac8; background:#fafbfd; }
.todo-calendar-day.is-today { box-shadow:inset 0 0 0 2px #88a8f4; }
.todo-calendar-day b { font:14px "DM Mono",monospace; }
.todo-calendar-tasks { display:grid; gap:3px; margin-top:6px; }
.todo-calendar-task { overflow:hidden; padding:3px 5px; border-radius:4px; color:#52657f; background:#edf3ff; font-size: 14px; text-overflow:ellipsis; white-space:nowrap; }
.todo-calendar-more { color:#7a879b; font-size: 14px; }
.todo-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.todo-summary-card { min-height:150px; padding:14px; border:1px solid #dfe6ef; border-radius:10px; background:#fff; cursor:pointer; }
.todo-summary-card:hover { border-color:#9db6f4; box-shadow:0 8px 20px rgba(48,76,123,.07); }
.todo-summary-card h3 { margin:0 0 5px; font-size: 14px; }
.todo-summary-card p { margin:0; color:#8b97a9; font-size: 14px; }
.todo-progress { height:5px; margin:15px 0 8px; overflow:hidden; border-radius:5px; background:#edf1f5; }
.todo-progress span { display:block; height:100%; border-radius:5px; background:#477cff; }
.todo-card-meta { display:flex; justify-content:space-between; color:#748198; font-size: 14px; }
.todo-year-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }
.todo-modal { width:min(100%,600px); }
.todo-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.todo-form-grid .form-field.is-wide { grid-column:1/-1; }
.todo-modal textarea { min-height:95px; }
@media (max-width:1000px) { .todo-main { grid-template-columns:180px minmax(0,1fr); } .todo-item { grid-template-columns:28px minmax(150px,1fr) 80px 70px 115px; } .todo-year-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) { .todo-shell { padding:10px; } .todo-main { grid-template-columns:1fr; } .todo-side { min-height:auto; padding:13px; } .todo-side h2,.todo-side-kicker,.todo-year-label,.todo-years,.todo-private-note { display:none; } .todo-side-nav { display:flex; overflow-x:auto; } .todo-side-button { min-width:max-content; } .todo-content-head { padding:20px 17px 15px; } .todo-toolbar { flex-wrap:wrap; padding:10px 17px; } .todo-toolbar-spacer { display:none; } .todo-search { width:100%; order:5; } .todo-stats { grid-template-columns:repeat(2,minmax(0,1fr)); padding:12px 17px 0; } .todo-view { padding:12px 17px 28px; } .todo-quick { grid-template-columns:1fr 1fr; } .todo-quick input:first-child { grid-column:1/-1; } .todo-item { grid-template-columns:28px minmax(120px,1fr) 70px; } .todo-item .todo-priority,.todo-item .todo-time { display:none; } .todo-summary-grid,.todo-year-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .todo-calendar { min-width:700px; } .todo-view:has(.todo-calendar) { overflow-x:auto; } }
@media (max-width:480px) { .todo-content-head { align-items:flex-start; flex-direction:column; } .todo-head-actions { width:100%; } .todo-head-actions .todo-button { flex:1; } .todo-summary-grid,.todo-year-grid { grid-template-columns:1fr; } .todo-form-grid { grid-template-columns:1fr; } .todo-form-grid .form-field.is-wide { grid-column:auto; } }

/* 字号舒展：保持原有信息密度与交互，仅给待办页面增加阅读留白。 */
.todo-main { grid-template-columns: 320px minmax(0, 1fr); }
.todo-side { padding: 28px 20px; }
.todo-side-nav { gap: 6px; }
.todo-side-button { min-height: 46px; padding: 10px 12px; font-size: 15px; }
.todo-side-icon { width: 27px; height: 27px; font-size: 15px; }
.todo-year { min-height: 40px; padding: 8px 12px; font-size: 15px; }
.todo-content-head { padding: 30px 34px 22px; }
.todo-content-head h1 { font-size: 28px; }
.todo-period-copy { font-size: 15px; }
.todo-button { min-height: 42px; padding: 9px 13px; font-size: 15px; }
.todo-toolbar { gap: 12px; padding: 14px 34px; }
.todo-period-nav button { width: 36px; height: 36px; }
.todo-today { min-height: 36px; font-size: 15px; }
.todo-filter, .todo-search { min-height: 40px; padding: 8px 11px; font-size: 15px; }
.todo-search { width: 220px; }
.todo-stats { gap: 11px; padding: 18px 34px 0; }
.todo-stat { min-height: 78px; padding: 14px 16px; }
.todo-stat span, .todo-card-meta { font-size: 15px; }
.todo-view { padding: 18px 34px 40px; }
.todo-quick { gap: 10px; margin-bottom: 14px; padding: 13px; }
.todo-quick input, .todo-quick select { min-height: 42px; padding: 9px 11px; font-size: 15px; }
.todo-group-head { min-height: 50px; padding: 12px 16px; }
.todo-group-head b, .todo-group-head span { font-size: 15px; }
.todo-item { min-height: 64px; padding: 10px 16px; gap: 11px; }
.todo-title { font-size: 15px; }
.todo-description, .todo-time, .todo-priority, .todo-actions button { font-size: 14px; }
.todo-actions button { min-height: 32px; padding: 6px 9px; }
.todo-calendar-day { min-height: 118px; padding: 10px; }
.todo-weekday { padding: 10px; }
.todo-summary-card { min-height: 170px; padding: 17px; }
.todo-summary-card h3 { font-size: 16px; }
.todo-summary-card p { font-size: 15px; }

@media (max-width: 1000px) {
  .todo-main { grid-template-columns: 260px minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .todo-main { grid-template-columns: 1fr; }
  .todo-side { padding: 16px; }
  .todo-content-head { padding: 24px 20px 18px; }
  .todo-toolbar { padding: 12px 20px; }
  .todo-stats { padding: 14px 20px 0; }
  .todo-view { padding: 14px 20px 32px; }
  .todo-quick input, .todo-quick select { min-height: 44px; }
}
