:root{
  --bg:#F6F7FA; --surface:#FFFFFF; --surface-2:#EEF1F5; --surface-3:#E4E8EE; --border:#E1E5EB;
  --text-primary:#151824; --text-secondary:#5B6172; --text-muted:#8A90A1;
  --accent:#2A78D6; --accent-strong:#184F95; --accent-contrast:#FFFFFF; --accent-soft:#E7F0FC;
  --shadow:0 1px 2px rgba(20,24,38,.06), 0 8px 24px -12px rgba(20,24,38,.16);
  --dep-comercial:#2A78D6; --dep-comercial-rgb:42,120,214;
  --dep-admin:#EB6834; --dep-admin-rgb:235,104,52;
  --dep-financeiro:#1BAF7A; --dep-financeiro-rgb:27,175,122;
  --dep-marketing:#EDA100; --dep-marketing-rgb:237,161,0;
  --dep-design:#E87BA4; --dep-design-rgb:232,123,164;
  --dep-text-on-tint:#151824;
  --status-good:#0CA30C; --status-good-rgb:12,163,12;
  --status-warning:#B8790A; --status-warning-rgb:184,121,10;
  --status-serious:#C25A2C; --status-serious-rgb:194,90,44;
  --status-critical:#C93A3A; --status-critical-rgb:201,58,58;
  --radius-sm:8px; --radius-md:12px; --radius-lg:16px;
  --font-display:'Manrope',system-ui,-apple-system,sans-serif;
  --font-body:'Inter',system-ui,-apple-system,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#12141A; --surface:#1B1E27; --surface-2:#242832; --surface-3:#2E3340; --border:#2C3140;
    --text-primary:#F1F2F6; --text-secondary:#AEB4C4; --text-muted:#828898;
    --accent:#FFFA2A; --accent-strong:#E6D400; --accent-contrast:#000000; --accent-soft:rgba(255,250,42,.16);
    --shadow:0 1px 2px rgba(0,0,0,.35), 0 12px 28px -14px rgba(0,0,0,.6);
    --dep-comercial:#4C96EE; --dep-comercial-rgb:76,150,238;
    --dep-admin:#E08A4C; --dep-admin-rgb:224,138,76;
    --dep-financeiro:#2FB988; --dep-financeiro-rgb:47,185,136;
    --dep-marketing:#D9A53E; --dep-marketing-rgb:217,165,62;
    --dep-design:#E37DA6; --dep-design-rgb:227,125,166;
    --dep-text-on-tint:#F1F2F6;
    --status-good:#3FC23F; --status-good-rgb:63,194,63;
    --status-warning:#D9A53E; --status-warning-rgb:217,165,62;
    --status-serious:#E0824F; --status-serious-rgb:224,130,79;
    --status-critical:#E56464; --status-critical-rgb:229,100,100;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#12141A; --surface:#1B1E27; --surface-2:#242832; --surface-3:#2E3340; --border:#2C3140;
  --text-primary:#F1F2F6; --text-secondary:#AEB4C4; --text-muted:#828898;
  --accent:#FFFA2A; --accent-strong:#E6D400; --accent-contrast:#000000; --accent-soft:rgba(255,250,42,.16);
  --shadow:0 1px 2px rgba(0,0,0,.35), 0 12px 28px -14px rgba(0,0,0,.6);
  --dep-comercial:#4C96EE; --dep-comercial-rgb:76,150,238;
  --dep-admin:#E08A4C; --dep-admin-rgb:224,138,76;
  --dep-financeiro:#2FB988; --dep-financeiro-rgb:47,185,136;
  --dep-marketing:#D9A53E; --dep-marketing-rgb:217,165,62;
  --dep-design:#E37DA6; --dep-design-rgb:227,125,166;
  --dep-text-on-tint:#F1F2F6;
  --status-good:#3FC23F; --status-good-rgb:63,194,63;
  --status-warning:#D9A53E; --status-warning-rgb:217,165,62;
  --status-serious:#E0824F; --status-serious-rgb:224,130,79;
  --status-critical:#E56464; --status-critical-rgb:229,100,100;
}
*{box-sizing:border-box;}
body{font-family:var(--font-body); color:var(--text-primary); background:var(--bg);}
h1,h2,h3,.brand,.stat-value{font-family:var(--font-display);}
a{color:var(--accent);}
button{font-family:inherit;}
.hidden-visually{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
.skip-link{position:absolute; left:8px; top:-40px; background:var(--accent); color:var(--accent-contrast); padding:8px 14px; border-radius:8px; z-index:200; transition:top .15s;}
.skip-link:focus{top:8px;}

/* ---------- layout ---------- */
#app{min-height:100%;}
.sidebar{
  position:fixed; left:0; top:0; bottom:0; width:248px; background:var(--surface); border-right:1px solid var(--border);
  display:flex; flex-direction:column; z-index:85; padding-top:env(safe-area-inset-top,0px);
}
.sidebar-head{display:flex; align-items:center; gap:10px; padding:18px 18px 14px;}
.brand-mark{width:34px; height:34px; border-radius:50%; background:#000; color:var(--accent-contrast); display:flex; align-items:center; justify-content:center; font-weight:800; font-family:var(--font-display); font-size:15px; flex:none; overflow:hidden;}
.brand-mark img{width:100%; height:100%; object-fit:cover; display:block;}
.brand{font-size:16px; font-weight:800; line-height:1.15;}
.brand small{display:block; font-family:var(--font-body); font-weight:500; font-size:11px; color:var(--text-muted); letter-spacing:.02em;}
.sidebar-close{margin-left:auto; display:none; background:none; border:none; color:var(--text-muted); padding:6px; border-radius:8px; cursor:pointer;}
.nav-group{padding:6px 10px;}
.nav-label{font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--text-muted); padding:14px 12px 6px;}
.nav-item{display:flex; align-items:center; gap:10px; width:100%; text-align:left; padding:9px 12px; border-radius:9px; border:none; background:none; color:var(--text-secondary); font-size:13.5px; font-weight:600; cursor:pointer; position:relative;}
.nav-item svg{flex:none; opacity:.85;}
.nav-item:hover{background:var(--surface-2); color:var(--text-primary);}
.nav-item.active{background:var(--accent-soft); color:var(--accent-strong);}
.nav-item.active svg{opacity:1;}
.nav-dot{width:8px; height:8px; border-radius:50%; flex:none;}
.sidebar-footer{margin-top:auto; padding:14px; border-top:1px solid var(--border); display:flex; flex-direction:column; gap:10px;}
.user-switch{display:flex; align-items:center; gap:8px;}
.avatar{width:30px; height:30px; border-radius:50%; background:var(--accent-soft); color:var(--accent-strong); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:12px; flex:none;}
.avatar.lg{width:44px;height:44px;font-size:15px;}
.user-switch select{flex:1; min-width:0;}
.proto-badge{font-size:10.5px; color:var(--text-muted); background:var(--surface-2); border-radius:7px; padding:6px 8px; line-height:1.4;}

.app-shell{margin-left:248px; min-height:100%; display:flex; flex-direction:column;}
.topbar{
  position:sticky; top:env(safe-area-inset-top,0px); z-index:40; background:var(--bg); border-bottom:1px solid var(--border);
  display:flex; align-items:center; gap:12px; padding:14px 22px;
}
.hamburger{background:var(--surface); border:1px solid var(--border); border-radius:9px; padding:8px; cursor:pointer; color:var(--text-primary);}
.page-title{font-size:19px; font-weight:800; margin:0;}
.page-sub{font-size:12.5px; color:var(--text-muted); margin-top:1px;}
.topbar-actions{margin-left:auto; display:flex; align-items:center; gap:10px;}
.icon-btn{background:var(--surface); border:1px solid var(--border); border-radius:9px; width:36px; height:36px; display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--text-secondary); position:relative;}
.icon-btn.hamburger{display:none;}
.icon-btn:hover{color:var(--text-primary); border-color:var(--text-muted);}
.badge-dot{position:absolute; top:-4px; right:-4px; background:var(--status-critical); color:#fff; font-size:10px; font-weight:700; border-radius:9px; min-width:16px; height:16px; display:flex; align-items:center; justify-content:center; padding:0 3px; border:2px solid var(--bg);}
.btn{display:inline-flex; align-items:center; gap:7px; border-radius:9px; padding:9px 14px; font-size:13.5px; font-weight:700; cursor:pointer; border:1px solid transparent;}
.btn-primary{background:var(--accent); color:var(--accent-contrast);}
.btn-primary:hover{background:var(--accent-strong);}
.btn-ghost{background:var(--surface); border-color:var(--border); color:var(--text-primary);}
.btn-ghost:hover{border-color:var(--text-muted);}
.btn-sm{padding:6px 10px; font-size:12.5px; border-radius:8px;}
.btn-danger-ghost{background:transparent;border:1px solid rgba(var(--status-critical-rgb),.4);color:var(--status-critical);}
.btn[disabled]{opacity:.5; cursor:not-allowed;}

.content{padding:20px 22px 90px; flex:1; min-width:0;}
.content:focus{outline:none;}

.dropdown-panel{position:absolute; top:calc(100% + 8px); right:0; width:320px; max-width:88vw; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); box-shadow:var(--shadow); z-index:70; max-height:70vh; overflow-y:auto;}
.dropdown-panel h4{margin:0; padding:12px 14px; border-bottom:1px solid var(--border); font-size:13px;}
.notif-row{padding:10px 14px; border-bottom:1px solid var(--border); font-size:12.5px; display:flex; gap:8px; align-items:flex-start;}
.notif-row:last-child{border-bottom:none;}
.notif-row .dot{width:7px;height:7px;border-radius:50%;background:var(--accent); margin-top:5px; flex:none;}
.notif-row.read .dot{background:var(--border);}
.notif-row.read{color:var(--text-muted);}
.notif-time{color:var(--text-muted); font-size:11px; margin-top:2px;}
.notif-empty{padding:20px 14px; text-align:center; color:var(--text-muted); font-size:12.5px;}

