:root {
  --bg-0:#080b14; --bg-1:#0f1424; --bg-2:#161c30;
  --gold:#C9A227; --gold-bright:#e2b734; --gold-bg:rgba(201,162,39,0.12);
  --text-0:#f5f5f7; --text-1:#d2d6df; --text-2:#8b93a4; --text-3:#5d6478;
  --border:rgba(255,255,255,0.08);
  --info:#3b82f6; --success:#10b981; --warn:#f5b301; --danger:#ef4444;
  --logo-src:url('img/logo-wb.png');
}
:root[data-theme="light"] {
  --bg-0:#fafafa; --bg-1:#ffffff; --bg-2:#f2f2f5;
  --gold:#A88516; --gold-bright:#C9A227; --gold-bg:rgba(168,133,22,0.10);
  --text-0:#111418; --text-1:#2d333d; --text-2:#5d6478; --text-3:#9aa1ad;
  --border:rgba(0,0,0,0.08);
  --info:#2563eb; --success:#059669; --warn:#d39e00; --danger:#dc2626;
  --logo-src:url('img/logo-bw.png');
}
* { box-sizing:border-box; margin:0; padding:0; }
html { transition:background-color .2s ease; }
body { font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif; background:var(--bg-0);
  color:var(--text-0); font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.mono { font-family:'JetBrains Mono',monospace; }

/* Header */
header { position:sticky; top:0; z-index:20; background:color-mix(in srgb,var(--bg-0) 88%,transparent);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--border); }
.bar { display:flex; align-items:center; gap:14px; padding:12px 18px; max-width:1280px; margin:0 auto; }
.logo { width:30px; height:30px; background:var(--logo-src) center/contain no-repeat; }
.brand { font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:18px; color:var(--gold-bright); }
.brand small { font-family:'Inter'; color:var(--text-2); font-weight:500; font-size:12px; display:block; letter-spacing:.5px; }
nav { display:flex; gap:6px; margin-left:auto; }
nav a { padding:7px 13px; border-radius:8px; color:var(--text-2); font-weight:600; font-size:14px; }
nav a.on, nav a:hover { color:var(--gold-bright); background:var(--gold-bg); }
.theme-toggle { background:none; border:1px solid var(--border); color:var(--text-2); width:34px; height:34px;
  border-radius:8px; cursor:pointer; font-size:15px; }
.theme-toggle:hover { color:var(--gold); border-color:var(--gold); }

main { max-width:1280px; margin:0 auto; padding:20px 18px 60px; }
h1 { font-family:'Playfair Display',serif; font-size:24px; font-weight:700; margin-bottom:4px; }
.sub { color:var(--text-2); font-size:13px; margin-bottom:20px; }

/* KPI cards */
.kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:24px; }
.kpi { background:var(--bg-1); border:1px solid var(--border); border-radius:12px; padding:16px; }
.kpi .n { font-family:'JetBrains Mono'; font-size:28px; font-weight:700; color:var(--gold-bright); }
.kpi .l { color:var(--text-2); font-size:12px; text-transform:uppercase; letter-spacing:.5px; margin-top:2px; }
.panel { background:var(--bg-1); border:1px solid var(--border); border-radius:12px; padding:18px; margin-bottom:18px; }
.panel h2 { font-size:14px; text-transform:uppercase; letter-spacing:.5px; color:var(--text-2); margin-bottom:14px; }
.barrow { display:flex; align-items:center; gap:10px; margin-bottom:9px; font-size:13px; }
.barrow .lab { width:120px; color:var(--text-1); }
.barrow .track { flex:1; height:8px; background:var(--bg-2); border-radius:4px; overflow:hidden; }
.barrow .fill { height:100%; background:var(--gold); border-radius:4px; }
.barrow .val { width:64px; text-align:right; font-family:'JetBrains Mono'; color:var(--text-2); }

