*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #0f1420;--panel: #171e2e;--panel-2: #1e2740;--border: #2a3550;--text: #e8ecf4;--muted: #8b93a7;--accent: #4f7cff;--accent-2: #22c55e;--danger: #ef4444;--warn: #f59e0b;--radius: 12px}body{font-family:Inter,-apple-system,sans-serif;background:var(--bg);color:var(--text);font-size:14px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer}input,select,textarea{font-family:inherit}.app{display:flex;min-height:100vh}.sidebar{width:220px;flex-shrink:0;background:var(--panel);border-right:1px solid var(--border);padding:20px 12px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh}.sidebar .brand{font-weight:800;font-size:17px;padding:4px 12px 18px;letter-spacing:-.3px}.sidebar .brand span{color:var(--accent)}.sidebar a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;color:var(--muted);font-weight:500}.sidebar a.active,.sidebar a:hover{background:var(--panel-2);color:var(--text)}.sidebar .spacer{flex:1}.sidebar .user{padding:8px 12px;font-size:12px;color:var(--muted);word-break:break-all}.sidebar .logout{background:none;border:1px solid var(--border);color:var(--muted);border-radius:8px;padding:8px;font-size:13px}.sidebar .logout:hover{color:var(--text);border-color:var(--muted)}.main{flex:1;padding:28px 32px;max-width:1200px;min-width:0}.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:12px;flex-wrap:wrap}.page-head h1{font-size:22px;font-weight:700;letter-spacing:-.4px}.page-head .sub{color:var(--muted);font-size:13px;margin-top:2px}.btn{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:9px 16px;font-weight:600;font-size:13px}.btn:hover{filter:brightness(1.1)}.btn.secondary{background:var(--panel-2);border:1px solid var(--border);color:var(--text)}.btn.danger{background:transparent;border:1px solid var(--danger);color:var(--danger)}.btn.sm{padding:5px 10px;font-size:12px}.btn.ghost{background:none;border:none;color:var(--muted);padding:4px 8px}.btn.ghost:hover{color:var(--text)}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:18px}.card h3{font-size:13px;font-weight:600;color:var(--muted);margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:20px}.kpi{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.kpi .label{font-size:12px;color:var(--muted);font-weight:500}.kpi .value{font-size:26px;font-weight:800;margin-top:4px;letter-spacing:-.5px}.kpi .value.warn{color:var(--warn)}.kpi .value.danger{color:var(--danger)}.kpi .value.ok{color:var(--accent-2)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}@media (max-width: 900px){.grid-2{grid-template-columns:1fr}.main{padding:16px}}.table-wrap{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;padding:10px 14px;color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border);white-space:nowrap}td{padding:11px 14px;border-bottom:1px solid var(--border);vertical-align:middle}tr:last-child td{border-bottom:none}tr.clickable{cursor:pointer}tr.clickable:hover td{background:var(--panel-2)}td .primary{font-weight:600}td .sub{color:var(--muted);font-size:12px;margin-top:2px}.badge{display:inline-block;padding:3px 9px;border-radius:99px;font-size:11px;font-weight:600;white-space:nowrap}.overdue{color:var(--danger);font-weight:600}.due-soon{color:var(--warn);font-weight:600}.filters{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}.filters input,.filters select{background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:8px 12px;font-size:13px}.filters input{min-width:220px}.filters input:focus,.filters select:focus{outline:none;border-color:var(--accent)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#05080fb3;display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;z-index:100;overflow-y:auto}.modal{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:24px;width:100%;max-width:560px}.modal h2{font-size:17px;margin-bottom:18px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid .full{grid-column:1 / -1}.field label{display:block;font-size:12px;color:var(--muted);font-weight:600;margin-bottom:5px}.field input,.field select,.field textarea{width:100%;background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:9px 11px;font-size:13px}.field textarea{resize:vertical;min-height:60px}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent)}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}.login-box{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:36px;width:100%;max-width:380px}.login-box h1{font-size:22px;margin-bottom:4px}.login-box h1 span{color:var(--accent)}.login-box p{color:var(--muted);font-size:13px;margin-bottom:24px}.login-box .field{margin-bottom:14px}.login-box .btn{width:100%;padding:11px;margin-top:6px}.error-msg{background:#ef44441f;border:1px solid var(--danger);color:#fca5a5;border-radius:8px;padding:10px 12px;font-size:13px;margin-bottom:14px}.info-msg{background:#4f7cff1f;border:1px solid var(--accent);color:#a5c0ff;border-radius:8px;padding:10px 12px;font-size:13px;margin-bottom:14px}.kanban{display:flex;gap:12px;overflow-x:auto;padding-bottom:12px}.kanban-col{min-width:240px;width:240px;flex-shrink:0}.kanban-col .col-head{display:flex;align-items:center;justify-content:space-between;padding:8px 4px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.kanban-col .col-head .count{color:var(--muted);font-weight:600}.kanban-card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:12px;margin-bottom:8px;cursor:pointer}.kanban-card:hover{border-color:var(--accent)}.kanban-card .t{font-weight:600;font-size:13px;margin-bottom:4px}.kanban-card .p{color:var(--muted);font-size:12px}.kanban-card .v{font-weight:700;font-size:13px;margin-top:6px}.kanban-card .due{font-size:11px;margin-top:4px}.bar-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;font-size:12px}.bar-row .bl{width:90px;color:var(--muted);text-align:right;flex-shrink:0}.bar-row .bar-track{flex:1;background:var(--bg);border-radius:6px;height:22px;position:relative}.bar-row .bar-fill{height:100%;border-radius:6px;min-width:2px}.bar-row .bv{width:80px;font-weight:600;flex-shrink:0}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:16px}.tabs button{background:none;border:none;color:var(--muted);font-weight:600;font-size:13px;padding:10px 14px;border-bottom:2px solid transparent}.tabs button.active{color:var(--text);border-bottom-color:var(--accent)}.list-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}.list-item:last-child{border-bottom:none}.list-item .li-main{min-width:0}.list-item .li-t{font-weight:600;font-size:13px}.list-item .li-s{color:var(--muted);font-size:12px;margin-top:2px}.empty{color:var(--muted);font-size:13px;padding:14px 0;text-align:center}.checkbox-btn{width:20px;height:20px;border-radius:6px;border:1.5px solid var(--muted);background:none;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;color:transparent;font-size:12px}.checkbox-btn.done{background:var(--accent-2);border-color:var(--accent-2);color:#fff}.done-text{text-decoration:line-through;color:var(--muted)}.back-link{color:var(--muted);font-size:13px;display:inline-block;margin-bottom:10px}.back-link:hover{color:var(--text)}.detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}.detail-head h1{font-size:24px;font-weight:800;letter-spacing:-.5px}.detail-meta{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;align-items:center}.detail-meta .meta-item{color:var(--muted);font-size:13px}.health-bar{width:120px;background:var(--bg);height:8px;border-radius:4px;display:inline-block;vertical-align:middle}.health-fill{height:100%;border-radius:4px}.loading{color:var(--muted);padding:40px;text-align:center}