/* ---------- generic components ---------- */
.section-head{display:flex; align-items:baseline; gap:10px; margin:26px 0 12px;}
.section-head:first-child{margin-top:0;}
.section-head h2{font-size:15px; margin:0;}
.section-head .count{font-size:12px; color:var(--text-muted); font-weight:600;}
.card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);}
.banner{display:flex; align-items:center; gap:10px; background:var(--accent-soft); color:var(--accent-strong); border-radius:var(--radius-md); padding:11px 14px; font-size:12.5px; margin-bottom:18px;}
.banner button{margin-left:auto; background:none;border:none;color:inherit;cursor:pointer;opacity:.7;}

.stat-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(168px,1fr)); gap:12px;}
.stat-tile{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); padding:14px 15px;}
.stat-tile .stat-label{font-size:11.5px; color:var(--text-muted); text-transform:uppercase; letter-spacing:.04em; font-weight:600;}
.stat-value{font-size:26px; font-weight:800; margin-top:6px; font-variant-numeric:tabular-nums;}
.stat-tile.accent-critical .stat-value{color:var(--status-critical);}
.stat-tile.accent-warning .stat-value{color:var(--status-warning);}
.stat-tile.accent-good .stat-value{color:var(--status-good);}

.attn-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px;}
.attn-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden;}
.attn-card-head{display:flex; align-items:center; gap:8px; padding:11px 14px; border-bottom:1px solid var(--border); font-weight:700; font-size:13px;}
.attn-card-head .count-pill{margin-left:auto; background:var(--surface-2); border-radius:20px; padding:2px 9px; font-size:11.5px; font-weight:700;}
.attn-list{max-height:230px; overflow-y:auto;}
.attn-row{display:flex; align-items:center; gap:9px; padding:9px 14px; border-bottom:1px solid var(--border); cursor:pointer; font-size:12.5px;}
.attn-row:last-child{border-bottom:none;}
.attn-row:hover{background:var(--surface-2);}
.attn-row .t{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.attn-empty{padding:18px 14px; text-align:center; color:var(--text-muted); font-size:12.5px;}

.chart-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:14px;}
.chart-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); padding:16px;}
.chart-card h3{font-size:13px; margin:0 0 14px;}
.bar-row{display:grid; grid-template-columns:108px 1fr 34px; align-items:center; gap:9px; margin-bottom:9px; font-size:12px;}
.bar-row .lbl{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-secondary);}
.bar-track{background:var(--surface-2); border-radius:6px; height:12px; overflow:hidden;}
.bar-fill{height:100%; border-radius:6px; min-width:4px;}
.bar-val{text-align:right; font-variant-numeric:tabular-nums; font-weight:700; color:var(--text-primary);}

