/* Campos & botões */
.field{margin:12px 0}
label{display:block; font-size:.95rem; margin:0 0 6px}
input,select,button{font:inherit; color:inherit}
input[type="text"], input[type="password"], input[type="date"], select{
  background:transparent; border:1px solid var(--border); border-radius:10px;
  padding:.7rem .9rem; width:100%; outline:none;
}
input:focus, select:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in oklab, var(--accent) 30%, transparent)
}
.checkbox{display:flex; gap:8px; align-items:center}

button{
  border:1px solid var(--border);
  background:linear-gradient(180deg, color-mix(in oklab, var(--card) 90%, #000 10%), var(--card));
  padding:.75rem 1rem; border-radius:10px; cursor:pointer;
  transition: transform .08s ease, box-shadow .12s ease;
}
button:active{transform:translateY(1px)}
button.primary{
  background:linear-gradient(180deg, color-mix(in oklab, var(--accent) 40%, var(--card)), var(--accent));
  border-color:color-mix(in oklab, var(--accent) 60%, var(--border)); color:#fff
}
button.ghost{background:transparent}
button.danger{
  background:linear-gradient(180deg, color-mix(in oklab, var(--danger) 40%, var(--card)), var(--danger));
  border-color:color-mix(in oklab, var(--danger) 60%, var(--border)); color:#fff
}
button.icon-btn{width:40px; height:40px; display:grid; place-items:center}
button.link{background:none; border:none; color:var(--accent); padding:0}

/* Form nova tarefa (compacto) */
.add-task{
  display:grid; grid-template-columns: 1fr auto auto; gap:8px; margin-top:14px; align-items:center
}
.add-task.add-collapsed #add-advanced{display:none}
.add-advanced.hidden{display:none}
#add-advanced{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
#add-advanced select{min-width:160px}