/* =============================================================================
 * 任务管理系统 v2.2.4 — 全局样式表
 * 
 * 包含：
 *   1. CSS 变量（6套主题皮肤）
 *   2. 基础样式 / 动画
 *   3. 认证页面
 *   4. 顶栏 / 主题切换器
 *   5. 布局 / 侧边栏
 *   6. 番茄钟小部件
 *   7. 内容区 / 任务表单
 *   8. 任务列表
 *   9. 月历 / 四象限
 *   10. 统计卡片 / 每日回顾
 *   11. 完整番茄钟面板 / 周图表
 *   12. 弹窗 / 设置
 *   13. Toast 提示 / 浮动番茄钟
 *   14. 响应式
 * ============================================================================= */

:root {
    --radius: 12px; --radius-sm: 8px; --radius-xs: 6px;
    --transition: 0.2s cubic-bezier(0.4,0,0.2,1);
    --font: -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
    --bg-gradient: none;
    --scrollbar-track: #F0F2F5;
    --scrollbar-thumb: #C0C8D4;
    --scrollbar-thumb-hover: #A0A8B4;
}

/* ========== 默认主题 ========== */
[data-theme="default"] {
    --primary: #4A90D9; --primary-light: #E8F1FB; --primary-dark: #3A7BC8;
    --danger: #E74C3C; --success: #27AE60; --warning: #F39C12; --info: #2980B9;
    --text: #2C3E50; --text-light: #7F8C8D; --text-muted: #95A5A6;
    --border: #E8ECF1; --bg: #F0F2F5; --card-bg: #FFFFFF; --sidebar-bg: #F8FAFB;
    --shadow: 0 1px 3px rgba(0,0,0,.08); --shadow-lg: 0 4px 16px rgba(0,0,0,.1);
    --glass: rgba(255,255,255,.85);
    --scrollbar-track: #F0F2F5; --scrollbar-thumb: #C0C8D4; --scrollbar-thumb-hover: #A0A8B4;
}
/* ========== 护眼绿 ========== */
[data-theme="green"] {
    --primary: #3CB371; --primary-light: #E8F5E9; --primary-dark: #2E7D32;
    --danger: #C0392B; --success: #27AE60; --warning: #F39C12; --info: #1E8449;
    --text: #2C3E50; --text-light: #7F8C8D; --text-muted: #95A5A6;
    --border: #C8E6C9; --bg: #F1F8F1; --card-bg: #FAFFFA; --sidebar-bg: #F2FAF2;
    --shadow: 0 1px 3px rgba(0,0,0,.06); --shadow-lg: 0 4px 16px rgba(0,0,0,.08);
    --glass: rgba(250,255,250,.88);
    --scrollbar-track: #F1F8F1; --scrollbar-thumb: #B0C8B0; --scrollbar-thumb-hover: #90A890;
}
/* ========== 樱花粉 ========== */
[data-theme="pink"] {
    --primary: #E87DA0; --primary-light: #FCE4EC; --primary-dark: #C96A8B;
    --danger: #D64550; --success: #6DAA6D; --warning: #E8A366; --info: #B07DA0;
    --text: #4A3539; --text-light: #8D7A7E; --text-muted: #A89699;
    --border: #F0D5DE; --bg: #FEF6F9; --card-bg: #FFFAFC; --sidebar-bg: #FDF4F7;
    --shadow: 0 1px 3px rgba(200,150,160,.1); --shadow-lg: 0 4px 16px rgba(200,150,160,.15);
    --glass: rgba(255,250,252,.88);
    --scrollbar-track: #FEF6F9; --scrollbar-thumb: #E8C0CE; --scrollbar-thumb-hover: #D8A0B0;
}
/* ========== 暗夜模式 ========== */
[data-theme="dark"] {
    --primary: #6C8CFF; --primary-light: #1E2A45; --primary-dark: #4A6FE0;
    --danger: #FF6B6B; --success: #4ECB71; --warning: #FFB84D; --info: #5DA0E8;
    --text: #E0E4EB; --text-light: #9BA3B2; --text-muted: #6B7385;
    --border: #2D3645; --bg: #1A1D24; --card-bg: #232730; --sidebar-bg: #1E212A;
    --shadow: 0 1px 3px rgba(0,0,0,.3); --shadow-lg: 0 4px 16px rgba(0,0,0,.4);
    --glass: rgba(35,39,48,.92);
    --scrollbar-track: #1A1D24; --scrollbar-thumb: #3D4455; --scrollbar-thumb-hover: #505870;
}
/* ========== 海洋蓝 ========== */
[data-theme="ocean"] {
    --primary: #0077B6; --primary-light: #E0F0FA; --primary-dark: #005A8C;
    --danger: #E63946; --success: #00B4D8; --warning: #F4A261; --info: #457B9D;
    --text: #1D3557; --text-light: #6B7D94; --text-muted: #8FA0B4;
    --border: #CCE0F0; --bg: #EEF4FA; --card-bg: #F8FBFE; --sidebar-bg: #F0F5FA;
    --shadow: 0 1px 3px rgba(0,80,130,.08); --shadow-lg: 0 4px 16px rgba(0,80,130,.12);
    --glass: rgba(248,251,254,.88);
    --scrollbar-track: #EEF4FA; --scrollbar-thumb: #B8D0E8; --scrollbar-thumb-hover: #98B8D8;
}
/* ========== 日落橙 ========== */
[data-theme="sunset"] {
    --primary: #E07B53; --primary-light: #FFF0E8; --primary-dark: #C56943;
    --danger: #D94040; --success: #5BA87D; --warning: #E8A040; --info: #C08060;
    --text: #4A3028; --text-light: #8D7065; --text-muted: #A89085;
    --border: #F0D5C8; --bg: #FFF7F3; --card-bg: #FFFCFA; --sidebar-bg: #FFF8F4;
    --shadow: 0 1px 3px rgba(200,120,80,.1); --shadow-lg: 0 4px 16px rgba(200,120,80,.15);
    --glass: rgba(255,252,250,.88);
    --scrollbar-track: #FFF7F3; --scrollbar-thumb: #E8D0C0; --scrollbar-thumb-hover: #D8B8A0;
}
/* ========== 岩石灰 ========== */
[data-theme="stone"] {
    --primary: #6B7B8D; --primary-light: #ECF0F2; --primary-dark: #566573;
    --danger: #C45A4A; --success: #5D8A6E; --warning: #B8965A; --info: #607D8B;
    --text: #37474F; --text-light: #78909C; --text-muted: #90A4AE;
    --border: #D5DBE0; --bg: #F0F3F5; --card-bg: #F8F9FA; --sidebar-bg: #EDF0F3;
    --shadow: 0 1px 3px rgba(100,110,120,.08); --shadow-lg: 0 4px 16px rgba(100,110,120,.12);
    --glass: rgba(247,249,250,.9);
    --scrollbar-track: #F0F3F5; --scrollbar-thumb: #C0C8D0; --scrollbar-thumb-hover: #A0A8B5;
}
/* ========== 摩卡棕 ========== */
[data-theme="coffee"] {
    --primary: #8D6E5A; --primary-light: #EDE0D8; --primary-dark: #6D5140;
    --danger: #B85C4A; --success: #6B8E6B; --warning: #C89858; --info: #7B6E60;
    --text: #3E3230; --text-light: #7A6A60; --text-muted: #A09088;
    --border: #E0D5C8; --bg: #FDF8F3; --card-bg: #FFFCF8; --sidebar-bg: #FDF6EE;
    --shadow: 0 1px 3px rgba(140,100,70,.08); --shadow-lg: 0 4px 16px rgba(140,100,70,.12);
    --glass: rgba(255,250,245,.88);
    --scrollbar-track: #FDF8F3; --scrollbar-thumb: #D8C8B5; --scrollbar-thumb-hover: #C0A890;
}
/* ========== 深夜暗 ========== */
[data-theme="midnight"] {
    --primary: #7B8CD0; --primary-light: #1E2440; --primary-dark: #5A6AB8;
    --danger: #E06060; --success: #50B870; --warning: #D4A040; --info: #6090D0;
    --text: #D8DEE8; --text-light: #98A0B8; --text-muted: #687090;
    --border: #2A3045; --bg: #0D1117; --card-bg: #161B25; --sidebar-bg: #111620;
    --shadow: 0 1px 3px rgba(0,0,0,.3); --shadow-lg: 0 4px 16px rgba(0,0,0,.4);
    --glass: rgba(18,24,34,.92);
    --scrollbar-track: #0D1117; --scrollbar-thumb: #2A3045; --scrollbar-thumb-hover: #3A4055;
}
/* ========== 毛玻璃 ========== */
[data-theme="frost"] {
    --primary: #7C8CE0; --primary-light: #E8EAFA; --primary-dark: #5A6AC0;
    --danger: #E06868; --success: #58B880; --warning: #D8A850; --info: #6888C8;
    --text: #3A4060; --text-light: #8088A8; --text-muted: #A0A8C0;
    --border: #D8DCF0; --bg: #F2F4FA; --card-bg: rgba(255,255,255,.7); --sidebar-bg: rgba(240,242,250,.75);
    --shadow: 0 1px 3px rgba(100,110,180,.08); --shadow-lg: 0 4px 16px rgba(100,110,180,.12);
    --glass: rgba(245,246,252,.72);
    --scrollbar-track: #F2F4FA; --scrollbar-thumb: #C8CCE0; --scrollbar-thumb-hover: #A8B0D0;
}
/* 毛玻璃主题特殊效果 */
[data-theme="frost"] .header{backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);background:rgba(245,246,252,.68);border-bottom:1px solid rgba(200,205,230,.4)}
[data-theme="frost"] .sidebar{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:rgba(240,242,250,.65);border-right:1px solid rgba(200,205,230,.35)}
[data-theme="frost"] .modal-box{background:rgba(255,255,255,.75);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.5)}
[data-theme="frost"] .task-item{background:rgba(255,255,255,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(200,205,230,.3)}
[data-theme="frost"] .task-item:hover{background:rgba(255,255,255,.72)}
[data-theme="frost"] .task-item.completed{background:rgba(245,246,252,.4)}
[data-theme="frost"] .header-btn,.theme-btn{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);background:rgba(255,255,255,.5);border:1px solid rgba(200,205,230,.3)}
[data-theme="frost"] .header-btn:hover,.theme-btn:hover{background:rgba(255,255,255,.7)}
[data-theme="frost"] .nav-item{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
[data-theme="frost"] .nav-item.active{background:rgba(124,140,224,.12)}
[data-theme="frost"] .form-group input,.auth-input{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);background:rgba(255,255,255,.5);border-color:rgba(200,205,230,.4)}
[data-theme="frost"] .form-group input:focus,.auth-input:focus{background:rgba(255,255,255,.7)}
/* ========== 暖沙 ========== */
[data-theme="sand"] {
    --primary: #C9A96E; --primary-light: #FDF5E6; --primary-dark: #A88D58;
    --danger: #D4735A; --success: #7BA870; --warning: #D4A040; --info: #B8A080;
    --text: #5D4E37; --text-light: #8B7D65; --text-muted: #A89880;
    --border: #EDE0CC; --bg: #FDFAF3; --card-bg: #FFFEFA; --sidebar-bg: #FDF8EE;
    --shadow: 0 1px 3px rgba(180,150,100,.08); --shadow-lg: 0 4px 16px rgba(180,150,100,.12);
    --glass: rgba(255,254,250,.9);
    --scrollbar-track: #FDFAF3; --scrollbar-thumb: #E0D0B8; --scrollbar-thumb-hover: #C8B898;
}
/* ========== 薰衣草 ========== */
[data-theme="lavender"] {
    --primary: #A78BFA; --primary-light: #F3F0FF; --primary-dark: #8B6FE0;
    --danger: #E06070; --success: #68B880; --warning: #D8B040; --info: #9080C8;
    --text: #3A3460; --text-light: #7B75A0; --text-muted: #A09ABB;
    --border: #E0DCF0; --bg: #F8F6FC; --card-bg: #FDFCFF; --sidebar-bg: #F6F4FA;
    --shadow: 0 1px 3px rgba(140,120,200,.08); --shadow-lg: 0 4px 16px rgba(140,120,200,.12);
    --glass: rgba(252,250,255,.88);
    --scrollbar-track: #F8F6FC; --scrollbar-thumb: #D0C8E8; --scrollbar-thumb-hover: #B8A8D8;
}