.projects-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:14px;}
.project-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); padding:16px; cursor:pointer; display:flex; flex-direction:column; gap:10px;}
.project-card:hover{border-color:var(--accent);}
.project-card h3{margin:0; font-size:14.5px;}
.project-desc{font-size:12px; color:var(--text-secondary); line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.progress-track{background:var(--surface-2); border-radius:8px; height:8px; overflow:hidden;}
.progress-fill{height:100%; background:var(--accent); border-radius:8px;}
.project-meta{display:flex; flex-wrap:wrap; gap:10px; font-size:11.5px; color:var(--text-muted);}
.avatars-stack{display:flex;}
.avatars-stack .avatar{width:24px; height:24px; font-size:10px; margin-left:-8px; border:2px solid var(--surface);}
.avatars-stack .avatar:first-child{margin-left:0;}

.pill{display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:700; padding:3px 9px; border-radius:20px; white-space:nowrap;}
.tag{display:inline-flex; align-items:center; font-size:11px; font-weight:600; padding:3px 8px; border-radius:7px; background:var(--surface-2); color:var(--text-secondary);}
.dep-pill{color:var(--dep-text-on-tint); background:rgba(var(--dep-rgb),.22); position:relative; padding-left:18px;}
.dep-pill::before{content:''; position:absolute; left:8px; top:50%; transform:translateY(-50%); width:6px; height:6px; border-radius:50%; background:rgb(var(--dep-rgb));}
.pr-good{color:var(--status-good); background:rgba(var(--status-good-rgb),.13);}
.pr-warning{color:var(--status-warning); background:rgba(var(--status-warning-rgb),.13);}
.pr-serious{color:var(--status-serious); background:rgba(var(--status-serious-rgb),.13);}
.pr-critical{color:var(--status-critical); background:rgba(var(--status-critical-rgb),.13);}
.overdue-chip{color:var(--status-critical); background:rgba(var(--status-critical-rgb),.13); font-weight:700;}
.due-today-chip{color:var(--status-warning); background:rgba(var(--status-warning-rgb),.15); font-weight:700;}

.filters-bar{display:flex; flex-wrap:wrap; gap:9px; align-items:center; margin-bottom:16px;}
.filters-bar select, .filters-bar input, select, input[type=text], input[type=date], input[type=url], textarea{
  font-family:inherit; font-size:12.5px; padding:7px 9px; border-radius:8px; border:1px solid var(--border); background:var(--surface); color:var(--text-primary);
}
.filters-bar select{cursor:pointer;}
.view-tabs{display:flex; gap:4px; background:var(--surface-2); padding:4px; border-radius:10px; width:max-content; margin-bottom:16px; flex-wrap:wrap;}
.view-tab{border:none; background:none; padding:7px 13px; border-radius:7px; font-size:12.5px; font-weight:700; color:var(--text-secondary); cursor:pointer;}
.view-tab.active{background:var(--surface); color:var(--text-primary); box-shadow:var(--shadow);}

/* kanban */
.board-scroll{display:flex; gap:14px; overflow-x:auto; padding-bottom:12px; align-items:flex-start;}
.kcol{flex:0 0 264px; background:var(--surface-2); border-radius:var(--radius-md); display:flex; flex-direction:column; max-height:calc(100vh - 260px); min-height:160px;}
.kcol-head{display:flex; align-items:center; gap:8px; padding:11px 12px; font-weight:700; font-size:12.5px; border-bottom:2px solid var(--border);}
.kcol-head .count-pill{background:var(--surface); border-radius:20px; padding:1px 8px; font-size:11px; font-weight:700; color:var(--text-secondary);}
.kcol-body{padding:10px; display:flex; flex-direction:column; gap:9px; overflow-y:auto; flex:1; min-height:60px;}
.kcol-body.drag-over{background:rgba(var(--dep-rgb,42,120,214),.12); outline:2px dashed rgba(var(--dep-rgb,42,120,214),.5); outline-offset:-4px; border-radius:8px;}
.kcard{background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:11px 12px; cursor:grab; display:flex; flex-direction:column; gap:8px;}
.kcard:active{cursor:grabbing;}
.kcard.dragging{opacity:.4;}
.kcard.is-overdue{border-color:rgba(var(--status-critical-rgb),.5); border-left:3px solid var(--status-critical);}
.kcard-title{font-size:13px; font-weight:700; line-height:1.35;}
.kcard-tags{display:flex; flex-wrap:wrap; gap:5px;}
.kcard-foot{display:flex; align-items:center; gap:7px; margin-top:2px;}
.kcard-foot .grow{flex:1;}
.kcard select{font-size:11px; padding:4px 6px; max-width:112px;}

/* list view */
.table-wrap{overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface);}
table{width:100%; border-collapse:collapse; font-size:12.5px; min-width:720px;}
th{text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-muted); padding:10px 12px; border-bottom:1px solid var(--border); white-space:nowrap;}
td{padding:10px 12px; border-bottom:1px solid var(--border); vertical-align:middle;}
tbody tr{cursor:pointer;}
tbody tr:hover{background:var(--surface-2);}
tbody tr:last-child td{border-bottom:none;}
tr.row-overdue td:first-child{box-shadow:inset 3px 0 0 var(--status-critical);}
.title-cell{font-weight:600; max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

/* calendar */
.cal-head{display:flex; align-items:center; gap:10px; margin-bottom:12px;}
.cal-head h3{margin:0; font-size:14.5px; min-width:150px;}
.cal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden;}
.cal-wd{background:var(--surface-2); padding:7px; font-size:11px; font-weight:700; text-align:center; color:var(--text-muted);}
.cal-day{background:var(--surface); min-height:92px; padding:6px; display:flex; flex-direction:column; gap:3px;}
.cal-day.muted{background:var(--bg); color:var(--text-muted);}
.cal-day.today{box-shadow:inset 0 0 0 2px var(--accent);}
.cal-daynum{font-size:11.5px; font-weight:700; font-variant-numeric:tabular-nums;}
.cal-chip{font-size:10.5px; padding:2px 6px; border-radius:5px; background:rgba(var(--dep-rgb),.22); color:var(--dep-text-on-tint); border-left:3px solid rgb(var(--dep-rgb)); cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600;}
.cal-more{font-size:10px; color:var(--text-muted); padding-left:2px;}

