/* ============ Ownest Financeiro — design system ============ */
@font-face{
  font-family:"Inter"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url("inter-latin.woff2") format("woff2");
}
:root{
  /* superfícies */
  --bg:#F5F3F1; --surface:#FFFFFF; --surface-2:#FAF8F6;
  --ink:#241D1A; --muted:#71655F; --faint:#A2948C; --line:#E8E2DD; --line-2:#F1ECE8;
  /* marca */
  --brand-900:#1E1210; --brand-800:#291916; --brand-700:#3A211C; --brand-600:#8A2F1E;
  --accent:#CE3A24; --accent-strong:#E8542F; --accent-soft:#FBEAE4; --accent-ink:#A02A18;
  /* semântica */
  --crit:#9E1B32; --crit-bg:#F9E7EA; --warn:#B07C1F; --warn-bg:#FBF3E0;
  --ok:#2E7D4F; --ok-bg:#E6F3EB;
  /* manual (input do utilizador) */
  --manual:#D9A81F; --manual-bg:#FFF7DF; --manual-line:#EACB6A;
  --radius:12px; --radius-s:8px;
  --shadow-1:0 1px 2px rgba(30,18,16,.05), 0 1px 8px rgba(30,18,16,.04);
  --shadow-2:0 4px 18px rgba(30,18,16,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:14px/1.55 "Inter", "Segoe UI", system-ui, sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
a{color:var(--accent)}
h1{font-size:21px; font-weight:650; letter-spacing:-.02em; margin:0}
h2{font-size:15px; font-weight:600; letter-spacing:-.01em; margin:28px 0 10px; color:var(--ink)}
.sub{font-size:12.5px; color:var(--muted)}

/* ============ layout com sidebar ============ */
.shell{display:flex; min-height:100vh}
aside.sidebar{
  width:216px; flex:0 0 216px; position:sticky; top:0; height:100vh; overflow-y:auto;
  background:linear-gradient(180deg, var(--brand-800) 0%, var(--brand-900) 100%);
  color:#E5DBD6; padding:18px 12px 14px; display:flex; flex-direction:column; gap:2px;
}
.sidebar .logo{display:flex; align-items:center; gap:10px; padding:2px 10px 16px}
.sidebar .logo .mark{
  width:32px; height:32px; border-radius:9px; flex:0 0 32px;
  background:linear-gradient(135deg, var(--accent-strong), var(--brand-600));
  display:grid; place-items:center; color:#fff; font-weight:800; font-size:15px;
  box-shadow:0 2px 8px rgba(232,84,47,.30);
}
.sidebar .logo b{font-size:14.5px; letter-spacing:-.01em; color:#fff; display:block; line-height:1.1}
.sidebar .logo span{font-size:10.5px; color:#A98F85; text-transform:uppercase; letter-spacing:.12em}
.sidebar .sec{font-size:10px; text-transform:uppercase; letter-spacing:.14em; color:#96786D;
  padding:14px 10px 5px; font-weight:600}
.sidebar a{
  display:flex; align-items:center; gap:9px; padding:7px 10px; border-radius:8px;
  color:#D3C4BD; text-decoration:none; font-size:13px; font-weight:500;
  transition:background .12s, color .12s;
}
.sidebar a:hover{background:rgba(255,255,255,.06); color:#fff}
.sidebar a.ativo{background:rgba(232,84,47,.20); color:#fff; box-shadow:inset 2px 0 0 var(--accent-strong)}
.sidebar a .ic{width:17px; text-align:center; opacity:.85; font-size:13px}
.sidebar a .tag-m{margin-left:auto; font-size:9.5px; font-weight:700; color:var(--manual);
  background:rgba(217,168,31,.15); border-radius:5px; padding:1px 5px; letter-spacing:.04em}
.sidebar .fundo{margin-top:auto; padding:12px 10px 0; border-top:1px solid rgba(255,255,255,.08); font-size:12px}
.sidebar .fundo .nome{color:#fff; font-weight:600}
.sidebar .fundo .role{color:#A98F85; font-size:11px; text-transform:capitalize}
.sidebar .fundo a{padding:6px 0 0; color:#B9A69E; font-size:12px}

main{flex:1; min-width:0; padding:22px 28px 72px; max-width:1440px}
.page-head{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:0 0 16px}
.page-head .grow{flex:1}

/* ============ flash ============ */
.flash{padding:10px 14px; border-radius:var(--radius-s); margin:0 0 14px; font-size:13px; box-shadow:var(--shadow-1)}
.flash.ok{background:var(--ok-bg); color:var(--ok)}
.flash.erro{background:var(--crit-bg); color:var(--crit)}

/* ============ cards / kpis ============ */
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin:14px 0}
.card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:14px 16px 12px; box-shadow:var(--shadow-1); position:relative; overflow:hidden;
  transition:transform .15s, box-shadow .15s;
}
.card:hover{transform:translateY(-1px); box-shadow:var(--shadow-2)}
.card span{font-size:11.5px; color:var(--muted); display:block; font-weight:550;
  text-transform:uppercase; letter-spacing:.05em}
.card b{display:block; font-size:22px; font-weight:680; letter-spacing:-.02em;
  font-variant-numeric:tabular-nums; margin:4px 0 2px}
.card small{font-size:11.5px; color:var(--faint); display:block}
.card.ok b{color:var(--ok)} .card.warn b{color:var(--warn)} .card.crit b{color:var(--crit)}
.card canvas.spark{position:absolute; right:10px; bottom:10px; opacity:.75}
.delta{display:inline-flex; align-items:center; gap:3px; font-size:11px; font-weight:650;
  border-radius:6px; padding:1px 7px; font-variant-numeric:tabular-nums}
.delta.up{background:var(--ok-bg); color:var(--ok)}
.delta.down{background:var(--crit-bg); color:var(--crit)}
.delta.flat{background:var(--surface-2); color:var(--muted)}
.dot{display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:6px}
.dot.ok{background:var(--ok)} .dot.warn{background:var(--warn)} .dot.crit{background:var(--crit)}
.dot.info{background:var(--accent)}

/* ============ tabelas ============ */
.tbl{overflow:auto; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); margin:12px 0; box-shadow:var(--shadow-1); max-height:78vh}
table{border-collapse:separate; border-spacing:0; width:100%; font-size:13px}
thead th{position:sticky; top:0; background:var(--surface-2); z-index:2;
  border-bottom:1px solid var(--line)}
th{font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
  text-align:left; font-weight:620}
th,td{padding:8px 12px; border-bottom:1px solid var(--line-2); white-space:nowrap}
tbody tr:hover td{background:var(--surface-2)}
tr:last-child td{border-bottom:0}
td.num,th.num{text-align:right; font-variant-numeric:tabular-nums}
tr.grupo td{background:var(--accent-soft); color:var(--accent-ink); font-weight:620;
  font-size:11.5px; text-transform:uppercase; letter-spacing:.06em}
tr.total td{font-weight:700; border-top:2px solid var(--line); background:var(--surface-2)}
td.neg{color:var(--crit)} td.pos{color:var(--ok)}

/* ============ forms ============ */
input,select,button,textarea{font:inherit; color:inherit}
input,select,textarea{background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-s); padding:7px 10px; transition:border-color .12s, box-shadow .12s}
input:focus,select:focus{outline:none; border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(206,58,36,.15)}
button{background:var(--accent); color:#fff; border:0; border-radius:var(--radius-s);
  padding:8px 16px; cursor:pointer; font-weight:600; font-size:13px;
  transition:background .12s, transform .1s; box-shadow:var(--shadow-1)}
button:hover{background:var(--accent-strong)}
button:active{transform:scale(.98)}
button.sec{background:var(--surface); color:var(--ink); border:1px solid var(--line)}
button.sec:hover{background:var(--surface-2)}
button.perigo{background:var(--crit)}
form.inline{display:inline}
.filtros{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:10px 0}
.grelha input{width:88px; text-align:right; padding:4px 7px; border-radius:6px; font-size:12.5px}

/* origem dos dados */
.grelha input.in-manual{background:var(--manual-bg); border-color:var(--manual-line)}
.grelha input.in-import{background:#E7F3ED; border-color:#A9CDB8}
.grelha input.in-mig{background:#EEF1F0; color:var(--muted)}
.legenda{display:flex; gap:16px; flex-wrap:wrap; align-items:center; font-size:12px;
  color:var(--muted); margin:10px 0 2px}
.legenda .sw{display:inline-block; width:13px; height:13px; border-radius:4px;
  vertical-align:-2px; margin-right:5px; border:1px solid var(--line)}
.sw.manual{background:var(--manual-bg); border-color:var(--manual-line)}
.sw.import{background:#E7F3ED; border-color:#A9CDB8}
.sw.mig{background:#EEF1F0} .sw.vazio{background:#FFF}

/* ============ chips / callouts ============ */
.chip{display:inline-flex; align-items:center; font-size:11px; font-weight:650;
  padding:2px 9px; border-radius:99px; letter-spacing:.02em}
.chip.ok{background:var(--ok-bg); color:var(--ok)}
.chip.warn{background:var(--warn-bg); color:var(--warn)}
.chip.crit{background:var(--crit-bg); color:var(--crit)}
.chip.info{background:var(--accent-soft); color:var(--accent-ink)}
.call{border:1px solid var(--line); border-left:3px solid var(--accent);
  background:var(--surface); border-radius:var(--radius-s); padding:11px 16px;
  margin:8px 0; max-width:920px; box-shadow:var(--shadow-1)}
.call b.t{display:block; font-size:11.5px; text-transform:uppercase; letter-spacing:.06em;
  color:var(--accent-ink); font-weight:680}
.call p{margin:4px 0 0; max-width:none; color:var(--ink)}
.call.crit{border-left-color:var(--crit)} .call.crit b.t{color:var(--crit)}
.call.warn{border-left-color:var(--warn)} .call.warn b.t{color:var(--warn)}
.call.ok{border-left-color:var(--ok)} .call.ok b.t{color:var(--ok)}
.call.input{border-left-color:var(--manual); background:linear-gradient(0deg, rgba(255,247,223,.5), rgba(255,247,223,.5)) var(--surface)}
.call.input b.t{color:#8A6D1B}
.call.info{border-left-color:var(--accent)}
.nota{font-size:12.5px; color:var(--muted); max-width:88ch}
p{max-width:88ch}

/* ============ gráficos ============ */
.grafico{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:16px 18px; margin:12px 0; box-shadow:var(--shadow-1)}
.grafico h2{margin:0 0 12px}
.duo{display:grid; grid-template-columns:1fr 1fr; gap:14px}
@media(max-width:980px){.duo{grid-template-columns:1fr}}

/* ============ detalhes ============ */
details{margin:4px 0}
details summary{cursor:pointer; color:var(--accent); font-size:12.5px}

/* ============ login ============ */
body.login-page{background:
  radial-gradient(1200px 600px at 80% -10%, rgba(232,84,47,.22), transparent 60%),
  linear-gradient(180deg, var(--brand-800), var(--brand-900)); min-height:100vh}
.login-box{max-width:380px; margin:14vh auto; background:var(--surface);
  border-radius:16px; padding:36px 34px; box-shadow:0 24px 70px rgba(0,0,0,.35)}
.login-box .mark{width:44px; height:44px; border-radius:12px; margin-bottom:14px;
  background:linear-gradient(135deg, var(--accent-strong), var(--brand-600));
  display:grid; place-items:center; color:#fff; font-weight:800; font-size:19px}
.login-box h1{margin:0 0 2px}
.login-box p{color:var(--muted); margin:0 0 18px; font-size:13px}
.login-box label{display:block; font-size:12px; color:var(--muted); margin:13px 0 5px; font-weight:550}
.login-box input{width:100%}
.login-box button{width:100%; margin-top:20px; padding:10px}

/* ============ responsivo / mobile ============ */
/* barra superior móvel (hambúrguer) — invisível em desktop */
.topbar-m{display:none; position:fixed; top:0; left:0; right:0; z-index:290; height:54px;
  align-items:center; gap:10px; padding:0 14px;
  background:linear-gradient(180deg, var(--brand-800), var(--brand-900));
  box-shadow:0 2px 12px rgba(30,18,16,.35)}
.topbar-m b{color:#fff; font-size:15px; letter-spacing:-.01em}
.topbar-m .tb-sec{font-size:10px; color:#A98F85; text-transform:uppercase; letter-spacing:.12em; margin-top:3px}
.menu-btn{background:none; border:0; box-shadow:none; padding:10px 8px; margin-left:-8px;
  display:flex; flex-direction:column; gap:4.5px; cursor:pointer}
.menu-btn span{display:block; width:20px; height:2px; border-radius:2px; background:#E5DBD6;
  transition:transform .25s, opacity .2s}
body.nav-aberta .menu-btn span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
body.nav-aberta .menu-btn span:nth-child(2){opacity:0}
body.nav-aberta .menu-btn span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.nav-veu{display:none; position:fixed; inset:0; z-index:295; background:rgba(20,12,10,.5);
  opacity:0; pointer-events:none; transition:opacity .25s}

@media(max-width:860px){
  .topbar-m{display:flex}
  .shell{display:block}
  /* nunca deixar a página inteira deslizar na horizontal */
  body{overflow-x:clip}
  .grafico canvas{max-width:100% !important}
  img{max-width:100%}
  /* sidebar vira gaveta deslizante */
  aside.sidebar{position:fixed; top:0; left:0; bottom:0; height:100dvh; z-index:300;
    width:min(78vw, 280px); flex:none; padding-top:14px;
    transform:translateX(-103%); transition:transform .28s cubic-bezier(.2,.7,.3,1);
    box-shadow:8px 0 30px rgba(0,0,0,.35)}
  body.nav-aberta aside.sidebar{transform:none}
  body.nav-aberta{overflow:hidden}
  body.nav-aberta .nav-veu{display:block; opacity:1; pointer-events:auto}
  .nav-veu{display:block}
  /* alvos de toque generosos no menu */
  .sidebar a{padding:11px 12px; font-size:14px}
  main{padding:68px 12px 56px}
  /* densidade adaptada */
  h1{font-size:18px}
  .cards{grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px}
  .card b{font-size:19px}
  .card canvas.spark{display:none}
  .duo{grid-template-columns:1fr}
  .grafico{padding:12px 12px}
  .man-hero{padding:22px 18px 18px}
  /* formulários: 16px evita o zoom automático do iOS; botões com altura de dedo */
  input,select,textarea{font-size:16px}
  .grelha input{font-size:14px}
  button{min-height:42px}
  .page-head{gap:8px}
  .dv-painel{padding:4vh 8px}
  .dv-caixa{padding:16px 14px; max-height:88vh}
  .login-box{margin:9vh auto; padding:28px 22px; width:min(92vw, 380px)}
  .tbl{max-height:none}
  th,td{padding:8px 10px}
  .tbl th:first-child, .tbl td:first-child{max-width:170px}
}
@media (prefers-reduced-motion: reduce){
  *{transition:none !important; animation:none !important}
}

/* primeira coluna fixa nas tabelas largas + ajuste de células aos números */
.tbl th:first-child, .tbl td:first-child{
  position:sticky; left:0; z-index:1; background:var(--surface);
  box-shadow:1px 0 0 var(--line-2); max-width:280px; overflow:hidden; text-overflow:ellipsis}
.tbl thead th:first-child{z-index:3; background:var(--surface-2)}
.tbl tr.grupo td:first-child{background:var(--accent-soft)}
.tbl tr.total td:first-child{background:var(--surface-2)}
.tbl tbody tr:hover td:first-child{background:var(--surface-2)}
.grelha input{width:auto; min-width:84px; max-width:118px; font-variant-numeric:tabular-nums}
.cards{grid-template-columns:repeat(auto-fit,minmax(172px,1fr))}

/* valores projetados automaticamente da tesouraria (correlação contínua) */
.grelha input.in-auto{background:#E8F0F8; border-color:#A9C4DE; color:#2C5578}
.sw.auto{background:#E8F0F8; border-color:#A9C4DE}

/* grupos de movimentos por categoria */
details.cat-grupo{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-s);
  padding:10px 14px; margin:8px 0; box-shadow:var(--shadow-1)}
details.cat-grupo summary{display:flex; align-items:center; gap:10px; cursor:pointer;
  color:var(--ink); font-size:13.5px; list-style-position:inside}
details.cat-grupo[open] summary{margin-bottom:6px}
details.cat-grupo .tbl{margin:6px 0 2px; box-shadow:none}

/* painel de decomposição de célula */
.dv-painel{position:fixed; inset:0; background:rgba(20,12,10,.45); display:none;
  z-index:200; align-items:flex-start; justify-content:center; padding:8vh 16px}
.dv-painel.aberto{display:flex}
.dv-caixa{background:var(--surface); border-radius:var(--radius); box-shadow:var(--shadow-2);
  max-width:640px; width:100%; max-height:78vh; overflow:auto; padding:20px 22px; position:relative}
.dv-fechar{position:absolute; top:10px; right:12px; background:none; border:0; color:var(--muted);
  font-size:20px; cursor:pointer; box-shadow:none; padding:2px 8px}
.dv-fechar:hover{background:var(--surface-2); color:var(--ink)}
.dv-head{display:flex; gap:10px; align-items:baseline; margin-bottom:4px; padding-right:28px}
.dv-valor{font-size:22px; font-weight:680; margin:4px 0 2px; display:flex; gap:10px; align-items:center}
.dv-corpo h4{font-size:12px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted);
  margin:16px 0 6px}
.dv-corpo table{width:100%; font-size:12.5px}
.dv-corpo th,.dv-corpo td{padding:5px 8px}
/* botão ⓘ nas células das grelhas */
td.dv-cel{position:relative}
td.dv-cel .dv-i{position:absolute; top:2px; right:2px; width:15px; height:15px; line-height:14px;
  font-size:10px; text-align:center; border-radius:50%; background:var(--accent-soft);
  color:var(--accent-ink); cursor:pointer; opacity:0; transition:opacity .12s; border:0; padding:0; box-shadow:none}
td.dv-cel:hover .dv-i{opacity:1}
tbody td[data-dv]{cursor:pointer}

/* botão de ação dos insights */
.acao-btn{display:inline-block; margin-top:8px; font-size:12px; font-weight:650;
  color:var(--accent-ink); background:var(--accent-soft); border-radius:7px;
  padding:5px 12px; text-decoration:none; transition:background .12s}
.acao-btn:hover{background:var(--accent); color:#fff}

/* ============ estratégia ============ */
.est-hero{border-left:4px solid var(--accent)}
.est-campo{margin:8px 0}
.est-rotulo{font-size:11px; text-transform:uppercase; letter-spacing:.09em; color:var(--accent-ink);
  font-weight:680; display:block; margin-bottom:3px}
.est-campo textarea{width:100%; resize:vertical; font-size:13.5px; line-height:1.5;
  border-color:transparent; background:transparent; padding:4px 6px}
.est-campo textarea:hover{border-color:var(--line)}
.est-campo textarea:focus{background:var(--surface)}
.est-campo p{margin:0; font-size:13.5px}
.est-cultura{display:flex; flex-wrap:wrap; gap:7px; margin-top:12px}
.est-cultura .chip{cursor:help}
.est-item{padding:5px 0; border-bottom:1px solid var(--line-2); font-size:13px;
  display:flex; align-items:baseline; gap:6px}
.est-item form{margin-left:auto}
.est-vazio{background:var(--manual-bg); border-radius:7px; padding:8px 12px}
.est-swot{border:1px solid var(--line); border-radius:var(--radius-s); padding:12px 14px; margin-bottom:12px}
.est-swot.ok{border-top:3px solid var(--ok)} .est-swot.warn{border-top:3px solid var(--warn)}
.est-swot.info{border-top:3px solid #46617A} .est-swot.crit{border-top:3px solid var(--crit)}
.est-swot h3{margin:0 0 6px; font-size:13.5px}
.est-meta{margin:10px 0}
.est-meta-l{display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-size:13px}
.est-meta-l .num{font-variant-numeric:tabular-nums; display:flex; gap:8px; align-items:center}
.est-barra{background:var(--line-2); border-radius:99px; height:9px; overflow:hidden; margin-top:4px}
.est-barra div{height:100%; background:linear-gradient(90deg, var(--accent-strong), var(--accent)); border-radius:99px}
.est-barra.bhag div{background:linear-gradient(90deg, #46617A, #2E4356)}
.est-sonhos{columns:2; gap:24px}
@media(max-width:900px){.est-sonhos{columns:1}}
.rock-feito{border-color:var(--ok); color:var(--ok)}
.rock-falhado{border-color:var(--crit); color:var(--crit)}
h3{font-size:13.5px; margin:12px 0 6px}

/* ============ estratégia v2 (visual) ============ */
.man-hero{background:
  radial-gradient(900px 420px at 85% -20%, rgba(232,84,47,.25), transparent 60%),
  linear-gradient(160deg, var(--brand-800), var(--brand-900));
  border-radius:16px; padding:30px 34px 24px; color:#EFE6E1; margin-bottom:26px;
  box-shadow:var(--shadow-2)}
.man-marca{font-size:10.5px; letter-spacing:.22em; color:#C08A75; font-weight:700; margin-bottom:14px}
.man-rotulo{font-size:10.5px; text-transform:uppercase; letter-spacing:.14em; color:#E8845F;
  font-weight:700; display:block; margin-bottom:4px}
.man-campo{margin:0 0 14px}
.man-campo textarea{width:100%; resize:vertical; background:transparent; border:1px solid transparent;
  color:#F3ECE7; font-size:13.5px; line-height:1.55; padding:2px 4px; border-radius:6px}
.man-campo textarea.man-grande{font-size:19px; font-weight:350; line-height:1.5; letter-spacing:-.01em}
.man-campo textarea:hover{border-color:rgba(255,255,255,.18)}
.man-campo textarea:focus{background:rgba(0,0,0,.25); border-color:var(--accent-strong); box-shadow:none}
.man-campo p{margin:0; color:#F3ECE7; font-size:13.5px}
.man-campo p.man-grande{font-size:19px; font-weight:350; line-height:1.5}
.man-grid{display:grid; grid-template-columns:1fr 1fr; gap:4px 28px; margin-top:6px}
@media(max-width:900px){.man-grid{grid-template-columns:1fr}}
.man-cultura{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; padding-top:16px;
  border-top:1px solid rgba(255,255,255,.12)}
.man-chip{font-size:11.5px; font-weight:600; color:#F3D9CE; background:rgba(232,84,47,.16);
  border:1px solid rgba(232,84,47,.35); border-radius:99px; padding:3px 12px; cursor:help}

.est-sec{display:flex; align-items:center; gap:14px; margin:34px 0 12px}
.est-sec .est-num{width:40px; height:40px; border-radius:12px; flex:0 0 40px;
  background:linear-gradient(135deg, var(--accent-strong), var(--accent)); color:#fff;
  display:grid; place-items:center; font-size:19px; font-weight:700;
  box-shadow:0 3px 10px rgba(206,58,36,.3)}
.est-sec h2{margin:0}

/* SWOT em quadrantes */
.swot-grelha{display:grid; grid-template-columns:1fr 1fr; gap:12px; position:relative; margin:12px 0}
@media(max-width:900px){.swot-grelha{grid-template-columns:1fr}}
.swot-q{border-radius:var(--radius); padding:14px 16px; box-shadow:var(--shadow-1)}
.swot-q h3{margin-top:0}
.swot-q.forca{background:linear-gradient(180deg, var(--ok-bg), var(--surface) 70%); border-top:3px solid var(--ok)}
.swot-q.fraqueza{background:linear-gradient(180deg, var(--warn-bg), var(--surface) 70%); border-top:3px solid var(--warn)}
.swot-q.oportunidade{background:linear-gradient(180deg, #E8EFF5, var(--surface) 70%); border-top:3px solid #46617A}
.swot-q.ameaca{background:linear-gradient(180deg, var(--crit-bg), var(--surface) 70%); border-top:3px solid var(--crit)}
.swot-eixo{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  background:var(--ink); color:#fff; font-size:10px; font-weight:700; letter-spacing:.14em;
  border-radius:99px; padding:4px 12px; pointer-events:none}
@media(max-width:900px){.swot-eixo{display:none}}

/* anéis BHAG */
.bhag-painel{background:linear-gradient(180deg, var(--surface-2), var(--surface))}
.bhag-aneis{display:flex; gap:34px; flex-wrap:wrap; justify-content:space-around; padding:12px 0 6px}
.anel-bloco{text-align:center; min-width:150px}
.anel{width:120px; height:120px; border-radius:50%; margin:0 auto;
  background:conic-gradient(var(--accent-strong) calc(var(--pct)*1%), var(--line-2) 0);
  display:grid; place-items:center; transition:background .3s}
.anel-miolo{width:92px; height:92px; border-radius:50%; background:var(--surface);
  display:grid; place-items:center; box-shadow:inset 0 1px 4px rgba(30,18,16,.06)}
.anel-miolo b{font-size:22px; letter-spacing:-.02em}
.anel-nome{font-size:12.5px; font-weight:650; margin-top:10px}
.anel-vals{font-size:11.5px; color:var(--muted); font-variant-numeric:tabular-nums}

/* metas anuais */
.est-meta{margin:12px 0}
.est-meta-l{display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-size:13px}
.est-meta-l .num{font-variant-numeric:tabular-nums; display:flex; gap:7px; align-items:center}
.est-barra{background:var(--line-2); border-radius:99px; height:11px; overflow:hidden; margin-top:5px}
.est-barra div{height:100%; background:linear-gradient(90deg, var(--accent-strong), var(--accent));
  border-radius:99px; min-width:3px}

/* sonhos em grelha */
.sonhos-grelha{display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; margin:10px 0}
.sonho-card{background:var(--surface-2); border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; font-size:12.5px; line-height:1.4; display:flex; gap:9px; align-items:flex-start}
.sonho-card form{margin-left:auto}
.sonho-n{flex:0 0 auto; width:22px; height:22px; border-radius:7px; background:var(--accent-soft);
  color:var(--accent-ink); font-size:11px; font-weight:700; display:grid; place-items:center}

/* rocks kanban */
.rocks-tri{font-size:14px; margin:18px 0 8px; color:var(--accent-ink); letter-spacing:.02em}
.rocks-grelha{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:12px; margin:6px 0 14px}
.rock-card{background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--faint);
  border-radius:var(--radius-s); padding:12px 14px; box-shadow:var(--shadow-1);
  display:flex; flex-direction:column; gap:7px; transition:transform .12s, box-shadow .12s}
.rock-card:hover{transform:translateY(-1px); box-shadow:var(--shadow-2)}
.rock-card.estado-em-curso{border-left-color:var(--accent-strong)}
.rock-card.estado-feito{border-left-color:var(--ok); opacity:.75}
.rock-card.estado-feito .rock-titulo{text-decoration:line-through; text-decoration-thickness:1px}
.rock-card.estado-falhado{border-left-color:var(--crit); opacity:.8}
.rock-card.estado-pendente{border-left-color:var(--warn)}
.rock-titulo{font-size:13px; font-weight:640; line-height:1.35}
.rock-resultado{font-size:12px; color:var(--muted)}
.rock-rodape{display:flex; align-items:center; gap:8px; margin-top:auto; font-size:11.5px}
.rock-rodape .grow{flex:1}
.rock-rodape select{padding:3px 6px; font-size:11.5px; border-radius:6px}
.rock-avatar{width:24px; height:24px; border-radius:50%; flex:0 0 24px;
  background:linear-gradient(135deg, var(--brand-600), var(--accent)); color:#fff;
  display:grid; place-items:center; font-size:10px; font-weight:700; text-transform:uppercase}

/* ============ impacto visual global ============ */
/* revelação suave ao entrar no viewport (só com JS ativo — senão tudo visível) */
html.js-anima .cards, html.js-anima .grafico, html.js-anima .call, html.js-anima .swot-grelha,
html.js-anima .rocks-grelha, html.js-anima .tbl, html.js-anima .man-hero,
html.js-anima .pl-grelha, html.js-anima .pl-filtros{opacity:0; transform:translateY(10px);
  /* rede de segurança: mesmo que o observer nunca dispare, tudo aparece sozinho */
  animation:surgir .5s cubic-bezier(.2,.7,.3,1) 1.2s forwards}
.anima-in{animation:surgir .5s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes surgir{to{opacity:1; transform:none}}
/* escalonamento dos cartões dentro de um grupo revelado */
.anima-in .card{animation:surgir .5s cubic-bezier(.2,.7,.3,1) backwards}
.anima-in .card:nth-child(1){animation-delay:.02s} .anima-in .card:nth-child(2){animation-delay:.07s}
.anima-in .card:nth-child(3){animation-delay:.12s} .anima-in .card:nth-child(4){animation-delay:.17s}
.anima-in .card:nth-child(5){animation-delay:.22s} .anima-in .card:nth-child(6){animation-delay:.27s}


/* barras que crescem */
.anima-in .est-barra div, .anima-in [style*="border-radius:99px"] > div{
  animation:crescer .8s cubic-bezier(.2,.7,.3,1) backwards; transform-origin:left}
@keyframes crescer{from{transform:scaleX(0)}}

/* cartão destaque (gradiente da marca) */
.card.destaque{background:linear-gradient(150deg, var(--brand-800), var(--brand-900)); border:0;
  box-shadow:0 6px 18px rgba(30,18,16,.25)}
.card.destaque span{color:#D9A88F}
.card.destaque b{color:#fff}
.card.destaque small{color:#B99C8D}
.card.destaque .delta.up{background:rgba(46,125,79,.3); color:#8FE0AE}
.card.destaque .delta.down{background:rgba(224,90,74,.28); color:#FFB3A6}

/* topo dos cartões acende no hover */
.card{border-top:2px solid transparent}
.card:hover{border-top-color:var(--accent-strong)}
.card.ok:hover{border-top-color:var(--ok)} .card.crit:hover{border-top-color:var(--crit)}
.card.warn:hover{border-top-color:var(--warn)}

/* títulos de página com sublinhado da marca */
.page-head h1, main > h1{position:relative; padding-bottom:2px}
.page-head h1::after{content:""; position:absolute; left:0; bottom:-6px; width:44px; height:3px;
  border-radius:3px; background:linear-gradient(90deg, var(--accent-strong), var(--accent))}

/* anéis com transição */
.anel{transition:background .8s ease}

/* polimento fino */
::selection{background:rgba(232,84,47,.25)}
::-webkit-scrollbar{width:10px; height:10px}
::-webkit-scrollbar-thumb{background:var(--faint); border-radius:99px; border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:var(--muted)}
::-webkit-scrollbar-track{background:transparent}
:focus-visible{outline:2px solid var(--accent-strong); outline-offset:2px; border-radius:4px}
button:focus-visible{outline-offset:1px}
.tbl tbody tr{transition:background .1s}
.chip{transition:transform .1s}
a.chip:hover{transform:translateY(-1px)}
.sidebar a .ic{transition:transform .15s}
.sidebar a:hover .ic{transform:scale(1.2)}

/* ============ plano estratégico (horizontes) ============ */
:root{
  --t-fazer:var(--accent); --t-delegar:#46617A; --t-adquirir:#B07C1F;
  --t-construir:#6B4A32; --t-contratar:#2E7D4F; --t-banca:#2E4356;
}
.pl-radar{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
/* filtros por tipo */
.pl-filtros{display:flex; gap:8px; flex-wrap:wrap; margin:16px 0 6px}
.pl-f{display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:600;
  background:var(--surface); color:var(--muted); border:1px solid var(--line);
  border-radius:99px; padding:5px 13px 5px 9px; box-shadow:var(--shadow-1); min-height:0}
.pl-f .pl-f-ic{width:20px; height:20px; border-radius:50%; display:grid; place-items:center;
  color:#fff; font-size:11px}
.pl-f .pl-f-n{font-size:10.5px; background:var(--line-2); border-radius:99px; padding:1px 7px;
  color:var(--muted); font-variant-numeric:tabular-nums}
.pl-f:not(.ativo){opacity:.38; filter:grayscale(.6); background:var(--surface-2)}
.pl-f:hover{background:var(--surface-2)}
.pl-f.t-fazer .pl-f-ic{background:var(--t-fazer)} .pl-f.t-delegar .pl-f-ic{background:var(--t-delegar)}
.pl-f.t-adquirir .pl-f-ic{background:var(--t-adquirir)} .pl-f.t-construir .pl-f-ic{background:var(--t-construir)}
.pl-f.t-contratar .pl-f-ic{background:var(--t-contratar)} .pl-f.t-banca .pl-f-ic{background:var(--t-banca)}

/* grelha de horizontes */
.pl-grelha{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:14px 0; align-items:start}
.pl-col{background:var(--surface-2); border:1px solid var(--line); border-radius:var(--radius);
  padding:14px 12px 12px; display:flex; flex-direction:column; gap:10px; min-width:0}
.pl-col-head{display:flex; align-items:center; gap:10px; justify-content:space-between}
.pl-h-nome{font-size:14.5px; font-weight:700; letter-spacing:-.01em}
.pl-h-per{font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; margin-top:1px}
.pl-col{border-top:4px solid var(--line)}
.pl-col.h-semana{border-top-color:var(--accent-strong)}
.pl-col.h-mes{border-top-color:#B07C1F}
.pl-col.h-trimestre{border-top-color:#46617A}
.pl-col.h-ano{border-top-color:var(--brand-700)}
.pl-anel{width:48px; height:48px; flex:0 0 48px; border-radius:50%;
  background:conic-gradient(var(--accent-strong) calc(var(--pct)*1%), var(--line-2) 0);
  display:grid; place-items:center; transition:background .6s}
.pl-anel span{width:36px; height:36px; border-radius:50%; background:var(--surface);
  display:grid; place-items:center; font-size:10.5px; font-weight:700;
  font-variant-numeric:tabular-nums}
/* objetivo do horizonte */
.pl-obj{background:var(--surface); border:1px dashed var(--manual-line); border-radius:var(--radius-s);
  padding:8px 10px}
.pl-obj label{font-size:9.5px; text-transform:uppercase; letter-spacing:.14em; color:#8A6D1B;
  font-weight:700; display:block; margin-bottom:2px}
.pl-obj textarea{width:100%; border:0; background:transparent; resize:vertical; padding:0;
  font-size:12.5px; line-height:1.45; min-height:34px}
.pl-obj textarea:focus{outline:none; box-shadow:none}
.pl-obj p{margin:0; font-size:12.5px}
.pl-metas .est-meta{margin:8px 0}
.pl-metas .est-meta-l{font-size:11.5px}
.pl-metas em{font-style:normal; color:var(--faint)}
/* cartões de ação */
.pl-lista{display:flex; flex-direction:column; gap:8px}
.pl-card{background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--faint);
  border-radius:var(--radius-s); padding:9px 11px 8px; box-shadow:var(--shadow-1);
  display:flex; flex-direction:column; gap:5px; transition:transform .12s, box-shadow .12s}
.pl-card:hover{transform:translateY(-1px); box-shadow:var(--shadow-2)}
.pl-card.t-fazer{border-left-color:var(--t-fazer)} .pl-card.t-delegar{border-left-color:var(--t-delegar)}
.pl-card.t-adquirir{border-left-color:var(--t-adquirir)} .pl-card.t-construir{border-left-color:var(--t-construir)}
.pl-card.t-contratar{border-left-color:var(--t-contratar)} .pl-card.t-banca{border-left-color:var(--t-banca)}
.pl-c-topo{display:flex; align-items:center; gap:8px; justify-content:space-between}
.pl-tipo{font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.08em}
.t-fazer .pl-tipo{color:var(--t-fazer)} .t-delegar .pl-tipo{color:var(--t-delegar)}
.t-adquirir .pl-tipo{color:var(--t-adquirir)} .t-construir .pl-tipo{color:var(--t-construir)}
.t-contratar .pl-tipo{color:var(--t-contratar)} .t-banca .pl-tipo{color:var(--t-banca)}
.pl-euro{font-size:11px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--ink);
  background:var(--line-2); border-radius:6px; padding:1px 7px}
.pl-titulo{font-size:13px; font-weight:600; line-height:1.35}
.pl-det{font-size:11.5px; color:var(--muted); line-height:1.4}
.pl-card.e-feito{opacity:.55}
.pl-card.e-feito .pl-titulo{text-decoration:line-through; text-decoration-thickness:1px}
.pl-rodape{display:flex; align-items:center; gap:7px; margin-top:2px}
.pl-rodape .grow{flex:1}
.pl-estado{background:var(--surface-2); color:var(--muted); border:1px solid var(--line);
  border-radius:99px; font-size:10.5px; font-weight:650; padding:2px 9px; min-height:0;
  box-shadow:none; cursor:pointer}
.e-em_curso .pl-estado{background:var(--accent-soft); color:var(--accent-ink); border-color:transparent}
.e-feito .pl-estado{background:var(--ok-bg); color:var(--ok); border-color:transparent}
.pl-avatar{width:22px; height:22px; border-radius:50%; flex:0 0 22px; font-size:9px; font-weight:700;
  background:linear-gradient(135deg, var(--brand-600), var(--accent)); color:#fff;
  display:grid; place-items:center; text-transform:uppercase; cursor:help}
.pl-mover{font-size:10.5px; padding:2px 4px; border-radius:6px; color:var(--muted); max-width:92px}
.pl-x{background:none; border:0; box-shadow:none; color:var(--faint); font-size:15px;
  padding:0 4px; min-height:0; cursor:pointer}
.pl-x:hover{color:var(--crit); background:none}
.pl-vazio{padding:6px 2px}
/* nova ação */
.pl-nova{margin-top:2px}
.pl-nova summary{font-weight:600}
.pl-nova form{display:flex; flex-direction:column; gap:7px; margin-top:8px}
.pl-nova input,.pl-nova select{font-size:13px; width:100%}
.pl-nova-l{display:flex; gap:7px}
.pl-nova button{align-self:flex-start; padding:6px 14px; min-height:0}
/* entrada animada dos cartões do plano (ocultação/reveal já na regra global) */
.anima-in .pl-card{animation:surgir .45s cubic-bezier(.2,.7,.3,1) backwards}
.anima-in .pl-card:nth-child(2){animation-delay:.05s} .anima-in .pl-card:nth-child(3){animation-delay:.1s}
.anima-in .pl-card:nth-child(4){animation-delay:.15s} .anima-in .pl-card:nth-child(5){animation-delay:.2s}
/* responsivo: 2 colunas em tablet, carrossel com snap em telemóvel */
@media(max-width:1180px){.pl-grelha{grid-template-columns:1fr 1fr}}
@media(max-width:860px){
  .pl-grelha{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:12px;
    padding-bottom:10px; margin-right:-12px}
  .pl-col{flex:0 0 86vw; scroll-snap-align:start}
  .pl-radar{grid-template-columns:1fr 1fr}
}

/* ============ pipeline de projetos futuros ============ */
.pipe-funil{display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin:12px 0; align-items:start}
.pipe-col{background:var(--surface-2); border:1px solid var(--line); border-radius:var(--radius);
  padding:12px 10px 10px; display:flex; flex-direction:column; gap:8px; min-width:0;
  border-top:4px solid var(--line)}
.pipe-col.f-prospecao{border-top-color:#9AA7B4}
.pipe-col.f-estudo{border-top-color:#46617A}
.pipe-col.f-negociacao{border-top-color:var(--warn)}
.pipe-col.f-licenciamento{border-top-color:var(--accent-strong)}
.pipe-col.f-pronto{border-top-color:var(--ok)}
.pipe-fase{font-size:13px; font-weight:700; letter-spacing:-.01em}
.pipe-dica{font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em}
.pipe-vazia{text-align:center; padding:14px 0; opacity:.6}
.pipe-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-s);
  padding:10px 11px 8px; box-shadow:var(--shadow-1); display:flex; flex-direction:column; gap:6px;
  transition:transform .12s, box-shadow .12s}
.pipe-card:hover{transform:translateY(-1px); box-shadow:var(--shadow-2)}
.pipe-topo{display:flex; align-items:flex-start; gap:8px; justify-content:space-between}
.pipe-topo b{font-size:13px; line-height:1.3}
.pipe-loc{font-size:11.5px; color:var(--muted)}
.pipe-nums{display:flex; flex-direction:column; gap:3px; background:var(--surface-2);
  border-radius:7px; padding:7px 9px}
.pipe-nums > div{display:flex; justify-content:space-between; align-items:baseline; gap:8px}
.pipe-nums span{font-size:9.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted)}
.pipe-nums b{font-size:12.5px; font-variant-numeric:tabular-nums; white-space:nowrap}
.pipe-nums b.pos{color:var(--ok)}
.pipe-nums em{font-style:normal; font-size:10px; color:var(--faint)}
.pipe-datas{font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums}
.pipe-notas{font-size:11.5px; color:var(--muted); line-height:1.4}
.pipe-rodape{display:flex; align-items:center; gap:6px; flex-wrap:wrap}
.pipe-rodape .grow{flex:1}
.pipe-rodape form.inline:first-child{flex:1 1 100%}
.pipe-rodape select{font-size:11px; padding:4px 6px; border-radius:6px; color:var(--muted); width:100%}
.pipe-edit summary{font-size:11.5px; padding:3px 8px; background:var(--surface-2);
  border:1px solid var(--line); border-radius:99px; list-style:none; cursor:pointer}
.pipe-edit summary::-webkit-details-marker{display:none}
.pipe-edit summary::before{content:"✎ "}
.pipe-edit summary{font-size:11px}
.pipe-form{display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; align-items:center}
.pipe-form label{font-size:11px; color:var(--muted); display:flex; gap:5px; align-items:center}
.pipe-form input,.pipe-form select{font-size:12.5px; padding:5px 8px}
.pipe-form button{min-height:0; padding:7px 14px}
.pipe-nova{margin:10px 0 4px}
.pipe-nova summary{font-weight:600; color:var(--accent)}
.pipe-nova .pipe-form-nova{background:var(--surface); border:1px dashed var(--line);
  border-radius:var(--radius-s); padding:12px}

/* cronograma (gantt) */
.gantt-caixa{overflow-x:auto}
.gantt{min-width:680px}
.gantt-grelha{position:relative; padding:26px 0 6px;
  background:repeating-linear-gradient(90deg, transparent 0, transparent calc(100%/var(--n) - 1px),
    var(--line-2) calc(100%/var(--n) - 1px), var(--line-2) calc(100%/var(--n)))}
.gantt-ano{position:absolute; top:0; bottom:0; border-left:1.5px solid var(--line)}
.gantt-ano span{position:absolute; top:2px; left:5px; font-size:10.5px; font-weight:700;
  color:var(--muted); letter-spacing:.06em}
.gantt-hoje{position:absolute; top:0; bottom:0; border-left:2px dashed var(--accent); z-index:2}
.gantt-hoje span{position:absolute; top:2px; left:5px; font-size:9.5px; font-weight:700;
  color:var(--accent); text-transform:uppercase; letter-spacing:.08em}
.gantt-linha{display:grid; grid-template-columns:170px 1fr; align-items:center; gap:8px; margin:7px 0}
.gantt-nome{font-size:12px; font-weight:600; line-height:1.25; padding-left:2px}
.gantt-nome small{display:block; font-weight:400; color:var(--muted); font-size:10px;
  text-transform:uppercase; letter-spacing:.06em}
.gantt-pista{position:relative; height:26px}
.gantt-barra{position:absolute; top:2px; bottom:2px; border-radius:99px; min-width:8px;
  display:flex; align-items:center; padding:0 10px; overflow:hidden;
  box-shadow:var(--shadow-1); transition:transform .12s}
.gantt-barra:hover{transform:scaleY(1.12)}
.gantt-barra span{font-size:10.5px; font-weight:700; color:#fff; white-space:nowrap;
  font-variant-numeric:tabular-nums; text-shadow:0 1px 2px rgba(0,0,0,.25)}
.gantt-barra.g-carteira{background:linear-gradient(90deg,#46617A,#2E4356)}
.gantt-barra.g-prospecao,.gantt-barra.g-estudo{background:#9AA7B4}
.gantt-barra.g-negociacao{background:var(--warn)}
.gantt-barra.g-licenciamento{background:linear-gradient(90deg,var(--accent-strong),var(--accent))}
.gantt-barra.g-pronto{background:var(--ok)}

/* responsivo: funil vira carrossel em ecrãs pequenos */
@media(max-width:1250px){.pipe-funil{grid-template-columns:repeat(3,1fr)}}
@media(max-width:860px){
  .pipe-funil{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:10px;
    padding-bottom:8px; margin-right:-12px}
  .pipe-col{flex:0 0 80vw; scroll-snap-align:start}
  .gantt-linha{grid-template-columns:110px 1fr}
}

/* animação de entrada do pipeline (mesma rede de segurança global) */
html.js-anima .pipe-funil{opacity:0; transform:translateY(10px);
  animation:surgir .5s cubic-bezier(.2,.7,.3,1) 1.2s forwards}
.anima-in .pipe-card{animation:surgir .45s cubic-bezier(.2,.7,.3,1) backwards}
.anima-in .gantt-barra{animation:crescer .8s cubic-bezier(.2,.7,.3,1) backwards; transform-origin:left}

/* pipeline v2: ciclo de vida completo + financiamento */
.pipe-scroll{overflow-x:auto; margin:12px 0}
.pipe-scroll .pipe-funil{margin:0; grid-template-columns:repeat(7,minmax(240px,1fr)); min-width:1730px}
.pipe-col.f-execucao{border-top-color:var(--accent)}
.pipe-col.f-vendas{border-top-color:var(--ok)}
.pipe-col.f-finalizado{border-top-color:#7A7069}
.pipe-card.pipe-real{border-style:solid; border-color:#3D5165;
  background:linear-gradient(180deg, #F0F4F8, var(--surface) 55%)}
.pipe-liga{font-size:11px; font-weight:600; text-decoration:none}
.fin-barra{display:flex; height:9px; border-radius:99px; overflow:hidden; background:var(--line-2)}
.fin-barra div{height:100%}
.fin-cp{background:#2E7D4F} .fin-banca{background:#46617A} .fin-ff{background:#B07C1F}
.pipe-finrow small{font-size:10px; color:var(--muted); display:block; margin-top:3px}
.pipe-finrow .neg{color:var(--crit); font-weight:600}
.gantt-barra.g-execucao{background:linear-gradient(90deg,var(--accent),var(--brand-600))}
.gantt-barra.g-vendas{background:var(--ok)}
.gantt-barra.g-finalizado{background:#7A7069}
@media(max-width:860px){
  .pipe-scroll{overflow:visible; margin-right:-12px}
  .pipe-scroll .pipe-funil{min-width:0}
}

/* formulário de edição do pipeline: contido no cartão, empilhado, nunca transborda */
.pipe-card{overflow:hidden}
.pipe-edit{flex:1 1 auto; min-width:0}
.pipe-edit > summary{display:inline-block}
.pipe-edit .pipe-form{display:block; background:var(--surface-2); border-radius:8px;
  padding:10px 10px 12px; margin-top:8px}
.pipe-edit .pipe-form label{display:block; width:100%; font-size:10.5px; font-weight:600;
  color:var(--muted); margin:8px 0 0; text-transform:uppercase; letter-spacing:.05em}
.pipe-edit .pipe-form input, .pipe-edit .pipe-form select{display:block; width:100%; max-width:100%;
  min-width:0; font-size:13px; margin-top:4px; text-align:left; box-sizing:border-box}
.pipe-edit .pipe-form button{display:block; width:100%; margin-top:12px}

/* funil dinâmico: colunas vazias colapsam em réguas finas; as com cartões dividem o ecrã */
.pipe-scroll .pipe-funil{display:flex; min-width:0; gap:12px; align-items:stretch}
.pipe-scroll .pipe-col{flex:1 1 240px; min-width:238px}
.pipe-scroll .pipe-col.vazia{flex:0 0 48px; min-width:48px; padding:12px 4px;
  display:flex; align-items:center; justify-content:flex-start}
.pipe-vert{writing-mode:vertical-rl; transform:rotate(180deg); font-size:11.5px; font-weight:700;
  color:var(--muted); letter-spacing:.07em; white-space:nowrap; margin:2px auto 0}
@media(max-width:860px){
  .pipe-scroll .pipe-funil{overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px}
  .pipe-scroll .pipe-col{flex:0 0 80vw; min-width:0; scroll-snap-align:start}
  .pipe-scroll .pipe-col.vazia{flex:0 0 48px; min-width:48px}
}
