:root{--navy: #0b2a4a;--navy-2: #12385f;--blue: #0a7bc2;--blue-soft: #e6f2fa;--bg: #f4f6f9;--card: #ffffff;--text: #1c2733;--muted: #6b7785;--line: #e3e8ee;--red: #c8372d;--red-soft: #fbe5e3;--yellow: #a86a00;--yellow-soft: #fdf1d6;--green: #1e8a52;--green-soft: #e0f3e8;--purple: #6f3fc4;--purple-soft: #eee6fb;--radius: 12px;--shadow: 0 1px 2px rgba(11, 42, 74, .06);color-scheme:light}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}h1,h2,h3{margin:0}.app{min-height:100vh}.demo-bar{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;background:#fff7e0;color:#6b4e00;font-size:13px;padding:6px 12px;border-bottom:1px solid #f1e0b0}.demo-bar select{padding:2px 6px;border-radius:6px;border:1px solid #e5cf8d;background:#fff}.side{display:none}.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--navy);color:#fff}.top-title{font-weight:600;flex:1}.top .icon-btn{color:#fff}.brand-mark{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;background:#fff;color:var(--navy);font-weight:700;font-size:13px}.main{padding:16px 16px 96px;max-width:1180px;margin:0 auto}.bottom{position:fixed;bottom:0;left:0;right:0;z-index:10;display:flex;background:#fff;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.bottom button{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px 6px;border:0;background:none;color:var(--muted);font-size:11px}.bottom button.on{color:var(--navy);font-weight:600}.fab{position:fixed;right:18px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:11;width:56px;height:56px;border-radius:50%;border:0;background:var(--blue);color:#fff;font-size:30px;line-height:1;box-shadow:0 6px 16px #0a7bc259}.badge{position:absolute;top:2px;right:calc(50% - 22px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;font-style:normal;line-height:18px}@media(min-width:900px){.app{display:grid;grid-template-columns:232px 1fr;grid-template-rows:auto 1fr}.demo-bar{grid-column:1 / -1}.top,.bottom{display:none}.side{display:flex;flex-direction:column;position:sticky;top:0;height:100vh;background:var(--navy);color:#cfdbe8;padding:18px 12px}.brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:600;padding:4px 8px 22px}.side nav{display:flex;flex-direction:column;gap:2px;flex:1}.side button{position:relative;display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border:0;border-radius:8px;background:none;color:inherit;text-align:left}.side button:hover{background:var(--navy-2)}.side button.on{background:#fff;color:var(--navy);font-weight:600}.side .badge{position:static;margin-left:auto}.main{padding:24px 28px 48px;width:100%;min-width:0}.fab{bottom:28px;right:28px}}.page{display:flex;flex-direction:column;gap:14px}.page-title{font-size:22px;font-weight:650;color:var(--navy)}.cols{display:grid;gap:14px}.col{display:flex;flex-direction:column;gap:14px;min-width:0}@media(min-width:900px){.cols{grid-template-columns:1fr 1fr;align-items:start}}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow);min-width:0}.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap}.card-head h2{font-size:15px;font-weight:650;color:var(--navy)}.sub{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:12px 0 4px}.empty{color:var(--muted);margin:6px 0;font-size:14px}.hint{color:var(--muted);font-size:13px;margin:8px 0 0}.muted{color:var(--muted)}.small{font-size:14px;font-weight:400}.link{border:0;background:none;color:var(--blue);padding:0;font-size:14px}.back{align-self:flex-start}.row-gap{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.row-end{display:flex;justify-content:flex-end;margin-top:8px}.quick-bar{display:flex;align-items:center;gap:10px;width:100%;margin-bottom:14px;padding:12px 14px;border:1px dashed #b9cde0;border-radius:var(--radius);background:#fff;color:var(--muted);text-align:left}.quick-bar span{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--blue-soft);color:var(--blue);font-weight:700}.btn{padding:8px 14px;border-radius:8px;border:1px solid var(--line);background:#fff;font-weight:500}.btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}.btn.ok{background:var(--green);border-color:var(--green);color:#fff}.btn.bad{color:var(--red);border-color:#efc3bf}.btn.small{padding:5px 10px;font-size:13px;margin-top:10px}.icon-btn{border:0;background:none;padding:6px;display:inline-grid;place-items:center;color:var(--muted)}.seg{display:inline-flex;background:#e9eef3;border-radius:9px;padding:3px;gap:2px;flex-wrap:wrap;max-width:100%}.seg button{border:0;background:none;padding:6px 12px;border-radius:7px;font-size:14px;color:var(--muted)}.seg button.on{background:#fff;color:var(--navy);font-weight:600;box-shadow:var(--shadow)}.toolbar{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center}.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{padding:5px 11px;border-radius:16px;border:1px solid var(--line);background:#fff;font-size:13px}.chip.on{background:var(--navy);border-color:var(--navy);color:#fff}.tag{display:inline-block;padding:1px 8px;border-radius:10px;font-size:12px;background:#eef1f5;color:#44505c}.cat-business{background:var(--blue-soft);color:#075a8f}.cat-people{background:#e8f5ef;color:#17734a}.cat-admin{background:#f1ecf9;color:#5b3aa0}.prio-high{background:var(--red-soft);color:var(--red)}.prio-low{background:#eef1f5;color:var(--muted)}.due{font-size:12px;color:var(--muted)}.due-today{color:var(--yellow);font-weight:600}.due-late{color:var(--red);font-weight:600}.pct{display:inline-block;min-width:44px;padding:1px 7px;border-radius:7px;font-weight:650;font-size:13px;text-align:center}.pct-red{background:var(--red-soft);color:var(--red)}.pct-yellow{background:var(--yellow-soft);color:var(--yellow)}.pct-green{background:var(--green-soft);color:var(--green)}.pct-purple{background:var(--purple-soft);color:var(--purple)}.pct-none{color:var(--muted)}.task{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}.task:last-child{border-bottom:0}.task-main{flex:1;min-width:0;cursor:pointer}.task-title{font-weight:500}.task.is-done .task-title{color:var(--muted);text-decoration:line-through}.task-meta{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:3px;font-size:13px}.task-more{margin-top:8px;font-size:14px}.task-more p{margin:0 0 6px}.check{flex:none;width:22px;height:22px;margin-top:1px;border-radius:6px;border:2px solid #b8c4d0;background:#fff;color:#fff;font-size:13px;line-height:1;padding:0}.check.st-doing{border-color:var(--blue)}.check.st-done{background:var(--green);border-color:var(--green)}.st-btn{flex:none;border:1px solid var(--line);background:#fff;border-radius:7px;font-size:12px;padding:3px 8px;color:var(--muted)}.who{list-style:none;padding:0;margin:0;display:grid;gap:4px}.who li{display:flex;gap:8px;align-items:center}.who li>span:first-child{min-width:56px}.st{font-size:12px;padding:0 7px;border-radius:8px;background:#eef1f5}.st-doing{background:var(--blue-soft);color:#075a8f}.st-done{background:var(--green-soft);color:var(--green)}.board{display:grid;gap:12px}@media(min-width:760px){.board{grid-template-columns:repeat(3,1fr)}}.board-col{background:#e9eef3;border-radius:var(--radius);padding:10px;min-height:120px}.board-col h3{font-size:14px;margin-bottom:8px;color:var(--navy)}.board-card{background:#fff;border-radius:9px;padding:10px;margin-bottom:8px;box-shadow:var(--shadow)}.board-move{display:flex;gap:6px;margin-top:8px}.board-move button{border:0;background:#f1f4f7;border-radius:6px;font-size:12px;padding:3px 8px;color:var(--muted)}.reqs{list-style:none;padding:0;margin:0}.reqs li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);cursor:pointer}.reqs li:last-child{border-bottom:0}.req{border-bottom:1px solid var(--line);padding:10px 0}.req:last-child{border-bottom:0}.req-head{cursor:pointer}.rq{font-size:12px;padding:1px 8px;border-radius:10px}.rq-waiting{background:var(--yellow-soft);color:var(--yellow)}.rq-need_more{background:var(--blue-soft);color:#075a8f}.rq-done{background:var(--green-soft);color:var(--green)}.rq-rejected{background:var(--red-soft);color:var(--red)}.thread{list-style:none;padding:0;margin:10px 0;display:grid;gap:8px}.thread li{background:#f4f6f9;border-radius:10px;padding:8px 10px;max-width:90%}.thread li.manager{background:var(--blue-soft);justify-self:end}.thread p{margin:2px 0 0}.reply{display:grid;gap:8px}.reply input,.search,.field input,select{padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;width:100%}select{width:auto}.reply-btns{display:flex;gap:8px;flex-wrap:wrap}.events{list-style:none;padding:0;margin:0}.event{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:7px 0;border-bottom:1px solid var(--line)}.events .event:last-child{border-bottom:0}.ev-title{font-weight:500;flex:1;min-width:120px}.ev-type{font-size:11px;padding:1px 7px;border-radius:8px;color:#fff;background:#7c8a98}.ev-Họp{background:var(--navy)}.ev-Đitỉnh{background:#0f8a8a}.ev-Coaching{background:var(--green)}.ev-Hộithảo{background:var(--blue)}.stat-row{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}@media(min-width:700px){.stat-row{grid-template-columns:repeat(4,1fr)}}.stat-chip{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;border-radius:var(--radius);border:1px solid var(--line);background:#fff;font-size:13px;color:var(--muted)}.stat-chip b{font-size:22px;color:var(--navy)}.stat-chip.late b{color:var(--red)}.stat-chip.on{border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}.act{border-bottom:1px solid var(--line);padding:10px 0}.act:last-child{border-bottom:0}.act-head{display:flex;justify-content:space-between;gap:12px;cursor:pointer;flex-wrap:wrap}.act-right{display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-size:13px;min-width:130px}.progress{width:120px;height:6px;border-radius:3px;background:#e6ebf0;overflow:hidden}.progress i{display:block;height:100%;background:var(--blue)}.ast{font-size:12px;padding:1px 8px;border-radius:10px;background:#eef1f5}.ast-dang{background:var(--blue-soft);color:#075a8f}.ast-xong{background:var(--green-soft);color:var(--green)}.ast-huy{text-decoration:line-through}.act-body{margin-top:10px;background:#f8fafc;border-radius:10px;padding:10px 12px}.act-info{display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:14px}.date-input{display:flex;align-items:center;gap:6px;font-weight:500}.date-input input{padding:5px 8px;border:1px solid var(--line);border-radius:7px}.steps{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:2px}.steps li{display:grid;grid-template-columns:26px 1fr auto;gap:4px 8px;align-items:center;padding:6px 0;border-bottom:1px dashed var(--line);font-size:14px}.steps li .muted{grid-column:2;font-size:12px}.steps li .due{grid-column:3;grid-row:1 / span 2;text-align:right}.steps li.done .step-label{color:var(--muted);text-decoration:line-through}.steps li.late .step-label{color:var(--red);font-weight:600}.acts-mini{list-style:none;padding:0;margin:0}.act-mini{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}.act-mini:last-child{border-bottom:0}.kpi-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:8px}.kpi-mini>div{display:flex;flex-direction:column;gap:3px;font-size:13px}.kpi-mini strong{font-size:16px;color:var(--navy)}.mini-team{width:100%;border-collapse:collapse;font-size:14px}.mini-team tr{cursor:pointer}.mini-team th{text-align:left;font-weight:500;padding:5px 0}.mini-team td{padding:5px 4px}.kpi-head{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:12px;display:flex;flex-direction:column;gap:4px}.stat-label{font-size:12px;color:var(--muted)}.stat-value{font-size:18px;font-weight:700;color:var(--navy)}.stat-value .pct{font-size:18px}.stat-value.up{color:var(--green)}.stat-value.down{color:var(--red)}.stat-sub{font-size:12px;color:var(--muted)}.legend{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px}.legend i{display:inline-block;width:10px;height:10px;border-radius:2px}.lg-t{background:#d5dee8}.lg-a{background:var(--blue)}.bars{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;height:160px}.bar-col{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;color:var(--muted)}.bar-col .cur{color:var(--navy);font-weight:700}.bar-area{position:relative;flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:2px}.bar{width:40%;border-radius:3px 3px 0 0;min-height:1px}.bar-t{background:#d5dee8}.bar-a{background:var(--blue)}.pct-bg-red{background:#e0766e}.pct-bg-yellow{background:#e2b04a}.pct-bg-green{background:#3fae74}.pct-bg-purple{background:#8b63d6}.table-wrap{overflow-x:auto;margin:0 -4px}.grid{border-collapse:collapse;width:100%;font-size:13px}.grid th,.grid td{padding:6px;border-bottom:1px solid var(--line);text-align:center;white-space:nowrap}.grid thead th{color:var(--muted);font-weight:500;font-size:12px}.grid tbody th{text-align:left;font-weight:500;position:sticky;left:0;background:#fff}.grid .cur{background:#f2f7fc}.grid.left td,.grid.left th{text-align:left}.grid tr.clickable{cursor:pointer}.grid tr.clickable:hover td,.grid tr.clickable:hover th{background:#f6f9fc}.grid tr.total th,.grid tr.total td{font-weight:700;border-top:2px solid var(--line)}.grid.input input{width:90px;padding:5px 6px;border:1px solid var(--line);border-radius:6px;text-align:right}.save{font-size:12px;color:var(--yellow)}.save.ok{color:var(--green)}.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}.person-card{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:12px;font-size:13px}.avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;font-weight:600;margin-bottom:4px}.pc-name{font-weight:600;font-size:14px}.profile{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px}.note{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px}.note.pinned{border-left:4px solid var(--blue)}.note p{margin:0 0 6px;white-space:pre-wrap}.note-foot{display:flex;gap:14px;align-items:center;font-size:13px}.sheet-wrap{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#0b2a4a59;display:flex;align-items:flex-end;justify-content:center}.sheet{width:100%;max-width:560px;max-height:92vh;overflow:auto;background:#fff;border-radius:16px 16px 0 0;padding:14px 16px calc(14px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px}@media(min-width:700px){.sheet-wrap{align-items:center}.sheet{border-radius:16px}}.sheet-head{display:flex;justify-content:space-between;gap:8px;align-items:center}.quick-input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;resize:vertical;font-size:16px}.preview{background:#f6f9fc;border:1px solid #dbe6f0;border-radius:12px;padding:12px;display:grid;gap:10px}.preview-title{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}.field{display:grid;gap:4px;font-size:13px}.field>span{color:var(--muted)}.field .hint{font-size:12px;margin:0}.sheet-foot{display:flex;justify-content:flex-end;gap:8px}.brand-mark{font-size:18px}.brand-text{display:flex;flex-direction:column;line-height:1.2}.brand-text small{font-weight:400;font-size:12px;color:#9fb4ca}img.brand-mark{width:34px;height:34px;border-radius:50%;background:#e6f2fa;object-fit:cover;object-position:top;padding:0}.tiggy{display:block;width:auto;-webkit-user-select:none;user-select:none}.greet{display:flex;align-items:center;gap:12px;background:linear-gradient(100deg,#eaf3fb,#fff 70%);border:1px solid var(--line);border-radius:var(--radius);padding:8px 16px 0;overflow:hidden}.greet .tiggy{align-self:flex-end}.greet>div{padding-bottom:8px}.greet-say{margin:4px 0 0;color:var(--navy-2)}.empty-tiggy{display:flex;align-items:center;gap:10px;color:var(--green);font-weight:600}.login{min-height:100vh;display:flex;align-items:center;align-content:center;justify-content:center;gap:24px;padding:24px 16px;background:linear-gradient(160deg,#eaf3fb,#fff 55%);flex-wrap:wrap}.login-art{display:flex;justify-content:center}.login-card{width:100%;max-width:360px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 20px;display:grid;gap:12px;box-shadow:0 8px 30px #0b2a4a14}.login-card h1{font-size:28px;color:var(--navy);font-weight:800}.login-card h1 span{color:var(--blue)}.login-slogan{margin:-6px 0 6px;color:var(--muted);font-style:italic}.btn.big{padding:11px;font-size:16px}.hint.demo{color:#a87a00}@media(max-width:700px){.login-art .tiggy{height:200px!important}.login{gap:8px}}@media(max-width:560px){.greet .page-title{font-size:18px}.greet .tiggy{height:80px!important}.greet-say{font-size:14px}}.form-err{color:var(--red);font-size:14px;margin:0}.link.danger{color:var(--red);margin-top:6px}.error-bar{background:var(--red-soft);color:var(--red);text-align:center;padding:6px 12px;font-size:14px;grid-column:1 / -1}.splash{min-height:100vh;display:grid;place-content:center;justify-items:center;gap:8px;color:var(--muted)}.soon{display:flex;align-items:center;gap:16px}.soon p{margin:4px 0 0}.notice{background:var(--green-soft);border:1px solid #b8e2c8;border-radius:10px;padding:10px 12px;margin-bottom:10px}.notice p{margin:4px 0;-webkit-user-select:all;user-select:all}.add-form{background:#f6f9fc;border:1px solid var(--line);border-radius:10px;padding:12px;display:grid;gap:10px;margin-bottom:10px}.form-grid{display:grid;gap:10px}@media(min-width:700px){.form-grid{grid-template-columns:1fr 1fr}}.field select{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff}.person-row{border-bottom:1px solid var(--line);padding:10px 0}.person-row:last-child{border-bottom:0}.person-row.left{display:flex;justify-content:space-between;align-items:center;gap:10px}.person-head{display:flex;gap:10px;align-items:center;cursor:pointer}.person-head .avatar{margin:0}.person-body{margin:10px 0 0 44px;display:grid;gap:10px}.btn.small{padding:5px 10px;font-size:13px;margin-top:0}