.week-strip{display:grid; grid-template-columns:repeat(7,1fr); gap:10px;}
.week-col{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); padding:10px; min-height:150px; display:flex; flex-direction:column; gap:7px;}
.week-col.today{border-color:var(--accent);}
.week-col h4{margin:0; font-size:11.5px; text-transform:uppercase; letter-spacing:.03em; color:var(--text-muted);}
.week-task{font-size:11.5px; background:var(--surface-2); border-radius:7px; padding:6px 8px; cursor:pointer; font-weight:600;}
.week-empty{font-size:11px; color:var(--text-muted);}

/* team */
.team-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px;}
.team-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); padding:14px; display:flex; gap:11px; align-items:center;}
.team-card .meta{min-width:0;}
.team-card .name{font-weight:700; font-size:13.5px;}
.team-card .role{font-size:11.5px; color:var(--text-muted);}
.team-stats{display:flex; gap:12px; margin-top:6px; font-size:11px;}
.team-stats b{font-variant-numeric:tabular-nums;}

/* settings */
.settings-block{margin-bottom:22px;}
.settings-block h3{font-size:13.5px; margin:0 0 10px;}
.area-row{display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--border);}
.area-row:last-child{border-bottom:none;}
.area-swatch{width:12px; height:12px; border-radius:4px; flex:none;}
.chip-row{display:flex; flex-wrap:wrap; gap:6px; margin-top:6px;}
.flow-chain{display:flex; flex-wrap:wrap; align-items:center; gap:5px; font-size:11.5px;}
.flow-chain .arrow{color:var(--text-muted);}

