/* Dashboard Jurídico — identidade do Claude Jurídico PRO:
   tinta náutica (#101D35), ouro (#C4A35A) e bordô (#7A2432) sobre papel quadriculado.
   Assinatura: a régua de prazos com carimbos. */

:root {
  --bg: #F3F4F6;
  --surf: #FFFFFF;
  --surf-2: #FAFBFC;
  --surf-3: #E4E7EB;
  --ink: #24272C;
  --ink-2: #3D434D;
  --ink-3: #6B7280;
  --line: #DDE0E5;
  --line-2: #BFC5CE;
  --marca: #101D35;
  --marca-esc: #0A1424;
  --marca-luz: #E5E9F0;
  --marca-txt: #FFFFFF;
  --pri: #101D35;
  --pri-hover: #1A2B4B;
  --pri-txt: #FFFFFF;
  --ouro: #C4A35A;
  --ouro-luz: rgba(196, 163, 90, .16);
  --bordo: #7A2432;
  --bordo-luz: rgba(122, 36, 50, .10);
  --alerta: #C87516;
  --alerta-luz: rgba(232, 145, 43, .15);
  --ok: #168B5B;
  --ok-luz: rgba(22, 139, 91, .12);
  --grade: rgba(14, 26, 43, .045);
  --lat: #FFFFFF;
  --hachura: rgba(14, 26, 43, .06);
  --sh1: 0 1px 2px rgba(14, 26, 43, .05), 0 1px 3px rgba(14, 26, 43, .04);
  --sh2: 0 2px 4px rgba(14, 26, 43, .04), 0 10px 22px -10px rgba(14, 26, 43, .20);
  --sh3: 0 18px 50px -16px rgba(14, 26, 43, .38);
  --rs: 8px;
  --r: 12px;
  --rl: 16px;
  --f-d: 'Poppins', 'Segoe UI', system-ui, sans-serif;
  --f-c: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --f-m: 'IBM Plex Mono', ui-monospace, Consolas, monospace;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #080C14; --surf: #131C2C; --surf-2: #0D1522; --surf-3: #1D2A3F;
    --ink: #E8ECF2; --ink-2: #B0BAC9; --ink-3: #7E8899;
    --line: #1F2C40; --line-2: #2E4160;
    --marca: #8FA9D6; --marca-esc: #6E8FC4; --marca-luz: rgba(143, 169, 214, .14); --marca-txt: #04122B; --pri: #8FA9D6; --pri-hover: #A9BEE2; --pri-txt: #04122B;
    --ouro: #D4B678; --ouro-luz: rgba(212, 182, 120, .14);
    --bordo: #E0808E; --bordo-luz: rgba(224, 128, 142, .14);
    --alerta: #F0A452; --alerta-luz: rgba(240, 164, 82, .14);
    --ok: #3FD0A2; --ok-luz: rgba(63, 208, 162, .12);
    --grade: rgba(140, 190, 240, .05); --lat: #0D1522; --hachura: rgba(140, 190, 240, .07);
    --sh1: 0 1px 2px rgba(0, 0, 0, .3);
    --sh2: 0 2px 6px rgba(0, 0, 0, .32), 0 12px 26px -12px rgba(0, 0, 0, .7);
    --sh3: 0 22px 60px -18px rgba(0, 0, 0, .85);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #080C14; --surf: #131C2C; --surf-2: #0D1522; --surf-3: #1D2A3F;
  --ink: #E8ECF2; --ink-2: #B0BAC9; --ink-3: #7E8899;
  --line: #1F2C40; --line-2: #2E4160;
  --marca: #8FA9D6; --marca-esc: #6E8FC4; --marca-luz: rgba(143, 169, 214, .14); --marca-txt: #04122B; --pri: #8FA9D6; --pri-hover: #A9BEE2; --pri-txt: #04122B;
  --ouro: #D4B678; --ouro-luz: rgba(212, 182, 120, .14);
  --bordo: #E0808E; --bordo-luz: rgba(224, 128, 142, .14);
  --alerta: #F0A452; --alerta-luz: rgba(240, 164, 82, .14);
  --ok: #3FD0A2; --ok-luz: rgba(63, 208, 162, .12);
  --grade: rgba(140, 190, 240, .05); --lat: #0D1522; --hachura: rgba(140, 190, 240, .07);
  --sh1: 0 1px 2px rgba(0, 0, 0, .3);
  --sh2: 0 2px 6px rgba(0, 0, 0, .32), 0 12px 26px -12px rgba(0, 0, 0, .7);
  --sh3: 0 22px 60px -18px rgba(0, 0, 0, .85);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background-color: var(--bg);
  background-image: linear-gradient(var(--grade) 1px, transparent 1px), linear-gradient(90deg, var(--grade) 1px, transparent 1px);
  background-size: 38px 38px;
  color: var(--ink);
  font-family: var(--f-c);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { font-family: var(--f-d); letter-spacing: -.02em; line-height: 1.2; margin: 0; }
p { margin: 0; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
::selection { background: var(--marca); color: var(--marca-txt); }
:focus-visible { outline: 2.5px solid var(--ouro); outline-offset: 2px; border-radius: 4px; }
[hidden] { display: none !important; }

.rot {
  font-family: var(--f-m); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-3); font-weight: 500;
}
.mono { font-family: var(--f-m); font-size: 13px; }
.muted { color: var(--ink-3); }
.pular { position: absolute; left: -9999px; top: 0; z-index: 300; background: var(--marca); color: var(--marca-txt); padding: 10px 16px; border-radius: var(--rs); }
.pular:focus { left: 10px; top: 10px; }

/* ---------- estrutura ---------- */
.app { display: grid; grid-template-columns: 256px minmax(0, 1fr); min-height: 100vh; }
.lat {
  position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column;
  background: var(--lat); border-right: 1px solid var(--line); padding: 18px 12px 14px;
}
.marca { display: flex; gap: 11px; align-items: center; text-decoration: none; padding: 4px 8px 18px; }
.marca-selo {
  width: 38px; height: 38px; flex: none; display: grid; place-items: center; border-radius: 10px;
  background: #101D35; color: #C4A35A; font-family: Georgia, 'Times New Roman', serif; font-size: 24px; font-weight: 700;
  box-shadow: inset 0 0 0 1.5px rgba(196, 163, 90, .55), var(--sh1);
}
.marca-n { display: block; font-family: var(--f-d); font-weight: 800; font-size: 15px; letter-spacing: -.03em; line-height: 1.2; }
.marca-s { display: block; font-family: var(--f-m); font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }

.nav { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; }
.nav-grupo { margin: 14px 10px 6px; }
.nav-i {
  display: flex; align-items: center; gap: 11px; padding: 8px 10px; border-radius: var(--rs);
  color: var(--ink-2); text-decoration: none; font-size: 14px; font-weight: 500;
  transition: background .14s, color .14s;
}
.nav-i:hover { background: var(--surf-2); color: var(--ink); }
.nav-i[aria-current="page"] { background: var(--marca-luz); color: var(--ink); font-weight: 600; box-shadow: inset 3px 0 0 var(--ouro); }
.nav-i svg { color: var(--ink-3); }
.nav-i[aria-current="page"] svg { color: var(--marca); }
.nav-c {
  margin-left: auto; font-family: var(--f-m); font-size: 10.5px; font-weight: 600; border-radius: 20px; padding: 1px 7px;
  background: var(--bordo); color: #fff;
}
.lat-pe { display: flex; gap: 8px; border-top: 1px solid var(--line); padding-top: 12px; }
.bt-lat {
  flex: 1; height: 34px; border-radius: var(--rs); border: 1px solid var(--line-2); background: var(--surf-2);
  font-size: 12.5px; font-weight: 600; color: var(--ink-2);
}
.bt-lat:hover { color: var(--ink); border-color: var(--ink-3); }

.coluna { min-width: 0; display: flex; flex-direction: column; }
.topo {
  position: sticky; top: 0; z-index: 40; display: flex; gap: 10px; align-items: center;
  padding: 12px 32px; background: color-mix(in srgb, var(--bg) 82%, transparent);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line);
}
.hamb { display: none; width: 40px; height: 40px; border-radius: var(--rs); border: 1px solid var(--line); background: var(--surf); place-items: center; }
.busca { position: relative; flex: 1; max-width: 560px; display: flex; align-items: center; gap: 8px;
  background: var(--surf); border: 1px solid var(--line); border-radius: var(--rs); padding: 0 10px; height: 40px; color: var(--ink-3); }
