/* ============================================================
   Ideal Sistemas — sistema interno · v1
   Mesma família visual do site institucional:
   trilho lateral + coluna, mono labels, cantos retos, tema claro.
   ============================================================ */

:root{
  --ground:    #F7F9F5;
  --surface:   #FFFFFF;
  --surface-2: #EFF3EB;
  --line:      #E3E8DF;
  --line-2:    #CDD6C7;

  --ink:       #18211B;
  --ink-2:     #47544A;
  --muted:     #718070;

  --accent:        #5F8F26;
  --accent-bright: #8DC63F;
  --accent-dim:    #9DBF6E;
  --dim:           #A3AFA0;
  --danger:        #A4432A;
  --danger-soft:   #F4E4DE;

  --display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --body:    'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --mono:    'IBM Plex Mono', ui-monospace, Consolas, monospace;

  --rail: 248px;
  --pad:  clamp(22px, 3.5vw, 56px);
  --ease: cubic-bezier(.16,1,.3,1);
}

*{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:var(--body);
  font-weight:300;
  font-size:15.5px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

::selection{ background:var(--accent-bright); color:var(--ink); }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--ground); }
::-webkit-scrollbar-thumb{ background:var(--line-2); }
::-webkit-scrollbar-thumb:hover{ background:var(--accent-dim); }

a{ color:inherit; }

.skip{
  position:absolute; left:-9999px; top:0; z-index:100;
  background:var(--accent-bright); color:var(--ink); padding:12px 18px;
  font-family:var(--mono); font-size:13px;
}
.skip:focus{ left:0; }

:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }

/* grão sutil, como no site ----------------------------------- */
body::after{
  content:''; position:fixed; inset:0; pointer-events:none; z-index:50;
  opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============================================================
   TRILHO LATERAL
   ============================================================ */

.rail{
  position:fixed; left:0; top:0; bottom:0; width:var(--rail);
  border-right:1px solid var(--line);
  background:var(--ground);
  display:flex; flex-direction:column; justify-content:space-between;
  padding:30px 24px 26px;
  z-index:40;
}

.wordmark{ text-decoration:none; display:block; }
.wm-row{ display:flex; align-items:center; gap:11px; }
.wm-bulb{
  width:40px; height:40px; flex:none;
  background:#F4F6F1; border-radius:50%;
  display:grid; place-items:center;
  box-shadow:0 0 0 1px var(--line-2);
}
.wm-bulb img{ width:28px; height:auto; display:block; }
.wm-main{
  display:block;
  font-family:var(--display); font-weight:900;
  font-size:20px; letter-spacing:-.035em; line-height:1;
}
.wm-thin{ font-weight:500; color:var(--ink-2); margin-left:.3em; }
.wm-endorse{
  display:flex; align-items:center; gap:9px; margin-top:11px;
  font-family:var(--mono); font-size:9px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--muted); white-space:nowrap;
}
.wm-endorse::before,
.wm-endorse::after{ content:''; height:1px; flex:1; min-width:8px; background:var(--line-2); }
.wm-endorse b{ color:var(--accent); font-weight:500; }

.rail-index{ position:relative; display:flex; flex-direction:column; gap:2px; }
.rail-marker{
  position:absolute; left:-24px; width:2px; height:26px; background:var(--accent);
  top:0; opacity:0;
  transition:transform .5s var(--ease), opacity .3s ease;
}
.rail-index a{
  display:flex; align-items:baseline; gap:11px;
  padding:6px 0; text-decoration:none;
  font-family:var(--mono); font-size:12.5px; letter-spacing:.01em;
  color:var(--muted);
  transition:color .28s ease;
}
.rail-index a i{ font-style:normal; font-size:10.5px; color:var(--line-2); transition:color .28s ease; }
.rail-index a:hover{ color:var(--ink); }
.rail-index a:hover i{ color:var(--accent-dim); }
.rail-index a.on{ color:var(--ink); }
.rail-index a.on i{ color:var(--accent); }

.rail-bottom{ display:flex; flex-direction:column; gap:12px; }
.status{
  display:flex; align-items:center; gap:9px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.04em; color:var(--muted);
}
.pip{
  width:6px; height:6px; border-radius:50%; background:var(--accent);
  box-shadow:0 0 0 0 rgba(141,198,63,.55);
  animation:pulse 3.4s infinite;
  flex:none;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(141,198,63,.5); }
  70%{ box-shadow:0 0 0 7px rgba(141,198,63,0); }
  100%{ box-shadow:0 0 0 0 rgba(141,198,63,0); }
}
.clock{ margin-left:auto; color:var(--dim); font-variant-numeric:tabular-nums; }
.rail-ver{
  font-family:var(--mono); font-size:9.5px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--dim);
}

