:root{--bg:#f7f8fa;--surface:#fff;--surface-2:#f1f3f5;--border:#e4e7eb;--border-strong:#cfd4da;--text:#1a1d29;--text-2:#5a5e6b;--text-3:#8a8e99;--primary:#4f46e5;--primary-light:#eef2ff;--success:#10b981;--success-light:#d1fae5;--warning:#f59e0b;--warning-light:#fef3c7;--danger:#ef4444;--danger-light:#fee2e2;--info:#3b82f6;--info-light:#dbeafe;--radius:10px;--radius-sm:6px;--radius-lg:14px;--shadow:0 4px 12px rgba(0,0,0,.06)}
*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.6;min-height:100vh}button,input,textarea,select{font:inherit}button{cursor:pointer;border:0}.hidden{display:none!important}
header{background:var(--surface);border-bottom:1px solid var(--border);padding:12px 24px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10}.brand,.toolbar,.user-chip,.connection-chip{display:flex;align-items:center}.brand{gap:10px;font-weight:600;font-size:16px}.brand-mark{width:32px;height:32px;background:linear-gradient(135deg,#4f46e5,#7c3aed);border-radius:8px;display:grid;place-items:center;color:#fff;font-weight:700}.toolbar{gap:8px;flex-wrap:wrap}.user-chip,.connection-chip{gap:6px;padding:6px 11px;background:var(--surface-2);border-radius:20px;font-size:13px;color:var(--text-2)}.dot{width:8px;height:8px;border-radius:50%;background:var(--warning)}.dot.online{background:var(--success)}.dot.error{background:var(--danger)}
.btn{padding:7px 14px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:5px}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:#4338ca}.btn-ghost{background:var(--surface-2);color:var(--text-2)}.btn-outline{border:1px solid var(--border-strong);color:var(--text-2);background:var(--surface)}.btn-sm{padding:5px 10px;font-size:12px}.btn-danger{background:var(--danger-light);color:var(--danger)}.btn-link{margin-top:8px;background:transparent;color:var(--primary)}.btn-link:hover{background:var(--primary-light)}
.tabs{background:var(--surface);padding:0 24px;border-bottom:1px solid var(--border);display:flex;gap:4px}.tab{padding:12px 18px;color:var(--text-2);background:transparent;font-weight:500;border-bottom:2px solid transparent}.tab.active{color:var(--primary);border-bottom-color:var(--primary)}main{max-width:1280px;margin:auto;padding:24px}.view{display:none}.view.active{display:block}
.board{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.column{background:var(--surface);border-radius:var(--radius-lg);padding:14px;border:1px solid var(--border);min-height:200px}.column-header{display:flex;justify-content:space-between;margin-bottom:12px;font-weight:600}.col-count{background:var(--surface-2);padding:1px 8px;border-radius:10px;font-size:12px;color:var(--text-2)}.col-progress .col-count{background:var(--info-light);color:var(--info)}.col-completed .col-count{background:var(--success-light);color:var(--success)}.col-expired .col-count{background:var(--danger-light);color:var(--danger)}
.task-card{background:var(--surface-2);border-radius:var(--radius);padding:12px;margin-bottom:8px;border-left:3px solid var(--border-strong)}.task-card:hover{box-shadow:var(--shadow)}.task-card.col-progress-card{border-left-color:var(--info)}.task-card.col-completed-card{border-left-color:var(--success)}.task-card.col-expired-card{border-left-color:var(--danger);opacity:.75}.task-card.mine{border-left-width:5px}.task-title{font-weight:600;margin-bottom:4px}.task-desc{color:var(--text-2);font-size:12px;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.task-meta,.task-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.task-meta{font-size:12px;color:var(--text-3);margin-bottom:8px}.task-actions{margin-top:8px}.task-score{background:var(--warning-light);color:#b45309;padding:1px 8px;border-radius:10px;font-weight:600}.task-mode{padding:1px 8px;border-radius:10px}.task-mode.assign{background:var(--info-light);color:var(--info)}.task-mode.claim{background:#fce7f3;color:#be185d}.task-deadline{font-size:12px;color:var(--text-3)}.task-deadline.danger{color:var(--danger);font-weight:500}
.form-card{background:var(--surface);border-radius:var(--radius-lg);padding:24px;max-width:640px;border:1px solid var(--border)}.form-card h2{font-size:16px;margin-bottom:18px}.form-group{margin-bottom:18px}.form-label{display:block;font-weight:500;margin-bottom:6px;font-size:13px}.req{color:var(--danger)}.form-input,.form-textarea,.form-select{width:100%;padding:9px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface)}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.form-textarea{resize:vertical;min-height:80px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mode-toggle{display:flex;border:1px solid var(--border-strong);border-radius:var(--radius-sm);overflow:hidden}.mode-toggle input{display:none}.mode-toggle label{flex:1;padding:9px;text-align:center;cursor:pointer}.mode-toggle input:checked+label{background:var(--primary);color:#fff}.submit-button{width:100%}
.kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}.kpi,.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg)}.kpi{padding:16px}.kpi-val{font-size:24px;font-weight:600}.kpi-label{font-size:12px;color:var(--text-2)}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.stat-card{padding:18px}.stat-title{font-weight:600;margin-bottom:14px}.stat-canvas-wrap{height:240px;position:relative}
.me-header{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;padding:24px;border-radius:var(--radius-lg);margin-bottom:16px}.me-name{font-size:18px;font-weight:600}.me-score{font-size:32px;font-weight:700}.me-sub{opacity:.85;font-size:13px}.section-title{font-size:14px;margin-bottom:12px}.task-list{display:flex;flex-direction:column;gap:8px}.empty{text-align:center;padding:36px 12px;color:var(--text-3);font-size:13px}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:50;padding:20px}.modal-card{background:var(--surface);border-radius:var(--radius-lg);padding:24px;max-width:460px;width:100%;max-height:90vh;overflow:auto}.modal-card.large{max-width:600px}.modal-title{font-weight:600;font-size:16px;margin-bottom:14px}.modal-description{color:var(--text-2);font-size:13px;margin-bottom:16px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.detail-row{display:flex;justify-content:space-between;gap:24px;padding:8px 0;border-bottom:1px solid var(--border);font-size:13px}.detail-label{color:var(--text-2);flex:none}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--text);color:#fff;padding:10px 20px;border-radius:var(--radius);z-index:100;box-shadow:var(--shadow)}.toast.success{background:var(--success)}.toast.error{background:var(--danger)}
@media(max-width:900px){.board,.stats-grid{grid-template-columns:1fr}.kpi-row{grid-template-columns:repeat(2,1fr)}.form-row{grid-template-columns:1fr}main{padding:16px}header{padding:10px 16px;align-items:flex-start;gap:12px}.toolbar{justify-content:flex-end}.tabs{padding:0 8px;overflow:auto}.tab{padding:11px 13px}}