:root{--green:#243747;--muted:#6c737c;--line:#dfe4e8;--bg:#f6f7f9;--ink:#20252b}body{background:#f6f7f9;color:#20252b;font-family:Arial,sans-serif}.sidebar{background:#1b2026;color:#f7f8fa}.sidebar nav button{color:#afb8c1}.sidebar nav button.active{background:#dbe9f3;color:#203749}.sidebar .note{background:transparent;border-top:1px solid #41464c;color:#aeb8c0}.sidebar .brand small{color:#aeb8c0;letter-spacing:2px;font-size:9px}.pagehead h1{font-family:'Times New Roman',Cambria,'Noto Serif',serif;font-weight:400;letter-spacing:-.3px;font-size:2.4rem}.panel,.stat,.groupcard,.connectcard{border-radius:4px;box-shadow:none}.primary,.linkbutton{background:#263c4c!important;color:white!important;border-color:#263c4c!important;border-radius:3px}button,input,select,textarea{border-radius:3px}button:hover{border-color:#88a8bd}.stat:first-child{background:#e2edf5;color:#203747}.stat:first-child .label,.stat:first-child small{color:#465e70}.status.connected{background:#e2ebe7;color:#425d50}.banner.warn{background:#f1eee8;border-color:#e4ded3;color:#6a5e4e}.tag.review{background:#eee9e0;color:#756146}.tag.high,.due.overdue{color:#8b5654;background:#f1e6e5}.eyebrow{letter-spacing:2px;color:#708391}.studio-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:24px;align-items:start}.workrow{padding:20px 24px;border-bottom:1px solid #e6e9ed;display:flex;justify-content:space-between;gap:18px;align-items:start}.workrow>div:first-child{min-width:0;flex:1}.workrow>div:last-child{display:flex;flex-wrap:wrap;gap:8px;max-width:240px}.workrow h3{font-size:15px;line-height:1.5;margin:10px 0 7px;overflow-wrap:anywhere}.workrow p{line-height:1.5;margin:8px 0;overflow-wrap:anywhere}.workrow small{color:#737b83;line-height:1.6}.workrow select{width:100%}.project-progress{padding:18px 0;border-bottom:1px solid #e6e9ed}.project-progress p{font-size:13px;color:#68717a}.project-progress small{font-size:11px;color:#717b83}progress{width:100%;height:8px;accent-color:#7895aa;display:block;margin:10px 0}progress::-webkit-progress-bar{background:#e7ecf0}progress::-webkit-progress-value{background:#7895aa}.report-bars{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:20px 0}.report-bars label{font-size:12px}.source-text{font:13px/1.7 Arial,sans-serif;white-space:pre-wrap;overflow-wrap:anywhere;max-height:65vh;overflow:auto}dialog form label{display:grid;gap:7px;margin:14px 0;font-size:13px}dialog form .checkline{display:flex;gap:10px;align-items:center}.checkline input{min-height:20px;width:20px}dialog form input,dialog form select,dialog form textarea{width:100%}.connectcard{margin-bottom:18px}.connectcard form label{display:grid;gap:7px;margin:14px 0}.connectcard form input,.connectcard form select{max-width:100%}.connectcard details{margin-top:20px}a{color:#426883}.empty{padding:35px 24px;color:#65737d}.empty h3{color:#34434e;font-size:17px}.profile{background:#e2ebf2;color:#3f586c}.avatar{background:#e4edf4;color:#375a72}.switch.on{background:#6e8ea4}.switch.on::after{background:#fff}
@media(max-width:1050px){.studio-grid{grid-template-columns:1fr}.studio-grid>aside{display:none}}
@media(max-width:720px){.sidebar{background:#fff;color:#303a43}.sidebar nav button.active{background:#dfebf4;color:#284b63}.sidebar nav button{color:#77828b}.sidebar nav button{font-size:10px}.pagehead h1{font-size:1.9rem}.workrow{padding:17px;flex-direction:column}.workrow>div:last-child{max-width:100%}.report-bars{gap:10px}.connectcard{padding:18px}.main{padding-bottom:100px}.groupcards{gap:12px}}
/* 0.4: logo, nguồn tin 2 phần, danh mục dự án, hồ sơ */
.brand.logo-only{flex-direction:column;align-items:flex-start;gap:8px}
.sidebar .brand.logo-only img{width:64px;height:64px;border-radius:16px;box-shadow:0 0 0 1px #2c5a51}
.brand.logo-only small{color:#b9d0c9;font-size:.6875rem;letter-spacing:1.6px;font-weight:500}
.login .brand.logo-only{align-items:center}
.login .brand.logo-only img{width:84px;height:84px}
.mobilebrand img{border-radius:9px}
.tag.code{background:#123d38;color:#efe9db;font-weight:650;letter-spacing:.3px}
.sourcegroup{margin-bottom:22px}
.sourcehead{margin:0 0 12px;font-size:1rem}
details.sourcegroup.others{border:1px solid var(--line);border-radius:14px;background:#fafbfa;padding:0}
details.sourcegroup.others>summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;min-height:44px}
details.sourcegroup.others>summary::-webkit-details-marker{display:none}
details.sourcegroup.others>summary::before{content:'▸';margin-right:4px;color:var(--muted)}
details.sourcegroup.others[open]>summary::before{content:'▾'}
details.sourcegroup.others>summary strong{flex:1}
details.sourcegroup.others>.groupcards{padding:0 16px 16px}
.groupcard .badges{margin-top:6px}
.projecttable{display:grid}
.projectrow{display:flex;align-items:center;gap:14px;padding:12px 22px;border-bottom:1px solid #edf0ee}
.projectrow[hidden]{display:none}
.projectrow .code{font-weight:700;min-width:52px;color:#123d38;font-variant-numeric:tabular-nums}
.projectrow .pinfo{flex:1;min-width:0}
.projectrow .pinfo strong{display:block;overflow-wrap:anywhere}
.projectrow small{color:var(--muted);font-size:.8125rem}
.panelhead input[type=search]{max-width:280px}
.actions.padded{padding:0 22px 20px}
.actions.tight{margin-top:10px}
.docactions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}
.linkbutton.small{min-height:36px;padding:6px 12px;font-size:.875rem}
.quietlink{display:inline-flex;align-items:center;min-height:36px;padding:6px 10px;font-size:.875rem}
.compose{margin-bottom:20px}
.compose label{display:grid;gap:6px;font-size:.875rem;margin-bottom:12px}
.compose textarea{width:100%;resize:vertical;min-height:80px}
.checkline{display:flex;gap:10px;align-items:flex-start}
@media(max-width:720px){.projectrow{padding:12px 15px}.docactions{justify-content:flex-start}.panelhead{flex-wrap:wrap}.panelhead input[type=search]{max-width:100%;width:100%}}
/* 0.4.1: mức ưu tiên dự án */
.prio{display:inline-block;border-radius:5px;padding:2px 7px;font-size:.6875rem;font-weight:650;letter-spacing:.3px;vertical-align:middle}
.prio-priority{background:#ffe866;color:#5b4a00}
.prio-delay{background:#fbe3c8;color:#87501a}
.prio-stopped{background:#e5e7e9;color:#5d646b}
.project-progress.is-priority{background:#fff7c2;border-radius:10px;padding:10px 12px;margin:0 -12px 6px}
.projectrow .code.is-priority{background:#ffe866;border-radius:6px;padding:2px 6px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;flex-shrink:0}
.seg button{border:0;border-radius:0;min-height:34px;padding:5px 9px;font-size:.75rem;background:#fff;color:var(--muted)}
.seg button+button{border-left:1px solid var(--line)}
.seg button.on.seg-priority{background:#ffe866;color:#4a3d00;font-weight:650}
.seg button.on.seg-normal{background:#e6efea;color:#23563c;font-weight:650}
.seg button.on.seg-delay{background:#fbe3c8;color:#7a4714;font-weight:650}
.seg button.on.seg-stopped{background:#dadde0;color:#3f454b;font-weight:650}
.prio-filter{display:flex;flex-wrap:wrap;gap:6px}
.prio-filter button.active{background:var(--green);color:#fff;border-color:var(--green)}
details.moreprojects{margin-top:10px;border-top:1px solid var(--line);padding-top:10px}
details.moreprojects>summary{cursor:pointer;min-height:40px;display:flex;align-items:center;font-weight:600;color:#23563c}
.danger{color:#a24033}
@media(max-width:720px){.projectrow{flex-wrap:wrap}.seg{order:3;width:100%}.seg button{flex:1}}

/* 0.4.2: chọn mức độ dự án bằng danh sách xổ xuống */
.prio-select{min-height:36px;padding:5px 30px 5px 10px;font-size:.8125rem;font-weight:600;border-radius:9px;cursor:pointer;flex-shrink:0;min-width:128px}
.prio-sel-priority{background-color:#ffe866;border-color:#e6cf3a;color:#4a3d00}
.prio-sel-normal{background-color:#fff;color:#23563c}
.prio-sel-delay{background-color:#fbe3c8;border-color:#e9c296;color:#7a4714}
.prio-sel-stopped{background-color:#e5e7e9;border-color:#c9cdd1;color:#4b5157}
.prio-select option{background:#fff;color:#20252b;font-weight:400}
@media(max-width:720px){.prio-select{order:3;width:100%}}
/* 0.5: giao diện tối giản, link dự án, cập nhật */
.pagehead{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:8px 0 22px}
.pagehead h1{font-family:Arial,'Segoe UI',sans-serif!important;font-weight:650!important;letter-spacing:0!important;font-size:1.625rem!important;margin:0}
.topbar .eyebrow:empty{display:none}
.topbar{min-height:52px;padding-bottom:10px}
.sidebar .note.ver{border:0;padding:0;margin-top:auto;font-size:.75rem;color:#7f9590;letter-spacing:.4px}
.sidebar .note.ver strong,.sidebar .note.ver p{display:none}
.linkchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.linkchips.padded{padding:6px 22px 18px;margin:0}
.chip{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:4px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;color:#20252b;font-size:.8125rem;font-weight:500;text-decoration:none;cursor:pointer;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip:hover{border-color:#123d38;background:#f2f7f5}
.chip.bad{border-color:#e7b7a8;background:#fdf3ef;color:#8a3d22}
.chip.add{border-style:dashed;color:var(--muted);background:transparent}
.linkpanel .panelhead{padding-bottom:6px}
.linkrow{display:grid;grid-template-columns:minmax(120px,1fr) minmax(180px,2fr) auto auto auto;gap:6px;align-items:center;margin-bottom:8px}
#autoForm .linkrow{grid-template-columns:1fr auto auto}
.linkrow input{min-width:0}
.fine.bad{color:#9a3b1f}
.updating{position:fixed;inset:0;background:rgba(246,247,249,.94);display:grid;place-items:center;z-index:100;text-align:center}
.updating img{width:72px;height:72px;border-radius:18px;margin-bottom:12px}
@media(max-width:720px){.linkrow{grid-template-columns:1fr auto auto auto}.linkrow .lk-label{grid-column:1/-1}.chip{max-width:100%}}
/* 0.5.1: huy hiệu số tin mới kiểu iPhone */
.sidebar nav button .navlabel{position:relative;display:inline-block}
.badge{position:absolute;top:-9px;right:-22px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#ff3b30;color:#fff;font-size:.6875rem;font-weight:700;line-height:19px;text-align:center;box-shadow:0 0 0 2px #1d2125;font-variant-numeric:tabular-nums;letter-spacing:0;animation:badgepop .25s ease-out}
@keyframes badgepop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
@media(max-width:720px){.badge{top:-30px;right:-14px;box-shadow:0 0 0 2px #fff}}
@media(prefers-reduced-motion:reduce){.badge{animation:none}}
.updating p{max-width:440px;margin:6px auto}
.updating .actions{justify-content:center;margin-top:14px}
/* 0.5.4: nhãn dán & biểu tượng */
img.sticker{width:96px;height:96px;object-fit:contain;display:block}
.emoji-note{color:var(--muted)}