/* ============================================================
   COLUNA / VISTA
   ============================================================ */

.column{ margin-left:var(--rail); min-height:100vh; }

.view{ padding:clamp(34px,5vw,60px) var(--pad) clamp(60px,8vw,110px); max-width:1240px; outline:none; }

/* cabeçalho de vista ----------------------------------------- */
.vhead{ margin-bottom:clamp(28px,4vw,44px); }
.label{
  font-family:var(--mono); font-size:11px; letter-spacing:.15em;
  text-transform:uppercase; color:var(--muted);
  margin:0 0 14px;
  display:flex; align-items:baseline; gap:12px;
}
.label i{ font-style:normal; color:var(--accent); }

.vhead-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:18px; flex-wrap:wrap; }
h1.vtitle{
  font-family:var(--display); font-weight:900;
  font-size:clamp(28px,3.4vw,42px); line-height:1.04; letter-spacing:-.035em;
  margin:0; text-wrap:balance;
}
.vhead-sub{ color:var(--muted); font-size:14.5px; margin:10px 0 0; max-width:58ch; }
.vhead-actions{ display:flex; gap:10px; flex-wrap:wrap; }

/* botões ----------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  text-decoration:none; cursor:pointer;
  background:var(--accent-bright); color:var(--ink); border:1px solid var(--accent-bright);
  padding:11px 20px;
  font-family:var(--mono); font-size:11.5px; letter-spacing:.09em; text-transform:uppercase;
  transition:background .3s ease, color .3s ease, border-color .3s ease;
}
.btn:hover{ background:transparent; color:var(--accent); border-color:var(--accent); }
.btn.ghost{ background:transparent; color:var(--ink-2); border-color:var(--line-2); }
.btn.ghost:hover{ border-color:var(--ink-2); color:var(--ink); background:transparent; }
.btn.danger{ background:transparent; color:var(--danger); border-color:var(--danger); }
.btn.danger:hover{ background:var(--danger); color:#fff; }
.btn.small{ padding:7px 13px; font-size:10.5px; }
.btn:disabled{ opacity:.45; cursor:not-allowed; }

/* link discreto de ação em linha */
.rowact{
  background:none; border:none; cursor:pointer; padding:4px 6px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted);
  transition:color .25s ease;
}
.rowact:hover{ color:var(--accent); }
.rowact.neg:hover{ color:var(--danger); }

/* ============================================================
   DASHBOARD
   ============================================================ */

.tiles{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px; background:var(--line); border:1px solid var(--line);
  margin-bottom:clamp(28px,4vw,44px);
}
.tile{
  background:var(--surface); padding:clamp(20px,2.4vw,30px);
  display:flex; flex-direction:column; gap:8px; min-width:0;
}
.tile-k{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted);
}
.tile-v{
  font-family:var(--display); font-weight:900;
  font-size:clamp(30px,3.4vw,46px); line-height:1; letter-spacing:-.04em;
  font-variant-numeric:tabular-nums;
  overflow-wrap:anywhere;
}
.tile-v small{ font-size:.5em; font-weight:700; color:var(--muted); letter-spacing:-.01em; }
.tile-note{ font-size:13px; color:var(--muted); }
.tile.accent .tile-v{ color:var(--accent); }

/* pipeline --------------------------------------------------- */
.pipeline{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px; background:var(--line); border:1px solid var(--line);
  margin-bottom:clamp(28px,4vw,44px);
}
.pipe{
  background:var(--ground); padding:16px 20px;
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
}
.pipe b{
  font-family:var(--display); font-weight:900; font-size:24px; letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;
}