/* Filtros */
.filtros { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.filtros select, .filtros input { background:var(--bg-1); border:1px solid var(--border); color:var(--text-0);
  padding:8px 11px; border-radius:8px; font-size:14px; font-family:inherit; }
.filtros input { flex:1; min-width:160px; }
.filtros select:focus, .filtros input:focus { outline:none; border-color:var(--gold); }

/* Lista desktop (tabela) */
.tabela { width:100%; border-collapse:collapse; background:var(--bg-1); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.tabela th { text-align:left; padding:11px 13px; font-size:12px; text-transform:uppercase; letter-spacing:.4px;
  color:var(--text-2); border-bottom:1px solid var(--border); }
.tabela td { padding:11px 13px; border-bottom:1px solid var(--border); font-size:14px; }
.tabela tr:last-child td { border-bottom:none; }
.tabela tr:hover td { background:var(--bg-2); cursor:pointer; }
.tabela .nome { font-weight:600; }

/* Cards mobile */
.cards { display:none; flex-direction:column; gap:10px; }
.card { background:var(--bg-1); border:1px solid var(--border); border-radius:12px; padding:14px; cursor:pointer; }
.card:hover { border-color:var(--gold); }
.card .nome { font-weight:600; margin-bottom:4px; }
.card .end { color:var(--text-2); font-size:13px; }
.card .meta { display:flex; gap:6px; margin-top:9px; flex-wrap:wrap; }

/* Badges */
.badge { display:inline-block; padding:2px 9px; border-radius:20px; font-size:11px; font-weight:700;
  letter-spacing:.3px; border:1px solid transparent; }
.b-classe { background:var(--gold-bg); color:var(--gold-bright); border-color:var(--gold); }
.b-alta { background:rgba(16,185,129,.14); color:var(--success); }
.b-media { background:rgba(245,179,1,.14); color:var(--warn); }
.b-baixa { background:rgba(239,68,68,.14); color:var(--danger); }
.b-st { background:var(--bg-2); color:var(--text-2); }
.b-revisar { background:rgba(245,179,1,.14); color:var(--warn); }
.b-duplicata,.b-fora_escopo,.b-residencial,.b-descartado { background:rgba(239,68,68,.10); color:var(--danger); }

/* Paginação */
.pag { display:flex; gap:8px; align-items:center; justify-content:center; margin-top:18px; color:var(--text-2); font-size:14px; }
.pag button { background:var(--bg-1); border:1px solid var(--border); color:var(--text-0); padding:7px 14px;
  border-radius:8px; cursor:pointer; }
.pag button:disabled { opacity:.4; cursor:default; }

/* Detalhe */
.det-head { display:flex; align-items:flex-start; gap:14px; flex-wrap:wrap; margin-bottom:18px; }
.det-head .ttl { flex:1; min-width:200px; }
.btn { background:var(--gold); color:#0c0c0c; border:none; padding:9px 18px; border-radius:8px; font-weight:700;
  cursor:pointer; font-family:inherit; font-size:14px; }
.btn:hover { background:var(--gold-bright); }
.btn.ghost { background:none; border:1px solid var(--border); color:var(--text-1); }
.btn.ghost:hover { border-color:var(--gold); color:var(--gold); }
details.sec { background:var(--bg-1); border:1px solid var(--border); border-radius:12px; margin-bottom:12px; }
details.sec > summary { padding:14px 16px; font-weight:700; cursor:pointer; list-style:none; display:flex; justify-content:space-between; }
details.sec > summary::-webkit-details-marker { display:none; }
details.sec > summary .cnt { color:var(--text-3); font-weight:500; font-size:13px; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1px; background:var(--border); border-top:1px solid var(--border); }
.fld { background:var(--bg-1); padding:11px 16px; }
.fld .k { color:var(--text-3); font-size:11px; text-transform:uppercase; letter-spacing:.4px; }
.fld .v { color:var(--text-0); font-size:14px; margin-top:2px; word-break:break-word; }
.fld .v.empty { color:var(--text-3); font-style:italic; }
.fld input { width:100%; background:var(--bg-2); border:1px solid var(--border); color:var(--text-0);
  padding:7px 9px; border-radius:6px; font-family:inherit; font-size:14px; margin-top:3px; }
.fld input:focus { outline:none; border-color:var(--gold); }

/* Audit */
.audit { font-size:13px; }
.audit .row { padding:10px 0; border-bottom:1px solid var(--border); }
.audit .row:last-child { border:none; }
.audit .campo { color:var(--gold-bright); font-weight:600; }
.audit .chg { color:var(--text-2); }
.audit .when { color:var(--text-3); font-size:12px; }

.loading,.erro { text-align:center; color:var(--text-2); padding:40px; }
.erro { color:var(--danger); }
.toast { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:var(--bg-2);
  border:1px solid var(--gold); color:var(--text-0); padding:12px 20px; border-radius:10px; z-index:50; font-size:14px; }

@media (max-width:760px) {
  .tabela { display:none; }
  .cards { display:flex; }
  nav a { padding:7px 9px; font-size:13px; }
  .brand small { display:none; }
  main { padding:16px 12px 60px; }
}