.busca:focus-within { border-color: var(--marca); }
.busca input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; color: var(--ink); height: 100%; }
.busca kbd { font-family: var(--f-m); font-size: 11px; border: 1px solid var(--line-2); border-radius: 5px; padding: 1px 6px; }
.busca-res {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px); background: var(--surf); border: 1px solid var(--line);
  border-radius: var(--r); box-shadow: var(--sh3); padding: 6px; max-height: 60vh; overflow: auto; color: var(--ink);
}
.busca-res a { display: block; padding: 8px 10px; border-radius: var(--rs); text-decoration: none; }
.busca-res a:hover, .busca-res a:focus { background: var(--surf-2); outline: none; }
.busca-res small { display: block; color: var(--ink-3); }

.principal { padding: 28px 32px 64px; max-width: 1280px; width: 100%; outline: none; }
.vista { animation: sobe .3s cubic-bezier(.2, .8, .3, 1) both; }
@keyframes sobe { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.cab { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.cab h1 { font-size: 28px; font-weight: 800; letter-spacing: -.035em; }
.cab .rot { margin-bottom: 4px; }
.cab-acoes { display: flex; gap: 8px; flex-wrap: wrap; }

/* ---------- botões ---------- */
.bt {
  text-decoration: none;
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 38px; padding: 0 14px;
  border-radius: var(--rs); border: 1px solid var(--line-2); background: var(--surf); color: var(--ink);
  font-size: 13.5px; font-weight: 600; box-shadow: var(--sh1); white-space: nowrap;
  transition: background .14s, border-color .14s, box-shadow .14s, transform .1s;
}
.bt:hover { background: var(--surf-2); border-color: var(--ink-3); }
.bt:active { transform: translateY(1px); }
.bt:disabled { opacity: .55; cursor: not-allowed; }
.bt.pri { background: var(--pri); border-color: var(--pri); color: var(--pri-txt); }
.bt.pri:hover { background: var(--pri-hover); }
.bt.ouro { background: var(--ouro); border-color: var(--ouro); color: #1B1405; }
.bt.perigo { background: var(--bordo); border-color: var(--bordo); color: #fff; }
.bt.min { height: 30px; padding: 0 10px; font-size: 12.5px; box-shadow: none; }
.bt.fant { border-color: transparent; background: none; box-shadow: none; }
.bt.fant:hover { background: var(--surf-3); }
.bt-x { border: 0; background: none; color: var(--ink-3); width: 34px; height: 34px; border-radius: var(--rs); display: grid; place-items: center; }
.bt-x:hover { background: var(--surf-3); color: var(--ink); }
.acoes-linha { display: flex; gap: 4px; justify-content: flex-end; }

/* ---------- cartões ---------- */
.cartao { background: var(--surf); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--sh1); padding: 18px 20px; }
.cartao > h2, .cartao-cab h2 { font-size: 16px; font-weight: 700; }
.cartao-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.grade { display: grid; gap: 16px; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g-painel { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
.mt { margin-top: 16px; }

.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 16px; }
.kpi {
  background: var(--surf); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--sh1);
  padding: 14px 16px; text-decoration: none; display: block; position: relative; overflow: hidden;
  transition: box-shadow .16s, transform .16s;
}
a.kpi:hover { box-shadow: var(--sh2); transform: translateY(-2px); }
.kpi-v { display: block; font-family: var(--f-d); font-size: 30px; font-weight: 800; letter-spacing: -.045em; line-height: 1.05; margin-top: 6px; }
.kpi-v.din { font-size: 22px; }
.kpi::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--line-2); }
.kpi.perigo::before { background: var(--bordo); }
.kpi.perigo .kpi-v { color: var(--bordo); }
.kpi.alerta::before { background: var(--alerta); }
.kpi.ouro::before { background: var(--ouro); }
.kpi.ok::before { background: var(--ok); }

/* ---------- assinatura: régua de prazos ---------- */
.regua { background: var(--surf); border: 1px solid var(--line); border-radius: var(--rl); box-shadow: var(--sh2); padding: 18px 20px 14px; margin-bottom: 16px; }
.regua-cab { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.regua-cab h2 { font-size: 18px; font-weight: 800; }
.regua-legenda { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--ink-3); }
.regua-legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.regua-corpo { display: flex; gap: 10px; align-items: stretch; }
.regua-venc {
  flex: none; width: 92px; border-radius: var(--r); background: var(--bordo-luz); border: 1px dashed var(--bordo);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; text-decoration: none; color: var(--bordo);
  padding: 8px;
}
.regua-venc b { font-family: var(--f-d); font-size: 30px; font-weight: 800; line-height: 1; }
.regua-venc span { font-family: var(--f-m); font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase; text-align: center; }
.regua-venc.zero { background: var(--ok-luz); border-color: var(--ok); color: var(--ok); }
.regua-trilho { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.regua-dias { padding-top: 14px; display: grid; grid-template-columns: repeat(31, minmax(30px, 1fr)); min-width: 930px; }
.dia { border-left: 1px solid var(--line); display: flex; flex-direction: column; min-height: 132px; }
.dia:first-child { border-left: 0; }
.dia.nu { background-image: repeating-linear-gradient(135deg, var(--hachura) 0 4px, transparent 4px 8px); }
.dia-topo { text-align: center; padding: 2px 0 6px; border-bottom: 2px solid var(--line); }
.dia-topo .ds { display: block; font-family: var(--f-m); font-size: 9px; text-transform: uppercase; color: var(--ink-3); letter-spacing: .06em; }
.dia-topo .dn { display: block; font-family: var(--f-m); font-size: 13px; font-weight: 600; color: var(--ink-2); }
.dia.hoje .dia-topo { border-bottom-color: var(--ouro); }
.dia.hoje .dn { color: var(--marca-txt); background: var(--marca); border-radius: 6px; margin: 0 3px; }
.dia.mes1 .dia-topo { position: relative; }
.dia.mes1 .dia-topo::before {
  content: attr(data-mes); position: absolute; top: -14px; left: 3px; font-family: var(--f-m); font-size: 9px;
  letter-spacing: .1em; text-transform: uppercase; color: var(--ouro);
}
.dia-pilha { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 7px 0; }
.carimbo {
  width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; text-decoration: none;
  font-family: var(--f-m); font-size: 10px; font-weight: 600; color: var(--marca);
  border: 1.5px solid currentColor; background: var(--surf); transform: rotate(-8deg);
  box-shadow: inset 0 0 0 2px var(--surf), inset 0 0 0 3px color-mix(in srgb, currentColor 35%, transparent);
  transition: transform .15s;
}
.carimbo:hover, .carimbo:focus-visible { transform: rotate(0) scale(1.15); }
.carimbo.u-d0, .carimbo.u-d1 { color: var(--bordo); background: var(--bordo-luz); }
.carimbo.u-d3 { color: var(--alerta); background: var(--alerta-luz); }
.carimbo.u-d7 { color: var(--ouro); background: var(--ouro-luz); }
.carimbo.mais { border-style: dashed; transform: none; }
.regua-dica { margin-top: 8px; font-size: 12px; color: var(--ink-3); }

/* ---------- listas do painel ---------- */
.lista { list-style: none; margin: 0; padding: 0; }
.lista li + li { border-top: 1px solid var(--line); }
.item { display: flex; gap: 12px; align-items: center; padding: 10px 2px; text-decoration: none; }
a.item:hover .item-t { color: var(--marca); text-decoration: underline; }
.item-data { flex: none; width: 58px; text-align: center; border-radius: var(--rs); padding: 4px 0; background: var(--surf-2); border: 1px solid var(--line); }
.item-data b { display: block; font-family: var(--f-d); font-size: 18px; line-height: 1.1; }
.item-data span { display: block; font-family: var(--f-m); font-size: 9.5px; text-transform: uppercase; color: var(--ink-3); }
.item-data.u-vencido, .item-data.u-d0, .item-data.u-d1 { background: var(--bordo-luz); border-color: var(--bordo); color: var(--bordo); }
.item-data.u-d3 { background: var(--alerta-luz); border-color: var(--alerta); }
.item-data.u-d7 { background: var(--ouro-luz); border-color: var(--ouro); }
.item-c { min-width: 0; flex: 1; }
.item-t { display: block; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.item-s { display: block; font-size: 12.5px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.item-u { flex: none; font-family: var(--f-m); font-size: 11px; color: var(--ink-3); }
.item-u.u-vencido, .item-u.u-d0, .item-u.u-d1 { color: var(--bordo); font-weight: 600; }

.atalhos { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- selos ---------- */
.selo { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 20px; font-size: 11.5px; font-weight: 600; white-space: nowrap; border: 1px solid transparent; }
.selo-perigo { background: var(--bordo-luz); color: var(--bordo); border-color: color-mix(in srgb, var(--bordo) 40%, transparent); }
.selo-ok { background: var(--ok-luz); color: var(--ok); }
.selo-neutro { background: var(--surf-3); color: var(--ink-2); }
.selo-ouro { background: var(--ouro-luz); color: color-mix(in srgb, var(--ouro) 70%, var(--ink)); }
.selo-alerta { background: var(--alerta-luz); color: var(--alerta); }
.data-fatal { display: inline-flex; flex-direction: column; line-height: 1.2; }
.data-fatal b { font-family: var(--f-m); font-size: 13px; }
.data-fatal small { font-size: 11px; color: var(--ink-3); }
.data-fatal.u-vencido b, .data-fatal.u-d0 b, .data-fatal.u-d1 b { color: var(--bordo); }
.data-fatal.u-vencido small, .data-fatal.u-d0 small, .data-fatal.u-d1 small { color: var(--bordo); }
.data-fatal.u-d3 small { color: var(--alerta); }

/* ---------- filtros ---------- */
.filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin-bottom: 14px; }
.filtros label { display: flex; flex-direction: column; gap: 3px; font-size: 11.5px; color: var(--ink-3); font-weight: 500; }
.filtros input, .filtros select { height: 36px; min-width: 150px; }
input, select, textarea {
  border: 1px solid var(--line-2); border-radius: var(--rs); background: var(--surf); padding: 0 10px; height: 38px; width: 100%;
  color: var(--ink);
}
textarea { padding: 8px 10px; height: auto; resize: vertical; }
input[type="checkbox"] { width: 18px; height: 18px; padding: 0; accent-color: var(--marca); }
input:focus, select:focus, textarea:focus { outline: 2px solid color-mix(in srgb, var(--marca) 40%, transparent); border-color: var(--marca); }
[aria-invalid] { border-color: var(--bordo); }

/* ---------- tabela ---------- */
.tabela-caixa { background: var(--surf); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--sh1); overflow-x: auto; }
.tabela { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabela th { text-align: left; font-family: var(--f-m); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); font-weight: 500; padding: 10px 12px; border-bottom: 1px solid var(--line); background: var(--surf-2); white-space: nowrap; }
.tabela td { padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.tabela tr:last-child td { border-bottom: 0; }
.tabela tr.clicavel { cursor: pointer; }
.tabela tr.clicavel:hover td { background: var(--surf-2); }
.tabela .dir { text-align: right; }
.tabela .forte { font-weight: 600; }

/* ---------- formulário e modal ---------- */
.form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.campo { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.campo label { font-size: 12.5px; font-weight: 600; color: var(--ink-2); }
.campo-toda { grid-column: 1 / -1; }
.campo-check { flex-direction: row; align-items: center; gap: 8px; align-self: end; min-height: 38px; }
.obrig { color: var(--bordo); }
.ajuda { color: var(--ink-3); font-size: 11.5px; }
.campo-erro { color: var(--bordo); font-size: 12px; min-height: 0; }
.campo-erro:empty { display: none; }
.calc {
  grid-column: 1 / -1; display: flex; gap: 18px; flex-wrap: wrap; align-items: center;
  padding: 12px 14px; border-radius: var(--r); background: var(--marca-luz); border: 1px solid var(--line);
}
.calc div { display: flex; flex-direction: column; }
.calc b { font-family: var(--f-m); font-size: 15px; }
.calc .fatal b { font-size: 20px; color: var(--marca); }
.calc.erro { background: var(--bordo-luz); color: var(--bordo); }

.modal-fundo {
  position: fixed; inset: 0; z-index: 200; background: rgba(8, 17, 29, .55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
  display: grid; place-items: center; padding: 16px; animation: aparece .15s ease both;
}
@keyframes aparece { from { opacity: 0; } }
.modal {
  width: min(620px, 100%); max-height: calc(100vh - 32px); display: flex; flex-direction: column;
  background: var(--surf); border-radius: var(--rl); box-shadow: var(--sh3); border: 1px solid var(--line);
  animation: sobe .2s cubic-bezier(.2, .8, .3, 1) both;
}
.modal-largo { width: min(900px, 100%); }
.modal-cab { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 18px 12px; border-bottom: 1px solid var(--line); }
.modal-cab h2 { font-size: 18px; font-weight: 700; }
.modal-corpo { padding: 16px 18px; overflow: auto; }
.modal-pe { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 18px 16px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.texto-pedido { font-family: var(--f-m); font-size: 12.5px; white-space: pre-wrap; background: var(--surf-2); border: 1px solid var(--line); border-radius: var(--rs); padding: 12px; max-height: 260px; overflow: auto; margin-top: 12px; }

/* ---------- abas ---------- */
.abas { display: flex; gap: 2px; border-bottom: 1px solid var(--line); margin-bottom: 16px; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
.aba { border: 0; background: none; padding: 9px 14px; font-weight: 600; font-size: 14px; color: var(--ink-3); border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.aba:hover { color: var(--ink); }
.aba[aria-selected="true"] { color: var(--ink); border-bottom-color: var(--ouro); }

/* ---------- ficha ---------- */
.ficha-dados { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px 20px; }
.ficha-dados dt { font-family: var(--f-m); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.ficha-dados dd { margin: 2px 0 0; font-weight: 500; overflow-wrap: anywhere; }
.cnj { font-family: var(--f-m); font-weight: 600; letter-spacing: -.01em; white-space: nowrap; }
.tabela a { text-decoration: none; }
.tabela a:hover { text-decoration: underline; }
.voltar { display: inline-flex; align-items: center; gap: 4px; color: var(--ink-3); text-decoration: none; font-size: 13px; margin-bottom: 8px; }
.voltar:hover { color: var(--ink); }

/* ---------- agenda ---------- */
.cal { background: var(--surf); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--sh1); overflow: hidden; }
.cal-sem { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-sem > div { padding: 8px; font-family: var(--f-m); font-size: 10.5px; text-transform: uppercase; letter-spacing: .1em; color: var(--ink-3); border-bottom: 1px solid var(--line); background: var(--surf-2); }
.cal-grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-dia { min-height: 108px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 6px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cal-dia:nth-child(7n) { border-right: 0; }
.cal-dia.fora { background: var(--surf-2); color: var(--ink-3); }
.cal-dia.nu { background-image: repeating-linear-gradient(135deg, var(--hachura) 0 4px, transparent 4px 8px); }
.cal-num { font-family: var(--f-m); font-size: 12px; font-weight: 600; display: flex; justify-content: space-between; gap: 4px; }
.cal-num small { font-weight: 400; color: var(--ink-3); font-size: 9.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-dia.hoje .cal-num > span { background: var(--marca); color: var(--marca-txt); border-radius: 6px; padding: 0 6px; }
.ev {
  display: block; font-size: 11.5px; line-height: 1.3; padding: 3px 6px; border-radius: 5px; text-decoration: none;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 0; text-align: left; width: 100%;
}
.ev-audiencia { background: var(--marca-luz); color: var(--ink); box-shadow: inset 3px 0 0 var(--marca); }
.ev-prazo { background: var(--ouro-luz); color: var(--ink); box-shadow: inset 3px 0 0 var(--ouro); }
.ev-prazo.u-vencido, .ev-prazo.u-d0, .ev-prazo.u-d1 { background: var(--bordo-luz); box-shadow: inset 3px 0 0 var(--bordo); }
.cal-nav { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cal-nav h2 { font-size: 20px; font-weight: 800; min-width: 200px; }
.cal-nav .abas { margin-bottom: 0; }
.semana-lista .cal-dia { min-height: 0; }

/* ---------- financeiro ---------- */
.barras { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 8px; align-items: end; height: 190px; padding-top: 10px; }
.barra { display: flex; flex-direction: column; align-items: center; gap: 4px; height: 100%; justify-content: flex-end; min-width: 0; }
.barra-par { display: flex; gap: 3px; align-items: flex-end; height: 150px; width: 100%; justify-content: center; }
.barra-par i { display: block; width: 42%; max-width: 16px; border-radius: 4px 4px 0 0; min-height: 2px; }
.barra-par .prev { background: var(--surf-3); box-shadow: inset 0 0 0 1px var(--line-2); }
.barra-par .rec { background: var(--ouro); }
.barra span { font-family: var(--f-m); font-size: 10px; color: var(--ink-3); text-transform: uppercase; }

/* ---------- agentes ---------- */
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.chip { border: 1px solid var(--line-2); background: var(--surf); border-radius: 20px; padding: 4px 12px; font-size: 12.5px; font-weight: 500; color: var(--ink-2); }
.chip[aria-pressed="true"] { background: var(--marca); border-color: var(--marca); color: var(--marca-txt); }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; }
.card {
  background: var(--surf); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--sh1);
  padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; position: relative;
  transition: box-shadow .16s, transform .16s, border-color .16s;
}
.card:hover { box-shadow: var(--sh2); transform: translateY(-2px); border-color: var(--line-2); }
.card-topo { display: flex; gap: 10px; align-items: flex-start; }
.card-n {
  flex: none; min-width: 34px; height: 26px; padding: 0 6px; border-radius: 7px; display: grid; place-items: center;
  font-family: var(--f-m); font-size: 11px; font-weight: 600; background: var(--dc, #101D35); color: #fff;
}
.card h3 { font-size: 14.5px; font-weight: 700; letter-spacing: -.01em; line-height: 1.3; font-family: var(--f-c); }
.card h3 small { display: block; font-family: var(--f-m); font-size: 11px; font-weight: 400; color: var(--ink-3); }
.card p { font-size: 13px; color: var(--ink-2); }
.card p.cortado { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card-pe { display: flex; gap: 6px; flex-wrap: wrap; margin-top: auto; padding-top: 4px; }
.card.destaque { border-color: var(--ouro); box-shadow: inset 0 0 0 1px var(--ouro), var(--sh1); }
.dep-tit { display: flex; align-items: center; gap: 10px; margin: 22px 0 10px; }
.dep-tit h2 { font-size: 17px; font-weight: 800; }
.dep-tit i { width: 12px; height: 12px; border-radius: 3px; background: var(--dc); }
.aviso { border: 1px solid var(--line); border-left: 4px solid var(--ouro); background: var(--surf); border-radius: var(--r); padding: 12px 16px; font-size: 13.5px; color: var(--ink-2); margin-bottom: 14px; }
.aviso.perigo { border-left-color: var(--bordo); }
.aviso b { color: var(--ink); }

/* ---------- vazio / carregando / toasts ---------- */
.vazio { text-align: center; padding: 36px 16px; color: var(--ink-3); background: var(--surf); border: 1px dashed var(--line-2); border-radius: var(--r); display: flex; flex-direction: column; align-items: center; gap: 8px; }
.vazio-t { font-weight: 600; color: var(--ink-2); }
.carregando { display: flex; align-items: center; gap: 10px; color: var(--ink-3); padding: 24px 4px; }
.giro { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--line-2); border-top-color: var(--marca); animation: gira .8s linear infinite; }
@keyframes gira { to { transform: rotate(360deg); } }
.toasts { position: fixed; right: 16px; bottom: 16px; z-index: 300; display: flex; flex-direction: column; gap: 8px; max-width: min(420px, calc(100vw - 32px)); }
.toast { background: #101D35; color: #F1F4F8; padding: 11px 14px; border-radius: var(--r); box-shadow: var(--sh3); font-size: 13.5px; border-left: 4px solid var(--ok); animation: sobe .2s both; transition: opacity .3s, transform .3s; }
.toast-erro { border-left-color: #E07A6C; }
.toast-aviso { border-left-color: var(--ouro); }
.toast.sai { opacity: 0; transform: translateY(6px); }
.veu { display: none; }

/* ---------- responsivo ---------- */
@media (max-width: 1080px) {
  .g-painel, .g3 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 800px) {
  .app { grid-template-columns: minmax(0, 1fr); }
  .lat { position: fixed; left: 0; top: 0; bottom: 0; width: 272px; z-index: 100; transform: translateX(-100%); transition: transform .22s ease; box-shadow: var(--sh3); }
  .lat.aberta { transform: none; }
  .veu.on { display: block; position: fixed; inset: 0; z-index: 90; background: rgba(8, 17, 29, .5); }
  .hamb { display: grid; }
  .topo { padding: 10px 16px; }
  .busca kbd { display: none; }
  .principal { padding: 20px 16px 48px; }
  .g2 { grid-template-columns: minmax(0, 1fr); }
  .form { grid-template-columns: minmax(0, 1fr); }
  .cab h1 { font-size: 23px; }
  .regua-corpo { flex-direction: column; }
  .regua-venc { width: 100%; flex-direction: row; gap: 10px; }
  .tabela thead { display: none; }
  .tabela tr { display: block; border-bottom: 1px solid var(--line); padding: 6px 0; }
  .tabela td { display: flex; justify-content: space-between; gap: 12px; border: 0; padding: 4px 12px; text-align: right; }
  .tabela td::before { content: attr(data-rotulo); font-family: var(--f-m); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); text-align: left; }
  .tabela td.dir { text-align: right; }
  .cal-sem > div { font-size: 9px; padding: 6px 2px; text-align: center; }
  .cal-dia { min-height: 64px; padding: 3px; }
  .ev { font-size: 10px; padding: 2px 3px; }
  .barras { gap: 3px; }
  .filtros label { flex: 1 1 140px; }
  .filtros input, .filtros select { min-width: 0; }
}

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

/* ---------- pesquisa nos tribunais (chat) ---------- */
.chat { display: flex; flex-direction: column; gap: 14px; padding-bottom: 12px; }
.msg { display: flex; gap: 10px; align-items: flex-start; }
.msg-eu { justify-content: flex-end; }
.msg .balao { background: var(--surf); border: 1px solid var(--line); border-radius: var(--rl); box-shadow: var(--sh1); padding: 12px 16px; max-width: 100%; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.msg-eu .balao { background: var(--pri); color: var(--pri-txt); border-color: var(--pri); max-width: min(620px, 90%); border-bottom-right-radius: 4px; white-space: pre-wrap; }
.msg-dj { padding-right: 24px; }
.msg-dj .balao { flex: 1; border-top-left-radius: 4px; }
.avatar {
  flex: none; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center;
  background: #101D35; color: #C4A35A; font-family: Georgia, 'Times New Roman', serif; font-weight: 700; font-size: 20px;
  box-shadow: inset 0 0 0 1.5px rgba(196, 163, 90, .55);
}
.erro-dj { color: var(--bordo); font-weight: 600; }
.chat-entrada {
  position: sticky; bottom: 0; display: flex; gap: 10px; align-items: flex-end;
  padding: 12px 0 16px; background: linear-gradient(to top, var(--bg) 70%, transparent);
}
.chat-entrada textarea { flex: 1; min-height: 48px; box-shadow: var(--sh2); }
.chat-entrada .bt { height: 48px; }
.cards-dj { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
.processo-dj .card-n { min-width: 52px; }
.ficha-dados.mini { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 6px 14px; margin: 0; }
.ficha-dados.mini dd { font-size: 13px; }
.ficha-dados .toda { grid-column: 1 / -1; }
.movs { list-style: none; margin: 0; padding: 0 0 0 12px; border-left: 2px solid var(--ouro); display: flex; flex-direction: column; gap: 5px; }
.movs li { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 8px; font-size: 13px; }
.movs .mono { font-size: 11.5px; color: var(--ink-3); }
@media (max-width: 800px) {
  .msg-dj { padding-right: 0; }
  .cards-dj { grid-template-columns: minmax(0, 1fr); }
  .movs li { grid-template-columns: minmax(0, 1fr); gap: 0; }
}

/* ---------- login (versão web) ---------- */
body.com-login .app { display: none; }
.login { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.login-caixa {
  width: min(400px, 100%); background: var(--surf); border: 1px solid var(--line); border-radius: var(--rl);
  box-shadow: var(--sh3); padding: 32px 28px 24px; display: flex; flex-direction: column; gap: 14px;
}
.login-caixa h1 { font-size: 26px; font-weight: 800; letter-spacing: -.035em; }
.login-caixa .rot { margin-top: -10px; }
.login-selo { width: 52px; height: 52px; font-size: 32px; border-radius: 14px; }
.login-caixa .bt { height: 44px; font-size: 15px; }
.login-msg { color: var(--bordo); font-size: 13.5px; min-height: 1em; }
.login-msg:empty { display: none; }
.login-rodape { font-size: 12px; color: var(--ink-3); text-align: center; }

/* ---------- topo: tema (balança) e usuário ---------- */
.topo-acoes { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.bt-tema {
  display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px 0 8px;
  border-radius: 999px; border: 1px solid var(--line); background: var(--surf); color: var(--ink);
  font-size: 13px; font-weight: 600; box-shadow: var(--sh1); transition: border-color .15s, box-shadow .15s;
}
.bt-tema:hover { border-color: var(--ouro); box-shadow: var(--sh2); }
.tema-balanca {
  position: relative; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center;
  background: #101D35; color: #C4A35A; box-shadow: inset 0 0 0 1.5px rgba(196, 163, 90, .55);
}
.tema-selo {
  position: absolute; right: -3px; bottom: -3px; width: 16px; height: 16px; border-radius: 50%;
  display: grid; place-items: center; background: var(--ouro); color: #101D35; box-shadow: 0 0 0 2px var(--surf);
}
.bt-tema.gira .tema-balanca svg { animation: balanca .6s ease; }
@keyframes balanca { 0% { transform: rotate(0); } 30% { transform: rotate(-14deg); } 65% { transform: rotate(10deg); } 100% { transform: rotate(0); } }
.usuario { display: inline-flex; align-items: center; gap: 8px; max-width: 240px; min-width: 0; }
.usuario-av {
  flex: none; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center;
  background: var(--marca-luz); color: var(--ink); font-family: var(--f-d); font-weight: 700; font-size: 14px;
  border: 1px solid var(--line);
}
.usuario-nome { font-size: 13px; font-weight: 600; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bt-sair {
  display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 14px; border-radius: var(--rs);
  border: 1px solid var(--line-2); background: var(--surf); color: var(--bordo); font-size: 13.5px; font-weight: 600;
  box-shadow: var(--sh1); transition: background .15s, color .15s, border-color .15s;
}
.bt-sair:hover { background: var(--bordo); border-color: var(--bordo); color: #fff; }
.login { position: relative; }
.login-tema { position: absolute; top: 16px; right: 16px; }
@media (max-width: 800px) {
  .tema-rotulo, .usuario-nome, .bt-sair span { display: none; }
  .bt-tema { padding: 0 5px; }
  .bt-sair { padding: 0 10px; }
  .usuario { display: none; }
}

/* ---------- PWA: instalação, avisos, barra inferior e áreas seguras ---------- */
.bt-instalar {
  display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 14px; border-radius: var(--rs);
  border: 1px solid var(--ouro); background: var(--ouro-luz); color: var(--ink); font-size: 13.5px; font-weight: 600;
}
.bt-instalar:hover { background: var(--ouro); color: #1B1405; }
.passos-ios { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 10px; }
.passos-ios svg { vertical-align: -3px; }
.aviso-versao {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 250;
  display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 16px; border-radius: var(--r);
  background: #101D35; color: #F1F4F8; box-shadow: var(--sh3); border-left: 4px solid var(--ouro); font-size: 13.5px;
  max-width: calc(100vw - 24px);
}
.faixa-offline {
  position: fixed; top: 0; left: 0; right: 0; z-index: 260; padding: calc(6px + env(safe-area-inset-top)) 12px 6px;
  background: var(--bordo); color: #fff; font-size: 13px; font-weight: 600; text-align: center;
}
.filtros-caixa > summary { display: none; list-style: none; }
.filtros-caixa > summary::-webkit-details-marker { display: none; }
.offline-caixa p { color: var(--ink-2); }
.tabbar { display: none; }

@media (display-mode: standalone) {
  .topo { padding-top: calc(12px + env(safe-area-inset-top)); }
}
@supports (padding: env(safe-area-inset-left)) {
  .topo { padding-left: max(32px, env(safe-area-inset-left)); padding-right: max(32px, env(safe-area-inset-right)); }
}

@media (max-width: 800px) {
  .topo { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); gap: 8px; }
  .bt-instalar { padding: 0 10px; }
  .bt-instalar span { display: none; }
  .principal { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
  body.com-tabbar .principal { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
  body.com-tabbar .hamb { display: none; }
  body.com-tabbar .chat-entrada { bottom: calc(64px + env(safe-area-inset-bottom)); }
  body.com-tabbar .toasts, body.com-tabbar .aviso-versao { bottom: calc(76px + env(safe-area-inset-bottom)); }
  body.com-login .tabbar { display: none !important; }

  .tabbar {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
    background: color-mix(in srgb, var(--surf) 94%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    border-top: 1px solid var(--line); box-shadow: 0 -6px 24px -14px rgba(14, 26, 43, .35);
    padding: 4px max(4px, env(safe-area-inset-right)) calc(4px + env(safe-area-inset-bottom)) max(4px, env(safe-area-inset-left));
  }
  .tab {
    flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 2px 4px;
    border: 0; background: none; border-radius: var(--rs); color: var(--ink-3); text-decoration: none; font: inherit;
  }
  .tab[aria-current="page"] { color: var(--ink); }
  .tab[aria-current="page"] .tab-ic { background: var(--marca-luz); box-shadow: inset 0 -2px 0 var(--ouro); }
  .tab:active { background: var(--surf-2); }
  .tab-ic { position: relative; display: grid; place-items: center; width: 44px; height: 28px; border-radius: 14px; }
  .tab-t { font-size: 10.5px; font-weight: 600; white-space: nowrap; }
  .tab-c {
    position: absolute; top: -3px; right: 2px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px;
    background: var(--bordo); color: #fff; font-family: var(--f-m); font-size: 10px; font-weight: 600; display: grid; place-items: center;
    box-shadow: 0 0 0 2px var(--surf);
  }

  /* Cabeçalho das telas: ações numa linha só, com rolagem lateral. */
  .cab { flex-direction: column; align-items: stretch; gap: 12px; margin-bottom: 16px; }
  .cab-acoes { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -16px; padding: 2px 16px 4px; }
  .cab-acoes::-webkit-scrollbar { display: none; }
  .cab-acoes > * { flex: none; }

  /* Filtros recolhíveis. */
  .filtros-caixa { margin-bottom: 12px; }
  .filtros-caixa > summary { display: inline-flex; cursor: pointer; margin-bottom: 8px; }
  .filtros-caixa > summary::before { content: '▸'; margin-right: 6px; transition: transform .15s; }
  .filtros-caixa[open] > summary::before { transform: rotate(90deg); }
  .filtros-caixa .filtros { margin-bottom: 0; }

  /* Modais ocupam a tela toda no celular. */
  .modal-fundo { padding: 0; align-items: end; }
  .modal, .modal-largo { width: 100%; max-height: 92vh; border-radius: var(--rl) var(--rl) 0 0; }
  .modal-pe { padding-bottom: calc(16px + env(safe-area-inset-bottom)); }

  /* Toques mais confortáveis. */
  .bt { min-height: 40px; }
  .bt.min { min-height: 34px; }
  input, select, textarea { font-size: 16px; } /* evita zoom automático no iPhone */
}

/* ---------- larguras: faixas com rolagem própria não podem alargar a página ---------- */
.principal { min-width: 0; }
/* :where() tem prioridade zero, então .g2/.g3/.g-painel continuam valendo. */
:where(.grade) { grid-template-columns: minmax(0, 1fr); }
.grade > * { min-width: 0; }
.cab-acoes, .abas, .regua-trilho, .chips, .tabela-caixa { min-width: 0; }
@media (max-width: 800px) {
  .cab-acoes, .abas, .regua-trilho, .tabela-caixa { contain: inline-size; }
}