.dash-cols{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(22px,3vw,40px); align-items:start; }
.dash-block h2{
  font-family:var(--display); font-weight:700; font-size:17px; letter-spacing:-.02em;
  margin:0 0 4px;
}
.mini-list{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.mini-list li{
  display:flex; align-items:baseline; gap:14px;
  padding:12px 2px; border-bottom:1px solid var(--line);
  font-size:14.5px;
}
.mini-list .when{
  font-family:var(--mono); font-size:11px; color:var(--dim);
  flex:none; min-width:74px; font-variant-numeric:tabular-nums;
}
.mini-list .what{ color:var(--ink-2); min-width:0; overflow-wrap:anywhere; }
.mini-list .late{ color:var(--danger); }

/* ============================================================
   BARRAS DE FERRAMENTA / BUSCA / TABELAS
   ============================================================ */

.toolbar{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  margin-bottom:22px;
}
.search{
  flex:1 1 240px; max-width:380px; position:relative;
}
.search input{
  width:100%;
  background:transparent; border:none; border-bottom:1px solid var(--line-2);
  color:var(--ink); font-family:var(--body); font-size:15px; font-weight:300;
  padding:9px 0;
  transition:border-color .3s ease;
}
.search input:focus{ border-bottom-color:var(--accent); outline:none; }
.search input::placeholder{ color:var(--dim); }

.filters{ display:flex; gap:2px; flex-wrap:wrap; }
.chip{
  background:none; border:1px solid transparent; cursor:pointer;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); padding:6px 11px;
  transition:color .25s ease, border-color .25s ease;
}
.chip:hover{ color:var(--ink); }
.chip.on{ color:var(--accent); border-color:var(--accent-dim); }

/* tabela editorial ------------------------------------------- */
.tbl{ width:100%; border-collapse:collapse; border-top:1px solid var(--line); }
.tbl th{
  text-align:left; padding:10px 14px 10px 2px;
  font-family:var(--mono); font-size:10px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted); font-weight:400;
  border-bottom:1px solid var(--line);
  white-space:nowrap;
}
.tbl td{
  padding:15px 14px 15px 2px; border-bottom:1px solid var(--line);
  vertical-align:top; font-size:14.5px; color:var(--ink-2);
}
.tbl tbody tr{ transition:background .3s ease; }
.tbl tbody tr:hover{ background:var(--surface); }
.tbl .t-main{ color:var(--ink); font-weight:400; }
.tbl .t-sub{ display:block; font-size:12.5px; color:var(--muted); margin-top:2px; }
.tbl .t-num{ font-family:var(--mono); font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.tbl .t-mono{ font-family:var(--mono); font-size:12px; color:var(--muted); white-space:nowrap; }
.tbl .t-act{ text-align:right; white-space:nowrap; }
.tbl tr.archived{ opacity:.5; }
.tbl a.t-link{ text-decoration:none; color:var(--ink); border-bottom:1px solid var(--line-2); padding-bottom:1px; transition:border-color .25s ease, color .25s ease; }
.tbl a.t-link:hover{ color:var(--accent); border-color:var(--accent); }

/* selo de status --------------------------------------------- */
.badge{
  display:inline-block;
  font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase;
  padding:4px 9px; border:1px solid var(--line-2); color:var(--muted);
  white-space:nowrap;
}
.badge.rascunho{ color:var(--muted); border-color:var(--line-2); }
.badge.enviada{ color:var(--accent); border-color:var(--accent-dim); }
.badge.aprovada{ color:var(--ink); background:var(--accent-bright); border-color:var(--accent-bright); }
.badge.recusada{ color:var(--danger); border-color:var(--danger); }

/* estado vazio ----------------------------------------------- */
.empty{
  border:1px dashed var(--line-2);
  padding:clamp(40px,6vw,72px) clamp(24px,4vw,48px);
  text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:14px;
}
.empty-mark{
  font-family:var(--display); font-weight:900; font-size:34px; line-height:1;
  color:transparent; -webkit-text-stroke:1px var(--line-2);
  letter-spacing:-.03em; user-select:none;
}
.empty p{ margin:0; color:var(--muted); max-width:44ch; font-size:14.5px; }
.empty .btn{ margin-top:6px; }

/* ============================================================
   ORÇAMENTO — EDITOR
   ============================================================ */

.crumb{
  font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); margin-bottom:16px; display:flex; gap:8px; align-items:center;
}
.crumb a{ color:var(--muted); text-decoration:none; transition:color .25s ease; }
.crumb a:hover{ color:var(--accent); }
.crumb .sep{ color:var(--line-2); }

.doc-card{
  background:var(--surface); border:1px solid var(--line);
  padding:clamp(22px,3vw,40px);
  margin-bottom:22px;
}
.doc-grid{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:18px 20px; }
.doc-grid .f-12{ grid-column:span 12; }
.doc-grid .f-6{ grid-column:span 6; }
.doc-grid .f-4{ grid-column:span 4; }
.doc-grid .f-3{ grid-column:span 3; }

