:root{--ink:#17221e;--muted:#6f7975;--green:#214f40;--green-2:#36705c;--cream:#f5f3ec;--paper:#fff;--line:#e5e7e2;--orange:#c96d45;--red:#b84d4d;--blue:#5577a5;--shadow:0 12px 36px rgba(22,42,34,.08);font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--cream)}*{box-sizing:border-box}body{margin:0;min-height:100vh}button,input,select,textarea{font:inherit}button,a{cursor:pointer}.hidden{display:none!important}.app{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:238px;background:#fcfcf9;border-right:1px solid var(--line);padding:27px 20px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font-family:Manrope;font-size:15px}.brand b{display:block;font-size:11px;letter-spacing:.04em;color:var(--muted)}.brand-mark{width:35px;height:35px;display:grid;place-items:center;border-radius:11px;background:var(--green);color:white;font:800 19px Manrope}.sidebar nav{margin-top:44px;display:grid;gap:6px}.sidebar nav a{display:flex;align-items:center;gap:13px;padding:11px 13px;border-radius:10px;color:#5b6561;text-decoration:none;font-weight:600;font-size:14px}.sidebar nav a i{font-style:normal;font-size:18px;width:20px;text-align:center}.sidebar nav a:hover,.sidebar nav a.active{background:#e8eee9;color:var(--green)}.sidebar-foot{margin-top:auto;border-top:1px solid var(--line);padding-top:18px;display:flex;align-items:center;gap:8px}.user-chip{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:12px;flex:0 0 auto}.user-chip strong,.user-chip small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-chip strong{font-size:13px}.user-chip small{font-size:11px;color:var(--muted);text-transform:capitalize}.icon-btn{border:0;background:transparent;border-radius:9px;padding:8px;color:var(--muted)}.icon-btn:hover{background:#eef0ec}.content{margin-left:238px;padding:44px clamp(26px,4vw,62px);max-width:1540px}.topbar{display:none}.page-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:28px;gap:20px}.page-head h1{font:800 clamp(27px,3vw,36px) Manrope;margin:0 0 6px;letter-spacing:-.04em}.page-head p{margin:0;color:var(--muted)}.eyebrow{font:700 11px Manrope;letter-spacing:.16em;color:#c8dad2}.eyebrow.green{color:var(--green-2)}.btn{border:1px solid var(--line);background:white;border-radius:10px;padding:10px 16px;font-weight:700;color:var(--ink);display:inline-flex;align-items:center;justify-content:center;gap:9px;text-decoration:none}.btn:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(30,60,48,.09)}.btn.primary{background:var(--green);border-color:var(--green);color:white}.btn.small{padding:7px 11px;font-size:12px}.btn.wide{width:100%;padding:13px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:28px}.stat{background:var(--paper);border:1px solid var(--line);border-radius:15px;padding:19px;position:relative}.stat span{color:var(--muted);font-size:12px;font-weight:600}.stat strong{display:block;font:800 29px Manrope;margin-top:8px}.stat i{position:absolute;right:16px;top:16px;width:32px;height:32px;display:grid;place-items:center;background:#edf2ee;color:var(--green);border-radius:9px;font-style:normal}.stat.alert i{color:var(--red);background:#faeded}.grid-2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.8fr);gap:20px}.panel{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:20px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.panel h2{font:700 16px Manrope;margin:0}.text-link{color:var(--green);font-size:12px;font-weight:700;text-decoration:none}.event-list,.task-list,.feed{display:grid;gap:10px}.event-row{display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:13px;padding:10px;border-radius:12px;text-decoration:none;color:inherit}.event-row:hover{background:#f6f7f3}.date-box{text-align:center;background:var(--cream);border-radius:10px;padding:7px 4px}.date-box strong,.date-box small{display:block}.date-box strong{font:800 19px Manrope}.date-box small{font-size:9px;color:var(--muted);letter-spacing:.08em}.event-row h3{font-size:14px;margin:0 0 5px}.meta{color:var(--muted);font-size:11px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}.progress{height:5px;background:#e9ebe6;border-radius:4px;overflow:hidden;margin-top:8px}.progress span{display:block;height:100%;background:var(--green-2);border-radius:4px}.badge{display:inline-flex;align-items:center;border-radius:20px;padding:4px 8px;font-size:10px;font-weight:700;text-transform:capitalize;background:#edf1ee;color:var(--green)}.badge.high,.badge.urgent,.badge.overdue{background:#f8e9e3;color:#a84e32}.badge.completed,.badge.done{background:#e7f1e9;color:#33734b}.badge.proposed,.badge.open{background:#f3efe2;color:#8a6b19}.badge.review{background:#eaf0f8;color:#45668f}.task-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #f0f1ed}.task-row:last-child{border:0}.check{width:20px;height:20px;border:2px solid #cbd0cb;border-radius:6px;background:white}.task-row h4{margin:0 0 3px;font-size:13px}.due{font-size:10px;color:var(--muted);white-space:nowrap}.due.late{color:var(--red);font-weight:700}.feed-item{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:9px 0}.feed-item p{margin:1px 0 4px;font-size:12px;line-height:1.45}.feed-item time{font-size:10px;color:var(--muted)}.activity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.activity-card{background:white;border:1px solid var(--line);border-radius:15px;padding:19px;text-decoration:none;color:inherit;display:flex;flex-direction:column;min-height:224px;transition:.15s}.activity-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.card-top{display:flex;justify-content:space-between;align-items:center}.team-dot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:6px}.activity-card h3{font:700 17px Manrope;margin:18px 0 8px}.activity-card p{font-size:12px;line-height:1.55;color:var(--muted);margin:0}.card-bottom{margin-top:auto;padding-top:18px}.toolbar{display:flex;gap:10px;margin-bottom:20px}.search{position:relative;flex:1}.search input,.toolbar select{height:42px;border:1px solid var(--line);background:white;border-radius:10px;padding:0 13px;outline:none}.search input{width:100%;padding-left:37px}.search:before{content:'⌕';position:absolute;left:13px;top:8px;color:var(--muted);font-size:21px}.toolbar select{min-width:135px}.empty{text-align:center;padding:55px 20px;color:var(--muted)}.empty b{display:block;color:var(--ink);font-size:16px;margin-bottom:5px}.detail-hero{background:var(--green);color:white;border-radius:18px;padding:28px;margin-bottom:20px;position:relative;overflow:hidden}.detail-hero:after{content:'';position:absolute;width:260px;height:260px;border:55px solid rgba(255,255,255,.05);border-radius:50%;right:-60px;top:-100px}.detail-hero h1{font:800 clamp(25px,4vw,38px) Manrope;max-width:700px;margin:15px 0 10px;position:relative;z-index:1}.detail-hero p{color:#d4e1db;max-width:720px;line-height:1.6;position:relative;z-index:1}.hero-meta{display:flex;gap:20px;flex-wrap:wrap;font-size:12px;color:#d4e1db;position:relative;z-index:1}.stage{margin:20px 0}.stage h3{text-transform:uppercase;letter-spacing:.12em;font-size:10px;color:var(--muted)}.stage .task-row{background:white;border:1px solid var(--line);border-radius:12px;padding:13px;margin:8px 0}.people-grid,.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.person,.team-card{background:white;border:1px solid var(--line);border-radius:14px;padding:17px}.person{display:flex;gap:13px}.person h3,.team-card h3{font-size:14px;margin:2px 0 4px}.person p,.team-card p{font-size:11px;color:var(--muted);margin:0;line-height:1.5}.team-card{border-top:4px solid var(--team)}.team-card strong{font:800 25px Manrope}.timeline{border-left:2px solid #e3e7e2;margin-left:17px;padding-left:23px}.timeline-item{position:relative;padding-bottom:22px}.timeline-item:before{content:'';position:absolute;width:9px;height:9px;background:var(--green);border:4px solid white;box-shadow:0 0 0 1px #dce1dc;border-radius:50%;left:-30px;top:3px}.timeline-item p{font-size:13px;line-height:1.5;margin:4px 0}.form{display:grid;gap:15px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form label,.login-form label{display:grid;gap:6px;font-size:12px;font-weight:700}.form input,.form select,.form textarea,.login-form input{width:100%;border:1px solid #dcded9;border-radius:9px;padding:11px 12px;outline:none;background:#fff}.form input:focus,.form select:focus,.form textarea:focus,.login-form input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(35,80,65,.1)}.form textarea{min-height:100px;resize:vertical}.full{grid-column:1/-1}dialog{width:min(610px,calc(100% - 28px));border:0;border-radius:18px;padding:28px;box-shadow:0 30px 100px rgba(10,25,20,.3)}dialog::backdrop{background:rgba(15,29,24,.55);backdrop-filter:blur(3px)}dialog h2{font:800 24px Manrope;margin:0 0 6px}.modal-close{position:absolute;right:17px;top:15px;border:0;background:#f0f1ee;width:30px;height:30px;border-radius:50%;font-size:20px}.toast{position:fixed;right:25px;top:22px;background:#17251f;color:white;padding:12px 18px;border-radius:10px;z-index:100;opacity:0;transform:translateY(-12px);pointer-events:none;transition:.2s;font-size:13px}.toast.show{opacity:1;transform:none}.login-page{min-height:100vh;display:grid;grid-template-columns:1.08fr .92fr;background:white}.login-art{background:linear-gradient(145deg,#173d31,#2e624f);padding:42px 7vw;color:white;display:flex;flex-direction:column;position:relative;overflow:hidden}.login-art:before,.login-art:after{content:'';position:absolute;border-radius:50%;border:90px solid rgba(255,255,255,.035)}.login-art:before{width:430px;height:430px;right:-240px;top:-200px}.login-art:after{width:330px;height:330px;left:-210px;bottom:-210px}.brand-light,.brand-light b{color:white}.login-copy{margin:auto 0;max-width:610px;position:relative;z-index:1}.login-copy h1{font:800 clamp(42px,5.5vw,74px)/1.06 Manrope;letter-spacing:-.055em;margin:20px 0}.login-copy h1 em{color:#d9bd85;font-style:normal}.login-copy>p{font-size:16px;line-height:1.7;color:#cbded6;max-width:520px}.login-quote{display:flex;align-items:center;gap:13px;font-size:11px;color:#c8d9d2}.mini-avatars{display:flex}.mini-avatars span{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#d7b87c;color:#253f36;font-size:8px;font-weight:700;border:2px solid #2c5b4b;margin-left:-5px}.login-panel{display:grid;place-items:center;padding:30px}.login-form{width:min(390px,100%)}.login-form h2{font:800 31px Manrope;letter-spacing:-.04em;margin:12px 0 5px}.login-form .muted{margin:0 0 30px}.login-form label{margin-bottom:16px}.demo-note{text-align:center;color:var(--muted);font-size:11px}.mobile-brand{display:none}.muted{color:var(--muted)}
@media(max-width:1050px){.activity-grid,.people-grid,.team-grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.25s;box-shadow:var(--shadow)}.sidebar.open{transform:none}.topbar{height:62px;display:flex;position:sticky;top:0;z-index:9;background:rgba(252,252,249,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);align-items:center;justify-content:space-between;padding:0 17px}.content{margin:0;padding:24px 16px 90px}.grid-2{grid-template-columns:1fr}.activity-grid,.people-grid,.team-grid{grid-template-columns:1fr}.page-head{align-items:center}.page-head p{font-size:12px}.toolbar{flex-wrap:wrap}.toolbar .search{flex-basis:100%}.toolbar select{flex:1;min-width:0}.login-page{grid-template-columns:1fr}.login-art{display:none}.login-panel{padding:24px}.mobile-brand{display:flex;margin-bottom:65px}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.detail-hero{padding:22px}.event-row{grid-template-columns:49px minmax(0,1fr)}.event-row>.badge{display:none}}
@media(max-width:430px){.stats{gap:9px}.stat{padding:14px}.stat strong{font-size:24px}.stat i{display:none}.page-head h1{font-size:26px}.page-head .btn span.label{display:none}.panel{padding:16px}}

