:root { --bg:#EAF1F3; --bg2:#DCE8EB; --card:#fff; --ink:#0A2430; --mut:#456270; --line:#C3D4DA; --petrol:#0E4A5A; --petrol-tx:#fff;
  --mark:#FFD84D; --star:#D99A00; --danger:#B42318; --display:"Bricolage Grotesque","Trebuchet MS",system-ui,sans-serif; --body:"IBM Plex Sans",system-ui,sans-serif }
@media (prefers-color-scheme: dark) { :root { --bg:#09181F; --bg2:#0E222B; --card:#12303B; --ink:#E6EFF2; --mut:#93AAB5; --line:#1F3944;
  --petrol:#2BA3BD; --petrol-tx:#04202A; --danger:#F97066 } }
* { box-sizing:border-box }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--body); line-height:1.55; -webkit-font-smoothing:antialiased }
h1, h2, h3 { font-family:var(--display); letter-spacing:-.02em; margin:0 }
h1 { font-size:clamp(26px,4vw,34px); font-weight:800; line-height:1.1 } h2 { font-size:20px; font-weight:700 } h3 { font-size:16px }
a { color:inherit } :focus-visible { outline:3px solid var(--mark); outline-offset:2px; border-radius:6px }
.hide { display:none !important } .mut { color:var(--mut); font-size:14px }

.top { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 24px; background:var(--card); border-bottom:1px solid var(--line); flex-wrap:wrap }
.brand { display:flex; align-items:center; gap:9px; font-family:var(--display); font-weight:800; font-size:19px; text-decoration:none }
.who { display:flex; align-items:center; gap:14px; font-size:14px; color:var(--mut); flex-wrap:wrap } .who a { text-decoration:none } .who a:hover { color:var(--ink) }
.page { max-width:1080px; margin:24px auto; padding:0 20px; display:grid; gap:20px }
.card { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px }
.card > h2 { margin-bottom:14px }
.row { display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end }
.field { display:grid; gap:4px; font-size:13px; color:var(--mut); font-weight:500 } .field.grow { flex:1; min-width:160px }

input, select, textarea { font:inherit; font-size:15px; padding:9px 12px; border-radius:10px; border:1.5px solid var(--line); background:var(--card); color:var(--ink); min-width:0 }
input:focus, select:focus { border-color:var(--petrol); outline:none }
button, .btn { font:inherit; font-weight:600; font-size:15px; cursor:pointer; padding:10px 18px; border-radius:10px; border:2px solid var(--petrol); background:var(--petrol); color:var(--petrol-tx); text-decoration:none; display:inline-block }
button.ghost, .btn.ghost { background:transparent; color:var(--ink); border-color:var(--line) } button.ghost:hover { border-color:var(--ink) }
button.mark { background:var(--mark); border-color:var(--mark); color:#0A2430 }
button.danger { background:transparent; color:var(--danger); border-color:transparent } button.danger:hover { border-color:var(--danger) }
button.sm { padding:5px 10px; font-size:13px; border-radius:8px }
button:disabled { opacity:.55; cursor:default }

table { width:100%; border-collapse:collapse; font-size:14px } th { text-align:left; font-weight:600; color:var(--mut); font-size:13px }
th, td { padding:10px 8px; border-bottom:1px solid var(--line); vertical-align:middle } td.act { white-space:nowrap; text-align:right }
.scroll { overflow-x:auto } td input, td select { width:100%; padding:6px 8px; font-size:14px }
.empty { padding:22px; text-align:center; color:var(--mut) }

.kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px }
.kpi { border:1px solid var(--line); border-radius:12px; padding:12px 14px } .kpi b { display:block; font-family:var(--display); font-size:24px; line-height:1.2 } .kpi span { font-size:13px; color:var(--mut) }

.notice { background:var(--mark); color:#0A2430; border-radius:12px; padding:12px 16px; margin:12px 0; font-size:14.5px }
.notice code { background:rgba(10,36,48,.12); padding:2px 8px; border-radius:6px; font-size:16px; font-weight:600; user-select:all }
.notice button { margin-left:8px; background:#0A2430; border-color:#0A2430; color:#fff }
.error { color:var(--danger); font-size:14px; min-height:20px }

@media (min-width:700px) { .tabs.quebra { flex-wrap:wrap; overflow-x:visible; row-gap:0 } .tabs.quebra .tab { padding:9px 10px } }
.tabs { display:flex; gap:2px; border-bottom:1px solid var(--line); overflow-x:auto; scrollbar-width:thin; -webkit-overflow-scrolling:touch; margin-bottom:4px }
.tab { background:none; border:0; border-bottom:3px solid transparent; border-radius:0; padding:12px 11px; color:var(--mut); white-space:nowrap; flex:0 0 auto; font-size:14.5px; font-weight:600 } .tab:hover { color:var(--ink); background:rgba(0,0,0,.03) } .tab[aria-selected=true] { color:var(--ink); border-color:var(--mark) }

dialog { border:1px solid var(--line); border-radius:16px; background:var(--card); color:var(--ink); padding:22px; width:min(680px, calc(100% - 28px)) }
dialog::backdrop { background:rgba(5,20,28,.55) }
.dhead { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px }

.log { height:380px; overflow-y:auto; display:flex; flex-direction:column; margin-bottom:12px }
.m { padding:11px 14px; border-radius:16px; margin:7px 0; max-width:88%; line-height:1.55 }
.m.u { white-space:pre-wrap }
.m p { margin:0 0 .6em } .m p:last-of-type { margin-bottom:0 }
.m ul { margin:.3em 0 .6em; padding-left:1.25em } .m li { margin:.2em 0 }
.m.u { align-self:flex-end; background:var(--petrol); color:var(--petrol-tx); border-bottom-right-radius:4px }
.m.a { align-self:flex-start; background:var(--bg); border:1px solid var(--line); border-bottom-left-radius:4px }
.m sup { font-weight:600; background:var(--mark); color:#0A2430; padding:0 4px; border-radius:4px }
.m details { margin-top:10px; font-size:13.5px; color:var(--mut); border-top:1px solid var(--line); padding-top:8px; white-space:normal }
.m summary { cursor:pointer; font-weight:600; color:var(--ink) } .m details div { margin-top:8px } .m details q { display:block; font-style:italic; quotes:none }
.tag { font-size:12px; color:var(--mut); margin-top:6px }

/* ícones por tipo de documento */
.ic { flex:none; vertical-align:-4px; margin-right:6px }
.ic-convencao { color:var(--petrol) } .ic-regimento { color:#6B5BD2 } .ic-ata { color:#0E7C86 } .ic-comunicado { color:#C2410C }
.ic-manual { color:#8A6D00 } .ic-laudo { color:#4D7C0F } .ic-contrato { color:#B7791F } .ic-financeiro { color:#15803D }
.ic-nf { color:#0284C7 } .ic-juridico { color:#9F1239 } .ic-seguro { color:#4F46E5 } .ic-rh { color:#A21CAF } .ic-outro { color:var(--mut) }
@media (prefers-color-scheme: dark) { .ic:not(.ic-convencao):not(.ic-outro) { filter:brightness(1.5) } }
.titcel { display:flex; align-items:center; gap:8px } .titcel .ic { margin:0 }

/* filtros de documentos */
.chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px }
.chip { display:inline-flex; align-items:center; gap:2px; padding:6px 13px; border-radius:999px; background:transparent; color:var(--ink); border:1.5px solid var(--line); font-weight:500; font-size:14px }
.chip .ic { margin-right:6px } .chip span { color:var(--mut); font-size:12.5px; margin-left:6px }
.chip[aria-pressed=true] { background:var(--ink); color:var(--card); border-color:var(--ink) } .chip[aria-pressed=true] span { color:inherit; opacity:.7 }
.achado { font-size:12.5px; color:var(--mut); margin-top:4px } .achado mark { background:var(--mark); color:#0A2430; padding:0 2px; border-radius:3px }

/* avaliação das respostas */
.fb { display:flex; align-items:center; gap:8px; margin-top:10px; font-size:13px; color:var(--mut) }
.sel-condo{width:auto;max-width:220px;padding:6px 10px;font-size:14px;margin:0 6px 0 0}

/* painéis, calendário, WhatsApp */
.pn-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:14px; margin-top:14px }
.pn-grid .card { margin:0 } .pn-grid h3 { margin:0 0 10px; font-size:15px }
.seg { display:inline-flex; border:1px solid var(--line); border-radius:10px; overflow:hidden } .seg button { border:0; border-radius:0; background:transparent; color:var(--ink); padding:7px 14px } .seg button[aria-pressed=true] { background:var(--ink); color:#fff }
.pill { display:inline-block; font-size:12.5px; font-weight:600; padding:2px 9px; border-radius:99px; background:#e8eef2; color:#234 } .pill.alto { background:#fde3e0; color:#8a1c12 } .pill.medio { background:#fff0d1; color:#7a4a00 } .pill.baixa, .pill.info { background:#e3f1e6; color:#1d5a2c }
.al { display:flex; gap:8px; align-items:center; padding:6px 0; border-bottom:1px solid var(--line) } .al:last-child { border:0 }
.hb { display:grid; grid-template-columns:110px 1fr 38px; gap:8px; align-items:center; font-size:13.5px; margin:5px 0 } .hb i { display:block; height:10px; border-radius:5px; background:var(--mark) } .hb div { background:var(--bg); border-radius:5px }
.clima { display:flex; height:16px; border-radius:8px; overflow:hidden; margin:8px 0 } .clima i { display:block } .clima .p { background:#3a9d5d } .clima .n { background:#c9cfd3 } .clima .g { background:#d9534f }
.li { padding:8px 0; border-bottom:1px solid var(--line); display:flex; gap:10px; align-items:flex-start; justify-content:space-between } .li:last-child { border:0 } .li small { color:var(--mut); display:block }
.li.feito b { text-decoration:line-through; color:var(--mut) }
.spark { width:100%; height:64px } .spark polyline { fill:none; stroke:var(--ink); stroke-width:2 } .spark path { fill:rgba(255,216,77,.5); stroke:none }
.cp { width:100%; font-family:monospace; font-size:13px }

@media print { body.imp-gestao header, body.imp-gestao nav, body.imp-gestao .tabs, body.imp-gestao #pn-modo, body.imp-gestao #pn-atualizar,
  body.imp-gestao .kpis, body.imp-gestao .pn-grid, body.imp-gestao #gs-dias, body.imp-gestao #gs-copiar, body.imp-gestao #gs-imprimir { display: none !important; }
  body.imp-gestao #gs-card { border: 0; box-shadow: none; } }

/* interface do síndico: abas sem quebra de linha, sem indicadores repetidos e sem rolagem lateral da página */
#kpis { display:none }
main.page, main.page > * { min-width:0 }
main.page h1 { overflow-wrap:anywhere }
.seg { max-width:100%; flex-wrap:wrap } .seg button { white-space:nowrap }
@media (max-width:700px) {
  .card { padding:14px }
  .tab { padding:11px 11px; font-size:14.5px }
  .seg { display:flex } .seg button { flex:1 1 auto }
  .top { flex-wrap:wrap; gap:8px }
}
.page:has(#kpis) { max-width:1200px }

/* acessos do assistente */
.perm-off { display:none !important }
.ro button:not([data-ro-ok]), .ro form { display:none !important }

/* estrelas de avaliação (1 a 4) */
.estrelas { display:flex; align-items:center; gap:2px; flex-wrap:wrap } .estrelas button { background:none; border:0; padding:0 3px; font-size:34px; line-height:1; color:var(--line); cursor:pointer; min-width:44px; min-height:44px }
.estrelas button.on { color:var(--star) } .estrelas button:focus-visible { outline:2px solid var(--petrol); border-radius:6px } .estrelas .est-rot { margin-left:10px; font-size:14px }
.av-box { border:1px solid var(--line); border-radius:12px; padding:14px; margin:14px 0 }
.stars { color:var(--star); letter-spacing:1px; white-space:nowrap } .stars s { text-decoration:none; color:var(--line) }
.dist { display:grid; grid-template-columns:22px 1fr 34px; gap:2px 8px; align-items:center; font-size:12.5px; color:var(--mut); margin-top:6px }
.meter { background:var(--bg); border-radius:6px; height:12px; overflow:hidden } .meter i { display:block; height:100%; background:var(--petrol) }

/* painel: seletor de condomínios e quadros que levam à aba de origem */
.combo { position:relative; max-width:460px } .combo-btn { width:100%; display:flex; justify-content:space-between; align-items:center; gap:10px; text-align:left; min-width:240px }
.combo-box { position:absolute; z-index:20; left:0; right:0; top:calc(100% + 6px); min-width:260px; background:var(--card,#fff); border:1.5px solid var(--line); border-radius:12px; padding:12px; box-shadow:0 12px 32px rgba(0,0,0,.14) }
.combo-lista { max-height:280px; overflow:auto; border-top:1px solid var(--line) } .combo-lista label { display:flex; align-items:center; gap:10px; padding:8px 4px; cursor:pointer; border-bottom:1px solid var(--line); font-size:14.5px } .combo-lista label:hover { background:var(--bg) }
.kp-link { cursor:pointer; position:relative } .kp-link:hover, .kp-link:focus-visible { border-color:var(--ink); box-shadow:0 2px 10px rgba(0,0,0,.08) }
.kp-link em { display:block; font-style:normal; font-size:12px; color:var(--mut); margin-top:4px } .kp-link:hover em { color:var(--ink); text-decoration:underline }
button.ver { background:none; border:0; padding:0; margin:0; font:inherit; font-size:13.5px; color:inherit; text-decoration:underline; cursor:pointer; width:auto; min-height:0 } button.ver:hover { color:var(--ink) }
details.pesq > summary { list-style:none } details.pesq > summary::-webkit-details-marker { display:none }
details.pesq > summary::before { content:"▸ Expandir"; font-size:12.5px; color:var(--mut); order:-1; flex-basis:100%; margin-bottom:2px } details.pesq[open] > summary::before { content:"▾ Recolher" }