/* ===== BUILDER DE CONTRATO ===== */
  .builder-top{display:flex;justify-content:space-between;align-items:flex-start;margin:14px 0 4px;gap:10px}
  .builder-hint{font-size:13px;color:var(--neutral);margin-bottom:18px}
  /* Cada dica numa linha própria — em vez de deixar quebrar livremente lado
     a lado (o que lia como um texto corrido/confuso ao envolver), fica
     sempre claro qual ícone pertence a qual frase. */
  .builder-legend{display:flex;flex-direction:column;gap:7px;margin:2px 0 16px}
  .builder-legend .bl-item{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--neutral)}
  .builder-legend .bl-item svg{width:15px;height:15px;opacity:.8;flex:none}
  .block{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);
    border-radius:var(--r);padding:12px 8px;margin-bottom:8px;box-shadow:var(--shadow);
    transition:transform .18s,box-shadow .18s,opacity .18s}
  /* Handle e toggle ficam só nesta linha — a lista de cláusulas abaixo é
     filha direta do .block, sem ficar espremida entre essas duas colunas
     pela altura inteira do bloco (era isso que deixava uma faixa vazia
     enorme dos dois lados de cada cláusula). */
  .block-header{display:flex;align-items:center;gap:8px}
  .block.dragging{opacity:.92;transition:none;position:relative;z-index:5;box-shadow:0 10px 24px rgba(0,0,0,.35);cursor:grabbing}
  /* Flash breve ao localizar um campo dinâmico dentro do texto do contrato
     (abrirCampoDinamicoComContexto) — chama atenção sem travar a leitura. */
  .block.campo-flash,.clause.campo-flash{animation:campoFlash 1.3s ease-out}
  @keyframes campoFlash{
    0%{box-shadow:0 0 0 2px var(--bib-orange,#E8763A)}
    75%{box-shadow:0 0 0 2px var(--bib-orange,#E8763A)}
    100%{box-shadow:none}
  }
  .handle{cursor:grab;color:var(--neutral);touch-action:none;flex:none;padding:2px;display:flex;margin-top:2px}
  .handle svg{width:16px;height:16px}
  .handle:active{cursor:grabbing}
  .handle-spacer{width:24px;flex:none}
  .block.locked{background:var(--paper-2)}
  .toggle.disabled{cursor:default;opacity:.55}
  .builder-locked-notice{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--ink-soft);
    background:var(--paper-2);border-radius:var(--r);padding:11px 14px;margin-bottom:14px}
  .builder-locked-notice svg{width:16px;height:16px;flex:none;color:var(--neutral)}
  .block-name{flex:1;min-width:0;font-size:14px;font-weight:600;cursor:pointer;
    display:flex;align-items:center;justify-content:space-between;gap:8px}
  .block-chev{width:14px;height:14px;flex:none;color:var(--neutral);transition:transform .2s}
  .block-preview{margin-top:9px}
  .block-preview.collapsed{display:none}
  .block.off .block-preview,.block.off .block-name{opacity:.45}
  /* cláusulas numeradas, separadas e com hierarquia clara */
  .clause-list{display:flex;flex-direction:column;gap:7px;width:100%}
  .clause{display:flex;gap:8px;align-items:flex-start;padding:9px 8px;border:1px solid var(--line-soft);
    border-radius:var(--r);background:var(--paper-2);cursor:pointer;transition:border-color .15s,background .15s;width:100%}
  .clause:hover{border-color:var(--ink-soft)}
  .clause.editing{cursor:default;border-color:var(--line)}
  .clause-n{flex:none;width:17px;height:17px;border-radius:var(--r);background:rgba(255,255,255,.08);color:var(--ink);
    font-size:10px;font-weight:700;display:grid;place-items:center;font-variant-numeric:tabular-nums;margin-top:1px}
  .clause-txt{flex:1;min-width:0;font-size:13px;color:var(--ink-soft);line-height:1.5;white-space:pre-wrap;word-break:break-word}
  /* Campo dinâmico destacado dentro do texto da cláusula — toca pra editar
     só esta ocorrência ou todas as ocorrências da mesma tag no contrato. */
  .dynf-tag{display:inline;padding:1px 5px;border-radius:3px;background:rgba(232,118,58,.18);
    border:1px solid rgba(232,118,58,.4);color:var(--ink);font-weight:600;cursor:pointer;white-space:normal}
  .dynf-tag:hover{background:rgba(232,118,58,.28)}
  .clause-edit{flex:1;min-width:0}
  .icon-sm{width:28px;height:28px;border-radius:var(--r);border:1px solid var(--line);background:var(--paper);
    display:grid;place-items:center;cursor:pointer;color:var(--ink-soft);flex:none;transition:border-color .15s,color .15s}
  .icon-sm:hover{border-color:var(--brand);color:var(--ink)}
  .icon-sm svg{width:14px;height:14px}
  .block-textarea{width:100%;border:1px solid var(--line);border-radius:var(--r);padding:9px 11px;font-family:inherit;
    font-size:13px;color:var(--ink);line-height:1.5;min-height:74px;resize:vertical;margin-top:2px;background:var(--paper)}
  .block-edit-actions{display:flex;gap:8px;margin-top:8px}
  .block-edit-actions .btn{padding:7px 12px;font-size:12.5px}
  .toggle{width:38px;height:22px;border-radius:99px;background:var(--line);position:relative;cursor:pointer;
    flex:none;transition:background .2s}
  .toggle .kn{width:18px;height:18px;border-radius:50%;background:#fff;position:absolute;top:2px;left:2px;
    transition:left .2s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
  /* "On" escurecido/dessaturado (era var(--brand), o verde vivo de marca) —
     mesma família de acento contido usada nos outros indicadores de estado
     "concluído" do app (ex.: .job-footer-btn.concluir). */
  .toggle.on{background:rgba(70,130,108,.65)}
  .toggle.on .kn{left:18px}
  .block.off{opacity:.7}
  .addblock{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:13px;
    border:1.5px dashed var(--line);border-radius:var(--r);background:none;color:var(--ink-soft);font-family:inherit;
    font-size:14px;font-weight:500;cursor:pointer;margin-top:6px}
  .addblock svg{width:16px;height:16px}
  .save-tpl{flex:none;white-space:nowrap;margin-top:2px}

  /* ===== PAINEL DE CAMPOS DINÂMICOS (substituição em massa) =====
     Acento monocromático (grafite/ink) — nada de verde da marca aqui, para
     não destoar da identidade escura da biblioteca. */
  .dynf-panel{border:1px solid var(--line);border-radius:var(--r);background:var(--paper-2);padding:14px 14px 6px;margin-bottom:14px}
  .dynf-head{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink)}
  .dynf-head svg{width:17px;height:17px;color:var(--ink-soft);flex:none}
  .dynf-count{margin-left:auto;font-size:11px;font-weight:600;color:var(--ink);background:rgba(255,255,255,.10);border-radius:var(--r);padding:2px 8px}
  .dynf-hint{font-size:12px;color:var(--neutral);margin:4px 0 12px}
  .dynf-row{display:grid;grid-template-columns:minmax(0,1fr) 14px minmax(0,1fr);align-items:center;gap:8px;margin-bottom:8px}
  /* Nome do campo (lado esquerdo) é clicável — leva até a cláusula onde ele
     aparece no contrato (localizarCampoNoBuilder), pra ver o contexto antes
     de editar o valor no input ao lado. */
  .dynf-key{min-height:38px;display:flex;align-items:center;font-size:12.5px;font-weight:600;color:var(--ink-soft);
    background:rgba(255,255,255,.05);border:1px solid var(--line-soft);border-radius:var(--r);padding:8px 10px;
    white-space:normal;overflow-wrap:break-word;line-height:1.25;cursor:pointer}
  .dynf-key:hover{border-color:var(--ink-soft);color:var(--ink)}
  .dynf-arrow{width:14px;height:14px;color:var(--neutral);flex:none;justify-self:center}
  .dynf-input{width:100%;min-height:38px;font-family:inherit;font-size:13px;color:var(--ink);
    background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:0 11px;outline:none;box-sizing:border-box}
  .dynf-input:focus{border-color:var(--ink-soft)}
  .dynf-input::placeholder{color:var(--ink-faint)}

  /* botão "adicionar cláusula" dentro do bloco — integrado, largura total */
  .addclause{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:8px;padding:9px;border-radius:var(--r);
    border:1px dashed var(--line);background:rgba(255,255,255,.03);color:var(--ink-soft);font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer;
    transition:border-color .15s,color .15s,background .15s}
  .addclause:hover{border-color:var(--ink-soft);color:var(--ink);background:rgba(255,255,255,.06)}
  .addclause svg{width:15px;height:15px;flex:none}

  /* seleção por checkbox de blocos/cláusulas (import da biblioteca) */
  .pick-list{display:flex;flex-direction:column;gap:8px}
  .pick-check{display:flex;align-items:flex-start;gap:11px;padding:12px 13px;border:1px solid var(--line);
    border-radius:var(--r);cursor:pointer;background:var(--paper-2);transition:border-color .15s,background .15s}
  .pick-check:hover{border-color:var(--ink-soft)}
  .pick-check.on{border-color:var(--ink);background:rgba(255,255,255,.06)}
  .pick-check .pc-box{flex:none;width:20px;height:20px;border-radius:var(--r);border:1.5px solid var(--line);
    display:grid;place-items:center;color:transparent;margin-top:1px}
  .pick-check .pc-box.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
  .pick-check .pc-box svg{width:13px;height:13px}
  .pick-check .pc-main{min-width:0;flex:1}
  .pick-check .pc-nm{font-size:14px;font-weight:600;color:var(--ink)}
  .pick-check .pc-sub{font-size:12px;color:var(--neutral);margin-top:2px;line-height:1.4}
  .btn[disabled]{opacity:.45;pointer-events:none}

  /* ===== IMPORTAR ARQUIVO (Modelos → + Criar → Arquivo) ===== */
  .imp-dropzone{border:1.5px dashed var(--line);border-radius:16px;padding:38px 20px;text-align:center;
    cursor:pointer;transition:border-color .15s,background .15s;margin-bottom:16px}
  .imp-dropzone.drag-over{border-color:var(--brand);background:var(--brand-10)}
  .imp-dropzone svg{width:30px;height:30px;color:var(--neutral);margin-bottom:10px}
  .imp-dropzone .ti{font-size:14.5px;font-weight:600;color:var(--ink);margin-bottom:4px}
  .imp-dropzone .si{font-size:12.5px;color:var(--neutral)}
  .imp-formats{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 4px}
  .imp-formats span{font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--ink-soft);
    background:var(--paper-2);border-radius:7px;padding:4px 8px}
  .imp-hint{font-size:12.5px;color:var(--neutral);line-height:1.55;margin-bottom:4px}
  .imp-progress{padding:6px 2px}
  .imp-progress-step{display:flex;align-items:center;gap:10px;padding:10px 2px;font-size:14px;color:var(--neutral)}
  .imp-progress-step.on{color:var(--ink);font-weight:600}
  .imp-progress-step.done{color:var(--brand)}
  .imp-progress-dot{width:9px;height:9px;border-radius:50%;background:var(--line);flex:none}
  .imp-progress-step.on .imp-progress-dot{background:var(--ink);animation:imp-pulse 1s ease-in-out infinite}
  .imp-progress-step.done .imp-progress-dot{background:var(--brand)}
  @keyframes imp-pulse{0%,100%{opacity:1}50%{opacity:.35}}
  .imp-fail{background:var(--paper-2);border-radius:13px;padding:16px;font-size:13.5px;color:var(--ink-soft);
    line-height:1.55;margin-top:8px}

  /* ===== REVISÃO DE IMPORTAÇÃO =====
     O bloco/cláusula em si reaproveita .block/.clause do editor real (ver
     contratos.css acima) — aqui só o que é específico da revisão: o título
     do bloco vira um input editável, e cada cláusula ganha um select de
     "mover para outro bloco" + remover, ao lado do texto. */
  .revb-title{flex:1;min-width:0;border:none;background:none;font-size:14px;font-weight:600;color:var(--ink);
    font-family:inherit;padding:2px 0;cursor:text}
  .revb-title:focus{outline:none;border-bottom:1.5px solid var(--brand)}
  .clause{cursor:pointer}
  .revc-actions{display:flex;flex-direction:column;gap:5px;flex:none;align-items:center}
  .revc-move{border:1px solid var(--line-soft);background:var(--paper);border-radius:7px;font-size:10.5px;
    color:var(--ink-soft);font-family:inherit;padding:2px 3px;max-width:84px}
  .revc-rm{color:var(--neutral);cursor:pointer;font-size:13px;padding:2px 4px}
  .revc-rm:hover{color:var(--ink)}

  /* ===== CALENDÁRIO ===== */
  .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:18px}
  .cal-dow{text-align:center;font-size:11px;color:var(--neutral);font-weight:600;padding-bottom:6px}
  .cal-day{aspect-ratio:1;border-radius:var(--r);border:1.5px solid rgba(255,255,255,.20);display:flex;flex-direction:column;
    align-items:center;justify-content:flex-start;padding:6px 2px;font-size:12.5px;color:rgba(255,255,255,.85);
    position:relative;cursor:pointer;background:rgba(124,126,129,.34);
    backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%)}
  .cal-day.out{opacity:.3}
  .cal-day.today{border-color:var(--brand);font-weight:600;color:var(--ink)}
  /* seleção de dia — mesma linguagem neutra "on" usada em chips/priority-opt
     no resto do app (fundo --ink, texto --paper), não mais o verde de marca. */
  .cal-day.cal-day-sel{background:var(--ink);border-color:var(--ink);color:var(--paper);font-weight:700}
  .cal-day.cal-day-sel .cd{background:var(--paper)!important}
  .cal-dots{display:flex;gap:2px;margin-top:3px;flex-wrap:wrap;justify-content:center}
  .cd{width:5px;height:5px;border-radius:50%}
  .legend{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:20px;font-size:12.5px;color:var(--ink-soft)}
  .legend span{display:inline-flex;align-items:center;gap:6px}
  .legend .cd{width:7px;height:7px}
  .agenda-item{display:flex;align-items:center;gap:11px;padding:11px 4px;border-bottom:1px solid var(--line-soft)}
  .agenda-day{width:34px;text-align:center;font-size:11px;color:var(--neutral);flex:none}
  .agenda-day b{display:block;font-size:15px;color:var(--ink);font-weight:600}