/* Keep activity feed content inside its grid column, including long pasted URLs. */
.feed-item{grid-template-columns:34px minmax(0,1fr)}
.feed-item>div{min-width:0}
.feed-item p,.feed-item time{overflow-wrap:anywhere}
.comment-person-tag{display:inline-flex;align-items:center;padding:3px 7px;border-radius:999px;background:#e8eef8;color:#45668f;font-weight:700}
.comment-tag-field{display:grid;gap:6px}.comment-tag-label{font-size:12px;font-weight:700}.comment-tag-picker{position:relative}.comment-tag-selected{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}.comment-tag-selected:empty{display:none}.comment-tag-chip{border:0;border-radius:999px;padding:5px 8px;background:#e8eef8;color:#45668f;font-size:11px;font-weight:700}.comment-tag-chip span{margin-left:3px;font-size:14px}.comment-tag-search{width:100%;border:1px solid #dcded9;border-radius:9px;padding:11px 12px;outline:none;background:#fff}.comment-tag-search:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(35,80,65,.1)}.comment-tag-results{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:20;max-height:260px;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px rgba(22,42,34,.14);padding:5px}.comment-tag-results button{width:100%;border:0;background:#fff;border-radius:7px;padding:9px 10px;text-align:left;display:flex;justify-content:space-between;gap:12px;color:var(--ink)}.comment-tag-results button:hover,.comment-tag-results button:focus{background:#eef3ef;outline:none}.comment-tag-results small{color:var(--muted);text-transform:capitalize}.comment-tag-results p{margin:0;padding:10px;color:var(--muted);font-size:12px}
.lang-toggle{border:1px solid var(--line);background:#f1f3ef;border-radius:8px;padding:3px;display:flex;gap:1px;flex:0 0 auto}.lang-toggle b,.lang-toggle span{padding:4px 6px;border-radius:5px;font:700 9px Manrope;color:var(--muted)}.lang-toggle b{background:white;color:var(--green);box-shadow:0 1px 4px rgba(20,40,32,.1)}body[data-lang="vi"] .lang-toggle b{background:transparent;color:var(--muted);box-shadow:none}body[data-lang="vi"] .lang-toggle span{background:white;color:var(--green);box-shadow:0 1px 4px rgba(20,40,32,.1)}.login-panel{position:relative}.login-lang{position:absolute;right:28px;top:28px}.top-actions{display:flex;align-items:center;gap:7px}.topbar .lang-toggle{display:none}@media(max-width:760px){.topbar .lang-toggle{display:flex}.sidebar-foot>.lang-toggle{display:none}}