.field{ display:flex; flex-direction:column; gap:7px; min-width:0; }
.field label{
  font-family:var(--mono); font-size:10px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--muted);
}
.field .opt{ color:var(--dim); letter-spacing:.08em; }
.field input, .field select, .field textarea{
  background:transparent; border:none; border-bottom:1px solid var(--line-2);
  color:var(--ink); font-family:var(--body); font-size:15px; font-weight:300;
  padding:8px 0; resize:vertical; border-radius:0;
  transition:border-color .3s ease;
  width:100%; min-width:0;
}
.field select{ cursor:pointer; }
.field input:focus, .field select:focus, .field textarea:focus{ border-bottom-color:var(--accent); outline:none; }

/* linhas de itens -------------------------------------------- */
.items-head, .item-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 74px 130px 130px 40px;
  gap:14px; align-items:center;
}
.items-head{
  font-family:var(--mono); font-size:10px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted); padding:0 0 8px; border-bottom:1px solid var(--line);
}
.item-row{ padding:6px 0; border-bottom:1px solid var(--line); }
.item-row input{
  background:transparent; border:none; border-bottom:1px solid transparent;
  color:var(--ink); font-family:var(--body); font-size:14.5px; font-weight:300;
  padding:7px 0; width:100%; min-width:0; border-radius:0;
  transition:border-color .3s ease;
}
.item-row input:hover{ border-bottom-color:var(--line-2); }
.item-row input:focus{ border-bottom-color:var(--accent); outline:none; }
.item-row input.num, .items-head .h-num{ text-align:right; font-variant-numeric:tabular-nums; }
.item-sub{
  font-family:var(--mono); font-size:13px; text-align:right;
  font-variant-numeric:tabular-nums; color:var(--ink-2); white-space:nowrap;
}
.item-del{
  background:none; border:none; cursor:pointer; color:var(--dim);
  font-size:16px; line-height:1; padding:6px;
  transition:color .25s ease; justify-self:end;
}
.item-del:hover{ color:var(--danger); }

.items-foot{ display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-top:16px; flex-wrap:wrap; }

.totals{ margin-left:auto; min-width:min(300px,100%); }
.totals .trow{
  display:flex; justify-content:space-between; gap:26px;
  padding:7px 0; font-size:14.5px; color:var(--ink-2);
}
.totals .trow .tv{ font-family:var(--mono); font-variant-numeric:tabular-nums; }
.totals .grand{
  border-top:1px solid var(--ink); margin-top:6px; padding-top:12px;
  color:var(--ink);
}
.totals .grand .tv{
  font-family:var(--display); font-weight:900; font-size:24px; letter-spacing:-.02em;
}
.desc-inline{ display:flex; align-items:center; gap:10px; }
.desc-inline select, .desc-inline input{
  background:transparent; border:none; border-bottom:1px solid var(--line-2);
  font-family:var(--mono); font-size:13px; color:var(--ink); padding:4px 0;
  border-radius:0;
}
.desc-inline input{ width:90px; text-align:right; }
.desc-inline input:focus, .desc-inline select:focus{ border-bottom-color:var(--accent); outline:none; }

.docbar{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  margin-bottom:22px;
}
.docbar-g{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }

/* fluxo de status -------------------------------------------- */
.statusflow{ display:flex; gap:2px; flex-wrap:wrap; }
.statusflow .chip.st-aprovada.on{ color:var(--accent); border-color:var(--accent); }
.statusflow .chip.st-recusada.on{ color:var(--danger); border-color:var(--danger); }

/* ============================================================
   PROJETOS
   ============================================================ */

.proj-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(16px,2vw,24px); }
.proj{
  background:var(--surface); border:1px solid var(--line);
  padding:clamp(20px,2.6vw,30px);
  display:flex; flex-direction:column; gap:16px;
  min-width:0;
}
.proj-head{ display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.proj h3{
  font-family:var(--display); font-weight:700; font-size:19px;
  letter-spacing:-.022em; margin:0; line-height:1.2;
}
.proj-cli{
  font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); margin-top:5px; display:block;
}
.proj-pct{
  font-family:var(--display); font-weight:900; font-size:30px; letter-spacing:-.04em;
  color:var(--accent); line-height:1; font-variant-numeric:tabular-nums; flex:none;
}
.proj-pct small{ font-size:.5em; }
.prog{ height:3px; background:var(--line); position:relative; overflow:hidden; }
.prog i{
  position:absolute; inset:0 auto 0 0; background:var(--accent-bright);
  transition:width .8s var(--ease);
}
.mods{ display:flex; flex-wrap:wrap; gap:6px; }
.mod{
  font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-2); border:1px solid var(--line-2); padding:4px 9px;
}