/* empty states */
.empty-state{text-align:center; padding:40px 20px; color:var(--text-muted); font-size:13px;}

/* overlays / drawer / modal */
.overlay{position:fixed; inset:0; background:rgba(10,12,18,.42); z-index:80; opacity:0; pointer-events:none; transition:opacity .18s;}
.overlay.show{opacity:1; pointer-events:auto;}
.task-drawer{
  position:fixed; top:0; right:0; bottom:0; width:440px; max-width:94vw; background:var(--surface); z-index:90;
  box-shadow:-16px 0 40px rgba(0,0,0,.18); transform:translateX(100%); transition:transform .22s ease; display:flex; flex-direction:column;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
.task-drawer.open{transform:translateX(0);}
.drawer-head{padding:16px 18px 0;}
.drawer-top-row{display:flex; align-items:flex-start; gap:10px;}
.drawer-top-row h2{font-size:16px; margin:0; flex:1; line-height:1.35;}
.drawer-close{background:var(--surface-2); border:none; border-radius:8px; width:30px; height:30px; display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--text-secondary); flex:none;}
.drawer-tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px;}
.drawer-tabs{display:flex; gap:2px; overflow-x:auto; padding:12px 18px 0; border-bottom:1px solid var(--border); margin-top:14px;}
.dtab{border:none; background:none; padding:8px 10px; font-size:12px; font-weight:700; color:var(--text-muted); cursor:pointer; white-space:nowrap; border-bottom:2px solid transparent; margin-bottom:-1px;}
.dtab.active{color:var(--accent); border-bottom-color:var(--accent);}
.drawer-body{flex:1; overflow-y:auto; padding:16px 18px 26px;}
.field-row{margin-bottom:13px;}
.field-row label{display:block; font-size:11px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:.03em; margin-bottom:5px;}
.field-row select, .field-row input, .field-row textarea{width:100%;}
.field-two{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.desc-text{font-size:13px; line-height:1.6; color:var(--text-secondary); white-space:pre-line;}
.approve-row{display:flex; gap:8px; margin:6px 0 16px;}
.checklist-item{display:flex; align-items:flex-start; gap:8px; padding:6px 0; font-size:13px;}
.checklist-item input[type=checkbox]{margin-top:3px;}
.checklist-item.done span{text-decoration:line-through; color:var(--text-muted);}
.add-row{display:flex; gap:7px; margin-top:8px;}
.add-row input{flex:1;}
.subtask-row{display:flex; align-items:center; gap:8px; padding:7px 0; border-bottom:1px solid var(--border); font-size:12.5px;}
.subtask-row:last-child{border-bottom:none;}
.comment{display:flex; gap:9px; margin-bottom:14px;}
.comment .body{flex:1; min-width:0;}
.comment .head{display:flex; gap:7px; align-items:baseline; font-size:12px;}
.comment .name{font-weight:700;}
.comment .time{color:var(--text-muted); font-size:11px;}
.comment .txt{font-size:13px; margin-top:2px; line-height:1.5;}
.attach-row, .link-row{display:flex; align-items:center; gap:9px; padding:8px 0; border-bottom:1px solid var(--border); font-size:12.5px;}
.attach-row:last-child, .link-row:last-child{border-bottom:none;}
.attach-icon{width:30px;height:30px;border-radius:8px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;flex:none;color:var(--text-secondary);}
.hist-item{display:flex; gap:9px; padding:8px 0; border-bottom:1px solid var(--border); font-size:12.5px;}
.hist-item:last-child{border-bottom:none;}
.hist-item .dot{width:7px;height:7px;border-radius:50%;background:var(--text-muted); margin-top:5px; flex:none;}
.dep-row{display:flex; align-items:center; gap:8px; padding:7px 0; border-bottom:1px solid var(--border); font-size:12.5px;}
.dep-row:last-child{border-bottom:none;}

.modal-overlay{position:fixed; inset:0; background:rgba(10,12,18,.42); z-index:95; display:flex; align-items:flex-start; justify-content:center; padding:5vh 16px; overflow-y:auto;}
.modal{background:var(--surface); border-radius:var(--radius-lg); width:560px; max-width:100%; box-shadow:var(--shadow);}
.modal-head{display:flex; align-items:center; padding:18px 20px; border-bottom:1px solid var(--border);}
.modal-head h2{font-size:16px; margin:0;}
.modal-body{padding:18px 20px;}
.modal-foot{display:flex; justify-content:flex-end; gap:9px; padding:16px 20px; border-top:1px solid var(--border);}

.toast{position:fixed; bottom:24px; left:50%; transform:translateX(-50%); background:var(--text-primary); color:var(--bg); padding:11px 18px; border-radius:10px; font-size:12.5px; font-weight:600; z-index:120; box-shadow:var(--shadow); opacity:0; pointer-events:none; transition:opacity .2s, transform .2s;}
.toast.show{opacity:1; transform:translateX(-50%) translateY(-6px);}

.mobile-nav{display:none; position:fixed; left:0; right:0; bottom:0; background:var(--surface); border-top:1px solid var(--border); z-index:55; padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px));}
.mobile-nav-inner{display:flex; justify-content:space-around;}
.mnav-item{background:none; border:none; display:flex; flex-direction:column; align-items:center; gap:2px; color:var(--text-muted); font-size:10px; font-weight:700; padding:4px 6px; cursor:pointer;}
.mnav-item.active{color:var(--accent);}

