:root{
  --ink:#1A1A1A; --ink-2:#242424; --gold:#C9A24B; --gold-soft:#E9D9B4;
  --bg:#F4F1EC; --card:#FFFFFF; --line:#E6E0D6; --line-2:#EFEAE1;
  --tx:#2A2724; --muted:#847B6C; --muted-2:#A79E8E;
  --mkt:#2F5597; --mid:#6B4FA0; --com:#9C6B00; --site:#1F6B5C; --ges:#454545; --ext:#7F7F7F;
  --st-done:#2E7D46; --st-prog:#2F5597; --st-todo:#B98900; --st-late:#C0392B; --st-dep:#C77A17; --st-cont:#6B4FA0;
  --shadow:0 1px 2px rgba(26,26,26,.05),0 6px 20px rgba(26,26,26,.06);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--tx);
  display:grid;grid-template-columns:248px 1fr;min-height:100vh;font-size:14px;line-height:1.5}

/* ---------- Sidebar ---------- */
.sidebar{background:var(--ink);color:#EDE7DA;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:22px 16px}
.brand{padding:6px 8px 18px;border-bottom:1px solid rgba(255,255,255,.08)}
.brand-mark{font-weight:700;letter-spacing:.22em;color:var(--gold);font-size:15px}
.brand-sub{font-size:12px;color:#B9B1A2;margin-top:3px;letter-spacing:.02em}
.nav{margin-top:14px;display:flex;flex-direction:column;gap:2px;overflow-y:auto;flex:1}
.nav button{all:unset;cursor:pointer;display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;color:#CFC7B8;font-size:13px;transition:.15s}
.nav button:hover{background:rgba(255,255,255,.06);color:#fff}
.nav button.active{background:var(--gold);color:#1A1A1A;font-weight:600}
.nav .dot{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.5;flex:none}
.nav button.active .dot{opacity:1}
.side-foot{border-top:1px solid rgba(255,255,255,.08);padding-top:14px;margin-top:10px}
.side-foot a{color:var(--gold);text-decoration:none;font-size:12.5px;font-weight:500}
.side-foot a:hover{text-decoration:underline}
.side-meta{color:#8C8474;font-size:11px;margin-top:8px}

/* ---------- Main ---------- */
.main{display:flex;flex-direction:column;min-width:0}
.topbar{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding:26px 34px 16px;border-bottom:1px solid var(--line)}
.topbar h1{margin:0;font-size:22px;font-weight:700;color:var(--ink)}
.sec-desc{margin:4px 0 0;color:var(--muted);font-size:13px;max-width:70ch}
.top-right{display:flex;align-items:center;gap:10px;flex:none}
.src-badge{font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:20px;background:#EFEAE1;color:var(--muted);border:1px solid var(--line)}
.src-badge.live{background:#E6F4EA;color:#2E7D46;border-color:#BfE3C9}
.src-badge.local{background:#FBF0DE;color:#B98900;border-color:#F0DDB6}
.btn-ghost{all:unset;cursor:pointer;font-size:12.5px;color:var(--muted);border:1px solid var(--line);padding:5px 11px;border-radius:8px;background:var(--card)}
.btn-ghost:hover{color:var(--ink);border-color:var(--gold)}
.view{padding:24px 34px 40px;flex:1}
.loading{color:var(--muted);padding:40px 0}
.foot{padding:14px 34px;border-top:1px solid var(--line);color:var(--muted-2);font-size:11.5px}

/* ---------- Cards / blocks ---------- */
.block{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);margin-bottom:22px;overflow:hidden}
.block-h{padding:14px 18px;border-bottom:1px solid var(--line-2);display:flex;align-items:center;gap:10px}
.block-h h2{margin:0;font-size:14.5px;font-weight:700;color:var(--ink)}
.block-h .count{margin-left:auto;font-size:11.5px;color:var(--muted);background:#F2EEE6;padding:2px 9px;border-radius:20px}
.block-b{padding:6px 6px}
.gold-bar{height:3px;background:linear-gradient(90deg,var(--gold),var(--gold-soft))}

/* KPI grid */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:22px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.kpi .k-top{height:3px;position:absolute;top:0;left:0;right:0}
.kpi .k-val{font-size:30px;font-weight:700;color:var(--ink);line-height:1}
.kpi .k-lab{font-size:12px;color:var(--muted);margin-top:7px}

/* ficha (definition) */
.dl{display:grid;grid-template-columns:200px 1fr}
.dl>div{padding:11px 16px;border-bottom:1px solid var(--line-2);display:flex;align-items:flex-start}
.dl .k{font-weight:600;color:var(--ink);background:#FAF8F4}
.dl .v{color:var(--tx)}
.dl>div:nth-last-child(-n+2){border-bottom:none}

/* tables */
.tbl-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
thead th{text-align:left;font-weight:600;color:var(--muted);background:#FAF8F4;padding:9px 12px;border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0}
tbody td{padding:9px 12px;border-bottom:1px solid var(--line-2);vertical-align:top}
tbody tr:hover{background:#FCFBF8}
tbody tr:last-child td{border-bottom:none}
td .ref{font-variant-numeric:tabular-nums;color:var(--muted-2);font-weight:600;font-size:12px}
td .strong{font-weight:600;color:var(--ink)}
td.small,.small{color:var(--muted);font-size:12.5px}

/* pills */
.pill{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11.5px;font-weight:600;white-space:nowrap;line-height:1.5}
.frente-Marketing{background:#E9F0FB;color:var(--mkt)}
.frente-Midia{background:#EEE9F6;color:var(--mid)}
.frente-Comercial{background:#FBF1DE;color:var(--com)}
.frente-Site{background:#E4F2ED;color:var(--site)}
.frente-Gestao{background:#ECECEC;color:var(--ges)}
.frente-CamboaExterno{background:#F0EEE9;color:var(--ext)}
.st{background:#eee;color:#444}
.st-Concluido{background:#E6F4EA;color:var(--st-done)}
.st-Emandamento{background:#E9F0FB;color:var(--st-prog)}
.st-Ainiciar{background:#FBF3DE;color:var(--st-todo)}
.st-AtrasadoUrgente{background:#FBE7E4;color:var(--st-late)}
.st-DependedeCamboa{background:#FBEEDD;color:var(--st-dep)}
.st-Continuo{background:#EEE9F6;color:var(--st-cont)}
.prio-Alta{color:var(--st-late);font-weight:600}
.prio-Media{color:var(--com)}
.prio-Baixa{color:var(--muted)}

/* filter chips */
.filters{display:flex;flex-wrap:wrap;gap:7px;padding:12px 12px 6px}
.chip{all:unset;cursor:pointer;font-size:12px;padding:5px 12px;border-radius:20px;border:1px solid var(--line);color:var(--muted);background:var(--card)}
.chip:hover{border-color:var(--gold)}
.chip.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* marcos timeline */
.timeline{padding:14px 20px}
.tl-item{display:grid;grid-template-columns:120px 1fr;gap:14px;padding:10px 0;border-left:2px solid var(--line);margin-left:6px;padding-left:18px;position:relative}
.tl-item::before{content:"";position:absolute;left:-7px;top:16px;width:11px;height:11px;border-radius:50%;background:var(--gold);border:2px solid #fff}
.tl-item.key::before{background:var(--st-late)}
.tl-date{font-weight:600;color:var(--ink);font-size:12.5px}
.tl-txt{color:var(--tx)}

/* gantt */
.gantt{padding:6px 10px 14px;overflow-x:auto}
.g-legend{display:flex;flex-wrap:wrap;gap:14px;padding:10px 14px;font-size:12px;color:var(--muted)}
.g-legend span{display:inline-flex;align-items:center;gap:6px}
.g-legend i{width:14px;height:10px;border-radius:3px;display:inline-block}
.gtable{border-collapse:collapse;min-width:760px;width:100%}
.gtable th{font-size:11px;color:var(--muted);font-weight:600;padding:6px 4px;text-align:center;border-bottom:1px solid var(--line)}
.gtable td{padding:3px 2px;border-bottom:1px solid var(--line-2)}
.gtable td.lab{font-size:12px;color:var(--tx);white-space:nowrap;padding-right:12px;max-width:260px;overflow:hidden;text-overflow:ellipsis}
.gcell{height:16px;border-radius:4px}
.phase-row td{background:#FAF6EC;font-weight:700;color:var(--ink);font-size:12px;padding:6px 4px}

/* notes list */
.notes{padding:8px 20px 16px;margin:0}
.notes li{margin:7px 0;color:var(--tx)}
.tag-inline{font-size:11px;color:var(--muted);background:#F2EEE6;padding:1px 7px;border-radius:12px;margin-left:6px}

.err{margin:6px 12px;padding:10px 14px;background:#FBF0DE;border:1px solid #F0DDB6;border-radius:10px;color:#8a6a00;font-size:12.5px}

@media(max-width:860px){
  body{grid-template-columns:1fr}
  .sidebar{position:fixed;left:-260px;transition:.2s;z-index:20;box-shadow:8px 0 30px rgba(0,0,0,.3)}
  .sidebar.open{left:0}
  .topbar,.view,.foot{padding-left:18px;padding-right:18px}
  .dl{grid-template-columns:1fr}
}

/* ===================== CENTRAL DE TAREFAS ===================== */
.ws-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 12px 6px}
.ws-src{padding:0 14px 8px;font-size:11.5px}
.ws-live{color:var(--st-done);font-weight:600}
.ws-local{color:var(--st-todo);font-weight:600}
.seg{display:inline-flex;background:#F2EEE6;border:1px solid var(--line);border-radius:9px;padding:2px}
.seg-b{all:unset;cursor:pointer;font-size:12.5px;padding:6px 12px;border-radius:7px;color:var(--muted)}
.seg-b.on{background:var(--card);color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.ws-search{flex:1;min-width:160px;max-width:280px;border:1px solid var(--line);border-radius:9px;padding:8px 12px;font-size:13px;background:var(--card);color:var(--tx);font-family:inherit}
.ws-search:focus{outline:none;border-color:var(--gold)}
.ws-sel{border:1px solid var(--line);border-radius:9px;padding:8px 10px;font-size:12.5px;background:var(--card);color:var(--tx);font-family:inherit}
.ws-spacer{flex:1}
.ws-mini{font-size:12px;color:var(--muted)}
.ws-mini .u{color:var(--st-late)}
.btn-primary{all:unset;cursor:pointer;background:var(--gold);color:#231d10;font-weight:600;font-size:12.5px;padding:8px 14px;border-radius:9px}
.btn-primary:hover{filter:brightness(1.05)}
.btn-danger{all:unset;cursor:pointer;color:var(--st-late);font-weight:600;font-size:12.5px;padding:8px 12px;border-radius:9px;border:1px solid #f0cfca}
.btn-danger:hover{background:#fbecea}

/* board */
.board{display:flex;gap:14px;padding:8px 12px 16px;overflow-x:auto;align-items:flex-start}
.col{flex:0 0 262px;background:#FAF8F4;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;max-height:calc(100vh - 240px)}
.col.drop-hover{border-color:var(--gold);background:#FCF6E9;box-shadow:0 0 0 2px rgba(201,162,75,.25)}
.col-h{display:flex;align-items:center;gap:8px;padding:11px 13px;font-size:12.5px;font-weight:700;color:var(--ink);border-bottom:1px solid var(--line-2)}
.col-n{margin-left:auto;font-size:11px;color:var(--muted);background:#EFEAE1;padding:1px 8px;border-radius:20px;font-weight:600}
.col-dot{width:9px;height:9px;border-radius:50%;display:inline-block;background:#bbb}
.col-dot.st-Ainiciar{background:var(--st-todo)}.col-dot.st-Emandamento{background:var(--st-prog)}
.col-dot.st-DependedeCamboa{background:var(--st-dep)}.col-dot.st-AtrasadoUrgente{background:var(--st-late)}
.col-dot.st-Continuo{background:var(--st-cont)}.col-dot.st-Concluido{background:var(--st-done)}
.col-body{padding:9px;display:flex;flex-direction:column;gap:9px;overflow-y:auto}
.col-empty{color:var(--muted-2);font-size:12px;text-align:center;padding:10px 0}
.card{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--fr,#ccc);border-radius:10px;padding:10px 12px;cursor:grab;box-shadow:0 1px 2px rgba(0,0,0,.04);transition:box-shadow .12s,transform .05s}
.card:hover{box-shadow:0 3px 12px rgba(0,0,0,.09)}
.card:active{cursor:grabbing}
.card.dragging{opacity:.4}
.c-top{display:flex;align-items:center;gap:7px;margin-bottom:5px}
.c-title{font-size:13px;font-weight:600;color:var(--ink);line-height:1.35}
.c-meta{display:flex;align-items:center;gap:7px;margin-top:8px;flex-wrap:wrap}
.c-prazo{font-size:11px;color:var(--muted);background:#F2EEE6;padding:1px 7px;border-radius:12px}
.c-resp{font-size:11.5px;color:var(--muted);margin-top:6px}
.pdot{width:8px;height:8px;border-radius:50%;display:inline-block;background:#ccc}
.pdot-Alta{background:var(--st-late)}.pdot-Media{background:#C98A17}.pdot-Baixa{background:#BBB4A6}

/* editable table */
.ws-table .cell-sel,.ws-table .cell-inp{width:100%;border:1px solid transparent;border-radius:7px;padding:5px 7px;font-size:12.5px;background:transparent;color:var(--tx);font-family:inherit}
.ws-table .cell-sel:hover,.ws-table .cell-inp:hover{border-color:var(--line)}
.ws-table .cell-sel:focus,.ws-table .cell-inp:focus{outline:none;border-color:var(--gold);background:#fff}
.ws-table .w-prazo{max-width:130px}
.ws-table .lnk{cursor:pointer;border-bottom:1px dotted var(--muted-2)}
.ws-table .lnk:hover{color:var(--gold);border-color:var(--gold)}
.row-edit{all:unset;cursor:pointer;color:var(--muted);font-size:16px;padding:0 6px;border-radius:6px}
.row-edit:hover{color:var(--ink);background:#F2EEE6}

/* progress */
.prog{padding:14px 18px}
.prog-bar{height:12px;background:#EFEAE1;border-radius:20px;overflow:hidden}
.prog-fill{height:100%;background:linear-gradient(90deg,var(--gold),#8FB89B);border-radius:20px;transition:width .4s}
.prog-txt{margin-top:9px;font-size:12.5px;color:var(--muted)}

/* modal */
.modal-ov{position:fixed;inset:0;background:rgba(26,22,18,.5);display:flex;align-items:center;justify-content:center;z-index:50;padding:20px;backdrop-filter:blur(2px)}
.modal{background:var(--card);border-radius:16px;width:100%;max-width:560px;max-height:90vh;overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.modal-h{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line-2)}
.modal-h h3{margin:0;font-size:16px;color:var(--ink)}
.modal-x{all:unset;cursor:pointer;color:var(--muted);font-size:18px;padding:2px 8px;border-radius:6px}
.modal-x:hover{background:#F2EEE6;color:var(--ink)}
.modal-b{padding:18px 22px;display:flex;flex-direction:column;gap:13px}
.modal-b label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:600;color:var(--muted)}
.modal-b input,.modal-b select,.modal-b textarea{border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:13px;font-family:inherit;color:var(--tx);background:#fff;font-weight:400}
.modal-b input:focus,.modal-b select:focus,.modal-b textarea:focus{outline:none;border-color:var(--gold)}
.modal-b textarea{resize:vertical}
.m-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:11px}
.modal-f{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;border-top:1px solid var(--line-2)}
.mf-right{display:flex;gap:9px}
@media(max-width:560px){.m-row{grid-template-columns:1fr}}

/* toast */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:11px 20px;border-radius:10px;font-size:13px;font-weight:500;box-shadow:0 8px 30px rgba(0,0,0,.25);opacity:0;pointer-events:none;transition:.2s;z-index:60}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.err{background:#8a2b20}
.toast.ok{background:#1f5c32}