.fases{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.fases li{
  display:flex; align-items:center; gap:12px;
  padding:9px 0; border-bottom:1px solid var(--line);
  font-size:14px; color:var(--ink-2);
}
.fase-st{
  flex:none; cursor:pointer; background:none;
  width:22px; height:22px; border:1px solid var(--line-2);
  display:grid; place-items:center;
  font-size:11px; line-height:1; color:transparent; padding:0;
  transition:border-color .25s ease, background .25s ease, color .25s ease;
}
.fase-st:hover{ border-color:var(--accent-dim); }
.fase-st[data-st="fazendo"]{ border-color:var(--accent); color:var(--accent); }
.fase-st[data-st="feito"]{ background:var(--accent-bright); border-color:var(--accent-bright); color:var(--ink); }
.fases .fase-nome{ flex:1; min-width:0; overflow-wrap:anywhere; }
.fases li.feito .fase-nome{ color:var(--dim); text-decoration:line-through; text-decoration-color:var(--line-2); }
.fase-tag{
  font-family:var(--mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--dim); flex:none;
}
.fases li .rowact{ opacity:0; transition:opacity .2s ease, color .25s ease; }
.fases li:hover .rowact{ opacity:1; }
.fase-add{ display:flex; gap:10px; align-items:center; }
.fase-add input{
  flex:1; background:transparent; border:none; border-bottom:1px solid var(--line-2);
  font-family:var(--body); font-size:14px; font-weight:300; color:var(--ink);
  padding:7px 0; border-radius:0; min-width:0;
}
.fase-add input:focus{ border-bottom-color:var(--accent); outline:none; }
.proj-foot{ display:flex; justify-content:flex-end; gap:4px; margin-top:auto; }

/* ============================================================
   TAREFAS — KANBAN
   ============================================================ */

.kanban{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(14px,2vw,22px); align-items:start; }
.kcol{ background:var(--surface-2); border:1px solid var(--line); min-height:280px; display:flex; flex-direction:column; }
.kcol-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  padding:14px 16px; border-bottom:1px solid var(--line);
  font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted);
}
.kcol-head b{ font-weight:400; color:var(--dim); font-variant-numeric:tabular-nums; }
.kcol-body{ padding:10px; display:flex; flex-direction:column; gap:8px; flex:1; }
.kcol.dragover{ outline:2px dashed var(--accent-dim); outline-offset:-6px; }

.kcard{
  background:var(--surface); border:1px solid var(--line);
  padding:13px 14px 11px;
  cursor:grab; user-select:none;
  transition:border-color .25s ease;
}
.kcard:hover{ border-color:var(--line-2); }
.kcard:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.kcard.dragging{ opacity:.4; }
.kcard-t{ font-size:14.5px; color:var(--ink); font-weight:400; overflow-wrap:anywhere; }
.kcard-meta{
  display:flex; justify-content:space-between; gap:10px; margin-top:8px;
  font-family:var(--mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted);
}
.kcard-meta .late{ color:var(--danger); }
.kcard-acts{ display:flex; justify-content:flex-end; gap:2px; margin-top:6px; opacity:0; transition:opacity .2s ease; }
.kcard:hover .kcard-acts, .kcard:focus-within .kcard-acts{ opacity:1; }
.kempty{
  font-family:var(--mono); font-size:11px; color:var(--dim); text-align:center;
  padding:26px 10px; letter-spacing:.06em;
}

/* ============================================================
   CONFIGURAÇÕES
   ============================================================ */

.cfg-grid{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:clamp(22px,3vw,40px); align-items:start; }
.cfg-card{
  background:var(--surface); border:1px solid var(--line);
  padding:clamp(22px,3vw,36px);
  display:flex; flex-direction:column; gap:20px;
}
.cfg-card h2{
  font-family:var(--display); font-weight:700; font-size:18px; letter-spacing:-.02em; margin:0;
}
.cfg-card .hint{ font-size:13.5px; color:var(--muted); margin:-10px 0 0; }
.cfg-form{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 20px; }
.cfg-form .full{ grid-column:1 / -1; }
.cfg-actions{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.danger-zone{ border-color:var(--danger-soft); }

/* ============================================================
   LOGIN (modo Firestore)
   ============================================================ */

.login{
  position:fixed; inset:0; z-index:80;
  background:var(--ground);
  display:grid; place-items:center;
  padding:var(--pad);
}
.login-box{
  width:min(380px,100%);
  background:var(--surface); border:1px solid var(--line);
  padding:clamp(28px,4vw,42px);
  display:flex; flex-direction:column; gap:20px;
  margin:0;
}
.login-brand{ margin-bottom:6px; }
.login-brand .wm-endorse{ margin-top:11px; }
.login-box .label{ margin:0; }
.login-err{ margin:0; font-size:13.5px; color:var(--danger); }
.login-box .btn{ justify-content:center; margin-top:4px; }

.rail-sair{
  font-family:var(--mono); font-size:10px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted);
  text-decoration:none; align-self:flex-start;
  transition:color .25s ease;
}
.rail-sair:hover{ color:var(--danger); }