/* ========== 基础样式 ========== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{display:flex;flex-direction:column;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;height:100vh;overflow:hidden;transition:background var(--transition),color var(--transition)}
body.pomo-running{--pomo-border:var(--danger)}
.hidden{display:none!important}
.fade-in{animation:fadeIn .3s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.6}}
@keyframes spin{to{transform:rotate(360deg)}}

/* ========== 认证页面 ========== */
.auth-page{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;background:linear-gradient(135deg,#667eea 0%,#764ba2 50%,#f093fb 100%);overflow-y:auto;position:relative}
/* 毛玻璃背景装饰 */
.auth-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.auth-bg-circle{position:absolute;border-radius:50%;opacity:.15;animation:authFloat 12s ease-in-out infinite}
.auth-bg-c1{width:400px;height:400px;background:#fff;top:-80px;right:-120px;animation-delay:0s}
.auth-bg-c2{width:300px;height:300px;background:#f0e6ff;bottom:-60px;left:-80px;animation-delay:-4s}
.auth-bg-c3{width:200px;height:200px;background:#e0c3fc;top:50%;left:60%;animation-delay:-8s}
@keyframes authFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-30px) scale(1.08)}}
/* 毛玻璃卡片 */
.auth-card{background:rgba(255,255,255,.25);border-radius:20px;padding:44px 40px;width:420px;max-width:100%;box-shadow:0 8px 40px rgba(0,0,0,.12);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.35);position:relative;z-index:1}
.auth-logo{text-align:center;font-size:48px;margin-bottom:4px;filter:drop-shadow(0 2px 8px rgba(0,0,0,.1))}
.auth-card h2{text-align:center;color:#2d3748;margin-bottom:6px;font-size:24px;font-weight:700}
.auth-card .auth-sub{text-align:center;color:rgba(45,55,72,.65);font-size:13px;margin-bottom:28px}
.auth-card .form-group{margin-bottom:16px}
.auth-card label{display:block;font-size:13px;color:rgba(45,55,72,.7);margin-bottom:5px;font-weight:500}
.auth-input{width:100%;padding:11px 14px;border:1.5px solid rgba(255,255,255,.5);border-radius:12px;font-size:14px;outline:none;font-family:var(--font);background:rgba(255,255,255,.35);color:#2d3748;transition:all var(--transition)}
.auth-input::placeholder{color:rgba(45,55,72,.35)}
.auth-input:focus{border-color:rgba(102,126,234,.6);background:rgba(255,255,255,.55);box-shadow:0 0 0 3px rgba(102,126,234,.15)}
.auth-btn{width:100%;padding:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:15px;font-weight:600;cursor:pointer;margin-top:10px;font-family:var(--font);transition:all var(--transition);box-shadow:0 4px 15px rgba(102,126,234,.3)}
.auth-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(102,126,234,.4)}
.auth-btn:active{transform:translateY(0)}
.auth-switch{text-align:center;margin-top:16px;font-size:13px;color:rgba(45,55,72,.65)}
.auth-switch a{color:#667eea;cursor:pointer;text-decoration:none;font-weight:600}
.auth-msg{text-align:center;font-size:13px;margin-top:10px;min-height:20px;transition:all .3s}
.auth-msg.error{color:#e53e3e}.auth-msg.success{color:#38a169}
.auth-card .remember-label{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(45,55,72,.65);cursor:pointer;user-select:none;font-weight:400;margin-bottom:0}
.remember-label input[type="checkbox"]{width:auto;accent-color:#667eea;cursor:pointer;flex-shrink:0}
.auth-version{text-align:center;margin-top:12px;font-size:11px;color:rgba(45,55,72,.35);letter-spacing:0.5px}

/* ========== 顶栏 ========== */
.header{background:var(--glass);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;box-shadow:var(--shadow)}
.header-inner{width:70%;max-width:1340px;margin:0 auto;padding:0 24px;height:60px;display:flex;align-items:center;justify-content:space-between}
.header-left{display:flex;align-items:center;gap:20px;flex:1}
.header-logo{font-size:19px;font-weight:700;color:var(--primary);display:flex;align-items:center;gap:8px;cursor:pointer}
.header-logo::before{content:'✓';display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:var(--radius-sm);background:var(--primary);color:#fff;font-size:16px;font-weight:700}
.header-search{position:relative;width:280px}
.header-search input{width:100%;padding:8px 14px 8px 36px;border:2px solid var(--border);border-radius:20px;font-size:13px;outline:none;font-family:var(--font);background:var(--bg);color:var(--text);transition:all var(--transition)}
.header-search input:focus{border-color:var(--primary);background:var(--card-bg);width:320px}
.header-search::before{content:'🔍';position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:13px;pointer-events:none}
.header-right{display:flex;align-items:center;gap:6px}
.header-user{font-size:13px;color:var(--text-light);padding:6px 10px;border-radius:var(--radius-xs);cursor:pointer;transition:all var(--transition);border:1px solid transparent}
.header-user:hover{background:var(--primary-light);color:var(--primary);border-color:var(--primary)}
.header-btn{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-xs);padding:6px 12px;font-size:12px;cursor:pointer;color:var(--text);font-family:var(--font);transition:all var(--transition);display:flex;align-items:center;gap:4px}
.header-btn:hover{background:var(--card-bg);border-color:var(--primary);color:var(--primary)}
.header-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.header-version{font-size:11px;color:var(--text-muted);background:var(--bg);padding:3px 8px;border-radius:10px;margin-left:4px}

/* ========== 主题切换按钮 ========== */
.theme-btn{width:32px;height:32px;border-radius:50%;border:2px solid var(--border);background:var(--card-bg);cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:all var(--transition);margin-right:4px}
.theme-btn:hover{transform:scale(1.1);border-color:var(--primary);box-shadow:0 0 8px var(--primary-light)}
/* 主题选择弹窗 */
.theme-picker-box{max-width:480px}
.theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.theme-card{cursor:pointer;border-radius:12px;border:2px solid var(--border);padding:16px 12px;text-align:center;transition:all var(--transition);background:var(--card-bg)}
.theme-card:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.08)}
.theme-card.active{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}
.theme-card .tc-dots{display:flex;gap:4px;justify-content:center;margin-bottom:8px}
.theme-card .tc-dot{width:16px;height:16px;border-radius:50%}
.theme-card .tc-name{font-size:13px;font-weight:600;color:var(--text);margin-bottom:2px}
.theme-card .tc-desc{font-size:11px;color:var(--text-muted)}

/* ========== 布局 ========== */
#mainApp{display:flex;flex-direction:column;flex:1;min-height:0}
.layout{display:flex;width:70%;max-width:1340px;margin:0 auto;flex:1;min-height:0}
.sidebar{width:240px;flex-shrink:0;background:var(--sidebar-bg);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow-y:auto;padding:12px 0}

.nav-section{margin-bottom:4px}
.nav-section-title{font-size:14px;font-weight:700;color:var(--text);padding:14px 18px 6px}
.nav-item{display:flex;align-items:center;gap:10px;padding:7px 14px;margin:1px 10px;border-radius:var(--radius-sm);cursor:pointer;font-size:13px;color:var(--text);transition:all var(--transition);position:relative}
.nav-item:hover{background:var(--primary-light);color:var(--primary-dark)}
.nav-item.active{background:var(--primary)!important;color:#fff!important;font-weight:600;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.nav-item .nav-icon{font-size:15px;width:22px;text-align:center;flex-shrink:0}
.nav-item .nav-label{flex:1}
.nav-item .nav-count{font-size:11px;background:rgba(0,0,0,.08);padding:2px 8px;border-radius:10px;font-weight:600}
.nav-item.active .nav-count{background:rgba(255,255,255,.25);color:#fff}
.category-list,.tag-list{margin-top:2px}
.category-item,.tag-item{display:flex;align-items:center;gap:8px;padding:5px 14px 5px 28px;margin:1px 10px;border-radius:var(--radius-sm);cursor:pointer;font-size:12px;transition:all var(--transition)}
.category-item:hover,.tag-item:hover{background:var(--primary-light)}
.category-item.active,.tag-item.active{background:var(--primary-light);color:var(--primary);font-weight:600}
.category-dot,.tag-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.category-name,.tag-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.category-count,.tag-count{font-size:11px;color:var(--text-light)}
.category-delete,.tag-delete{display:none;color:var(--text-muted);font-size:14px;cursor:pointer;padding:2px 4px;border-radius:3px}
.category-item:hover .category-delete,.tag-item:hover .tag-delete{display:inline}
.category-delete:hover,.tag-delete:hover{color:var(--danger);background:rgba(231,76,60,.1)}
.btn-new{display:block;margin:6px 16px;padding:6px 12px;font-size:12px;color:var(--primary);background:var(--bg);border:1px dashed var(--border);border-radius:var(--radius-xs);cursor:pointer;font-family:var(--font);text-align:center;transition:all var(--transition)}
.btn-new:hover{background:var(--primary-light);border-color:var(--primary)}

/* ========== 页脚 ========== */
.footer{background:var(--card-bg);border-top:1px solid var(--border);padding:0;height:60px;position:sticky;bottom:0;z-index:100}
.footer-inner{width:70%;max-width:1340px;margin:0 auto;padding:0 24px;height:100%;display:flex;align-items:center;justify-content:space-between}
.footer-left,.footer-right,.footer-center{display:flex;align-items:center;gap:10px}
.footer-logo{font-size:14px;font-weight:600;color:var(--primary)}
.footer-version{font-size:10px;color:var(--text-muted);background:var(--bg);padding:2px 8px;border-radius:8px}
.footer-center{font-size:13px;color:var(--text-light);letter-spacing:1px}
.footer-right{font-size:12px;color:var(--text-muted)}

/* ========== 番茄钟侧边栏小部件 ========== */
.pomo-widget{margin:12px 14px;padding:14px;background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border);text-align:center}
.pomo-widget .pomo-timer{font-size:36px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.pomo-widget.pomo-active .pomo-timer{color:var(--danger);animation:pulse 2s infinite}
.pomo-widget .pomo-label{font-size:11px;color:var(--text-muted);margin:4px 0 10px}
.pomo-controls{display:flex;gap:6px;justify-content:center}
.pomo-btn{padding:5px 14px;border:none;border-radius:var(--radius-xs);font-size:12px;cursor:pointer;font-family:var(--font);font-weight:600;transition:all var(--transition)}
.pomo-btn-start{background:var(--success);color:#fff}
.pomo-btn-start:hover{opacity:.9;transform:scale(1.02)}
.pomo-btn-stop{background:var(--danger);color:#fff}
.pomo-btn-reset{background:var(--bg);color:var(--text);border:1px solid var(--border)}
.pomo-btn-reset:hover{background:var(--border)}
.pomo-stats{display:flex;justify-content:center;gap:12px;margin-top:8px;font-size:11px;color:var(--text-light)}
.pomo-stats span{display:flex;align-items:center;gap:3px}
.pomo-preset-row{display:flex;justify-content:center;gap:8px;margin:6px 0}
.pomo-preset{font-size:11px;padding:2px 8px;border-radius:10px;background:var(--bg);cursor:pointer;color:var(--text-light);border:1px solid transparent;transition:all var(--transition)}
.pomo-preset:hover,.pomo-preset.selected{background:var(--primary-light);color:var(--primary);border-color:var(--primary)}

/* ========== 内容区 ========== */
.content{flex:1;min-width:0;padding:20px 24px;display:flex;flex-direction:column;overflow-x:hidden}
#listView,#reviewView{flex:1;overflow-y:auto;overflow-x:hidden;min-height:0}
#quadrantsView,#pomodoroView{flex:1;display:flex;flex-direction:column;min-height:0}
#calendarView{flex:1;display:flex;flex-direction:column;min-height:0}
.content-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.content-title{font-size:22px;font-weight:700}
.content-sub{font-size:13px;color:var(--text-light);margin-top:2px}
.view-tabs{display:flex;gap:4px;background:var(--card-bg);border-radius:var(--radius);padding:4px;box-shadow:var(--shadow);margin-bottom:14px;border:1px solid var(--border)}
.view-tab{flex:1;padding:8px 12px;text-align:center;font-size:13px;border-radius:var(--radius-sm);cursor:pointer;border:none;background:transparent;color:var(--text-light);font-family:var(--font);transition:all var(--transition)}
.view-tab:hover{color:var(--text);background:var(--bg)}
.view-tab.active{background:var(--primary);color:#fff;font-weight:600;box-shadow:var(--shadow)}

/* ========== 任务快速添加表单 ========== */
.task-form{background:var(--card-bg);border-radius:var(--radius);padding:16px;margin-bottom:14px;box-shadow:var(--shadow);border:1px solid var(--border);overflow-x:hidden}
.task-form-row{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.task-form-row input,.task-form-row select{padding:9px 12px;border:2px solid var(--border);border-radius:var(--radius-sm);font-size:13px;font-family:var(--font);color:var(--text);background:var(--bg);outline:none;transition:border var(--transition)}
.task-form-row input:focus,.task-form-row select:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}
.task-input-title{flex:1;min-width:160px}
.task-input-category{width:100px}.task-input-priority{width:95px}.task-input-date{width:140px}.task-input-time{width:110px}.task-input-reminder{width:95px}
.btn-submit{padding:9px 20px;background:var(--primary);color:#fff;border:none;border-radius:var(--radius-sm);font-size:13px;cursor:pointer;font-family:var(--font);font-weight:600;white-space:nowrap;transition:all var(--transition)}
.btn-submit:hover{background:var(--primary-dark);transform:translateY(-1px)}
.btn-submit:active{transform:translateY(0)}
.tag-select-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;align-items:center}
.tag-pill{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:12px;font-size:11px;cursor:pointer;border:1px solid var(--border);user-select:none;transition:all var(--transition)}
.tag-pill.selected{color:#fff;border-color:transparent}
.tag-pill:not(.selected){background:var(--bg);color:var(--text-light)}
.tag-pill:not(.selected):hover{border-color:var(--primary);color:var(--primary)}

/* ========== 任务列表 ========== */
.task-group{margin-bottom:6px}
.task-group-title{font-size:12px;font-weight:600;color:var(--text-muted);padding:8px 6px;display:flex;align-items:center;gap:6px;position:sticky;top:0;background:var(--bg);z-index:5;text-transform:uppercase;letter-spacing:.5px}
.task-list{display:flex;flex-direction:column;gap:4px}
.task-item{background:var(--card-bg);border-radius:var(--radius-sm);padding:12px 16px;display:flex;align-items:center;gap:12px;box-shadow:var(--shadow);border:1px solid var(--border);transition:all .35s;position:relative}
.task-item:hover{box-shadow:var(--shadow-lg);border-color:var(--primary);transform:translateX(2px)}
.task-item.completing{opacity:0;transform:translateX(30px);max-height:0;padding:0;margin:0;border:0;overflow:hidden}
.task-item.completed .task-title{text-decoration:line-through;color:var(--text-light)}
.task-item.doing{border-left:3px solid var(--warning)}
.task-item.sub-task{padding-left:36px;border-left:2px solid var(--primary-light);position:relative}
.task-item.sub-task::before{content:'';position:absolute;left:18px;top:50%;width:12px;height:1px;background:var(--primary-light)}
.task-checkbox{width:20px;height:20px;border:2px solid var(--border);border-radius:50%;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;color:transparent;transition:all var(--transition)}
.task-checkbox:hover{border-color:var(--success);background:rgba(39,174,96,.1)}
.task-item.completed .task-checkbox{background:var(--success);border-color:var(--success);color:#fff}
.task-state-btn{font-size:11px;padding:2px 8px;border-radius:10px;cursor:pointer;border:1px solid var(--border);background:var(--bg);color:var(--text-light);font-family:var(--font);transition:all var(--transition);white-space:nowrap}
.task-state-btn:hover{background:var(--primary-light);color:var(--primary);border-color:var(--primary)}
.task-state-btn.doing{background:var(--warning);color:#fff;border-color:var(--warning)}
.task-state-btn.done{background:var(--success);color:#fff;border-color:var(--success)}
.task-content{flex:1;min-width:0;overflow:hidden}
.task-title{font-size:14px;font-weight:500;word-break:break-all;cursor:pointer;line-height:1.4}
.task-title:hover{color:var(--primary)}
.task-meta{display:flex;align-items:center;gap:6px;margin-top:4px;font-size:11px;color:var(--text-light);flex-wrap:wrap}
.task-category-tag{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:10px;font-size:11px;color:#fff}
.task-time{display:inline-flex;align-items:center;gap:3px;font-size:11px}
.task-time.overdue{color:var(--danger);font-weight:600}.task-time.today-due{color:var(--warning);font-weight:600}
.task-tags{display:flex;gap:3px;flex-wrap:wrap}
.task-tag-mini{padding:1px 7px;border-radius:8px;font-size:10px;color:#fff}
.task-pomo-count{display:inline-flex;align-items:center;gap:2px;font-size:11px;color:var(--primary);background:var(--primary-light);padding:2px 6px;border-radius:8px}
.sub-connector{color:var(--primary);font-weight:700;font-size:13px;opacity:.7}
.task-sub-badge{display:inline-flex;align-items:center;gap:2px;font-size:11px;color:var(--info);background:var(--primary-light);padding:2px 7px;border-radius:8px;cursor:default}
.task-actions{display:flex;gap:4px;opacity:0;transition:opacity var(--transition);flex-shrink:0}
.task-item:hover .task-actions{opacity:1}
.task-actions .act-btn{padding:4px 8px;border:none;background:none;cursor:pointer;font-size:13px;border-radius:4px;color:var(--text-light);transition:all var(--transition)}
.task-actions .act-btn:hover{color:var(--primary);background:var(--primary-light)}
.task-actions .act-btn.danger:hover{color:var(--danger);background:rgba(231,76,60,.1)}
.task-trash-actions{display:flex;gap:8px;opacity:0;transition:opacity var(--transition)}
.task-item:hover .task-trash-actions{opacity:1}
.task-trash-actions .link{font-size:12px;color:var(--primary);cursor:pointer;font-weight:500}
.task-trash-actions .link.danger{color:var(--danger)}
.empty-state{text-align:center;padding:60px 20px;color:var(--text-light)}
.empty-state-icon{font-size:56px;margin-bottom:16px;opacity:.4}
.empty-state-text{font-size:14px}

/* ========== 工具栏 ========== */
.content-toolbar{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.content-toolbar .sort-btn{padding:5px 12px;font-size:12px;border:1px solid var(--border);border-radius:var(--radius-xs);background:var(--card-bg);cursor:pointer;font-family:var(--font);color:var(--text-light);transition:all var(--transition)}
.content-toolbar .sort-btn:hover,.content-toolbar .sort-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}

/* ========== 日历工具栏 ========== */
.calendar-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-shrink:0}
.cal-toolbar-title{font-size:16px;font-weight:600;min-width:160px;text-align:center}
.cal-toolbar-btn{padding:5px 14px;border:1px solid var(--border);background:var(--card-bg);border-radius:var(--radius-xs);cursor:pointer;font-size:13px;font-family:var(--font);color:var(--text);transition:all var(--transition)}
.cal-toolbar-btn:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.cal-view-tabs{display:flex;gap:2px;background:var(--bg);border-radius:var(--radius-xs);padding:2px;margin-left:auto}
.cal-view-tab{padding:5px 12px;border:none;border-radius:4px;font-size:12px;cursor:pointer;background:transparent;color:var(--text-light);font-family:var(--font);transition:all var(--transition)}
.cal-view-tab:hover{color:var(--text);background:var(--card-bg)}
.cal-view-tab.active{background:var(--primary);color:#fff;font-weight:600}

/* ========== 月历视图 ========== */
.full-calendar{display:flex;flex-direction:column;flex:1;min-height:0;background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;border:1px solid var(--border)}
.full-cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid var(--border);background:var(--sidebar-bg);flex-shrink:0}
.full-cal-weekday{padding:8px;text-align:center;font-size:12px;color:var(--text-muted);font-weight:600}
.full-cal-days{display:grid;grid-template-columns:repeat(7,1fr);flex:1;min-height:0}
.full-cal-day{border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:4px 5px;position:relative;background:var(--card-bg);transition:background var(--transition);overflow:hidden;display:flex;flex-direction:column}
.full-cal-day:nth-child(7n){border-right:none}
.full-cal-day.other-month{background:var(--sidebar-bg);color:var(--text-muted);opacity:.6}
.full-cal-day.today{background:var(--primary-light)}
.full-cal-day:hover{filter:brightness(.97);cursor:pointer}
.full-cal-day-num{font-size:11px;margin-bottom:2px;font-weight:600;flex-shrink:0}
.full-cal-day.today .full-cal-day-num{color:var(--primary);font-size:12px;font-weight:700}
.full-cal-tasks{display:flex;flex-direction:column;gap:1px;flex:1;min-height:0;overflow:hidden}
.full-cal-task{font-size:10px;padding:2px 4px;border-radius:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;color:#fff;flex-shrink:0;line-height:1.3}
.full-cal-task.completed{opacity:.5;text-decoration:line-through}
.full-cal-more{font-size:10px;color:var(--text-muted);cursor:pointer;font-weight:600;flex-shrink:0;padding:1px 4px}
.full-cal-more:hover{color:var(--primary)}

/* ========== 周视图 ========== */
.week-view{display:flex;flex-direction:column;flex:1;min-height:0;background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;border:1px solid var(--border)}
.week-view-header{display:flex;align-items:center;gap:8px;padding:10px 14px;font-size:13px;color:var(--text);border-bottom:1px solid var(--border);background:var(--sidebar-bg);flex-shrink:0}
.week-view-header .week-num-badge{background:var(--primary);color:#fff;padding:2px 10px;border-radius:10px;font-size:12px;font-weight:600}
.week-view-grid{display:grid;grid-template-columns:repeat(7,1fr);flex:1;min-height:0}
.week-day-col{border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;min-width:0}
.week-day-col:last-child{border-right:none}
.week-day-header{padding:8px 4px;text-align:center;font-size:11px;border-bottom:1px solid var(--border);background:var(--sidebar-bg);flex-shrink:0}
.week-day-header .wday-num{font-size:22px;font-weight:700;line-height:1.2}
.week-day-header .wday-label{font-size:10px;color:var(--text-muted)}
.week-day-header.today{background:var(--primary-light)}
.week-day-header.today .wday-num{color:var(--primary)}
.week-day-body{flex:1;overflow-y:auto;padding:4px;display:flex;flex-direction:column;gap:2px}

.week-task{font-size:10px;padding:2px 5px;border-radius:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;color:#fff;line-height:1.4}
.week-task.completed{opacity:.5;text-decoration:line-through}
.week-day-body .cal-more-link{font-size:10px;color:var(--text-muted);cursor:pointer;text-align:center;padding:2px}
.week-day-body .cal-more-link:hover{color:var(--primary)}

/* ========== 日视图 ========== */
.day-view{display:flex;flex-direction:column;flex:1;min-height:0;background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;border:1px solid var(--border)}
.day-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);flex-shrink:0}
.day-header-left{display:flex;align-items:baseline;gap:12px}
.day-date-num{font-size:36px;font-weight:700;color:var(--primary);line-height:1}
.day-date-info{display:flex;flex-direction:column}
.day-date-weekday{font-size:16px;font-weight:600}
.day-date-full{font-size:12px;color:var(--text-muted)}
.day-view .task-list{flex:1;overflow-y:auto;padding:12px 16px}
.day-view .task-list .empty-state{padding:40px 20px}
.day-view .task-item{border:none;border-bottom:1px solid var(--border);border-radius:0;box-shadow:none}
.day-view .task-item:last-child{border-bottom:none}

/* ========== 四象限视图 ========== */
.quadrants-grid{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:12px}
.quadrant{background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);min-height:0;border:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden}
.quadrant-header{padding:14px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-shrink:0}
.quadrant-title{font-size:14px;font-weight:600}.quadrant-count{font-size:11px;color:var(--text-light);background:var(--bg);padding:2px 8px;border-radius:10px}
.quadrant.urgent-important .quadrant-header{border-left:4px solid var(--danger)}
.quadrant.important .quadrant-header{border-left:4px solid var(--warning)}
.quadrant.urgent .quadrant-header{border-left:4px solid var(--primary)}
.quadrant.normal .quadrant-header{border-left:4px solid var(--text-muted)}
.quadrant-body{flex:1;min-height:0;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:2px}
.quadrant-task{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:var(--radius-xs);cursor:pointer;font-size:12px;transition:background var(--transition)}
.quadrant-task:hover{background:var(--bg)}
.q-checkbox{width:16px;height:16px;border:2px solid var(--border);border-radius:50%;cursor:pointer;flex-shrink:0;transition:all var(--transition)}
.q-checkbox.done{background:var(--success);border-color:var(--success)}

/* ========== 摘要统计 ========== */
.summary-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:16px}
.summary-card{background:var(--card-bg);border-radius:var(--radius);padding:18px 16px;box-shadow:var(--shadow);text-align:center;border:1px solid var(--border);transition:all var(--transition);cursor:default}
.summary-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.summary-card .num{font-size:32px;font-weight:700;color:var(--primary)}
.summary-card .label{font-size:12px;color:var(--text-light);margin-top:4px}
.summary-card.danger .num{color:var(--danger)}.summary-card.success .num{color:var(--success)}.summary-card.info .num{color:var(--info)}

/* ========== 每日回顾 ========== */
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px}
.review-card{background:var(--card-bg);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);border:1px solid var(--border);text-align:center;transition:all var(--transition)}
.review-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.review-card .r-icon{font-size:28px;margin-bottom:8px}
.review-card .r-value{font-size:28px;font-weight:700;color:var(--primary)}
.review-card .r-label{font-size:12px;color:var(--text-light);margin-top:2px}
.review-bar{display:flex;height:6px;border-radius:3px;overflow:hidden;background:var(--bg);margin-top:4px}
.review-bar-fill{height:100%;background:var(--primary);border-radius:3px;transition:width .6s ease}

/* ========== 完整番茄钟面板 ========== */
.pomo-full{background:var(--card-bg);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);border:1px solid var(--border);text-align:center;flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.pomo-full .pomo-big-timer{font-size:72px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text);transition:color var(--transition);flex-shrink:0}
.pomo-full.pomo-active .pomo-big-timer{color:var(--danger)}
.pomo-full .pomo-big-label{font-size:14px;color:var(--text-muted);margin:6px 0 16px;flex-shrink:0}
.pomo-full .pomo-big-controls{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;flex-shrink:0}
.pomo-big-btn{padding:10px 24px;border:none;border-radius:var(--radius-xs);font-size:14px;cursor:pointer;font-family:var(--font);font-weight:600;transition:all var(--transition)}
.pomo-big-btn.start{background:var(--primary);color:#fff}.pomo-big-btn.start:hover{background:var(--primary-dark)}
.pomo-big-btn.stop{background:var(--danger);color:#fff}.pomo-big-btn.stop:hover{opacity:.9}
.pomo-big-btn.reset{background:var(--bg);color:var(--text);border:1px solid var(--border)}.pomo-big-btn.reset:hover{background:var(--border)}
.pomo-big-btn.short{background:var(--success);color:#fff}.pomo-big-btn.short:hover{opacity:.9}
.pomo-big-btn.long{background:var(--info);color:#fff}.pomo-big-btn.long:hover{opacity:.9}
.pomo-config{display:flex;gap:8px;justify-content:center;margin-bottom:14px;font-size:13px;align-items:center;color:var(--text-light);flex-shrink:0}
.pomo-config input{width:50px;padding:4px 6px;border:1px solid var(--border);border-radius:4px;text-align:center;font-size:13px;font-family:var(--font);background:var(--bg);color:var(--text)}
.pomo-config select{padding:4px 8px;border:1px solid var(--border);border-radius:4px;font-size:13px;font-family:var(--font);background:var(--bg);color:var(--text);max-width:180px;outline:none;transition:border var(--transition),box-shadow var(--transition)}
.pomo-config select:focus{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}
.pomo-today-stats{display:flex;justify-content:center;gap:24px;margin-top:14px;font-size:13px;color:var(--text-light);flex-shrink:0}
.pomo-today-stats strong{color:var(--primary);font-size:16px}

/* ========== 周图表 ========== */
.pomo-week-chart{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;margin-top:18px;box-shadow:var(--shadow)}
.pomo-week-title{font-size:13px;font-weight:600;color:var(--text);text-align:center;margin-bottom:10px}
.week-chart{display:flex;gap:4px;align-items:stretch;justify-content:center;height:100px;margin-top:auto}
.week-bar-col{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;flex:1;max-width:40px}
.week-bar{width:100%;background:var(--primary);border-radius:3px 3px 0 0;min-height:2px;transition:height .5s ease}
.week-bar-label{font-size:10px;color:var(--text-muted);text-align:center;margin-top:4px;line-height:1}
.week-chart-empty{text-align:center;color:var(--text-muted);font-size:12px;padding:24px 0}
/* ========== 弹窗系统 ========== */
.modal-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;backdrop-filter:blur(2px)}
.modal-overlay.show{display:flex;animation:fadeIn .2s ease}
.modal-box{background:var(--card-bg);border-radius:var(--radius);padding:24px;width:540px;max-width:92vw;max-height:88vh;overflow-y:auto;box-shadow:0 12px 40px rgba(0,0,0,.25);animation:slideUp .25s ease;position:relative}
.modal-box.modal-wide{width:720px}
.modal-box h3{margin-bottom:16px;font-size:16px;color:var(--text);display:flex;align-items:center;gap:8px;padding-right:28px}
.modal-close{position:absolute;top:16px;right:16px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:none;background:transparent;color:var(--text-muted);font-size:18px;cursor:pointer;transition:all var(--transition);line-height:1}
.modal-close:hover{background:var(--bg);color:var(--text)}
.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}
.btn-cancel,.btn-save{padding:9px 22px;border-radius:var(--radius-xs);font-size:14px;font-family:var(--font);cursor:pointer;font-weight:600;transition:all var(--transition)}
.btn-cancel{border:1px solid var(--border);background:var(--bg);color:var(--text)}.btn-cancel:hover{background:var(--border)}
.btn-save{border:none;background:var(--primary);color:#fff}.btn-save:hover{background:var(--primary-dark)}
.btn-danger{padding:9px 22px;border:none;border-radius:var(--radius-xs);font-size:14px;font-family:var(--font);cursor:pointer;font-weight:600;transition:all var(--transition);background:var(--danger);color:#fff}
.btn-danger:hover{opacity:.85;transform:translateY(-1px)}
.btn-danger:active{transform:translateY(0)}
/* 确认弹窗 */
.confirm-box{width:400px;text-align:center}
.confirm-box h3{justify-content:center;padding-right:0}
.confirm-msg{color:var(--text-light);font-size:14px;line-height:1.6;margin-bottom:8px}
.confirm-box .modal-actions{justify-content:center;gap:16px}.edit-field{margin-bottom:12px}
.edit-field label{display:block;font-size:12px;color:var(--text-light);margin-bottom:4px;font-weight:600}
.edit-field input,.edit-field select,.edit-field textarea{width:100%;padding:9px 12px;border:2px solid var(--border);border-radius:var(--radius-xs);font-size:13px;font-family:var(--font);outline:none;color:var(--text);background:var(--bg);transition:border var(--transition)}
.edit-field input:focus,.edit-field select:focus,.edit-field textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}
.edit-field textarea{resize:vertical;min-height:70px}
.edit-row{display:flex;gap:8px}.edit-row .edit-field{flex:1}
.tag-edit-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.tag-edit-pill{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:12px;font-size:12px;cursor:pointer;border:1px solid var(--border);transition:all var(--transition)}
.tag-edit-pill.selected{color:#fff}
.tag-edit-pill:not(.selected){background:var(--bg);color:var(--text-light)}
.color-options{display:flex;gap:8px;flex-wrap:wrap}
.color-dot{width:28px;height:28px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:all var(--transition)}
.color-dot:hover{transform:scale(1.15)}
.color-dot.selected{border-color:var(--text);box-shadow:0 0 0 2px var(--card-bg),0 0 0 4px var(--primary)}

/* ========== 自定义提醒 ========== */
.custom-reminder-row{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:12px;color:var(--text-light)}
.custom-reminder-row input{padding:7px 10px;border:2px solid var(--border);border-radius:var(--radius-xs);font-size:13px;font-family:var(--font);background:var(--bg);color:var(--text)}
.custom-reminder-row input:focus{border-color:var(--primary);outline:none}

/* ========== 附件区域 ========== */
.attach-zone{margin-top:6px}
.btn-attach{padding:8px 14px;font-size:12px;background:var(--primary);color:#fff;border:none;border-radius:var(--radius-xs);cursor:pointer;font-family:var(--font);font-weight:600;transition:all var(--transition)}
.btn-attach:hover{background:var(--primary-dark);transform:translateY(-1px)}
.attach-hint{display:block;font-size:11px;color:var(--text-muted);margin-top:4px}
.attach-list{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.attach-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg);border-radius:var(--radius-xs);font-size:12px}
.attach-item .att-name{flex:1;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attach-item .att-size{color:var(--text-muted);font-size:11px;white-space:nowrap}
.attach-item .att-actions{display:flex;gap:6px}
.attach-item .att-btn{font-size:11px;padding:2px 8px;border:1px solid var(--border);border-radius:4px;cursor:pointer;background:var(--card-bg);color:var(--text-light);font-family:var(--font);transition:all var(--transition)}
.attach-item .att-btn:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.attach-item .att-btn.danger:hover{background:var(--danger);border-color:var(--danger)}

/* ========== 子任务 ========== */
.edit-section{margin-bottom:12px;border-top:1px solid var(--border);padding-top:12px}
.edit-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.edit-section-header label{font-size:12px;color:var(--text-light);font-weight:600}
.btn-small{padding:6px 14px;font-size:12px;background:var(--primary);color:#fff;border:none;border-radius:var(--radius-xs);cursor:pointer;font-family:var(--font);font-weight:600;transition:all var(--transition)}
.btn-small:hover{background:var(--primary-dark);transform:translateY(-1px)}
.subtask-list{display:flex;flex-direction:column;gap:6px}
.subtask-item{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--bg);border-radius:var(--radius-xs);font-size:12px}
.subtask-item .sub-checkbox{width:16px;height:16px;border:2px solid var(--border);border-radius:50%;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:10px;transition:all var(--transition)}
.subtask-item .sub-checkbox.done{background:var(--success);border-color:var(--success);color:#fff}
.subtask-item .sub-title{flex:1;font-size:12px}
.subtask-item .sub-title input{width:100%;padding:4px 6px;border:1px solid var(--border);border-radius:4px;font-size:12px;font-family:var(--font);background:var(--card-bg);color:var(--text)}
.subtask-item .sub-date{font-size:11px;color:var(--text-muted)}
.subtask-item .sub-date input{border:1px solid var(--border);border-radius:4px;padding:2px 4px;font-size:11px;font-family:var(--font);background:var(--card-bg);color:var(--text)}
.subtask-item .sub-del{color:var(--text-muted);cursor:pointer;font-size:14px;padding:2px;border-radius:3px}
.subtask-item .sub-del:hover{color:var(--danger);background:rgba(231,76,60,.1)}

/* ========== 图标选择器 ========== */
.icon-options{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.icon-option{padding:6px 10px;border-radius:var(--radius-xs);cursor:pointer;font-size:18px;border:2px solid transparent;transition:all var(--transition)}
.icon-option:hover{background:var(--bg);border-color:var(--border)}
.icon-option.selected{border-color:var(--primary);background:var(--primary-light)}

/* ========== 工作日选择器 ========== */
.weekday-select{display:flex;gap:4px;margin-top:4px}
.wday-chip{padding:6px 10px;border-radius:var(--radius-xs);font-size:12px;cursor:pointer;border:2px solid var(--border);background:var(--bg);color:var(--text-light);transition:all var(--transition);user-select:none}
.wday-chip.selected{background:var(--primary);color:#fff;border-color:var(--primary)}

/* ========== 重复任务选择器 ========== */
.weekday-picker{display:flex;gap:6px;flex-wrap:wrap}
.weekday-btn{display:inline-flex;align-items:center;gap:3px;padding:6px 10px;border-radius:var(--radius-xs);font-size:12px;cursor:pointer;border:2px solid var(--border);background:var(--bg);color:var(--text-light);transition:all var(--transition);user-select:none}
.weekday-btn:has(input:checked){background:var(--primary);color:#fff;border-color:var(--primary)}
.weekday-btn input[type="checkbox"]{display:none}
.task-recur-icon{display:inline-flex;align-items:center;gap:2px;font-size:11px;color:var(--primary);background:var(--primary-light);padding:1px 6px;border-radius:10px;margin-left:4px;white-space:nowrap;vertical-align:middle}
.task-item.completed .task-recur-icon{text-decoration:none}

/* ========== 虚拟重复实例（预排） ========== */
.task-item.virtual-task{border-left:3px dashed var(--primary);opacity:.85;background:var(--bg)}
.task-item.virtual-task:hover{opacity:1}
.virtual-badge{font-size:10px;color:var(--primary);background:var(--primary-light);padding:1px 6px;border-radius:8px;margin-left:6px;vertical-align:middle}
.virtual-hint{font-size:11px;color:var(--text-muted);white-space:nowrap}
.full-cal-task.virtual{opacity:.65;border:1px dashed rgba(255,255,255,.4)}
.week-task.virtual{opacity:.65;border:1px dashed rgba(255,255,255,.4)}

/* ========== 打卡视图 ========== */
#habitsView{flex:1;overflow-y:auto;overflow-x:hidden;min-height:0}
.habits-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.habits-stats{display:flex;gap:20px;font-size:13px;color:var(--text-light)}
.habits-stats strong{color:var(--primary);font-size:18px}
.habits-trend{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:14px;box-shadow:var(--shadow)}
.habits-trend-title{font-size:13px;font-weight:600;color:var(--text);margin-bottom:10px;display:flex;align-items:center;gap:6px}
.habits-trend-chart{display:flex;gap:3px;align-items:flex-end;justify-content:space-between;height:80px}
.habit-trend-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;max-width:40px}
.habit-trend-bar{border-radius:2px 2px 0 0;min-height:0;width:100%;transition:height .4s ease}
.habit-trend-day{font-size:9px;color:var(--text-muted);margin-top:3px}
.habit-trend-bar.filled{background:var(--success)}.habit-trend-bar.empty{background:var(--border);min-height:2px}
.habits-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.habit-card{background:var(--card-bg);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);border:1px solid var(--border);cursor:pointer;transition:all var(--transition);position:relative}
.habit-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.habit-card-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.habit-card-icon{font-size:28px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--primary-light)}
.habit-card-name{font-size:15px;font-weight:600;flex:1}
.habit-card-delete{color:var(--text-muted);cursor:pointer;font-size:14px;padding:2px 6px;border-radius:4px;transition:all var(--transition);opacity:0}
.habit-card:hover .habit-card-delete{opacity:1}
.habit-card-delete:hover{color:var(--danger);background:rgba(231,76,60,.1)}
.habit-card-stats{display:flex;gap:12px;margin-bottom:10px;font-size:11px;color:var(--text-light)}
.habit-card-stats span{display:flex;flex-direction:column;align-items:center}
.habit-card-stats .hs-val{font-size:18px;font-weight:700;color:var(--primary)}
.habit-card-stats .hs-label{font-size:10px;color:var(--text-muted)}
.habit-card-check{margin-top:4px}
.habit-check-btn{width:100%;padding:8px;border:none;border-radius:var(--radius-sm);font-size:13px;font-weight:600;cursor:pointer;font-family:var(--font);transition:all var(--transition)}
.habit-check-btn.unchecked{background:var(--primary-light);color:var(--primary)}
.habit-check-btn.unchecked:hover{background:var(--primary);color:#fff}
.habit-check-btn.checked{background:var(--success);color:#fff}
.habit-check-btn.checked:hover{opacity:.85}
.habit-detail-panel{background:var(--card-bg);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);border:1px solid var(--border);margin-top:14px}
.habit-detail-back{font-size:12px;color:var(--primary);cursor:pointer;margin-bottom:12px;display:inline-block}
.habit-detail-back:hover{text-decoration:underline}
.habit-detail-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.habit-detail-header .hd-name{font-size:18px;font-weight:700}
.habit-detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.hd-stat{text-align:center;padding:14px;background:var(--bg);border-radius:var(--radius)}
.hd-stat .hd-val{font-size:24px;font-weight:700;color:var(--primary)}
.hd-stat .hd-label{font-size:11px;color:var(--text-muted);margin-top:2px}
.habit-detail-calendar{display:flex;flex-wrap:wrap;gap:6px}
.habit-cal-day{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;border:2px solid var(--border);background:var(--bg);color:var(--text-light);transition:all var(--transition)}
.habit-cal-day.checked{background:var(--success);border-color:var(--success);color:#fff}
.habit-cal-day.today{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}

/* ========== 设置面板 ========== */
.settings-section{margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.settings-section:last-child{border-bottom:none;margin-bottom:0}
.settings-section h4{font-size:14px;color:var(--text);margin-bottom:8px}
.settings-row{display:flex;align-items:center;justify-content:space-between;padding:5px 0;font-size:13px}
.toggle-switch{position:relative;width:46px;height:26px;background:#ccc;border-radius:13px;cursor:pointer;transition:background var(--transition)}
.toggle-switch.on{background:var(--success)}
.toggle-switch::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform var(--transition)}
.toggle-switch.on::after{transform:translateX(20px)}
.settings-input{width:100%;padding:8px 10px;border:2px solid var(--border);border-radius:var(--radius-xs);font-size:13px;font-family:var(--font);outline:none;margin-top:4px;background:var(--bg);color:var(--text);transition:border var(--transition)}
.settings-input:focus{border-color:var(--primary)}
.btn-test-email{padding:6px 14px;font-size:12px;margin-top:8px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-xs);cursor:pointer;font-family:var(--font);transition:all var(--transition)}
.btn-test-email:hover{background:var(--primary-light);border-color:var(--primary);color:var(--primary)}
.settings-tip{font-size:11px;color:var(--text-light);margin-top:4px}

/* ========== Toast 提示 ========== */
.toast{position:fixed;top:20px;left:50%;transform:translateX(-50%);padding:12px 24px;border-radius:var(--radius-sm);color:#fff;font-size:14px;z-index:9999;box-shadow:0 6px 20px rgba(0,0,0,.25);animation:toastIn .3s ease;display:flex;align-items:center;gap:12px;max-width:90vw}
@keyframes toastIn{from{opacity:0;transform:translateX(-50%) translateY(-12px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.toast-success{background:var(--success)}.toast-error{background:var(--danger)}.toast-info{background:var(--info)}
.toast-btn{background:rgba(255,255,255,.25);border:1px solid rgba(255,255,255,.5);color:#fff;padding:4px 12px;border-radius:4px;font-size:12px;cursor:pointer;font-family:var(--font);font-weight:600;white-space:nowrap}

/* ========== 右下角提醒弹窗 ========== */
.reminder-popup-container{position:fixed;bottom:20px;right:20px;z-index:9998;display:flex;flex-direction:column-reverse;gap:12px;max-width:380px;width:100%}
.reminder-popup{background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.2);overflow:hidden;opacity:0;transform:translateX(120%);transition:all .35s cubic-bezier(.4,0,.2,1);position:relative}
.reminder-popup.rem-popup-show{opacity:1;transform:translateX(0)}
.reminder-popup.rem-popup-remove{opacity:0;transform:translateX(120%) scale(.9)}
.rem-popup-bar{height:4px;width:100%}
.rem-popup-body{padding:14px 16px}
.rem-popup-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.rem-popup-priority{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:700}
.rem-popup-time{font-size:12px;color:var(--text-light)}
.rem-popup-time em{font-style:normal;color:var(--danger);font-weight:600;margin-left:4px}
.rem-popup-title{font-size:15px;font-weight:600;color:var(--text);margin-bottom:4px;line-height:1.4}
.rem-popup-cat{font-size:12px;color:var(--text-light);margin-bottom:10px}
.rem-popup-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.rem-btn{padding:6px 12px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;border:none;transition:all .15s;font-family:var(--font)}
.rem-btn-done{background:var(--success);color:#fff}
.rem-btn-done:hover{filter:brightness(1.1)}
.rem-btn-snooze{background:var(--primary-light);color:var(--primary);border:1px solid var(--primary)}
.rem-btn-snooze:hover{background:var(--primary);color:#fff}
.rem-btn-close{position:absolute;top:8px;right:8px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;color:var(--text-light);border:none;border-radius:6px;font-size:14px;cursor:pointer;z-index:2;transition:all .15s}
.rem-btn-close:hover{color:var(--danger);background:rgba(239,68,68,.1)}

/* ========== 浮动番茄钟 ========== */
.pomo-floating{position:fixed;bottom:24px;right:24px;background:var(--card-bg);border-radius:50%;width:64px;height:64px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);border:2px solid var(--border);z-index:50;cursor:pointer;transition:all var(--transition);font-size:16px;font-weight:700;font-variant-numeric:tabular-nums}
.pomo-floating:hover{transform:scale(1.1);border-color:var(--primary)}
.pomo-floating.pomo-active{animation:pulse 2s infinite;border-color:var(--danger);color:var(--danger)}

/* ========== 全局滚动条（统一风格） ========== */
*{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:var(--scrollbar-track);border-radius:3px}
::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px;border:1px solid var(--scrollbar-track)}
::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}
::-webkit-scrollbar-corner{background:var(--scrollbar-track)}

/* 侧边栏滚动条窄一点 */
.sidebar::-webkit-scrollbar{width:4px}
.sidebar::-webkit-scrollbar-thumb{border:none}

/* ========== 响应式 ========== */
@media (max-width:900px){
    .sidebar{position:fixed;left:-240px;top:60px;bottom:0;z-index:90;transition:left var(--transition);box-shadow:var(--shadow-lg)}
    .sidebar.open{left:0}
    .quadrants-grid{grid-template-columns:1fr}.review-grid{grid-template-columns:1fr}
    .task-form-row{flex-direction:column}.task-form-row input,.task-form-row select{width:100%}
    .summary-grid{grid-template-columns:repeat(2,1fr)}
}