/* ---------- modal ---------- */
dialog{
  border:1px solid var(--line-strong);border-radius:12px;padding:0;
  background:var(--surface);color:var(--ink);
  width:min(560px,calc(100vw - 24px));max-height:calc(100vh - 32px);
  margin:auto;
}
dialog::backdrop{background:rgba(15,25,32,.55)}
.dlg{display:flex;flex-direction:column;max-height:calc(100vh - 34px)}
.dlg-head{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--line)}
.dlg-head h2{font:700 18px/1.2 var(--font-display);flex:1}
.dlg-body{padding:16px 18px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}
.dlg-foot{padding:12px 18px;border-top:1px solid var(--line);display:flex;gap:8px;align-items:center}
.field{display:flex;flex-direction:column;gap:5px}
.field>label,.field>.lbl{font-size:13px;font-weight:600}
.field input[type=text],.field input[type=date],.field textarea,.field select{
  padding:8px 10px;border:1px solid var(--line-strong);background:var(--paper);
  border-radius:var(--radius);width:100%;
}
.field textarea{resize:vertical;min-height:88px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hint{font-size:12.5px;color:var(--ink-soft)}
.checklist{display:flex;flex-direction:column;gap:4px}
.ck{display:flex;align-items:center;gap:8px}
.ck input[type=checkbox]{width:16px;height:16px;accent-color:var(--ink);flex:none}
.ck input[type=text]{flex:1;padding:5px 8px;border:1px solid transparent;background:none;border-radius:4px}
.ck input[type=text]:hover{border-color:var(--line)}
.ck input[type=text]:focus{border-color:var(--ink);background:var(--paper)}
.ck.done input[type=text]{text-decoration:line-through;color:var(--ink-soft)}
.people{display:flex;flex-wrap:wrap;gap:6px}
.person{
  display:inline-flex;align-items:center;gap:6px;padding:3px 4px 3px 4px;
  border:1px solid var(--line-strong);border-radius:99px;background:var(--surface);
}
.person .avatar{margin:0}
.person span.n{padding-right:6px;font-size:13px}
.person button{border:0;background:none;color:var(--ink-soft);width:20px;height:20px;border-radius:50%}
.person button:hover{color:var(--danger)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{
  padding:4px 10px;border:1px solid var(--line-strong);background:var(--paper);
  border-radius:99px;font-size:13px;
}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.color-row{display:flex;gap:8px;flex-wrap:wrap}
.swatch{width:26px;height:26px;border-radius:50%;border:2px solid transparent;box-shadow:0 0 0 1px var(--line-strong)}
.swatch[aria-pressed="true"]{border-color:var(--surface);box-shadow:0 0 0 2px var(--ink)}
.notice{
  padding:10px 12px;border-radius:var(--radius);font-size:13px;
  background:color-mix(in srgb,var(--p-media) 14%,var(--surface));
  border:1px solid color-mix(in srgb,var(--p-media) 45%,var(--line));
}
.code{
  font:12.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  padding:8px 10px;overflow-x:auto;white-space:pre;
}
.toast{
  position:fixed;left:50%;bottom:22px;transform:translateX(-50%);
  background:var(--ink);color:var(--paper);padding:9px 14px;border-radius:8px;
  font-size:14px;z-index:60;box-shadow:0 6px 24px rgba(0,0,0,.25);
}
.toast button{margin-left:10px;background:none;border:0;color:inherit;text-decoration:underline;font-weight:600}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Botões empilhados dentro de menus (mover cartão, opções da coluna). */
.dlg-body .lista{gap:8px}
.dlg-body .lista .btn{justify-content:center;padding:11px 12px}
.dlg-body .lista .btn:disabled{opacity:.45;cursor:default}
.dlg-body .btn:disabled{opacity:.45;cursor:default}