/* ============================================================
   DIÁLOGOS
   ============================================================ */

.dlg{
  border:1px solid var(--line-2); padding:0; background:var(--surface); color:var(--ink);
  width:min(560px, calc(100vw - 40px));
  max-height:calc(100vh - 60px);
}
.dlg::backdrop{ background:rgba(24,33,27,.32); backdrop-filter:blur(2px); }
.dlg-inner{ padding:clamp(24px,4vw,36px); }
.dlg-title{
  font-family:var(--display); font-weight:900; font-size:22px; letter-spacing:-.03em;
  margin:0 0 22px;
}
.dlg-form{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px 18px; }
.dlg-form .full{ grid-column:1 / -1; }
.dlg-actions{
  grid-column:1 / -1;
  display:flex; justify-content:flex-end; gap:10px; margin-top:10px;
}
.dlg-confirm{ width:min(430px, calc(100vw - 40px)); }
.confirm-box{ padding:clamp(22px,4vw,32px); margin:0; }
.confirm-msg{ margin:0 0 22px; color:var(--ink-2); }

/* toast ------------------------------------------------------ */
.toast{
  position:fixed; left:50%; bottom:26px; transform:translate(-50%,16px);
  z-index:90; pointer-events:none;
  background:var(--ink); color:var(--ground);
  font-family:var(--mono); font-size:12px; letter-spacing:.05em;
  padding:11px 18px; opacity:0;
  transition:opacity .35s ease, transform .35s var(--ease);
}
.toast.show{ opacity:1; transform:translate(-50%,0); }

/* ============================================================
   IMPRESSÃO — proposta A4
   ============================================================ */

.print-root{ background:#5c645c; min-height:100vh; padding:34px 16px; }
.print-bar{
  max-width:820px; margin:0 auto 18px;
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.print-bar .btn{ background:var(--ground); border-color:var(--ground); }
.print-bar .btn:hover{ background:var(--accent-bright); border-color:var(--accent-bright); color:var(--ink); }

.sheet{
  background:#fff; color:var(--ink);
  width:min(820px, 100%); margin:0 auto;
  padding:56px 60px;
  font-size:13.5px; line-height:1.55;
}
.sheet-head{
  display:flex; justify-content:space-between; align-items:flex-start; gap:24px;
  padding-bottom:26px; border-bottom:2px solid var(--ink);
}
.sheet-brand{ display:flex; flex-direction:column; gap:9px; }
.sheet-brand .wm-row{ gap:10px; }
.sheet-brand .wm-bulb{ width:44px; height:44px; }
.sheet-brand .wm-bulb img{ width:30px; }
.sheet-brand .wm-main{ font-size:23px; }
.sheet-doc{ text-align:right; }
.sheet-doc .sd-t{
  font-family:var(--display); font-weight:900; font-size:26px; letter-spacing:-.03em; line-height:1;
}
.sheet-doc .sd-n{
  font-family:var(--mono); font-size:12px; letter-spacing:.14em; color:var(--accent);
  margin-top:7px; display:block;
}
.sheet-doc .sd-d{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; color:var(--muted);
  margin-top:5px; display:block;
}

.sheet-parties{
  display:grid; grid-template-columns:1fr 1fr; gap:34px;
  padding:26px 0; border-bottom:1px solid var(--line);
}
.party .p-k{
  font-family:var(--mono); font-size:9.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted); margin-bottom:8px; display:flex; align-items:center; gap:8px;
}
.party .p-k::after{ content:''; height:1px; flex:1; background:var(--line); }
.party .p-name{ font-family:var(--display); font-weight:700; font-size:15.5px; letter-spacing:-.015em; }
.party p{ margin:2px 0 0; color:var(--ink-2); font-size:12.5px; }

.sheet-title{ padding:26px 0 4px; }
.sheet-title h2{
  font-family:var(--display); font-weight:900; font-size:21px; letter-spacing:-.028em; margin:0;
}

.sheet-items{ width:100%; border-collapse:collapse; margin-top:18px; }
.sheet-items th{
  text-align:left; font-family:var(--mono); font-size:9.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted); font-weight:400;
  padding:9px 10px 9px 0; border-bottom:1px solid var(--ink);
}
.sheet-items th.r, .sheet-items td.r{ text-align:right; padding-right:0; padding-left:10px; }
.sheet-items td{
  padding:11px 10px 11px 0; border-bottom:1px solid var(--line);
  font-size:13px; color:var(--ink-2); vertical-align:top;
}
.sheet-items td:first-child{ color:var(--ink); }
.sheet-items td.r{ font-family:var(--mono); font-size:12.5px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.sheet-items .i-n{ font-family:var(--mono); font-size:11px; color:var(--dim); width:34px; }

.sheet-totals{ display:flex; justify-content:flex-end; margin-top:16px; }
.sheet-totals .box{ min-width:270px; }
.sheet-totals .trow{
  display:flex; justify-content:space-between; gap:30px; padding:5px 0;
  font-size:12.5px; color:var(--ink-2);
}
.sheet-totals .trow .tv{ font-family:var(--mono); font-variant-numeric:tabular-nums; }
.sheet-totals .grand{
  border-top:2px solid var(--ink); margin-top:7px; padding-top:11px; color:var(--ink);
  align-items:baseline;
}
.sheet-totals .grand .tk{
  font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase;
}
.sheet-totals .grand .tv{
  font-family:var(--display); font-weight:900; font-size:23px; letter-spacing:-.02em;
}

.sheet-terms{
  margin-top:30px; padding-top:20px; border-top:1px solid var(--line);
  display:grid; grid-template-columns:1fr 1fr; gap:24px;
}
.sheet-terms .p-k{
  font-family:var(--mono); font-size:9.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted); margin-bottom:6px;
}
.sheet-terms p{ margin:0; font-size:12.5px; color:var(--ink-2); }