@media (max-width: 880px){
  .sidebar{transform:translateX(-100%); transition:transform .2s ease; width:270px;}
  .sidebar.open{transform:translateX(0);}
  .sidebar-close{display:block;}
  .app-shell{margin-left:0;}
  .icon-btn.hamburger{display:flex; align-items:center; justify-content:center;}
  .mobile-nav{display:block;}
  .content{padding-bottom:84px;}
  .kcol{flex:0 0 78vw;}
  .field-two{grid-template-columns:1fr;}
  .modal{width:100%;}
  .topbar{padding:12px 14px;}
  .view-tabs{max-width:100%;}
  .page-title{font-size:17px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
}
@media (max-width:520px){
  .stat-grid{grid-template-columns:repeat(2,1fr);}
  .cal-day{min-height:64px;}
  .week-strip{grid-template-columns:1fr; }
  .topbar{gap:8px;}
  .page-sub{display:none;}
  #newTaskBtn span{display:none;}
  #newTaskBtn{padding:9px;}
  .chart-grid{grid-template-columns:1fr;}
  .projects-grid{grid-template-columns:1fr;}
  .attn-grid{grid-template-columns:1fr;}
  .team-grid{grid-template-columns:1fr;}
}

.gate-screen{position:fixed; inset:0; z-index:150; display:none; align-items:center; justify-content:center; background:var(--bg); padding:20px;}
.gate-screen.show{display:flex;}
.login-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); box-shadow:var(--shadow); padding:26px; width:360px; max-width:100%;}
.login-logo{display:flex; justify-content:center; margin-bottom:14px;}
.login-logo img{width:72px; height:72px; border-radius:50%; object-fit:cover; background:#000;}
.login-card h1{font-size:20px; margin:0 0 4px; text-align:center;}
.login-card p.sub{text-align:center;}
.login-card p.sub{font-size:12.5px; color:var(--text-muted); margin:0 0 18px;}
.login-card .field-row{margin-bottom:12px;}
.login-card .field-row label{display:block; font-size:11px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:.03em; margin-bottom:5px;}
.login-card input{width:100%;}
.login-error{color:var(--status-critical); font-size:12.5px; margin:8px 0 0; min-height:16px;}
.login-link{background:none; border:none; color:var(--accent); font-size:12px; cursor:pointer; padding:0; margin-top:10px;}
.app-loading{display:flex; align-items:center; justify-content:center; min-height:50vh; color:var(--text-muted); font-size:13px;}
.app-error{text-align:center; padding:50px 20px; color:var(--text-secondary);}

/* Gantt */
.gantt-wrap{position:relative; overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); padding:8px 0;}
.gantt-group{font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-muted); font-weight:700; padding:10px 12px 4px;}
.gantt-row{display:flex; align-items:center; min-height:34px;}
.gantt-label{width:160px; flex:none; font-size:12px; padding:0 10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; cursor:pointer;}
.gantt-track{position:relative; height:24px; flex:none;}
.gantt-bar{position:absolute; top:2px; height:20px; border-radius:6px; background:rgba(var(--dep-rgb),.9); color:var(--dep-text-on-tint); font-size:10.5px; font-weight:700; display:flex; align-items:center; gap:4px; padding:0 7px; cursor:pointer; overflow:hidden; white-space:nowrap;}
.gantt-bar.is-overdue{outline:2px solid var(--status-critical); outline-offset:-2px;}
.gantt-today{position:absolute; top:0; bottom:0; width:2px; background:var(--accent); z-index:2; pointer-events:none;}

/* Timeline */
.timeline{border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); padding:6px 0;}
.tl-item{display:flex; gap:10px; padding:11px 16px; border-bottom:1px solid var(--border); cursor:pointer;}
.tl-item:last-child{border-bottom:none;}
.tl-item:hover{background:var(--surface-2);}
.tl-dot{width:8px; height:8px; border-radius:50%; background:var(--accent); margin-top:5px; flex:none;}
.tl-text{font-size:13px; line-height:1.5;}
.tl-meta{font-size:11px; color:var(--text-muted); margin-top:2px;}