/* JurisBoard — réplica fiel dos tokens do Multica (packages/ui/styles/tokens.css)
   Cores convertidas de oklch para hex/rgb equivalentes. */
:root {
  --app-shell: #f4f4f5;          /* oklch(.9644 .0013 286) */
  --page-canvas: #fcfcfc;        /* oklch(.988 0 0) */
  --surface: #ffffff;
  --surface-hover: #f6f6f7;      /* oklch(.967 .001 286) */
  --surface-border: #e6e6e9;     /* oklch(.92 .004 286) */
  --border: #eeeef0;             /* oklch(.945 .003 286) */
  --foreground: #18181b;         /* oklch(.141 .005 286) */
  --muted: #f6f6f7;
  --muted-fg: #74747e;           /* oklch(.552 .016 286) */
  --primary: #26262b;            /* oklch(.21 .006 286) — botão principal escuro */
  --primary-fg: #fafafa;
  --brand: #3c6de0;              /* oklch(.55 .16 255) */
  --warning: #dfa100;            /* oklch(.75 .16 85) */
  --success: #1d9b53;            /* oklch(.55 .16 145) */
  --info: #3565dd;               /* oklch(.55 .18 250) */
  --destructive: #d13d3d;        /* oklch(.577 .245 27) */
  --radius: 10px;
  --surface-shadow: 0 1px 2px rgb(15 23 42 / .04), 0 1px 1px rgb(15 23 42 / .03);
  --floating-shadow: 0 16px 40px rgb(15 23 42 / .14), 0 3px 10px rgb(15 23 42 / .08);
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { background: var(--page-canvas); color: var(--foreground); font-family: var(--font); font-size: 13px; line-height: 1.5; height: 100vh; overflow: hidden; -webkit-font-smoothing: antialiased; }
.layout { display: flex; height: 100vh; }

/* ---------- sidebar (app shell) ---------- */
.sidebar { width: 220px; background: var(--app-shell); border-right: 1px solid var(--surface-border); padding: 14px 10px; display: flex; flex-direction: column; gap: 16px; flex-shrink: 0; }
.logo { display: flex; gap: 9px; align-items: center; padding: 0 6px; }
.logo-mark { width: 30px; height: 30px; border-radius: 8px; background: var(--primary); color: #fff; display: grid; place-items: center; font-size: 15px; font-weight: 600; }
.logo-title { font-weight: 600; font-size: 13px; }
.logo-sub { font-size: 10.5px; color: var(--muted-fg); }
.nav { display: flex; flex-direction: column; gap: 1px; }
.nav-item { padding: 6px 8px; border-radius: 7px; color: var(--muted-fg); cursor: pointer; text-decoration: none; font-weight: 500; font-size: 13px; display: flex; align-items: center; gap: 7px; }
.nav-item.active { background: #ececee; color: var(--foreground); }
.nav-item:hover { background: #ececee; }
.sidebar-footer { margin-top: auto; font-size: 11px; color: var(--muted-fg); padding: 0 6px; }

/* ---------- topbar ---------- */
.main { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.topbar { display: flex; align-items: center; justify-content: space-between; padding: 10px 18px; border-bottom: 1px solid var(--border); background: var(--page-canvas); }
.crumb { font-weight: 500; font-size: 13px; }
.crumb span { color: var(--muted-fg); font-weight: 400; margin: 0 5px; }

/* ---------- kanban ---------- */
.kanban { flex: 1; display: flex; gap: 16px; padding: 18px 24px; overflow-x: auto; align-items: stretch; }
/* escopado ao kanban: a classe "col" solta colide com .side-row.col da lateral */
.kanban .col { flex: 1 1 0; min-width: 280px; border-radius: 12px; padding: 10px; display: flex; flex-direction: column; background: rgba(118, 118, 128, .07); }
.kanban .col.bg-warning { background: rgb(223 161 0 / .05); }
.kanban .col.bg-success { background: rgb(29 155 83 / .05); }
.kanban .col.bg-info { background: rgb(53 101 221 / .05); }
.kanban .col.bg-destructive { background: rgb(209 61 61 / .05); }

.col-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; padding: 0 6px; }
.col-head-left { display: flex; align-items: center; gap: 8px; min-width: 0; }
.col-head-left .status-ic { width: 12px; height: 12px; flex-shrink: 0; }
.col-title { font-size: 12px; font-weight: 600; }
.col-count { font-size: 12px; color: var(--muted-fg); }
.col-add { width: 24px; height: 24px; border: none; background: transparent; border-radius: 50%; color: var(--muted-fg); cursor: pointer; font-size: 15px; line-height: 1; display: grid; place-items: center; }
.col-add:hover { background: rgb(0 0 0 / .05); color: var(--foreground); }

.col-cards { flex: 1; min-height: 200px; overflow-y: auto; padding: 4px; border-radius: 8px; display: flex; flex-direction: column; gap: 10px; }
.col-empty { padding: 40px 0; text-align: center; font-size: 12px; color: var(--muted-fg); }

/* ---------- card (réplica do board-card) ---------- */
.card { background: var(--surface); border: 0.5px solid var(--surface-border); border-radius: 10px; padding: 13px 15px; cursor: pointer; box-shadow: var(--surface-shadow); transition: border-color .12s, background .12s; }
.card:hover { border-color: rgb(24 24 27 / .15); background: var(--surface-hover); }
.card-id-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.card-id-right { display: flex; align-items: center; gap: 4px; min-height: 20px; }
.task-code { font-size: 12px; color: var(--muted-fg); }

/* ações do card (arquivar/excluir) — aparecem no hover */
.card-actions { display: none; align-items: center; gap: 2px; }
.card:hover .card-actions { display: inline-flex; }
.ca-btn { border: none; background: transparent; color: var(--muted-fg); cursor: pointer; padding: 3px; border-radius: 6px; display: inline-flex; align-items: center; }
.ca-btn:hover { background: rgb(0 0 0 / .06); color: var(--foreground); }
.ca-btn.ca-del:hover { color: var(--destructive); background: rgb(209 61 61 / .08); }
.card-title { margin-top: 4px; font-size: 14px; font-weight: 500; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card-sub { margin-top: 4px; font-size: 12px; color: var(--muted-fg); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.card-chips { margin-top: 6px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.chip { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; background: rgb(118 118 128 / .1); padding: 2px 7px; font-size: 11px; color: var(--muted-fg); max-width: 200px; }
.chip .t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chip.chip-stage { color: var(--brand); background: rgb(60 109 224 / .09); }
.chip.chip-alert { color: var(--warning); background: rgb(223 161 0 / .12); font-weight: 600; }
.card-foot { margin-top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.avatar { width: 18px; height: 18px; border-radius: 50%; background: var(--brand); color: #fff; font-size: 10px; font-weight: 600; display: inline-grid; place-items: center; flex-shrink: 0; }
.assignee { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--foreground); min-width: 0; }
.assignee .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.timeago { font-size: 12px; color: var(--muted-fg); flex-shrink: 0; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--warning); display: inline-block; animation: pulse 1.2s infinite; margin-right: 5px; }
@keyframes pulse { 50% { opacity: .25; } }

/* ---------- status icon svg ---------- */
.status-ic.gray { color: var(--muted-fg); }
.status-ic.warning { color: var(--warning); }
.status-ic.success { color: var(--success); }
.status-ic.info { color: var(--info); }
.status-ic.destructive { color: var(--destructive); }

/* ---------- pill de status (detalhe) ---------- */
.pill { font-size: 11px; font-weight: 600; padding: 2px 10px; border-radius: 999px; white-space: nowrap; display: inline-flex; align-items: center; gap: 5px; }
.pill.QUEUED { background: rgb(118 118 128 / .1); color: var(--muted-fg); }
.pill.RUNNING { background: rgb(223 161 0 / .12); color: var(--warning); }
.pill.WAITING_INPUT { background: rgb(29 155 83 / .12); color: var(--success); }
.pill.DONE { background: rgb(53 101 221 / .1); color: var(--info); }
.pill.FAILED { background: rgb(209 61 61 / .1); color: var(--destructive); }

/* ---------- detalhe da tarefa (coluna principal + sidebar de propriedades) ---------- */
.detail { flex: 1; display: flex; flex-direction: column; overflow: hidden; background: var(--page-canvas); }
.detail.hidden, .kanban.hidden, .hidden { display: none !important; }
.detail-header { display: flex; align-items: center; gap: 12px; padding: 10px 18px; border-bottom: 1px solid var(--border); background: var(--page-canvas); }
.detail-header-spacer { flex: 1; }

.detail-body { flex: 1; display: flex; overflow: hidden; }
.detail-main { flex: 1; display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.detail-scroll { flex: 1; overflow-y: auto; padding: 22px 28px 14px; }
.detail-h1 { font-size: 20px; font-weight: 650; line-height: 1.3; letter-spacing: -.2px; }
.detail-subline { margin-top: 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.stage-badge { font-size: 11.5px; font-weight: 500; padding: 3px 11px; border-radius: 999px; color: var(--brand); background: rgb(60 109 224 / .09); line-height: 1.5; }
.question-banner { margin: 16px 0 0; padding: 11px 14px; border: 1px solid rgb(223 161 0 / .35); border-radius: var(--radius); background: rgb(223 161 0 / .07); color: #8a6400; font-weight: 500; font-size: 13px; }
.activity-head { margin: 24px 0 2px; padding-bottom: 9px; border-bottom: 1px solid var(--border); font-size: 13px; font-weight: 650; display: flex; align-items: center; gap: 7px; color: var(--foreground); }
.activity-head .lucide { color: var(--muted-fg); }

/* sidebar de propriedades (padrão "Properties" do Multica) */
.detail-side { width: 312px; flex-shrink: 0; border-left: 1px solid var(--border); background: var(--page-canvas); overflow-y: auto; padding: 16px 14px 22px; display: flex; flex-direction: column; gap: 12px; }
/* cada seção é um cartão branco (como os cards do board) — nada de área chapada */
.side-sec {
  flex-shrink: 0;  /* sem isso, o flex comprime as seções e o texto sobrepõe */
  min-width: 0; overflow: hidden;  /* conteúdo sem quebra (etiquetas longas) não pode esticar o cartão além da coluna */
  background: var(--surface); border: 1px solid var(--surface-border);
  border-radius: 10px; padding: 13px 15px; box-shadow: var(--surface-shadow);
}
.side-title { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .7px; color: var(--muted-fg); margin-bottom: 6px; display: flex; align-items: center; gap: 6px; }
.side-title .lucide { color: var(--muted-fg); }
.side-count { font-weight: 600; color: var(--muted-fg); background: var(--muted); border-radius: 999px; padding: 0 7px; font-size: 10px; }
/* block (não flex): linhas flex-column dentro de flex-column têm a altura
   intrínseca calculada errada no Chromium e o texto sobrepõe */
.side-rows { display: block; }
.side-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; font-size: 12.5px; min-height: 28px; }
.side-row .side-k { color: var(--muted-fg); flex-shrink: 0; }
.side-row .side-v { display: flex; align-items: center; gap: 6px; font-weight: 500; text-align: right; min-width: 0; }
.side-row .side-v .status-ic { width: 13px; height: 13px; }
.side-row .side-v .avatar { width: 17px; height: 17px; font-size: 9.5px; }
.side-row .side-v .live-dot { margin-right: 0; }
.side-row.col { flex-direction: column; align-items: stretch; gap: 3px; padding: 9px 0; border-bottom: 1px solid var(--border); min-height: 0; }
.side-row.col:last-of-type { border-bottom: none; }
.side-row.col .side-k { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; }
.side-row.col .side-v { text-align: left; font-weight: 500; line-height: 1.5; display: block; overflow-wrap: anywhere; }

/* valores especiais da seção Processo */
.side-v.side-cnj { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; color: var(--brand); font-weight: 600; }
.side-v.side-client { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; color: var(--brand); font-weight: 650; }
.side-v.side-client > .lucide { flex-shrink: 0; }
.side-polo { font-size: 10px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; padding: 1px 8px; border-radius: 999px; background: rgb(60 109 224 / .09); color: var(--brand); }
.side-fatal { margin-top: 10px; display: flex; align-items: center; gap: 11px; padding: 10px 13px; border: 1px solid rgb(209 61 61 / .3); background: rgb(209 61 61 / .06); border-radius: 10px; color: var(--destructive); }
.side-fatal > .lucide { flex-shrink: 0; }
.side-fatal .fk { display: block; font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; opacity: .8; }
.side-fatal .fv { display: block; font-weight: 700; font-size: 13.5px; margin-top: 1px; }

/* lista de arquivos da sidebar */
.side-files { display: flex; flex-direction: column; gap: 2px; }
.side-file { display: flex; align-items: center; gap: 8px; padding: 6px 8px; margin: 0 -8px; border-radius: 7px; text-decoration: none; color: var(--foreground); font-size: 12px; }
.side-file:hover { background: var(--surface-hover); }
.side-file > .lucide { color: var(--brand); }
.sf-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.sf-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.sf-dir { font-size: 10.5px; color: var(--muted-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sf-size { color: var(--muted-fg); font-size: 11px; flex-shrink: 0; }
.sf-dl { color: var(--muted-fg); display: none; align-items: center; }
.side-file:hover .sf-dl { display: inline-flex; }
.side-file:hover .sf-size { display: none; }

@media (max-width: 980px) {
  .detail-body { flex-direction: column; }
  .detail-side { width: 100%; border-left: none; border-top: 1px solid var(--border); flex-shrink: 0; max-height: 45vh; }
}

/* Transcript no padrão do agent-transcript do Multica: linhas compactas
   [badge tipo][resumo truncado][hora], expansíveis para o conteúdo bruto. */
.timeline { padding: 4px 0 12px; }
.tl-row { border-bottom: 1px solid var(--border); }
.tl-head { display: flex; align-items: flex-start; gap: 10px; padding: 8px 6px; cursor: default; }
.tl-row.expandable .tl-head { cursor: pointer; }
.tl-row.expandable .tl-head:hover { background: var(--surface-hover); }
.tl-badge { flex-shrink: 0; display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 600; padding: 2px 8px; border-radius: 999px; margin-top: 1px; min-width: 86px; justify-content: center; }
.tl-badge.tool { background: rgb(223 161 0 / .1); color: #9a7100; }
.tl-badge.think { background: rgb(140 110 220 / .1); color: #7c5fc9; }
.tl-badge.agent { background: rgb(29 155 83 / .1); color: var(--success); }
.tl-badge.user-b { background: rgb(60 109 224 / .1); color: var(--brand); }
.tl-badge.result-b { background: rgb(53 101 221 / .12); color: var(--info); }
.tl-badge.error-b { background: rgb(209 61 61 / .1); color: var(--destructive); }
.tl-badge.sys { background: var(--muted); color: var(--muted-fg); }
.tl-main { flex: 1; min-width: 0; font-size: 13px; }
.tl-summary { display: flex; align-items: baseline; gap: 6px; color: var(--foreground); }
.tl-summary .chev { color: var(--muted-fg); font-size: 10px; transition: transform .12s; display: inline-block; }
.tl-row.open .chev { transform: rotate(90deg); }
.tl-summary .s-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; min-width: 0; }
.tl-summary .s-text .mono { font-family: 'SF Mono', Consolas, monospace; font-size: 12px; color: var(--muted-fg); }
.tl-time { flex-shrink: 0; font-size: 10px; color: rgb(116 116 126 / .6); margin-top: 3px; font-variant-numeric: tabular-nums; }
.tl-expand { margin: 0 6px 10px 102px; border: 1px solid var(--surface-border); border-radius: 8px; background: var(--muted); overflow: hidden; }
.tl-expand pre { max-height: 260px; overflow: auto; padding: 10px 12px; font-size: 11px; font-family: 'SF Mono', Consolas, monospace; color: var(--muted-fg); white-space: pre-wrap; word-break: break-all; margin: 0; }
.tl-expand .lbl { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--muted-fg); padding: 8px 12px 0; }

/* blocos de texto (advogado / agente / resultado) — bolhas com markdown leve */
.tl-bubble { margin: 10px 0; border: 1px solid var(--surface-border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--surface-shadow); padding: 11px 15px; font-size: 13px; }
.tl-bubble .who { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; margin-bottom: 4px; }
.tl-bubble.b-user { background: rgb(60 109 224 / .05); border-color: rgb(60 109 224 / .18); }
.tl-bubble.b-user .who { color: var(--brand); }
.tl-bubble.b-agent .who { color: var(--success); }
.tl-bubble.b-result { border-left: 3px solid var(--info); }
.tl-bubble.b-result .who { color: var(--info); }
.tl-bubble.b-error { border-left: 3px solid var(--destructive); }
.tl-bubble.b-error .who { color: var(--destructive); }
.md p { margin: 4px 0; }
.md h1, .md h2, .md h3, .md h4 { font-size: 13px; font-weight: 600; margin: 8px 0 3px; }
.md code { background: var(--muted); border-radius: 4px; padding: 0 4px; font-family: 'SF Mono', Consolas, monospace; font-size: 12px; }
.md pre { background: var(--muted); border: 1px solid var(--surface-border); border-radius: 8px; padding: 9px 11px; overflow-x: auto; font-size: 11.5px; font-family: 'SF Mono', Consolas, monospace; margin: 6px 0; white-space: pre-wrap; }
.md pre code { background: none; padding: 0; }
.md ul { margin: 4px 0 4px 18px; }
.md li { margin: 2px 0; }

.reply-bar { display: flex; gap: 10px; padding: 12px 28px 14px; border-top: 1px solid var(--border); background: var(--page-canvas); }
.reply-bar textarea { flex: 1; background: var(--surface); border: 1px solid var(--surface-border); border-radius: var(--radius); color: var(--foreground); padding: 9px 12px; resize: vertical; font: inherit; box-shadow: var(--surface-shadow); }
.reply-bar textarea:focus { outline: none; border-color: #a1a1aa; }

/* ---------- botões / dialog ---------- */
.btn-primary { background: var(--primary); border: none; color: var(--primary-fg); font-weight: 500; padding: 7px 14px; border-radius: 8px; cursor: pointer; font-size: 13px; font-family: inherit; }
.btn-primary:hover { background: #3a3a41; }
.btn-primary:disabled { opacity: .5; cursor: default; }
.btn-ghost { background: transparent; border: 1px solid var(--surface-border); color: var(--muted-fg); padding: 6px 11px; border-radius: 8px; cursor: pointer; font-size: 13px; font-family: inherit; }
.btn-ghost:hover { color: var(--foreground); background: var(--surface-hover); }
.btn-ghost.danger:hover { color: var(--destructive); border-color: var(--destructive); }

dialog { margin: auto; background: var(--surface); color: var(--foreground); border: 1px solid var(--border); border-radius: 14px; padding: 20px; width: 540px; max-width: 92vw; box-shadow: var(--floating-shadow); }
dialog::backdrop { background: rgb(15 23 42 / .3); }
.btn-danger { background: var(--destructive); border: none; color: #fff; font-weight: 500; padding: 7px 14px; border-radius: 8px; cursor: pointer; font-size: 13px; font-family: inherit; }
.btn-danger:hover { background: #b83232; }

/* diálogo de confirmação (excluir/remover) — mesmo shell dos outros modais */
.confirm-dialog { width: 430px; }
.confirm-head { display: flex; align-items: flex-start; gap: 13px; }
.confirm-icon { width: 38px; height: 38px; border-radius: 10px; background: rgb(209 61 61 / .1); color: var(--destructive); display: grid; place-items: center; flex-shrink: 0; }
.confirm-icon.neutral { background: rgb(60 109 224 / .1); color: var(--brand); }
.confirm-body { min-width: 0; padding-top: 1px; }
.confirm-title { font-size: 14px; font-weight: 650; line-height: 1.4; overflow-wrap: anywhere; }
.confirm-msg { font-size: 12.5px; color: var(--muted-fg); margin-top: 5px; line-height: 1.55; white-space: pre-line; }
.confirm-actions { margin-top: 18px; }
.new-form { display: flex; flex-direction: column; gap: 12px; }
.new-form h3 { font-size: 14px; font-weight: 600; }
.new-form label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--muted-fg); font-weight: 500; }
.new-form input, .new-form textarea { background: var(--surface); border: 1px solid var(--surface-border); border-radius: 8px; color: var(--foreground); padding: 8px 11px; font: inherit; }
.new-form .opt { font-weight: 400; font-size: 11px; color: var(--muted-fg); }
.new-form input:focus, .new-form textarea:focus { outline: none; border-color: #a1a1aa; }
.form-actions { display: flex; justify-content: flex-end; gap: 8px; }
.row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.new-form select { background: var(--surface); border: 1px solid var(--surface-border); border-radius: 8px; color: var(--foreground); padding: 8px 9px; font: inherit; }
.new-form select:focus { outline: none; border-color: #a1a1aa; }
.model-chip { font-size: 11px; padding: 2px 9px; border-radius: 999px; background: var(--muted); color: var(--muted-fg); white-space: nowrap; font-weight: 500; }
.check-label { flex-direction: row !important; align-items: center; gap: 8px !important; }

/* ---------- páginas Skills / Advogados / Processos ---------- */
.page { flex: 1; overflow-y: auto; padding: 26px 32px; }
.page-title { font-size: 16px; font-weight: 600; }
.page-sub { font-size: 12.5px; color: var(--muted-fg); margin: 4px 0 18px; }
.page-sub code { background: var(--muted); padding: 1px 5px; border-radius: 5px; font-size: 11.5px; }

/* Área de trabalho do servidor: o quadro ocupa o que sobra da página, e o
   noVNC escala a tela remota dentro dele (resize=scale). */
.vnc-frame { height: calc(100vh - 190px); min-height: 380px; background: var(--surface); border: 0.5px solid var(--surface-border); border-radius: var(--radius); box-shadow: var(--surface-shadow); overflow: hidden; }
.vnc-frame iframe { width: 100%; height: 100%; border: none; display: block; }

.skills-grid { display: flex; flex-direction: column; gap: 10px; }
.skill-card { background: var(--surface); border: 0.5px solid var(--surface-border); border-radius: var(--radius); box-shadow: var(--surface-shadow); padding: 14px 16px; }
.skill-head { display: flex; align-items: center; gap: 10px; }
.skill-icon { width: 30px; height: 30px; border-radius: 8px; background: rgb(60 109 224 / .1); color: var(--brand); display: grid; place-items: center; font-size: 15px; flex-shrink: 0; }
.skill-name { font-weight: 600; font-size: 13.5px; }
.skill-files { font-size: 11.5px; color: var(--muted-fg); }
.skill-desc { margin-top: 8px; font-size: 12.5px; color: var(--muted-fg); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.skill-desc.open { -webkit-line-clamp: unset; }
.skill-actions { margin-top: 10px; display: flex; gap: 8px; }

.skill-card.clickable { cursor: pointer; transition: border-color .12s; }
.skill-card.clickable:hover { border-color: rgb(24 24 27 / .18); }

/* ---------- detalhe da skill: rail de skills + árvore de arquivos + viewer/editor ---------- */
.skill-page { flex: 1; display: flex; overflow: hidden; }

/* rail esquerdo com todas as skills */
.sk-rail { width: 236px; flex-shrink: 0; border-right: 1px solid var(--border); background: var(--surface); display: flex; flex-direction: column; overflow: hidden; }
.sk-rail-head { padding: 13px 16px 11px; font-weight: 650; font-size: 13px; display: flex; align-items: center; gap: 7px; cursor: pointer; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.sk-rail-head:hover { background: var(--surface-hover); }
.sk-rail-head .lucide { color: var(--muted-fg); }
.sk-rail-list { flex: 1; overflow-y: auto; }
.sk-rail-item { display: flex; gap: 10px; padding: 11px 14px; cursor: pointer; border-bottom: 1px solid var(--border); align-items: flex-start; }
.sk-rail-item:hover { background: var(--surface-hover); }
.sk-rail-item.active { background: var(--muted); }
.sk-rail-ic { width: 26px; height: 26px; border-radius: 7px; background: var(--muted); color: var(--muted-fg); display: grid; place-items: center; flex-shrink: 0; }
.sk-rail-item.active .sk-rail-ic { background: rgb(60 109 224 / .1); color: var(--brand); }
.sk-rail-txt { min-width: 0; }
.sk-rail-txt .n { font-weight: 600; font-size: 12.5px; line-height: 1.35; }
.sk-rail-txt .d { font-size: 11px; color: var(--muted-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 1px; }

/* área principal: barra de título + (files | conteúdo) */
.sk-main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.sk-title-bar { display: flex; align-items: center; gap: 12px; padding: 9px 18px; border-bottom: 1px solid var(--border); background: var(--surface); flex-shrink: 0; }
.sk-title-name { font-weight: 650; font-size: 14px; display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.sk-title-name .lucide { color: var(--brand); }
.sk-title-desc { flex: 1; min-width: 0; font-size: 12.5px; color: var(--muted-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sk-main-body { flex: 1; display: flex; min-height: 0; }

/* coluna FILES (árvore) */
.sk-files-col { width: 280px; flex-shrink: 0; border-right: 1px solid var(--border); background: var(--surface); overflow-y: auto; padding: 0 8px 16px; }
.sk-files-head { font-size: 10.5px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; color: var(--muted-fg); padding: 13px 10px 9px; border-bottom: 1px solid var(--border); margin-bottom: 6px; position: sticky; top: 0; background: var(--surface); }
.sk-folder-row { display: flex; align-items: center; gap: 7px; padding: 6px 10px; border-radius: 7px; cursor: pointer; font-size: 12.5px; font-weight: 500; }
.sk-folder-row:hover { background: var(--surface-hover); }
.sk-folder-row .chev { display: inline-flex; color: var(--muted-fg); transition: transform .12s; }
.sk-folder-row.open .chev { transform: rotate(90deg); }
.sk-folder-row .lucide { color: var(--muted-fg); flex-shrink: 0; }
.sk-file-row { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 7px; cursor: pointer; font-size: 12.5px; color: var(--foreground); }
.sk-file-row.child { margin-left: 18px; }
.sk-file-row:hover { background: var(--surface-hover); }
.sk-file-row.active { background: rgb(60 109 224 / .09); color: var(--brand); font-weight: 600; }
.sk-file-row .lucide { color: var(--muted-fg); flex-shrink: 0; }
.sk-file-row.active .lucide { color: var(--brand); }
.sk-etapa-num { width: 24px; height: 20px; border-radius: 6px; background: rgb(60 109 224 / .09); color: var(--brand); font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; font-variant-numeric: tabular-nums; }
.sk-file-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sk-file-size { font-size: 10.5px; color: var(--muted-fg); flex-shrink: 0; font-variant-numeric: tabular-nums; }

/* conteúdo / editor */
.sk-content { flex: 1; min-width: 0; display: flex; flex-direction: column; background: var(--page-canvas); }
.sk-content-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 16px; border-bottom: 1px solid var(--border); background: var(--page-canvas); flex-shrink: 0; min-height: 46px; }
.sk-file-name { font-size: 13px; font-weight: 650; display: flex; align-items: center; gap: 8px; min-width: 0; overflow: hidden; }
.sk-file-path { font-weight: 400; font-size: 11px; color: var(--muted-fg); font-family: 'SF Mono', Consolas, monospace; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sk-content-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.sk-content-actions .btn-ghost { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }
.sk-edit-note { font-size: 11px; color: var(--muted-fg); }
.sk-view { flex: 1; overflow-y: auto; padding: 18px 26px 30px; font-size: 13px; max-width: 980px; }
.sk-fm-table { display: grid; grid-template-columns: 110px 1fr; gap: 7px 16px; border: 1px solid var(--surface-border); background: var(--surface); border-radius: 10px; padding: 14px 18px; margin-bottom: 18px; font-size: 12.5px; box-shadow: var(--surface-shadow); }
.sk-fm-table .fk { color: var(--muted-fg); font-family: 'SF Mono', Consolas, monospace; font-size: 11.5px; padding-top: 1px; }
.sk-fm-table .fv { min-width: 0; overflow-wrap: anywhere; line-height: 1.55; }
.sk-raw { font-size: 12px; font-family: 'SF Mono', Consolas, monospace; white-space: pre-wrap; word-break: break-word; color: var(--foreground); }
.sk-editor { flex: 1; border: none; outline: none; resize: none; padding: 16px 22px; font-size: 12.5px; font-family: 'SF Mono', Consolas, monospace; line-height: 1.6; color: var(--foreground); background: var(--surface); }

.lawyer-add { display: flex; gap: 8px; margin-bottom: 14px; }
.lawyer-add input { flex: 1; background: var(--surface); border: 1px solid var(--surface-border); border-radius: 8px; padding: 8px 11px; font: inherit; }
.lawyer-add input:focus { outline: none; border-color: #a1a1aa; }
.lawyers-table { background: var(--surface); border: 0.5px solid var(--surface-border); border-radius: var(--radius); box-shadow: var(--surface-shadow); overflow: hidden; }
.lawyer-row { display: flex; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--border); }
.lawyer-row:last-child { border-bottom: none; }
.lawyer-row .avatar { background: var(--primary); width: 26px; height: 26px; font-size: 12px; }
.lawyer-name { font-weight: 500; flex: 1; }
.lawyer-oab { color: var(--muted-fg); font-size: 12px; }
.lawyer-del { border: none; background: transparent; color: var(--muted-fg); cursor: pointer; font-size: 14px; padding: 4px 8px; border-radius: 6px; }
.lawyer-del:hover { color: var(--destructive); background: rgb(209 61 61 / .08); }

/* ---------- meta do processo no detalhe ---------- */
.meta-panel { margin: 12px 18px 0; display: flex; flex-wrap: wrap; gap: 6px; }
.meta-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; padding: 3px 10px; border-radius: 999px; background: var(--surface); border: 1px solid var(--surface-border); box-shadow: var(--surface-shadow); }
.meta-chip .k { color: var(--muted-fg); font-size: 11px; }
.meta-chip.danger { border-color: rgb(209 61 61 / .35); color: var(--destructive); font-weight: 600; }

/* ---------- página Processos (ficha estilo LegalScript, tema Multica) ---------- */
.page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.view-toggle { display: inline-flex; border: 1px solid var(--surface-border); border-radius: 8px; overflow: hidden; background: var(--surface); flex-shrink: 0; }
.vt-btn { border: none; background: transparent; padding: 6px 14px; font: inherit; font-size: 12px; font-weight: 600; color: var(--muted-fg); cursor: pointer; text-transform: uppercase; letter-spacing: .4px; }
.vt-btn.active { background: var(--primary); color: var(--primary-fg); }

.proc-list { display: flex; flex-direction: column; gap: 14px; }
.proc-card { background: var(--surface); border: 0.5px solid var(--surface-border); border-radius: var(--radius); box-shadow: var(--surface-shadow); padding: 20px 24px; cursor: pointer; transition: border-color .12s; }
.proc-card:hover { border-color: rgb(24 24 27 / .18); }
.pc-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.pc-cnj { font-size: 17px; font-weight: 650; letter-spacing: .2px; }
.pc-tipo { font-size: 13px; color: var(--muted-fg); margin-top: 2px; }
.pc-status { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

.pc-cnj { color: var(--brand); display: flex; align-items: center; gap: 7px; }
.pc-copy { border: none; background: transparent; color: var(--muted-fg); cursor: pointer; padding: 3px; border-radius: 6px; display: inline-flex; align-items: center; }
.pc-copy:hover { background: var(--muted); color: var(--foreground); }
.pc-party { margin-top: 5px; font-size: 14px; font-weight: 500; display: flex; align-items: center; gap: 7px; }
.pc-party.is-client { color: var(--brand); font-weight: 650; }
.pc-party.na { color: var(--muted-fg); font-weight: 400; }
.pc-row3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 8px 22px; padding: 12px 0; }
.pc-row4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px 22px; padding: 12px 0 2px; border-top: 1px solid var(--border); }

.pc-polos { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 16px 0 14px; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
.pc-polo-label { font-size: 10.5px; font-weight: 700; letter-spacing: .7px; color: var(--muted-fg); display: flex; align-items: center; gap: 8px; }
.pc-cli-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 700; letter-spacing: .5px; padding: 1px 8px; border-radius: 999px; background: rgb(223 161 0 / .13); color: #9a7100; }
.pc-polo-name { margin-top: 6px; font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 7px; }
.pc-polo-name .lucide { color: var(--muted-fg); }

.pc-info { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px 22px; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
.pc-kv { font-size: 12.5px; color: var(--muted-fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pc-kv b { color: var(--foreground); font-weight: 600; margin-left: 4px; }
.pc-kv b.na { color: var(--muted-fg); font-weight: 400; }

.pc-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 13px; }
.pc-foot-left { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pc-open { display: inline-flex; align-items: center; gap: 5px; }
.pc-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.pc-actions .btn-ghost { padding: 6px 8px; display: inline-flex; align-items: center; }
.page-head-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.topbar-right { display: flex; align-items: center; gap: 8px; }
.topbar-right .btn-ghost, #proc-archived { display: inline-flex; align-items: center; gap: 6px; }
#btn-show-archived.active, #proc-archived.active { color: var(--foreground); background: var(--surface-hover); border-color: #c9c9ce; }
.proc-table .t-actions { text-align: right; }
.proc-table .t-actions .ca-btn { visibility: hidden; }
.proc-table tbody tr:hover .t-actions .ca-btn { visibility: visible; }

/* modo tabela (estilo Asana/Linear) */
.proc-table-wrap { background: var(--surface); border: 0.5px solid var(--surface-border); border-radius: var(--radius); box-shadow: var(--surface-shadow); overflow-x: auto; }
.proc-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.proc-table th { text-align: left; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; color: var(--muted-fg); padding: 11px 16px; border-bottom: 1px solid var(--surface-border); white-space: nowrap; }
.proc-table td { padding: 12px 16px; border-bottom: 1px solid var(--border); white-space: nowrap; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.proc-table tr:last-child td { border-bottom: none; }
.proc-table tbody tr { cursor: pointer; }
.proc-table tbody tr:hover { background: var(--surface-hover); }
.proc-table .t-cnj { font-weight: 600; }
.proc-table .t-sub { font-size: 11.5px; color: var(--muted-fg); font-weight: 400; }

/* ---------- detalhe do processo ---------- */
.pd-header { display: flex; align-items: center; gap: 14px; margin-bottom: 6px; }
.pd-title-wrap { flex: 1; min-width: 0; }
.pd-cnj { font-size: 19px; font-weight: 650; letter-spacing: .2px; display: flex; align-items: center; gap: 9px; color: var(--brand); }
.pd-cnj .lucide { color: var(--brand); }
.pd-sub { font-size: 13px; color: var(--muted-fg); margin-top: 3px; }
.pd-grid { display: block; margin: 18px 0 26px; }
.pd-ficha { cursor: default; }
.pd-ficha:hover { border-color: var(--surface-border); }
.pd-ficha .pc-polos { grid-template-columns: 1fr 1fr; }
.pd-ficha .pc-polo-name { font-size: 15px; }
.pd-cnj .pill { font-size: 11px; }
.pd-section { display: flex; align-items: center; justify-content: space-between; margin: 6px 0 12px; }
.pd-section h3 { font-size: 14px; font-weight: 600; }
.pd-tasks { display: flex; flex-direction: column; gap: 10px; }
.pd-task { background: var(--surface); border: 0.5px solid var(--surface-border); border-radius: var(--radius); box-shadow: var(--surface-shadow); padding: 14px 18px; display: flex; align-items: center; gap: 14px; cursor: pointer; transition: border-color .12s; }
.pd-task:hover { border-color: rgb(24 24 27 / .18); }
.pd-task .pt-main { flex: 1; min-width: 0; }
.pd-task .pt-title { font-weight: 600; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-task .pt-sub { font-size: 12px; color: var(--muted-fg); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-task .pt-side { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

/* ---------- seções inteligentes do processo (referência: LegalEaseOS) ---------- */
.pd-sections { display: flex; flex-direction: column; gap: 14px; margin-bottom: 26px; }
.sec-card { background: var(--surface); border: 0.5px solid var(--surface-border); border-radius: var(--radius); box-shadow: var(--surface-shadow); padding: 16px 22px; }
.sec-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
.sec-title { font-size: 14.5px; font-weight: 650; display: flex; align-items: center; gap: 8px; }
.sec-title .lucide { color: var(--brand); }
.sec-actions { display: flex; align-items: center; gap: 10px; }
.sec-when { font-size: 11.5px; color: var(--muted-fg); }
.sec-gen { display: inline-flex; align-items: center; gap: 6px; }
.sec-error { margin: 8px 0; padding: 8px 12px; border: 1px solid rgb(209 61 61 / .3); border-radius: 8px; background: rgb(209 61 61 / .05); color: var(--destructive); font-size: 12.5px; }
.sec-body { margin-top: 8px; }
.sec-empty { font-size: 12.5px; color: var(--muted-fg); padding: 10px 0; }
.sec-obs { font-size: 12px; color: var(--muted-fg); margin-top: 10px; }
.pd-ficha { margin-bottom: 0; }

/* advogados dos polos */
.pc-advs { margin-top: 6px; display: flex; flex-direction: column; gap: 3px; font-size: 11.5px; color: var(--muted-fg); }
.pc-advs .lucide { vertical-align: -2px; margin-right: 4px; }

/* viewer das etapas gravadas (checkpoints outputs/*.md) — estilo "histórico de execução" */
.etapas-panel { margin: 18px 0 0; border: 0.5px solid var(--surface-border); border-radius: 12px; background: var(--surface); box-shadow: var(--surface-shadow); overflow: hidden; }
.ep-title { padding: 11px 16px; font-size: 12.5px; font-weight: 650; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 7px; background: var(--page-canvas); }
.ep-title .lucide { color: var(--brand); }
.ep-hint { font-weight: 400; font-size: 11px; color: var(--muted-fg); }
.ep-row { border-bottom: 1px solid var(--border); }
.ep-row:last-child { border-bottom: none; }
.ep-head { display: flex; align-items: center; gap: 9px; padding: 9px 16px; cursor: pointer; font-size: 12.5px; }
.ep-head:hover { background: var(--surface-hover); }
.ep-head .chev { color: var(--muted-fg); display: inline-flex; transition: transform .12s; }
.ep-row.open .ep-head .chev { transform: rotate(90deg); }
.ep-check { color: var(--success); }
.ep-name { font-weight: 600; flex: 1; text-transform: capitalize; }
.ep-size { font-size: 11px; color: var(--muted-fg); font-variant-numeric: tabular-nums; }
.ep-body { padding: 4px 18px 14px 52px; max-height: 480px; overflow-y: auto; font-size: 13px; border-top: 1px dashed var(--border); background: var(--page-canvas); }

/* timeline de andamentos */
.tml { display: flex; flex-direction: column; }
.tml-ev { display: flex; gap: 14px; }
.tml-rail { display: flex; flex-direction: column; align-items: center; width: 36px; flex-shrink: 0; }
.tml-dot { width: 34px; height: 34px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: var(--muted); color: var(--muted-fg); flex-shrink: 0; }
.tml-dot.t-distribuicao { background: rgb(60 109 224 / .12); color: var(--brand); }
.tml-dot.t-decisao, .tml-dot.t-despacho, .tml-dot.t-sentenca { background: rgb(223 161 0 / .14); color: #9a7100; }
.tml-dot.t-audiencia { background: rgb(29 155 83 / .12); color: var(--success); }
.tml-dot.t-recurso, .tml-dot.t-execucao { background: rgb(209 61 61 / .1); color: var(--destructive); }
.tml-line { flex: 1; width: 2px; background: var(--border); margin: 4px 0; min-height: 14px; }
.tml-body { flex: 1; min-width: 0; padding: 6px 0 18px; }
.tml-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tml-title { font-weight: 650; font-size: 13.5px; }
.tml-date { font-size: 12px; color: var(--muted-fg); }
.tml-desc { font-size: 12.5px; color: var(--muted-fg); margin-top: 4px; line-height: 1.5; text-align: justify; max-width: 900px; }

/* despesas processuais */
.dsp-totals { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin: 6px 0 14px; }
.dsp-total { border: 1px solid var(--surface-border); border-radius: 10px; padding: 12px 16px; }
.dsp-total .k { font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--muted-fg); display: flex; align-items: center; gap: 5px; }
.dsp-total .v { font-size: 17px; font-weight: 650; margin-top: 4px; }
.dsp-total.ok .v { color: var(--success); }
.dsp-total.bad .v { color: var(--destructive); }
.dsp-total.brand .v { color: var(--brand); }
.dsp-list { display: flex; flex-direction: column; gap: 8px; }
.dsp-guia { display: flex; align-items: center; gap: 14px; border: 1px solid var(--border); border-left: 3px solid var(--brand); border-radius: 8px; padding: 10px 14px; }
.dsp-main { flex: 1; min-width: 0; }
.dsp-tipo { font-weight: 600; font-size: 13px; display: flex; align-items: center; gap: 8px; }
.dsp-pagador { font-size: 10px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; padding: 1px 8px; border-radius: 999px; background: var(--muted); color: var(--muted-fg); }
.dsp-pagador.ok { background: rgb(29 155 83 / .12); color: var(--success); }
.dsp-pagador.bad { background: rgb(209 61 61 / .1); color: var(--destructive); }
.dsp-desc { font-size: 12.5px; color: var(--muted-fg); margin-top: 2px; }
.dsp-meta { font-size: 11.5px; color: var(--muted-fg); margin-top: 2px; }
.dsp-valor { font-weight: 650; font-size: 14px; white-space: nowrap; }

/* valores */
.val-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.val-box { border: 1px solid var(--surface-border); border-radius: 10px; padding: 12px 16px; }
.val-box .k { font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--muted-fg); }
.val-box .v { font-size: 17px; font-weight: 650; margin-top: 4px; }
.val-box .s { font-size: 11.5px; color: var(--muted-fg); margin-top: 3px; }
.val-box.brand .v { color: var(--brand); }
.val-box.ok .v { color: var(--success); }

/* ---------- ícones lucide ---------- */
.lucide { vertical-align: -2px; flex-shrink: 0; }
.nav-item .lucide { vertical-align: -3px; }
.tl-badge .lucide { vertical-align: -2px; }
.tl-bubble .who .lucide { vertical-align: -2px; margin-right: 2px; }
.chip .lucide { vertical-align: -2px; }
.question-banner .lucide { vertical-align: -2.5px; margin-right: 4px; }
.col-add .lucide { vertical-align: middle; }
.skill-icon .lucide { vertical-align: middle; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: rgb(0 0 0 / .1); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: rgb(0 0 0 / .18); }

/* ---------- Agenda de prazos ---------- */
.cal-nav { display: flex; align-items: center; gap: 8px; }
.cal-month { min-width: 140px; text-align: center; font-weight: 600; font-size: 14px; }
.cal-grid {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1px;
  background: var(--surface-border); border: 1px solid var(--surface-border);
  border-radius: var(--radius); overflow: hidden; margin-bottom: 24px;
}
.cal-wday {
  background: var(--muted); color: var(--muted-fg); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em; padding: 6px 8px;
}
.cal-day { background: var(--surface); min-height: 96px; padding: 7px; min-width: 0; }
.cal-day.other { background: var(--page-canvas); }
.cal-day.today { box-shadow: inset 3px 0 0 var(--brand); background: rgb(60 109 224 / .03); }
.cal-day-num { font-size: 12px; color: var(--muted-fg); margin-bottom: 5px; display: flex; align-items: center; gap: 6px; }
.cal-day.today .cal-day-num { color: var(--brand); font-weight: 700; }
.cal-today-tag {
  font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  background: var(--brand); color: #fff; border-radius: 999px; padding: 1px 7px;
}
.cal-chip {
  display: flex; align-items: center; gap: 5px; max-width: 100%;
  font-size: 11px; font-weight: 500; line-height: 1.35; padding: 3px 7px;
  border-radius: 6px; margin-bottom: 3px; cursor: pointer;
  border-left: 3px solid transparent; transition: filter .1s;
}
.cal-chip-kind { font-size: 9px; font-weight: 800; letter-spacing: .05em; flex-shrink: 0; opacity: .85; }
.cal-chip-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-chip.fatal { background: rgb(209 61 61 / .08); color: #b03030; border-left-color: var(--destructive); }
.cal-chip.rec { background: rgb(223 161 0 / .1); color: #8a6400; border-left-color: var(--warning); }
.cal-chip.done { opacity: .45; text-decoration: line-through; }
.cal-chip.static { cursor: default; white-space: nowrap; display: inline-flex; font-size: 10px; font-weight: 700; letter-spacing: .05em; padding: 2px 8px; border-radius: 999px; border-left: none; }
.cal-chip:not(.static):hover { filter: brightness(.93); }

/* selo de urgência (cor pela proximidade, não pelo tipo) */
.due-badge {
  display: inline-flex; align-items: center; font-size: 11px; font-weight: 600;
  padding: 2px 9px; border-radius: 999px; white-space: nowrap;
}
.due-badge.over { background: var(--destructive); color: #fff; }
.due-badge.crit { background: rgb(209 61 61 / .1); color: var(--destructive); }
.due-badge.warn { background: rgb(223 161 0 / .12); color: #8a6400; }
.due-badge.calm { background: rgb(118 118 128 / .1); color: var(--muted-fg); }
.due-badge.ok { background: rgb(29 155 83 / .12); color: var(--success); }

.cal-upcoming-title { font-size: 15px; margin: 0 0 10px; display: flex; align-items: center; gap: 6px; }
.cal-upcoming { display: flex; flex-direction: column; gap: 6px; }
.cal-up-row {
  display: flex; align-items: center; gap: 12px; background: var(--surface);
  border: 1px solid var(--surface-border); border-radius: var(--radius);
  padding: 10px 14px; box-shadow: var(--surface-shadow); cursor: pointer;
  transition: border-color .12s, background .12s;
}
.cal-up-row:hover { border-color: rgb(24 24 27 / .15); background: var(--surface-hover); }
.cal-up-when { display: flex; flex-direction: column; align-items: center; min-width: 52px; flex-shrink: 0; }
.cal-up-date { font-weight: 700; font-size: 14px; line-height: 1.2; }
.cal-up-wd { font-size: 10.5px; color: var(--muted-fg); text-transform: capitalize; }
.cal-up-main { flex: 1; min-width: 0; }
.cal-up-title { font-size: 13px; font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-up-sub { font-size: 11.5px; color: var(--muted-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 1px; }
.cal-up-open { flex-shrink: 0; }
.cal-empty { color: var(--muted-fg); font-size: 13px; padding: 14px; }

/* ---------- modal do prazo ---------- */
.deadline-dialog { max-width: 520px; width: min(520px, 92vw); padding: 0; overflow: hidden; }
.dl-band { height: 4px; background: var(--warning); }
.deadline-dialog.is-fatal .dl-band { background: var(--destructive); }
.dl-body { padding: 20px 22px; }
.dl-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.dl-kind { font-size: 10px; font-weight: 800; letter-spacing: .07em; padding: 3px 10px; border-radius: 999px; }
.dl-kind.fatal { background: rgb(209 61 61 / .1); color: var(--destructive); }
.dl-kind.rec { background: rgb(223 161 0 / .12); color: #8a6400; }
.dl-date-big { font-size: 17px; font-weight: 700; letter-spacing: -.2px; }
.dl-date-big::first-letter { text-transform: uppercase; }
.dl-title { margin: 10px 0 2px; font-size: 14.5px; font-weight: 600; line-height: 1.45; }
.dl-partes { color: var(--muted-fg); font-size: 12.5px; line-height: 1.5; }
.dl-warn {
  display: flex; align-items: center; gap: 7px; margin-top: 10px;
  background: rgb(223 161 0 / .08); border: 1px solid rgb(223 161 0 / .3);
  color: #8a6400; border-radius: 8px; padding: 7px 11px; font-size: 12px;
}
.dl-fields { margin-top: 14px; border-top: 1px solid var(--border); }
.dl-field { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 8px 0; border-bottom: 1px solid var(--border); font-size: 12.5px; }
.dl-field .dl-k { color: var(--muted-fg); flex-shrink: 0; }
.dl-field .dl-v { font-weight: 550; text-align: right; min-width: 0; overflow-wrap: anywhere; }
.dl-cnj { color: var(--brand); font-weight: 650; display: inline-flex; align-items: center; gap: 2px; }
.dl-actions { margin-top: 16px; display: flex; align-items: center; }
.dl-actions-spacer { flex: 1; }

/* ---------- Publicações (autopilot) ---------- */
.pub-list { display: flex; flex-direction: column; gap: 8px; }
.pub-row {
  background: var(--surface);
  border: 1px solid var(--surface-border); border-radius: var(--radius);
  box-shadow: var(--surface-shadow); overflow: hidden;
}
.pub-row.discarded { opacity: .55; }
.pub-head { display: flex; gap: 14px; align-items: flex-start; padding: 12px 14px; cursor: pointer; }
.pub-head:hover { background: var(--surface-hover); }
.pub-main { flex: 1; min-width: 0; }
.pub-top { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.pub-date { font-weight: 600; font-size: 13px; }
.pub-tipo { font-size: 11px; font-weight: 600; padding: 1px 9px; border-radius: 999px; background: rgb(60 109 224 / .09); color: var(--brand); }
.pub-diario { color: var(--muted-fg); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pub-cnj { font-size: 13.5px; font-weight: 600; color: var(--brand); margin-bottom: 4px; display: flex; align-items: center; gap: 2px; flex-wrap: wrap; }
.pub-cliente { color: var(--foreground); font-weight: 500; }
.pub-excerpt { color: var(--muted-fg); font-size: 12.5px; line-height: 1.45; }
.pub-actions { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
.pub-chev .lucide { color: var(--muted-fg); }
.side-polo { white-space: nowrap; }
.side-polo-extra { display: block; margin-top: 3px; font-size: 11.5px; color: var(--muted-fg); font-weight: 400; line-height: 1.45; }

/* expansão inline do card (referência LegalEaseOS) */
.pub-expand { border-top: 1px solid var(--border); padding: 14px; background: var(--page-canvas); }
.pubd-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px 18px; margin-bottom: 14px; }
.pubd-field { min-width: 0; }
.pubd-k { display: block; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; color: var(--muted-fg); margin-bottom: 2px; }
.pubd-v { font-size: 13px; font-weight: 500; line-height: 1.45; overflow-wrap: anywhere; }
.pubd-texto-head { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .7px; color: var(--muted-fg); margin-bottom: 6px; }
.pubd-texto {
  border: 1px solid var(--surface-border); border-radius: 8px; padding: 12px 14px;
  background: var(--surface); font-size: 13px; line-height: 1.6; white-space: pre-wrap;
  max-height: 320px; overflow: auto; overflow-wrap: anywhere;
}

/* cartão-resumo da análise dentro da publicação expandida */
.pubd-resumo {
  border: 1px solid rgb(60 109 224 / .25); background: rgb(60 109 224 / .04);
  border-radius: 10px; padding: 12px 14px; margin-bottom: 14px;
  font-size: 13px; line-height: 1.55;
}
.pubd-resumo-head {
  display: flex; align-items: center; gap: 6px; font-size: 10.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .7px; color: var(--brand); margin-bottom: 8px;
}
.pubd-resumo .md { max-height: 340px; overflow-y: auto; }

/* ---------- DJEN (coleta paralela em teste) ---------- */
.nav-tag, .page-tag {
  font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px;
  padding: 1px 6px; border-radius: 999px; background: rgb(223 161 0 / .15); color: var(--warning);
  vertical-align: middle;
}
.page-tag { margin-left: 6px; }
.djen-controls { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.djen-date { display: flex; align-items: center; gap: 5px; font-size: 12px; color: var(--muted-fg); }
.djen-date input {
  font: inherit; font-size: 12.5px; color: var(--foreground); padding: 6px 8px;
  border: 1px solid var(--surface-border); border-radius: 8px; background: var(--surface);
}
.djen-scoreboard { margin-bottom: 18px; }
.djen-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; }
.djen-tile {
  background: var(--surface); border: 1px solid var(--surface-border); border-radius: var(--radius);
  box-shadow: var(--surface-shadow); padding: 12px 14px;
}
.djen-tile-v { font-size: 22px; font-weight: 650; line-height: 1.1; }
.djen-tile-k { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--muted-fg); margin-top: 3px; }
.djen-tile.ok .djen-tile-v { color: var(--success); }
.djen-tile.warn { border-color: rgb(223 161 0 / .35); }
.djen-tile.warn .djen-tile-v { color: var(--warning); }
.djen-tile.bad { border-color: rgb(209 61 61 / .35); }
.djen-tile.bad .djen-tile-v { color: var(--destructive); }
.djen-meta { margin-top: 10px; font-size: 12px; color: var(--muted-fg); line-height: 1.6; }
.djen-hint { font-size: 11.5px; font-weight: 400; color: var(--muted-fg); text-transform: none; letter-spacing: 0; }
.djen-warn { margin-top: 6px; font-size: 11.5px; font-weight: 600; color: var(--warning); }
.djen-note {
  margin-top: 10px; padding: 9px 12px; border-radius: 9px; font-size: 12.5px; line-height: 1.5;
  border: 1px solid rgb(223 161 0 / .3); background: rgb(223 161 0 / .07);
}

/* ---------- autenticação e usuários ---------- */
.auth-screen {
  position: fixed; inset: 0; z-index: 100; display: grid; place-items: center;
  background: var(--app-shell);
}
.auth-card {
  width: min(380px, 92vw); background: var(--surface); border: 1px solid var(--surface-border);
  border-radius: 14px; padding: 28px 26px; box-shadow: var(--floating-shadow);
  display: flex; flex-direction: column; gap: 12px;
}
.auth-logo { margin-bottom: 6px; }
.auth-card h3 { font-size: 18px; }
.auth-sub { color: var(--muted-fg); font-size: 12.5px; margin-top: -6px; }
.auth-card label { font-size: 12px; font-weight: 600; color: var(--muted-fg); display: flex; flex-direction: column; gap: 4px; }
.auth-card input {
  font: inherit; font-weight: 400; color: var(--foreground); padding: 8px 10px;
  border: 1px solid var(--surface-border); border-radius: 8px; background: var(--surface);
}
.auth-card input:focus { outline: 2px solid rgb(60 109 224 / .35); border-color: var(--brand); }
.auth-err { background: rgb(209 61 61 / .08); color: var(--destructive); border-radius: 8px; padding: 8px 10px; font-size: 12.5px; }
.auth-card .btn-primary { margin-top: 4px; padding: 9px; }

.user-box {
  display: flex; align-items: center; gap: 8px; padding: 8px 6px; margin-top: auto;
  border-top: 1px solid var(--surface-border);
}
.user-box .avatar { width: 24px; height: 24px; font-size: 11px; }
.user-box-main { flex: 1; min-width: 0; }
.user-box-name { font-size: 12px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-box-role { font-size: 10.5px; color: var(--muted-fg); }
.user-box + .sidebar-footer { margin-top: 4px; }
.user-box .btn-ghost { padding: 3px 7px; }

.user-add { flex-wrap: wrap; }
.user-add select { font: inherit; padding: 7px 9px; border: 1px solid var(--surface-border); border-radius: 8px; background: var(--surface); }
.user-row .user-role-sel { font: inherit; font-size: 12px; padding: 4px 6px; border: 1px solid var(--surface-border); border-radius: 7px; background: var(--surface); }
.user-self { color: var(--muted-fg); font-weight: 400; font-size: 11px; }
.user-row .user-pass { font-size: 11.5px; }
.user-row .lawyer-del[disabled] { opacity: .3; cursor: default; }

/* editor de permissões por usuário */
.users-list { display: flex; flex-direction: column; gap: 8px; }
.user-card { background: var(--surface); border: 1px solid var(--surface-border); border-radius: var(--radius); box-shadow: var(--surface-shadow); overflow: hidden; }
.user-card-head { display: flex; align-items: center; gap: 12px; padding: 10px 14px; }
.user-card-head .lawyer-name { font-weight: 600; }
.user-card-head .lawyer-oab { color: var(--muted-fg); font-size: 12px; flex: 1; }
.user-perm-count { font-size: 11.5px; color: var(--muted-fg); white-space: nowrap; }
.user-perms { border-top: 1px solid var(--border); padding: 12px 14px; background: var(--page-canvas); }
.user-presets { font-size: 12px; color: var(--muted-fg); display: flex; align-items: center; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
.user-perm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 6px 18px; }
.user-perm-item { display: flex; align-items: center; gap: 8px; font-size: 12.5px; cursor: pointer; padding: 3px 0; }
.user-perm-item input { accent-color: var(--brand); }
.user-perms-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
.user-perms-hint { font-size: 11.5px; color: var(--muted-fg); }
.user-perms-btn[disabled] { opacity: .45; cursor: default; }

/* aviso de identificação na ficha lateral do processo */
.side-warn {
  display: flex; gap: 7px; align-items: flex-start; margin-top: 7px;
  background: rgb(223 161 0 / .08); border: 1px solid rgb(223 161 0 / .3);
  color: #8a6400; border-radius: 7px; padding: 7px 9px;
  font-size: 11px; line-height: 1.45; font-weight: 500;
}
.side-warn .lucide { flex-shrink: 0; margin-top: 1px; }

/* papéis processuais do cliente como etiquetas de contorno (sem fundo) */
.side-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.side-tag {
  border: 1px solid var(--surface-border); background: var(--surface);
  color: var(--muted-fg); border-radius: 999px; padding: 1px 9px;
  font-size: 10.5px; font-weight: 500; line-height: 1.6; max-width: 100%;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* reforço do opt-out de tema escuro automático (Chrome Auto Dark Mode) */
:root { color-scheme: only light; }

/* ---------- ficha do processo (redesenho: placa CNJ, partes, azulejos) ---------- */
.pcv-cnj {
  display: flex; align-items: center; gap: 4px;
  background: rgb(60 109 224 / .07); border: 1px solid rgb(60 109 224 / .2);
  border-radius: 8px; padding: 8px 11px;
}
.pcv-num { color: var(--brand); font-weight: 700; font-size: 13px; letter-spacing: .01em; overflow-wrap: anywhere; }
.pcv-trib { color: var(--muted-fg); font-size: 11.5px; line-height: 1.45; margin: 6px 2px 0; }
.pcv-parties { margin-top: 13px; }
.pcv-party { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 550; line-height: 1.45; flex-wrap: wrap; }
.pcv-party > .lucide { flex-shrink: 0; }
.pcv-party.is-client { color: var(--brand); font-weight: 650; }
.pcv-vs { color: var(--muted-fg); font-size: 11px; font-weight: 800; margin: 5px 0 5px 7px; }
.pcv-medida { margin-top: 13px; border-left: 3px solid var(--brand); padding: 2px 0 2px 10px; font-size: 12.5px; line-height: 1.5; }
.pcv-label { display: block; font-size: 9.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted-fg); margin-bottom: 2px; }
.pcv-dates { display: flex; gap: 8px; margin-top: 13px; }
.pcv-tile { flex: 1; min-width: 0; border-radius: 9px; padding: 8px 11px; }
.pcv-tile-k { display: flex; align-items: center; gap: 4px; font-size: 9.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; margin-bottom: 3px; opacity: .8; }
.pcv-tile-v { font-size: 12px; font-weight: 650; line-height: 1.45; overflow-wrap: anywhere; display: block; }
.pcv-tile.rec { background: rgb(223 161 0 / .1); color: #8a6400; }
.pcv-tile.fatal { background: rgb(209 61 61 / .09); color: var(--destructive); }
.pcv-parties { margin-bottom: 4px; }
.pcv-parties + .side-row.col, .pcv-trib + .side-row.col { border-top: 1px solid var(--border); margin-top: 10px; }

/* ---------- revisões inline (selecionar trecho → pedir alteração) ---------- */
.annot-fab { position: fixed; z-index: 80; display: flex; align-items: center; gap: 6px; padding: 7px 12px; border: none; border-radius: 9px; background: var(--primary); color: var(--primary-fg); font: 500 12px var(--font); cursor: pointer; box-shadow: var(--floating-shadow); }
.annot-fab:hover { background: #3a3a41; }
.annot-fab svg { width: 13px; height: 13px; }

.annot-panel { border-top: 1px solid var(--border); background: var(--surface); padding: 10px 28px 4px; max-height: 210px; overflow-y: auto; flex-shrink: 0; }
.annot-head { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; padding-bottom: 8px; }
.annot-hint { font-weight: 400; font-size: 11px; color: var(--muted-fg); }
.annot-row { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; border-top: 1px solid var(--border); }
.annot-num { width: 18px; height: 18px; border-radius: 50%; background: rgb(60 109 224 / .12); color: var(--brand); font-size: 11px; font-weight: 600; display: grid; place-items: center; flex-shrink: 0; margin-top: 1px; }
.annot-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.annot-file { font-size: 11px; font-weight: 600; color: var(--brand); }
.annot-excerpt { font-size: 12px; color: var(--muted-fg); font-style: italic; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.annot-note { font-size: 12.5px; color: var(--foreground); }
.annot-del { flex-shrink: 0; margin-top: 2px; }

.annot-dlg-file { display: flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: var(--brand); }
.annot-dlg-excerpt { border-left: 3px solid var(--brand); background: var(--muted); padding: 8px 12px; border-radius: 0 8px 8px 0; font-size: 12.5px; font-style: italic; max-height: 150px; overflow-y: auto; white-space: pre-wrap; }