.sheet-sign{
  margin-top:58px;
  display:grid; grid-template-columns:1fr 1fr; gap:44px;
}
.sign-slot{ text-align:center; }
.sign-slot .line{ border-top:1px solid var(--ink); padding-top:9px; }
.sign-slot .s-n{ font-size:12.5px; color:var(--ink); }
.sign-slot .s-k{
  font-family:var(--mono); font-size:9.5px; letter-spacing:.15em; text-transform:uppercase;
  color:var(--muted); margin-top:3px; display:block;
}

.sheet-foot{
  margin-top:44px; padding-top:16px; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
  font-family:var(--mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted);
}
.sheet-foot b{ color:var(--accent); font-weight:500; }

@media print{
  @page{ size:A4; margin:14mm 13mm; }
  body{ background:#fff; overflow:visible; }
  body::after{ display:none; }
  .rail, .column, .toast, .print-bar, .dlg{ display:none !important; }
  .print-root{ background:#fff; padding:0; min-height:0; }
  .sheet{ width:100%; padding:0; box-shadow:none; font-size:12.5px; }
  .sheet-items tr, .sign-slot{ break-inside:avoid; }
  .badge.aprovada{ -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}

/* modo impressão na tela: esconde o app, mostra o documento */
body.printing .rail, body.printing .column{ display:none; }

/* ============================================================
   RESPONSIVO
   ============================================================ */

@media (max-width:1080px){
  :root{ --rail:0px; }

  .rail{
    position:sticky; top:0; left:auto; right:auto; bottom:auto;
    width:100%; height:auto; flex-direction:row; align-items:center;
    justify-content:space-between; flex-wrap:wrap; gap:4px 16px;
    border-right:none; border-bottom:1px solid var(--line);
    padding:12px var(--pad) 0;
    background:rgba(247,249,245,.92);
    backdrop-filter:blur(14px);
  }
  .rail-index{
    order:3; width:100%;
    flex-direction:row; gap:20px;
    overflow-x:auto; -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    margin-top:8px; padding:9px 0 11px;
    border-top:1px solid var(--line);
  }
  .rail-index::-webkit-scrollbar{ display:none; }
  .rail-index a{ white-space:nowrap; padding:2px 0; }
  .rail-marker{ display:none; }
  .rail-bottom{ flex-direction:row; align-items:center; gap:14px; }
  .status{ display:none; }
  .rail-ver{ display:none; }
  .wm-endorse{ margin-top:5px; }

  .column{ margin-left:0; }

  .tiles{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pipeline{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dash-cols{ grid-template-columns:1fr; }
  .proj-grid{ grid-template-columns:1fr; }
  .cfg-grid{ grid-template-columns:1fr; }
  .kanban{ grid-template-columns:1fr; }
  .kcol{ min-height:0; }

  .doc-grid .f-6, .doc-grid .f-4, .doc-grid .f-3{ grid-column:span 6; }
}

@media (max-width:640px){
  body{ font-size:15px; }

  .tiles{ grid-template-columns:1fr; }
  .pipeline{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dlg-form, .cfg-form{ grid-template-columns:1fr; }
  .doc-grid .f-6, .doc-grid .f-4, .doc-grid .f-3{ grid-column:span 12; }

  /* tabelas viram cartões empilhados */
  .tbl thead{ display:none; }
  .tbl, .tbl tbody, .tbl tr, .tbl td{ display:block; width:100%; }
  .tbl tr{ border:1px solid var(--line); background:var(--surface); margin-bottom:12px; padding:14px 16px; }
  .tbl td{ border:none; padding:3px 0; }
  .tbl .t-act{ text-align:left; padding-top:9px; }

  /* itens do orçamento em pilha */
  .items-head{ display:none; }
  .item-row{
    grid-template-columns:1fr 1fr;
    gap:8px 14px; padding:12px 0;
  }
  .item-row input.desc{ grid-column:1 / -1; }
  .item-sub{ text-align:left; align-self:center; }
  .item-del{ justify-self:end; }

  .sheet{ padding:34px 22px; }
  .sheet-parties, .sheet-terms, .sheet-sign{ grid-template-columns:1fr; gap:22px; }
  .sheet-doc{ text-align:left; }
  .sheet-head{ flex-direction:column; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none !important; transition:none !important; }
}

/* ─────────── Sistemas (mapa de projetos, ao vivo do GitHub) ─────────── */
.sys-sync{ font-family:var(--mono); font-size:11.5px; color:var(--muted); align-self:center; margin-right:4px; }

.sys-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(16px,2vw,24px); }

.sys{
  display:flex; flex-direction:column; gap:12px;
  background:var(--surface); border:1px solid var(--line);
  border-radius:14px; padding:20px 20px 16px;
  transition:border-color .25s var(--ease), transform .25s var(--ease);
}
.sys:hover{ border-color:var(--line-2); transform:translateY(-2px); }

.sys-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.sys-title{ display:flex; align-items:center; gap:9px; min-width:0; }
.sys-title h3{ margin:0; font-family:var(--display); font-size:17px; font-weight:700; color:var(--ink); line-height:1.15; word-break:break-word; }
.sys-dot{ width:9px; height:9px; border-radius:50%; flex:0 0 auto; margin-top:2px; }
.sys-dot.is-priv{ background:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent); }
.sys-dot.is-pub{ background:var(--dim); box-shadow:0 0 0 3px color-mix(in srgb, var(--dim) 22%, transparent); }
.sys-lang{ font-family:var(--mono); font-size:11px; color:var(--ink-2); background:var(--surface-2); border:1px solid var(--line); border-radius:999px; padding:3px 9px; white-space:nowrap; flex:0 0 auto; }

.sys-desc{ margin:0; font-size:13.5px; line-height:1.5; color:var(--ink-2); }
.sys-nodesc{ color:var(--muted); font-style:italic; }

.sys-commit{
  display:flex; flex-direction:column; gap:3px;
  background:var(--surface-2); border:1px solid var(--line);
  border-radius:9px; padding:9px 11px;
}
.sys-commit-empty{ background:transparent; border-style:dashed; }
.sys-commit-msg{ font-size:12.5px; color:var(--ink); line-height:1.4; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.sys-commit-meta{ font-family:var(--mono); font-size:11px; color:var(--muted); }
.sys-commit-meta b{ color:var(--accent); font-weight:500; }

.sys-tags{ display:flex; flex-wrap:wrap; gap:6px; }
.sys-tag{ font-family:var(--mono); font-size:10.5px; letter-spacing:.03em; color:var(--ink-2); background:var(--ground); border:1px solid var(--line); border-radius:6px; padding:2px 7px; }

.sys-foot{ display:flex; gap:14px; margin-top:auto; padding-top:4px; }
.sys-foot .rowact{ font-family:var(--mono); font-size:12px; color:var(--accent); text-decoration:none; }
.sys-foot .rowact:hover{ text-decoration:underline; }

.sys-state{ text-align:center; padding:56px 20px; border:1px dashed var(--line-2); border-radius:14px; background:var(--surface); }
.sys-state-t{ margin:0 0 8px; font-family:var(--display); font-weight:700; font-size:17px; color:var(--ink); }
.sys-state-m{ margin:0 auto 18px; max-width:52ch; font-size:13.5px; line-height:1.55; color:var(--muted); }

@media (max-width:860px){ .sys-grid{ grid-template-columns:1fr; } }