/* fontes servidas pelo próprio site (GRATUM_DESIGN, 27/10) */
@font-face{font-family:'Gabarito';font-style:normal;font-weight:600 800;font-display:swap;src:url(/estatico/fontes/gabarito.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400 700;font-display:swap;src:url(/estatico/fontes/hanken.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url(/estatico/fontes/jetbrains.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Área logada do Instituto Gratum: cores e letras do manual de marca v1, com densidade de ferramenta de trabalho. */
:root{
  --papel:#FBFAF7; --sup:#FFFFFF; --tinta:#1E1B18; --suave:#6E6A64; --linha:#E4DFD5; --azul:#3B5BA9; --azul-claro:#E4E9F4;
  --ok:#4E7D5B; --atencao:#A8641A; --ruim:#8E3B2E; --ouro:#E3B23C;
  --f-titulo:'Gabarito','Segoe UI',sans-serif; --f-texto:'Hanken Grotesk','Segoe UI',sans-serif; --f-num:'JetBrains Mono',ui-monospace,Consolas,monospace;
  color-scheme:light;
}
/* tela clara só: ferramenta de trabalho de escritório */
*{box-sizing:border-box}
body{margin:0;background:var(--papel);color:var(--tinta);font:15px/1.5 var(--f-texto)}
h1,h2,h3{font-family:var(--f-titulo);font-weight:700;letter-spacing:-.01em;line-height:1.15;margin:0;text-wrap:balance}
h1{font-size:1.6rem}h2{font-size:1.15rem}h3{font-size:1rem}
a{color:var(--azul)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--azul);outline-offset:2px}
[hidden]{display:none!important}

/* topo */
.topo{position:sticky;top:0;z-index:10;background:var(--sup);border-bottom:1px solid var(--linha);display:flex;align-items:center;gap:16px;padding:10px max(16px,calc((100vw - 1240px)/2));flex-wrap:wrap}
.topo img{height:40px;width:auto}
.topo .titulo{font:700 14px var(--f-titulo);color:var(--suave);border-left:1px solid var(--linha);padding-left:14px}
.abas{display:flex;gap:4px;flex-wrap:wrap;flex:1;align-items:center}
.abas button{background:none;border:0;padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:600;color:var(--suave)}
.abas button[aria-current="page"]{background:var(--azul-claro);color:var(--azul)}
.abas select{width:auto;max-width:240px;border:1px solid var(--linha);border-radius:8px;padding:7px 10px;background:var(--sup);font-weight:600;color:var(--suave)}
.campo .chip{justify-self:start}
.quem{display:flex;gap:10px;align-items:center;font-size:.88rem;color:var(--suave)}
.selo-perfil{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--azul);background:var(--azul-claro);padding:2px 8px;border-radius:999px}

main{max-width:1240px;margin:0 auto;padding:22px 16px 60px;display:grid;gap:20px}
.cab p{color:var(--suave);margin:6px 0 0;max-width:80ch}
.olho{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:var(--azul);font-weight:700}
.grade{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:20px;align-items:start}
@media (max-width:980px){.grade{grid-template-columns:minmax(0,1fr)}}
.col{display:grid;gap:16px;min-width:0}
.painel{background:var(--sup);border:1px solid var(--linha);border-radius:14px;padding:18px;display:grid;gap:12px;min-width:0}
.fixo{position:sticky;top:74px}
@media (max-width:980px){.fixo{position:static}}
.dica{font-size:.82rem;color:var(--suave);margin:0}
.campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px 16px}
.campo{display:grid;gap:4px;font-size:.88rem;font-weight:600}
input[type=number],input[type=text],input[type=email],input[type=password],select,textarea{width:100%;padding:8px 10px;border:1px solid var(--linha);border-radius:8px;background:var(--papel);font-weight:400}
input[type=number]{font-family:var(--f-num)}
.rolagem{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:.88rem}
th,td{padding:7px 8px;border-bottom:1px solid var(--linha);text-align:right;vertical-align:middle}
th:first-child,td:first-child{text-align:left}
thead th{font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--suave);font-weight:700}
td.n,dd{font-family:var(--f-num);font-variant-numeric:tabular-nums}
td input[type=number]{width:100px}
td.q input{width:70px}
tr.desligado td{color:var(--suave)} tr.desligado td:first-child label{text-decoration:line-through}
.fonte{font-size:.74rem;color:var(--suave);font-weight:400}
.chip{display:inline-block;font-size:.72rem;font-weight:700;padding:1px 8px;border-radius:999px;border:1px solid var(--atencao);color:var(--atencao);white-space:nowrap}
.grande{font:600 1.8rem/1.1 var(--f-num);font-variant-numeric:tabular-nums}
dl.kv{display:grid;grid-template-columns:1fr auto;gap:5px 12px;font-size:.88rem;margin:0}
.kv dt{color:var(--suave)}.kv dd{margin:0;text-align:right}
.kv .t{font-weight:700;color:var(--tinta);border-top:1px solid var(--linha);padding-top:6px}
.pilula{display:inline-block;font-size:.78rem;font-weight:700;padding:2px 9px;border-radius:999px;border:1px solid}
.pilula.bom{color:var(--ok)}.pilula.atencao{color:var(--atencao)}.pilula.ruim{color:var(--ruim)}
.btn{font-weight:700;padding:8px 14px;border-radius:8px;border:1px solid var(--azul);background:var(--azul);color:#fff;cursor:pointer}
.btn.leve{background:transparent;color:var(--tinta);border-color:var(--linha);font-weight:600}
.btn.perigo{background:transparent;color:var(--ruim);border-color:var(--linha)}
.btn.mini{padding:4px 9px;font-size:.82rem}
.btn:disabled{opacity:.5;cursor:default}
.linha{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.chave{display:flex;gap:8px;align-items:center;font-size:.9rem;font-weight:600}
.aviso{border-left:3px solid var(--atencao);padding:4px 0 4px 12px;color:var(--suave);font-size:.86rem;margin:0}
.vazio{color:var(--suave);font-size:.9rem;margin:0}
.cenario-mesa{color:var(--azul);font-weight:700}
.cmp td,.cmp th{white-space:nowrap}
.cmp td.destaque{font-weight:700;color:var(--azul)}
.lista-cen{display:grid;gap:8px}
.cen{display:flex;gap:10px;align-items:center;flex-wrap:wrap;border:1px solid var(--linha);border-radius:10px;padding:10px 12px;background:var(--papel)}
.cen.aberto{border-color:var(--azul);box-shadow:inset 0 0 0 1px var(--azul)}
.cen b{flex:1;min-width:160px}
.cen small{color:var(--suave)}
.marca-check{display:flex;gap:6px;align-items:center;font-size:.84rem}
.mensagem{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--tinta);color:var(--papel);padding:10px 16px;border-radius:10px;font-weight:600;z-index:50;max-width:90vw}
.mensagem.erro{background:var(--ruim);color:#fff}
dialog{border:1px solid var(--linha);border-radius:14px;padding:20px;max-width:520px;width:calc(100% - 32px);background:var(--sup);color:var(--tinta)}
dialog::backdrop{background:rgba(20,16,28,.45)}
dialog form{display:grid;gap:12px}
.link-caixa{display:flex;gap:8px}.link-caixa input{font-family:var(--f-num);font-size:.8rem}
.cidades-check{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:4px 12px;font-weight:400}

/* entrar e criar senha */
.entrada{min-height:100vh;display:grid;place-items:center;padding:24px 16px}
.entrada .painel{width:100%;max-width:400px;gap:16px;padding:28px}
.entrada img{height:52px;width:auto}
.entrada form{display:grid;gap:12px}
.entrada input,.entrada .btn{min-height:44px} /* alvo de 44 px na entrada (GRATUM_DESIGN, 27/10) */
.erro-txt{color:var(--ruim);font-size:.88rem;margin:0;min-height:1.2em}

/* situação da proposta e planos (orçamento da cidade) */
.sit{font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:999px;white-space:nowrap}
.sit-ras{background:#ECE7DC;color:var(--suave)}.sit-env{background:#FBEFD2;color:#8A6110}.sit-ok{background:#DCE8DE;color:#2F5A3A}.sit-nao{background:#F6DDD3;color:#8E3B2E}
.nova-cid{color:var(--azul) !important;border:1px dashed var(--azul) !important}
.planos{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.plano{border:1px solid var(--linha);border-radius:12px;padding:16px;display:grid;gap:10px;background:var(--papel);border-top:5px solid var(--azul)}
.plano-cab{display:flex;justify-content:space-between;align-items:center;gap:10px}
.plano-cab b{font:700 1.1rem var(--f-titulo)}

/* financeiro */
.sub-abas{display:flex;flex-wrap:wrap;gap:6px}
.sub-abas .btn[aria-current="page"]{background:var(--azul-claro);color:var(--azul);border-color:var(--azul)}
.cartoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.cartao{gap:6px;border-top:4px solid var(--azul)}
.cartao .grande{font-size:1.45rem}
table.tit td{vertical-align:top}
td.acoes{white-space:nowrap;text-align:right}
td.acoes .btn+.btn{margin-left:6px}
#fin{display:grid;gap:16px;margin-top:14px}
@media (max-width:700px){
  table.tit thead{display:none}
  table.tit,table.tit tbody{display:block}
  table.tit tr{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;padding:12px 0;border-bottom:1px solid var(--linha)}
  table.tit td{display:block;border:0;padding:0;text-align:left!important}
  table.tit td:nth-child(2){grid-column:1/-1;order:-1}
  table.tit td[data-r]::before{content:attr(data-r);display:block;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--suave)}
  table.tit td.acoes{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px;white-space:normal}
  table.tit td.acoes .btn+.btn{margin-left:0}
}
